[codex] Optimize terminal tab switching (#1003)

* Optimize terminal tab switching

* Reduce themed tab switch repaint work

.gitattributes

@@ -0,0 +1 @@
+*.sh text eol=lf

.github/scripts/bump-homebrew-cask.sh

@@ -0,0 +1,89 @@
+#!/usr/bin/env bash
+#
+# bump-homebrew-cask.sh — push a new version of the Netcatty cask to the
+# binaricat/homebrew-netcatty tap.
+#
+# Called from the release pipeline (`build.yml` → `homebrew-tap` job) after
+# the GitHub Release has been published with the signed + notarized DMGs.
+# Computes SHA-256 of the arm64 and x64 DMGs, rewrites the cask file, and
+# pushes the bump back to the tap repository using HOMEBREW_TAP_TOKEN.
+#
+# Required env vars:
+#   VERSION              — semver without leading "v" (e.g. 1.1.6)
+#   HOMEBREW_TAP_TOKEN   — PAT with contents:write on the tap repo
+#
+# Optional env vars:
+#   TAP_REPO             — default: binaricat/homebrew-netcatty
+#   ARTIFACTS_DIR        — default: artifacts
+#   CASK_PATH            — default: Casks/netcatty.rb
+set -euo pipefail
+
+: "${VERSION:?VERSION env var required (no leading v)}"
+: "${HOMEBREW_TAP_TOKEN:?HOMEBREW_TAP_TOKEN env var required}"
+
+TAP_REPO="${TAP_REPO:-binaricat/homebrew-netcatty}"
+ARTIFACTS_DIR="${ARTIFACTS_DIR:-artifacts}"
+CASK_PATH="${CASK_PATH:-Casks/netcatty.rb}"
+
+ARM_DMG="${ARTIFACTS_DIR}/Netcatty-${VERSION}-mac-arm64.dmg"
+X64_DMG="${ARTIFACTS_DIR}/Netcatty-${VERSION}-mac-x64.dmg"
+
+for f in "$ARM_DMG" "$X64_DMG"; do
+  if [[ ! -f "$f" ]]; then
+    echo "::error::Required DMG artifact not found: $f"
+    exit 1
+  fi
+done
+
+ARM_SHA=$(shasum -a 256 "$ARM_DMG" | awk '{print $1}')
+X64_SHA=$(shasum -a 256 "$X64_DMG" | awk '{print $1}')
+
+echo "Computed checksums:"
+echo "  arm64: ${ARM_SHA}"
+echo "  x64  : ${X64_SHA}"
+
+TMP=$(mktemp -d)
+trap 'rm -rf "$TMP"' EXIT
+
+git clone --depth 1 \
+  "https://x-access-token:${HOMEBREW_TAP_TOKEN}@github.com/${TAP_REPO}.git" \
+  "$TMP/tap"
+cd "$TMP/tap"
+
+if [[ ! -f "$CASK_PATH" ]]; then
+  echo "::error::Cask file not found in tap: $CASK_PATH"
+  exit 1
+fi
+
+# Patch the cask in place. The three lines we touch are anchored well enough
+# that we don't need anything fancier than sed:
+#   - the `version "X.Y.Z"` line (single line, anchored to start)
+#   - the `sha256 arm:   "..."` line
+#   - the `       intel: "..."` line (anchor on "intel:" at start, after the
+#     leading whitespace, so we don't accidentally match the `arch arm:
+#     "...", intel: "..."` line earlier in the file)
+sed -i -E 's|^(\s*version)\s+"[^"]+"|\1 "'"$VERSION"'"|' "$CASK_PATH"
+sed -i -E 's|(sha256\s+arm:\s+)"[^"]+"|\1"'"$ARM_SHA"'"|' "$CASK_PATH"
+sed -i -E 's|^(\s*intel:\s+)"[^"]+"|\1"'"$X64_SHA"'"|' "$CASK_PATH"
+
+# Sanity-check: parsed file should still be valid Ruby. Catches a broken
+# substitution before we push.
+if command -v ruby >/dev/null 2>&1; then
+  ruby -c "$CASK_PATH" >/dev/null
+fi
+
+if git diff --quiet; then
+  echo "Cask already at ${VERSION} with matching checksums — nothing to push."
+  exit 0
+fi
+
+echo "Cask diff:"
+git --no-pager diff "$CASK_PATH"
+
+git config user.email "github-actions[bot]@users.noreply.github.com"
+git config user.name "github-actions[bot]"
+git add "$CASK_PATH"
+git commit -m "Bump netcatty to ${VERSION}"
+git push origin HEAD:main
+
+echo "Pushed bump for ${VERSION} to ${TAP_REPO}."

.github/scripts/generate-release-note.js

@@ -56,8 +56,7 @@ const files = {
     x64: `Netcatty-${version}-mac-x64.dmg`
   },
   win: {
-    x64: `Netcatty-${version}-win-x64.exe`,
-    arm64: `Netcatty-${version}-win-arm64.exe`
+    x64: `Netcatty-${version}-win-x64.exe`
   },
   linux: {
     appimage: {
@@ -77,8 +76,7 @@ const files = {
 
 const badges = {
   win: {
-    setup_x64: `[![Setup x64](https://img.shields.io/badge/Setup-x64-0078D6?style=flat-square&logo=windows)](${baseUrl}/${files.win.x64})`,
-    setup_arm64: `[![Setup arm64](https://img.shields.io/badge/Setup-arm64-0078D6?style=flat-square&logo=windows)](${baseUrl}/${files.win.arm64})`
+    setup_x64: `[![Setup x64](https://img.shields.io/badge/Setup-x64-0078D6?style=flat-square&logo=windows)](${baseUrl}/${files.win.x64})`
   },
   mac: {
     apple_silicon: `[![DMG Apple Silicon](https://img.shields.io/badge/DMG-Apple_Silicon-000000?style=flat-square&logo=apple)](${baseUrl}/${files.mac.arm64})`,
@@ -99,7 +97,7 @@ const content = `
 
 | OS | Download |
 | :--- | :--- |
-| **Windows** | ${badges.win.setup_x64} ${badges.win.setup_arm64} |
+| **Windows** | ${badges.win.setup_x64} |
 | **macOS** | ${badges.mac.apple_silicon} ${badges.mac.intel} |
 | **Linux** | ${badges.linux.appimage_x64} ${badges.linux.deb_x64} ${badges.linux.rpm_x64} <br> ${badges.linux.appimage_arm64} ${badges.linux.deb_arm64} ${badges.linux.rpm_arm64} |
 `;

.github/workflows/build-mosh-binaries.yml

@@ -0,0 +1,233 @@
+name: build-mosh-binaries
+
+# Trigger philosophy (mirrors build.yml):
+#  - Pushes that touch the mosh build pipeline + PRs run the matrix
+#    so we can validate workflow / script changes without tagging.
+#    Artifacts upload as workflow artifacts only; *no* release.
+#  - Manual `workflow_dispatch` with `release_tag` publishes the
+#    binaries + SHA256SUMS to the dedicated binary repository
+#    (`binaricat/Netcatty-mosh-bin` by default).
+#
+# `paths` keeps unrelated commits (UI, bridges, etc) from rebuilding
+# or refreshing mosh binaries on every push.
+on:
+  workflow_dispatch:
+    inputs:
+      mosh_ref:
+        description: "mosh upstream git ref (tag/branch/commit) — see https://github.com/mobile-shell/mosh"
+        type: string
+        default: "mosh-1.4.0"
+      release_tag:
+        description: "Optional release tag to attach binaries to (e.g. mosh-bin-1.4.0-1). Empty = artifacts only."
+        type: string
+        default: ""
+      release_repo:
+        description: "Repository that stores mosh-client binary releases."
+        type: string
+        default: "binaricat/Netcatty-mosh-bin"
+  push:
+    branches:
+      - "**"
+    paths:
+      - ".gitattributes"
+      - ".github/workflows/build-mosh-binaries.yml"
+      - "electron-builder.config.cjs"
+      - "package.json"
+      - "scripts/build-mosh/**"
+      - "scripts/fetch-mosh-binaries.cjs"
+      - "scripts/mosh-extra-resources.cjs"
+  pull_request:
+    paths:
+      - ".gitattributes"
+      - ".github/workflows/build-mosh-binaries.yml"
+      - "electron-builder.config.cjs"
+      - "package.json"
+      - "scripts/build-mosh/**"
+      - "scripts/fetch-mosh-binaries.cjs"
+      - "scripts/mosh-extra-resources.cjs"
+
+# Cancel superseded branch / PR builds.
+concurrency:
+  group: build-mosh-binaries-${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+env:
+  MOSH_REF: ${{ inputs.mosh_ref || 'mosh-1.4.0' }}
+
+jobs:
+  # ------------------------------------------------------------------
+  # Linux x64 (manylinux2014 / glibc 2.17, broad distro compatibility).
+  # Static-links the heavy third-party deps where possible; the resulting
+  # mosh-client still depends on baseline Linux system libraries.
+  # ------------------------------------------------------------------
+  build-linux-x64:
+    name: build-linux-x64
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Build mosh-client (linux-x64)
+        run: |
+          # Run only the compiler inside manylinux2014. JavaScript actions
+          # need the host runner's newer glibc.
+          docker run --rm \
+            -e MOSH_REF="${MOSH_REF}" \
+            -e OUT_DIR=/work/out \
+            -e ARCH=x64 \
+            -v "${GITHUB_WORKSPACE}:/work" \
+            -w /work \
+            quay.io/pypa/manylinux2014_x86_64 \
+            bash scripts/build-mosh/build-linux.sh
+      - name: Upload artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: mosh-client-linux-x64
+          path: out/
+
+  build-linux-arm64:
+    name: build-linux-arm64
+    runs-on: ubuntu-24.04-arm
+    steps:
+      - uses: actions/checkout@v4
+      - name: Build mosh-client (linux-arm64)
+        run: |
+          # Run only the compiler inside manylinux2014. JavaScript actions
+          # need the host runner's newer glibc.
+          docker run --rm \
+            -e MOSH_REF="${MOSH_REF}" \
+            -e OUT_DIR=/work/out \
+            -e ARCH=arm64 \
+            -v "${GITHUB_WORKSPACE}:/work" \
+            -w /work \
+            quay.io/pypa/manylinux2014_aarch64 \
+            bash scripts/build-mosh/build-linux.sh
+      - name: Upload artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: mosh-client-linux-arm64
+          path: out/
+
+  # ------------------------------------------------------------------
+  # macOS universal2 (arm64 + x86_64 lipo).
+  # Min deployment target: macOS 11 (Big Sur) — covers arm64 hardware.
+  # Static-links OpenSSL, protobuf, ncurses for both arches.
+  # ------------------------------------------------------------------
+  build-macos-universal:
+    name: build-macos-universal
+    runs-on: macos-15-intel
+    steps:
+      - uses: actions/checkout@v4
+      - name: Build mosh-client (darwin-universal)
+        env:
+          MOSH_REF: ${{ env.MOSH_REF }}
+          OUT_DIR: ${{ github.workspace }}/out
+          MACOSX_DEPLOYMENT_TARGET: "11.0"
+        run: bash scripts/build-mosh/build-macos.sh
+      - name: Upload artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: mosh-client-darwin-universal
+          path: out/
+
+  # ------------------------------------------------------------------
+  # Windows x64 pinned standalone client.
+  # Do not compile this in CI: the upstream Cygwin build can clear the
+  # terminal and never render output on Windows. Ship the SHA256-pinned
+  # FluentTerminal standalone binary verified by fetch-windows.sh.
+  # ------------------------------------------------------------------
+  fetch-windows-x64:
+    name: fetch-windows-x64
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Fetch pinned mosh-client.exe (win32-x64)
+        run: |
+          set -euo pipefail
+          export OUT_DIR="${GITHUB_WORKSPACE}/out"
+          mkdir -p "$OUT_DIR"
+          bash scripts/build-mosh/fetch-windows.sh
+      - name: Upload artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: mosh-client-win32-x64
+          path: out/
+
+  # ------------------------------------------------------------------
+  # Windows arm64 — intentionally not built.
+  # The pinned upstream source only provides x64. arm64 Windows builds
+  # should be added only after we have a tested standalone arm64 client.
+  # ------------------------------------------------------------------
+
+  # ------------------------------------------------------------------
+  # Aggregate + optional release to the dedicated binary repository.
+  # ------------------------------------------------------------------
+  release:
+    name: release
+    needs:
+      - build-linux-x64
+      - build-linux-arm64
+      - build-macos-universal
+      - fetch-windows-x64
+    runs-on: ubuntu-latest
+    if: github.event_name == 'workflow_dispatch' && inputs.release_tag != ''
+    permissions:
+      contents: read
+    steps:
+      - uses: actions/checkout@v4
+      - name: Download artifacts
+        uses: actions/download-artifact@v4
+        with:
+          path: artifacts
+      - name: Stage release files
+        run: |
+          set -euo pipefail
+          mkdir -p release
+          for d in artifacts/*/; do
+            find "$d" -maxdepth 1 -type f -exec cp {} release/ \;
+          done
+          (cd release && find . -maxdepth 1 -type f ! -name SHA256SUMS -printf '%P\n' | sort | xargs sha256sum > SHA256SUMS)
+          ls -la release
+          cat release/SHA256SUMS
+      - name: Determine tag
+        id: tag
+        env:
+          RELEASE_TAG: ${{ inputs.release_tag }}
+        run: |
+          tag="${RELEASE_TAG}"
+          if [[ ! "$tag" =~ ^mosh-bin-[A-Za-z0-9._-]+$ ]]; then
+            echo "Invalid mosh binary release tag: $tag" >&2
+            exit 1
+          fi
+          printf 'name=%s\n' "$tag" >> "$GITHUB_OUTPUT"
+      - name: Create / update release
+        env:
+          GH_TOKEN: ${{ secrets.MOSH_BIN_RELEASE_TOKEN }}
+          RELEASE_REPO: ${{ inputs.release_repo }}
+          RELEASE_TAG: ${{ steps.tag.outputs.name }}
+        run: |
+          set -euo pipefail
+          if [[ -z "${GH_TOKEN:-}" ]]; then
+            echo "::error::MOSH_BIN_RELEASE_TOKEN is required to publish into ${RELEASE_REPO}."
+            exit 1
+          fi
+          {
+            printf '%s\n' 'Pre-built `mosh-client` binaries consumed by `scripts/fetch-mosh-binaries.cjs` during `npm run pack`.'
+            printf 'Linux/macOS artifacts are built from `mobile-shell/mosh` upstream ref `%s`.\n' "${MOSH_REF}"
+            printf '%s\n\n' 'Windows x64 is the SHA256-pinned FluentTerminal standalone `mosh-client.exe` fallback.'
+            printf 'Source workflow: %s/%s/actions/runs/%s\n' "${GITHUB_SERVER_URL}" "${GITHUB_REPOSITORY}" "${GITHUB_RUN_ID}"
+            printf 'Source commit: `%s`\n\n' "${GITHUB_SHA}"
+            printf '%s\n' 'All artifacts are GPL-3.0; see `resources/mosh/README.md` for source provenance.'
+          } > release-notes.md
+          if gh release view "${RELEASE_TAG}" --repo "${RELEASE_REPO}" >/dev/null 2>&1; then
+            gh release edit "${RELEASE_TAG}" \
+              --repo "${RELEASE_REPO}" \
+              --title "${RELEASE_TAG}" \
+              --notes-file release-notes.md
+            gh release upload "${RELEASE_TAG}" release/* \
+              --repo "${RELEASE_REPO}" \
+              --clobber
+          else
+            gh release create "${RELEASE_TAG}" release/* \
+              --repo "${RELEASE_REPO}" \
+              --title "${RELEASE_TAG}" \
+              --notes-file release-notes.md
+          fi

.github/workflows/build.yml

@@ -1,5 +1,23 @@
 name: build-packages
 
+# Trigger philosophy
+#  - Any push to any branch + any PR -> run the build matrix so CI is
+#    always testable. Same-repo PR runs own package validation; matching
+#    branch push runs become a lightweight mirror only after a current
+#    open PR run for the same commit is visible. If lookup is slow or
+#    unavailable, the push run falls back to the full matrix. Artifacts
+#    upload as workflow artifacts only; *no* GitHub Release is published.
+#  - Tag push matching `v<MAJOR>.<MINOR>.<PATCH>` (with optional
+#    pre-release suffix like `v1.2.3-rc.1`) -> run the matrix and
+#    publish a GitHub Release. Loose tags like `v-test`, `vNEXT`, or
+#    `v1.0` no longer auto-publish.
+#  - Manual `workflow_dispatch` -> run the matrix on the selected ref.
+#    `publish_release` only publishes when the selected ref is also a
+#    strict version tag.
+#
+# The release job validates the exact same rule before publishing, so
+# adding branches/PRs above is safe; accidental tag-like branch names
+# won't leak a release.
 on:
   workflow_dispatch:
     inputs:
@@ -7,13 +25,179 @@ on:
         description: "Publish GitHub Release after build"
         type: boolean
         default: false
+      mosh_bin_release:
+        description: "Release tag containing bundled mosh-client binaries"
+        type: string
+        default: ""
   push:
+    branches:
+      - "**"
     tags:
-      - "v*"
+      - "v[0-9]+.[0-9]+.[0-9]+"
+      - "v[0-9]+.[0-9]+.[0-9]+-[0-9A-Za-z]*"
+  pull_request:
+
+# A newer run for the same push branch or PR cancels older in-progress
+# work. Push and PR events stay in separate groups so deduped push runs
+# can mirror PR results cleanly instead of leaving cancelled checks on
+# the PR. Publishing tag runs share a release group across push and
+# manual dispatch; non-publishing manual tag runs use their own group.
+concurrency:
+  group: build-packages-${{ github.workflow }}-${{ startsWith(github.ref, 'refs/tags/') && (github.event_name == 'push' || (github.event_name == 'workflow_dispatch' && inputs.publish_release)) && 'release' || github.event_name }}-${{ github.event.pull_request.head.repo.full_name || github.repository }}-${{ github.ref_type }}-${{ github.event.pull_request.head.ref || github.ref_name }}
+  cancel-in-progress: ${{ !startsWith(github.ref, 'refs/tags/') }}
+
+permissions:
+  actions: read
+  contents: read
+  pull-requests: read
+
+env:
+  MOSH_BIN_RELEASE: ${{ github.event.inputs.mosh_bin_release || vars.MOSH_BIN_RELEASE || '' }}
+  BUNDLE_MOSH: ${{ (startsWith(github.ref, 'refs/tags/v') && (github.event_name == 'push' || (github.event_name == 'workflow_dispatch' && inputs.publish_release))) || (github.event_name == 'workflow_dispatch' && inputs.mosh_bin_release != '') }}
+  STRICT_VERSION_REF_RE: '^refs/tags/v(0|[1-9][0-9]*)\.(0|[1-9][0-9]*)\.(0|[1-9][0-9]*)(-((0|[1-9][0-9]*|[A-Za-z][0-9A-Za-z-]*|[0-9A-Za-z][0-9A-Za-z-]*[A-Za-z-][0-9A-Za-z-]*)(\.(0|[1-9][0-9]*|[A-Za-z][0-9A-Za-z-]*|[0-9A-Za-z][0-9A-Za-z-]*[A-Za-z-][0-9A-Za-z-]*))*))?$'
 
 jobs:
+  dedupe:
+    name: dedupe push run
+    runs-on: ubuntu-latest
+    outputs:
+      skip_heavy_ci: ${{ steps.detect.outputs.skip_heavy_ci }}
+      heavy_ci_pr_run_id: ${{ steps.detect.outputs.heavy_ci_pr_run_id }}
+    steps:
+      - name: Detect duplicate heavy CI
+        id: detect
+        shell: bash
+        env:
+          GH_TOKEN: ${{ github.token }}
+          REPOSITORY: ${{ github.repository }}
+          REPOSITORY_OWNER: ${{ github.repository_owner }}
+          EVENT_NAME: ${{ github.event_name }}
+          REF: ${{ github.ref }}
+          HEAD_REF: ${{ github.ref_name }}
+          HEAD_SHA: ${{ github.sha }}
+        run: |
+          skip_heavy_ci=false
+          if [[ "$EVENT_NAME" == "push" && "$REF" == refs/heads/* ]]; then
+            pr_count=0
+            if ! pr_count="$(gh api --method GET "repos/${REPOSITORY}/pulls" \
+              -f state=open \
+              -f "head=${REPOSITORY_OWNER}:${HEAD_REF}" \
+              -F per_page=1 \
+              --jq 'length')"; then
+              echo "::warning::Could not check open PRs; running full push CI."
+              pr_count=0
+            fi
+
+            pr_run_id=""
+            if [[ "$pr_count" != "0" ]]; then
+              cutoff="$(date -u -d '20 minutes ago' +'%Y-%m-%dT%H:%M:%SZ')"
+              for attempt in {1..18}; do
+                if ! pr_run_id="$(gh api --method GET "repos/${REPOSITORY}/actions/workflows/build.yml/runs" \
+                  -f event=pull_request \
+                  -f "branch=${HEAD_REF}" \
+                  -f "head_sha=${HEAD_SHA}" \
+                  -F per_page=20 \
+                  --jq "[.workflow_runs[] | select(.created_at >= \"${cutoff}\" and .conclusion != \"cancelled\" and .conclusion != \"skipped\")] | sort_by(.created_at, .id) | .[0].id // \"\"")"; then
+                  echo "::warning::Could not check PR workflow runs; running full push CI."
+                  pr_run_id=""
+                  break
+                fi
+                if [[ -n "$pr_run_id" ]]; then
+                  skip_heavy_ci=true
+                  break
+                fi
+                if [[ "$attempt" == "18" ]]; then
+                  break
+                fi
+                sleep 10
+              done
+            fi
+            if [[ -n "$pr_run_id" ]]; then
+              echo "heavy_ci_pr_run_id=${pr_run_id}" >> "$GITHUB_OUTPUT"
+              echo "heavy_ci_pr_run_id=${pr_run_id}"
+            fi
+          fi
+          echo "skip_heavy_ci=${skip_heavy_ci}" >> "$GITHUB_OUTPUT"
+          echo "skip_heavy_ci=${skip_heavy_ci}"
+
+  dedupe-result:
+    name: dedupe result
+    needs: dedupe
+    if: needs.dedupe.outputs.skip_heavy_ci == 'true'
+    runs-on: ubuntu-latest
+    steps:
+      - name: Mirror PR build result
+        shell: bash
+        env:
+          GH_TOKEN: ${{ github.token }}
+          REPOSITORY: ${{ github.repository }}
+          PR_RUN_ID: ${{ needs.dedupe.outputs.heavy_ci_pr_run_id }}
+        run: |
+          if [[ -z "$PR_RUN_ID" ]]; then
+            echo "::error::No PR workflow run was selected for dedupe."
+            exit 1
+          fi
+
+          for attempt in {1..360}; do
+            if ! result="$(gh run view "$PR_RUN_ID" --repo "$REPOSITORY" --json status,conclusion --jq '.status + "|" + (.conclusion // "")')"; then
+              echo "::warning::Could not read PR workflow run ${PR_RUN_ID}; retrying."
+              sleep 30
+              continue
+            fi
+            status="${result%%|*}"
+            conclusion="${result#*|}"
+            echo "PR run ${PR_RUN_ID}: status=${status} conclusion=${conclusion:-pending}"
+
+            if [[ "$status" == "completed" ]]; then
+              if [[ "$conclusion" == "success" ]]; then
+                exit 0
+              fi
+              echo "::error::PR workflow run ${PR_RUN_ID} completed with conclusion '${conclusion}'."
+              exit 1
+            fi
+
+            sleep 30
+          done
+
+          echo "::error::Timed out waiting for PR workflow run ${PR_RUN_ID}."
+          exit 1
+
+  resolve-mosh:
+    name: resolve bundled mosh-client
+    needs: dedupe
+    if: |
+      needs.dedupe.outputs.skip_heavy_ci != 'true'
+      && (
+        (startsWith(github.ref, 'refs/tags/v') && (github.event_name == 'push' || (github.event_name == 'workflow_dispatch' && inputs.publish_release)))
+        || (github.event_name == 'workflow_dispatch' && inputs.mosh_bin_release != '')
+      )
+    runs-on: ubuntu-latest
+    outputs:
+      mosh_bin_release: ${{ steps.resolve.outputs.mosh_bin_release }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Resolve bundled mosh-client release
+        id: resolve
+        env:
+          GITHUB_TOKEN: ${{ github.token }}
+        run: |
+          node scripts/resolve-mosh-bin-release.cjs
+          release="$(grep '^MOSH_BIN_RELEASE=' "$GITHUB_ENV" | tail -n 1 | cut -d= -f2-)"
+          if [[ -z "$release" ]]; then
+            echo "::error::MOSH_BIN_RELEASE was not resolved."
+            exit 1
+          fi
+          echo "mosh_bin_release=${release}" >> "$GITHUB_OUTPUT"
+
   build:
-    name: build-${{ matrix.name }}
+    name: ${{ needs.dedupe.outputs.skip_heavy_ci == 'true' && format('deduped build-{0}', matrix.name) || format('build-{0}', matrix.name) }}
+    needs: [dedupe, resolve-mosh]
+    if: |
+      always()
+      && needs.dedupe.result == 'success'
+      && needs.dedupe.outputs.skip_heavy_ci != 'true'
     runs-on: ${{ matrix.os }}
     strategy:
       fail-fast: false
@@ -24,13 +208,28 @@ jobs:
             pack_script: pack:mac
           - name: windows
             os: windows-latest
-            pack_script: pack:win
+            # The mosh binary workflow currently produces win32-x64 only.
+            # Keep official packages aligned with bundled-mosh coverage
+            # until Cygwin arm64 is stable enough to build win32-arm64.
+            pack_script: pack:win-x64
     env:
+      MOSH_BIN_RELEASE: ${{ needs.resolve-mosh.outputs.mosh_bin_release }}
       VITE_SYNC_GITHUB_CLIENT_ID: ${{ secrets.VITE_SYNC_GITHUB_CLIENT_ID }}
       VITE_SYNC_GOOGLE_CLIENT_ID: ${{ secrets.VITE_SYNC_GOOGLE_CLIENT_ID }}
       VITE_SYNC_GOOGLE_CLIENT_SECRET: ${{ secrets.VITE_SYNC_GOOGLE_CLIENT_SECRET }}
       VITE_SYNC_ONEDRIVE_CLIENT_ID: ${{ secrets.VITE_SYNC_ONEDRIVE_CLIENT_ID }}
     steps:
+      - name: Validate bundled mosh-client release
+        if: env.BUNDLE_MOSH == 'true'
+        shell: bash
+        env:
+          RESOLVE_MOSH_RESULT: ${{ needs.resolve-mosh.result }}
+        run: |
+          if [[ "$RESOLVE_MOSH_RESULT" != "success" || -z "$MOSH_BIN_RELEASE" ]]; then
+            echo "::error::Bundled mosh-client release was not resolved for this package build."
+            exit 1
+          fi
+
       - name: Checkout
         uses: actions/checkout@v4
 
@@ -43,15 +242,43 @@ jobs:
       - name: Install deps
         run: npm ci
 
+      - name: Install cross-platform native binaries
+        shell: bash
+        run: |
+          # npm ci only installs optional deps for the host platform.
+          # macOS packages still cover both arm64 and x64, so we need
+          # codex-acp for both architectures there.
+          # Platform-specific codex-acp packages declare cpu/os constraints,
+          # so --force is needed to install the non-host-arch binary.
+          CODEX_VER=$(node -e "console.log(require('./node_modules/@zed-industries/codex-acp/package.json').version)")
+          if [[ "${{ matrix.name }}" == "macos" ]]; then
+            npm install "@zed-industries/codex-acp-darwin-x64@${CODEX_VER}" "@zed-industries/codex-acp-darwin-arm64@${CODEX_VER}" --no-save --force
+          elif [[ "${{ matrix.name }}" == "windows" ]]; then
+            npm install "@zed-industries/codex-acp-win32-x64@${CODEX_VER}" --no-save --force
+          fi
+
+      - name: Fetch bundled mosh-client
+        if: env.BUNDLE_MOSH == 'true'
+        shell: bash
+        run: |
+          if [[ "${{ matrix.name }}" == "macos" ]]; then
+            npm run fetch:mosh -- --platform=darwin --arch=universal
+          elif [[ "${{ matrix.name }}" == "windows" ]]; then
+            npm run fetch:mosh -- --platform=win32 --arch=x64
+          fi
+
       - name: Set version
         shell: bash
         run: |
-          if [[ "$GITHUB_REF" == refs/tags/v* ]]; then
-            # Tag release: use version from tag
+          # Strict semver matches v<MAJOR>.<MINOR>.<PATCH>[-pre]; loose
+          # tags / branches / PRs fall through to a semver-pre-release
+          # form (`0.0.0-sha-<short-sha>`) so npm pkg / electron-builder
+          # accept it. Non-semver versions (e.g. bare "abc1234") cause
+          # downstream tooling to error or pick weird codepaths.
+          if [[ "$GITHUB_REF" =~ $STRICT_VERSION_REF_RE ]]; then
             VERSION="${GITHUB_REF_NAME#v}"
           else
-            # workflow_dispatch: use short commit ID
-            VERSION="${GITHUB_SHA:0:7}"
+            VERSION="0.0.0-sha-${GITHUB_SHA:0:7}"
           fi
           echo "Setting version to ${VERSION}"
           npm pkg set version="${VERSION}"
@@ -90,9 +317,15 @@ jobs:
   # compatible with most current Linux distributions including Arch.
   # See #264.
   build-linux-x64:
-    name: build-linux-x64
+    name: ${{ needs.dedupe.outputs.skip_heavy_ci == 'true' && 'deduped build-linux-x64' || 'build-linux-x64' }}
+    needs: [dedupe, resolve-mosh]
+    if: |
+      always()
+      && needs.dedupe.result == 'success'
+      && needs.dedupe.outputs.skip_heavy_ci != 'true'
     runs-on: ubuntu-22.04
     env:
+      MOSH_BIN_RELEASE: ${{ needs.resolve-mosh.outputs.mosh_bin_release }}
       npm_config_arch: x64
       npm_config_target_arch: x64
       VITE_SYNC_GITHUB_CLIENT_ID: ${{ secrets.VITE_SYNC_GITHUB_CLIENT_ID }}
@@ -100,6 +333,17 @@ jobs:
       VITE_SYNC_GOOGLE_CLIENT_SECRET: ${{ secrets.VITE_SYNC_GOOGLE_CLIENT_SECRET }}
       VITE_SYNC_ONEDRIVE_CLIENT_ID: ${{ secrets.VITE_SYNC_ONEDRIVE_CLIENT_ID }}
     steps:
+      - name: Validate bundled mosh-client release
+        if: env.BUNDLE_MOSH == 'true'
+        shell: bash
+        env:
+          RESOLVE_MOSH_RESULT: ${{ needs.resolve-mosh.result }}
+        run: |
+          if [[ "$RESOLVE_MOSH_RESULT" != "success" || -z "$MOSH_BIN_RELEASE" ]]; then
+            echo "::error::Bundled mosh-client release was not resolved for this package build."
+            exit 1
+          fi
+
       - name: Checkout
         uses: actions/checkout@v4
 
@@ -115,10 +359,13 @@ jobs:
       - name: Set version
         shell: bash
         run: |
-          if [[ "$GITHUB_REF" == refs/tags/v* ]]; then
+          # See matrix job's Set version step for the strict-semver
+          # rationale; identical logic, duplicated because the Linux
+          # legs are standalone jobs.
+          if [[ "$GITHUB_REF" =~ $STRICT_VERSION_REF_RE ]]; then
             VERSION="${GITHUB_REF_NAME#v}"
           else
-            VERSION="${GITHUB_SHA:0:7}"
+            VERSION="0.0.0-sha-${GITHUB_SHA:0:7}"
           fi
           echo "Setting version to ${VERSION}"
           npm pkg set version="${VERSION}"
@@ -128,6 +375,10 @@ jobs:
           npm_config_arch: x64
         run: bash scripts/ensure-node-pty-linux.sh prepare x64
 
+      - name: Fetch bundled mosh-client
+        if: env.BUNDLE_MOSH == 'true'
+        run: npm run fetch:mosh -- --platform=linux --arch=x64
+
       - name: Build package
         env:
           npm_config_arch: x64
@@ -156,11 +407,17 @@ jobs:
   # to ensure compatibility with older distros like UOS/Deepin (GLIBC 2.28).
   # Key: GLIBC < 2.34 avoids the libpthread-merge symbol requirement.
   build-linux-arm64:
-    name: build-linux-arm64
+    name: ${{ needs.dedupe.outputs.skip_heavy_ci == 'true' && 'deduped build-linux-arm64' || 'build-linux-arm64' }}
+    needs: [dedupe, resolve-mosh]
+    if: |
+      always()
+      && needs.dedupe.result == 'success'
+      && needs.dedupe.outputs.skip_heavy_ci != 'true'
     runs-on: ubuntu-24.04-arm
     container:
       image: debian:bullseye
     env:
+      MOSH_BIN_RELEASE: ${{ needs.resolve-mosh.outputs.mosh_bin_release }}
       npm_config_arch: arm64
       npm_config_target_arch: arm64
       VITE_SYNC_GITHUB_CLIENT_ID: ${{ secrets.VITE_SYNC_GITHUB_CLIENT_ID }}
@@ -168,6 +425,17 @@ jobs:
       VITE_SYNC_GOOGLE_CLIENT_SECRET: ${{ secrets.VITE_SYNC_GOOGLE_CLIENT_SECRET }}
       VITE_SYNC_ONEDRIVE_CLIENT_ID: ${{ secrets.VITE_SYNC_ONEDRIVE_CLIENT_ID }}
     steps:
+      - name: Validate bundled mosh-client release
+        if: env.BUNDLE_MOSH == 'true'
+        shell: bash
+        env:
+          RESOLVE_MOSH_RESULT: ${{ needs.resolve-mosh.result }}
+        run: |
+          if [[ "$RESOLVE_MOSH_RESULT" != "success" || -z "$MOSH_BIN_RELEASE" ]]; then
+            echo "::error::Bundled mosh-client release was not resolved for this package build."
+            exit 1
+          fi
+
       - name: Install build dependencies
         run: |
           apt-get update
@@ -186,10 +454,13 @@ jobs:
       - name: Set version
         shell: bash
         run: |
-          if [[ "$GITHUB_REF" == refs/tags/v* ]]; then
+          # See matrix job's Set version step for the strict-semver
+          # rationale; identical logic, duplicated because the Linux
+          # legs are standalone jobs.
+          if [[ "$GITHUB_REF" =~ $STRICT_VERSION_REF_RE ]]; then
             VERSION="${GITHUB_REF_NAME#v}"
           else
-            VERSION="${GITHUB_SHA:0:7}"
+            VERSION="0.0.0-sha-${GITHUB_SHA:0:7}"
           fi
           echo "Setting version to ${VERSION}"
           npm pkg set version="${VERSION}"
@@ -199,6 +470,10 @@ jobs:
           npm_config_arch: arm64
         run: bash scripts/ensure-node-pty-linux.sh prepare arm64
 
+      - name: Fetch bundled mosh-client
+        if: env.BUNDLE_MOSH == 'true'
+        run: npm run fetch:mosh -- --platform=linux --arch=arm64
+
       - name: Build package
         env:
           npm_config_arch: arm64
@@ -227,7 +502,12 @@ jobs:
     name: release
     runs-on: ubuntu-latest
     needs: [build, build-linux-x64, build-linux-arm64]
-    if: startsWith(github.ref, 'refs/tags/') || (github.event_name == 'workflow_dispatch' && inputs.publish_release)
+    # Only release on a strict v<MAJOR>.<MINOR>.<PATCH>[-pre] tag.
+    # Manual workflow_dispatch can publish only when it is run from one
+    # of those tags. PRs and branch pushes skip this job.
+    if: |
+      startsWith(github.ref, 'refs/tags/v')
+      && (github.event_name == 'push' || (github.event_name == 'workflow_dispatch' && inputs.publish_release))
     permissions:
       contents: write
       actions: read
@@ -235,6 +515,14 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v4
 
+      - name: Validate release tag
+        shell: bash
+        run: |
+          if [[ ! "$GITHUB_REF" =~ $STRICT_VERSION_REF_RE ]]; then
+            echo "::error::Release tags must be v<MAJOR>.<MINOR>.<PATCH> or v<MAJOR>.<MINOR>.<PATCH>-<prerelease>."
+            exit 1
+          fi
+
       - name: Download artifacts
         uses: actions/download-artifact@v4
         with:
@@ -303,6 +591,7 @@ jobs:
         uses: softprops/action-gh-release@v2
         with:
           body_path: release_notes.md
+          prerelease: ${{ contains(github.ref_name, '-') }}
           files: |
             artifacts/*.dmg
             artifacts/*.zip
@@ -315,3 +604,33 @@ jobs:
           generate_release_notes: true
           fail_on_unmatched_files: false
           token: ${{ secrets.RELEASE_TOKEN }}
+
+  homebrew-tap:
+    name: bump homebrew tap
+    runs-on: ubuntu-latest
+    needs: release
+    # Only stable release tags update the Cask. Prerelease tags
+    # (e.g. v1.2.0-rc.1) are skipped so brew users stay on stable.
+    if: |
+      startsWith(github.ref, 'refs/tags/v')
+      && !contains(github.ref_name, '-')
+      && (github.event_name == 'push' || (github.event_name == 'workflow_dispatch' && inputs.publish_release))
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Download macOS artifacts
+        uses: actions/download-artifact@v4
+        with:
+          name: netcatty-macos
+          path: artifacts/
+
+      - name: Bump Cask in binaricat/homebrew-netcatty
+        env:
+          HOMEBREW_TAP_TOKEN: ${{ secrets.HOMEBREW_TAP_TOKEN }}
+          ARTIFACTS_DIR: artifacts
+        run: |
+          # Strip the leading "v" — Cask version is plain semver.
+          VERSION="${GITHUB_REF_NAME#v}"
+          export VERSION
+          bash .github/scripts/bump-homebrew-cask.sh

.github/workflows/test.yml

@@ -0,0 +1,37 @@
+name: test
+
+on:
+  pull_request:
+  push:
+    branches:
+      - "**"
+
+concurrency:
+  group: test-${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+permissions:
+  contents: read
+
+jobs:
+  test:
+    name: lint-and-test
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: npm
+
+      - name: Install deps
+        run: npm ci
+
+      - name: Lint
+        run: npm run lint
+
+      - name: Test
+        run: npm test

.gitignore

@@ -55,8 +55,22 @@ coverage
 # Serena MCP project config (local only)
 /.serena/
 
+# Git worktrees (local isolated workspaces)
+/.worktrees/
+
 # Windows VS Build environment scripts (local dev only)
 Directory.Build.props
 Directory.Build.targets
 build_with_vs.bat
 build_with_vs2022.bat
+
+# Bundled mosh-client binaries fetched at pack time by
+# scripts/fetch-mosh-binaries.cjs. resources/mosh/README.md is
+# committed; the actual binaries, the Cygwin DLL bundle (Windows),
+# and the bundled ncurses terminfo database are all pulled from the
+# dedicated mosh binary repository, never committed.
+/resources/mosh/*/mosh-client
+/resources/mosh/*/mosh-client.exe
+/resources/mosh/*/mosh-client-*-dlls/
+/resources/mosh/*/*.dll
+/resources/mosh/*/terminfo/

AGENTS.md

@@ -18,7 +18,7 @@ This project is wired around three layers: domain (pure logic), application stat
 - **UI** (`components/`, `App.tsx`): Presentation; depends on hooks and domain helpers only.
 
 ## How Things Talk
-- UI calls application hooks → hooks call domain helpers → persistence/config via infrastructure adapters.
+- UI calls application hooks -> hooks call domain helpers -> persistence/config via infrastructure adapters.
 - `App.tsx` wires hooks to components; no business logic should live in components beyond view glue.
 - Local storage keys are centralized in `infrastructure/config/storageKeys.ts`; avoid ad-hoc `localStorage` calls elsewhere.
 
@@ -44,6 +44,12 @@ This project is wired around three layers: domain (pure logic), application stat
 - Avoid direct network/fetch in components; add a service/adaptor first.
 - Maintain ASCII-only unless required by existing file content.
 
+## Review Boundaries
+- Treat `electron/cli/*`, `netcatty-tool-cli`, the CLI discovery file, and the local TCP bridge as internal Netcatty integration surfaces unless a task explicitly says otherwise.
+- Do not review those surfaces as public APIs by default, and do not assume they must support third-party callers, manual launches, or non-Netcatty agents.
+- On supported first-party paths, assume Netcatty's own launcher provides required integration environment such as `NETCATTY_TOOL_CLI_DISCOVERY_FILE`.
+- If a review concern depends on external exposure, third-party compatibility, or public API stability, call it out as out of scope unless the task explicitly includes that contract.
+
 ---
 
 ## Aside Panel Design System
@@ -54,20 +60,20 @@ VaultView subpages (Hosts, Keychain, Port Forwarding, Snippets, Known Hosts) sha
 
 Import from `./ui/aside-panel`:
 ```tsx
-import { 
-  AsidePanel, 
-  AsidePanelHeader, 
-  AsidePanelContent, 
+import {
+  AsidePanel,
+  AsidePanelHeader,
+  AsidePanelContent,
   AsidePanelFooter,
   AsideActionMenu,
-  AsideActionMenuItem 
+  AsideActionMenuItem
 } from "./ui/aside-panel";
 ```
 
 ### Basic Usage
 ```tsx
-<AsidePanel 
-  open={isOpen} 
+<AsidePanel
+  open={isOpen}
   onClose={handleClose}
   title="Panel Title"
   subtitle="Optional subtitle"

README.md

@@ -40,7 +40,8 @@
 
 ---
 
-[![Netcatty Main Interface](screenshots/main-window-dark.png)](screenshots/main-window-dark.png)
+<img width="2868" height="1784" alt="netcatty SSH (Window) 2026-04-23 11:19 PM" src="https://github.com/user-attachments/assets/d6df734f-9ebc-452a-8b7d-e8a0fdc9463a" />
+
 
 ---
 
@@ -48,11 +49,6 @@
 # 🔥 Catty Agent — Your IT Ops AI Partner
 
 > 🚀 **Boost your IT ops daily work with AI power.** Catty Agent is the built-in AI assistant that understands your servers, executes commands, and handles complex multi-host operations — all through natural conversation.
-
-<p align="center">
-  <img src="screenshots/ai-feature.png" alt="Catty Agent Interface" width="800">
-</p>
-
 ### 🔥 What can Catty Agent do?
 
 - 🚀 **Natural language server management** — just tell it what you need, no more memorizing commands
@@ -68,7 +64,10 @@
 Ask Catty Agent to check a server's health, and it runs the right commands, analyzes the output, and gives you a clear summary — all in seconds.
 
 
-https://github.com/user-attachments/assets/eecf08f1-80bd-49db-886d-b36e93388865
+
+https://github.com/user-attachments/assets/f819a1b6-8cba-4910-8017-97dfc080b477
+
+
 
 
 
@@ -78,8 +77,9 @@ https://github.com/user-attachments/assets/eecf08f1-80bd-49db-886d-b36e93388865
 Watch Catty Agent orchestrate a Docker Swarm cluster across two servers in one conversation. It handles the init, token exchange, and node joining — you just tell it what you want.
 
 
+https://github.com/user-attachments/assets/52fd30b8-9f02-43d4-a3b2-142691e8e3ec
+
 
-https://github.com/user-attachments/assets/282027aa-5c9e-4bb1-b2c3-5eea9df2b203
 
 
 
@@ -160,21 +160,27 @@ Video previews (stored in `screenshots/gifs/`), rendered inline on GitHub:
 ### Vault views: grid / list / tree
 Switch between different Vault views to match your workflow: overview in grid, dense scanning in list, and hierarchical navigation in tree.
 
-https://github.com/user-attachments/assets/e2742987-3131-404d-bd4b-06423e5bfd99
+
+https://github.com/user-attachments/assets/1ff1f3f1-e5ae-40ea-b35a-0e5148c3afeb
+
 
 
 ### Split terminals + session management
 Work in multiple sessions at once with split panes. Keep related tasks side-by-side and reduce context switching.
 
-https://github.com/user-attachments/assets/377d0c46-cc5a-4382-aa31-5acfd412ce62
+
+
+https://github.com/user-attachments/assets/9c24b519-4b4b-4910-a22a-590d04c9af31
+
+
 
 
 
 ### SFTP: drag & drop + built-in editor
 Move files with drag & drop, then edit quickly using the built-in editor without leaving the app.
 
-https://github.com/user-attachments/assets/c6e06af4-b0d5-461c-b0c7-9d6f655af6c7
 
+https://github.com/user-attachments/assets/f3afdb36-399d-4330-b9f3-4678f178f6db
 
 
 
@@ -182,7 +188,11 @@ https://github.com/user-attachments/assets/c6e06af4-b0d5-461c-b0c7-9d6f655af6c7
 ### Drag file upload
 Drop files into the app to kick off uploads without hunting through dialogs.
 
-https://github.com/user-attachments/assets/c8e0c4ff-f020-4e18-9b09-681ec97b003f
+
+
+https://github.com/user-attachments/assets/e1e26f7a-3489-41cc-975e-8dccba56ea85
+
+
 
 
 
@@ -190,7 +200,10 @@ https://github.com/user-attachments/assets/c8e0c4ff-f020-4e18-9b09-681ec97b003f
 ### Custom themes
 Make Netcatty yours: customize themes and UI appearance.
 
-https://github.com/user-attachments/assets/77e2a693-4ef2-4823-8ca1-9bcbf14ed98b
+
+
+https://github.com/user-attachments/assets/1a6049aa-9a4c-4d52-a13d-0b007a791b00
+
 
 
 
@@ -198,7 +211,11 @@ https://github.com/user-attachments/assets/77e2a693-4ef2-4823-8ca1-9bcbf14ed98b
 ### Keyword highlighting
 Highlight important terminal output so errors, warnings, and key events stand out at a glance.
 
-https://github.com/user-attachments/assets/e6516993-ad66-4594-8c28-57426082339b
+
+
+https://github.com/user-attachments/assets/1a1db7bd-948b-4f3c-97cd-8fd0cbe7cce7
+
+
 
 
 

application/defaultKeyPassphrases.ts

@@ -0,0 +1,93 @@
+import type { SSHKey } from "../domain/models";
+import { isEncryptedCredentialPlaceholder } from "../domain/credentials";
+import { STORAGE_KEY_DEFAULT_KEY_PASSPHRASES } from "../infrastructure/config/storageKeys";
+import { localStorageAdapter } from "../infrastructure/persistence/localStorageAdapter";
+import { encryptField, decryptField } from "../infrastructure/persistence/secureFieldAdapter";
+
+export async function saveDefaultKeyPassphrase(keyPath: string, passphrase: string): Promise<void> {
+  const store = localStorageAdapter.read<Record<string, string>>(STORAGE_KEY_DEFAULT_KEY_PASSPHRASES) ?? {};
+  store[keyPath] = await encryptField(passphrase) ?? passphrase;
+  localStorageAdapter.write(STORAGE_KEY_DEFAULT_KEY_PASSPHRASES, store);
+}
+
+export async function loadDefaultKeyPassphrase(keyPath: string): Promise<string | null> {
+  const store = localStorageAdapter.read<Record<string, string>>(STORAGE_KEY_DEFAULT_KEY_PASSPHRASES);
+  const enc = store?.[keyPath];
+  if (!enc) return null;
+  const decrypted = await decryptField(enc);
+  if (!decrypted || isEncryptedCredentialPlaceholder(decrypted)) {
+    removeDefaultKeyPassphrases([keyPath]);
+    return null;
+  }
+  return decrypted;
+}
+
+export function removeDefaultKeyPassphrases(keyPaths: string[]): void {
+  const store = localStorageAdapter.read<Record<string, string>>(STORAGE_KEY_DEFAULT_KEY_PASSPHRASES);
+  if (!store) return;
+  let changed = false;
+  for (const keyPath of keyPaths) {
+    if (keyPath in store) {
+      delete store[keyPath];
+      changed = true;
+    }
+  }
+  if (changed) {
+    localStorageAdapter.write(STORAGE_KEY_DEFAULT_KEY_PASSPHRASES, store);
+  }
+}
+
+export function clearReferenceKeyPassphrases(keys: SSHKey[], keyPaths: string[]): SSHKey[] {
+  let changed = false;
+  const updated = keys.map((key) => {
+    if (key.source === "reference" && key.filePath && keyPaths.includes(key.filePath) && key.passphrase) {
+      changed = true;
+      return { ...key, passphrase: undefined, savePassphrase: false };
+    }
+    return key;
+  });
+  return changed ? updated : keys;
+}
+
+export function clearKeyPassphrasesByIds(keys: SSHKey[], keyIds: string[] = []): SSHKey[] {
+  if (keyIds.length === 0) return keys;
+  const ids = new Set(keyIds);
+  let changed = false;
+  const updated = keys.map((key) => {
+    if (ids.has(key.id) && key.passphrase) {
+      changed = true;
+      return { ...key, passphrase: undefined, savePassphrase: false };
+    }
+    return key;
+  });
+  return changed ? updated : keys;
+}
+
+export function shouldUpdateReferenceKeyPassphrase(key?: SSHKey | null): boolean {
+  return Boolean(
+    key &&
+      (!key.passphrase || isEncryptedCredentialPlaceholder(key.passphrase)),
+  );
+}
+
+export async function rememberKeyPassphrase(args: {
+  keyPath: string;
+  passphrase: string;
+  keys: SSHKey[];
+  updateKeys: (keys: SSHKey[]) => Promise<unknown> | unknown;
+  setCurrentKeys?: (keys: SSHKey[]) => void;
+}): Promise<void> {
+  const { keyPath, passphrase, keys, updateKeys, setCurrentKeys } = args;
+  await saveDefaultKeyPassphrase(keyPath, passphrase);
+
+  const refKey = keys.find((key) => key.source === "reference" && key.filePath === keyPath);
+  if (!refKey) return;
+
+  const updated = keys.map((key) =>
+    key.id === refKey.id
+      ? { ...key, passphrase, savePassphrase: true }
+      : key
+  );
+  setCurrentKeys?.(updated);
+  await updateKeys(updated);
+}

application/i18n/locales/en.ts

@@ -56,6 +56,11 @@ const en: Messages = {
   'confirm.deleteHost': 'Delete Host "{name}"?',
   'confirm.deleteIdentity': 'Delete Identity "{name}"?',
   'confirm.removeProvider': 'Remove provider "{name}"?',
+  'confirm.closeBusyTerminal.title': 'Confirm close',
+  'confirm.closeBusyTerminal.message': 'Process "{command}" is still running and will be terminated.',
+  'confirm.closeBusyTerminal.messageWithMore': 'Process "{command}" and {count} other running process(es) will be terminated.',
+  'confirm.closeBusyTerminal.cancel': 'Cancel',
+  'confirm.closeBusyTerminal.close': 'Close',
   'dialog.createWorkspace.title': 'Create Workspace',
   'dialog.renameWorkspace.title': 'Rename workspace',
   'dialog.renameSession.title': 'Rename session',
@@ -197,9 +202,15 @@ const en: Messages = {
   'settings.application.github.subtitle': 'Source code',
   'settings.application.whatsNew': "What's new",
   'settings.application.whatsNew.subtitle': 'Show release notes',
+  'settings.application.openExternal.failedTitle': 'Cannot open link',
+  'settings.application.openExternal.failedBody': 'The link could not be opened in either the system browser or the built-in browser window.',
   'settings.vault.title': 'Vault',
   'settings.vault.showRecentHosts': 'Show recently connected hosts',
   'settings.vault.showRecentHostsDesc': 'Display a section of recently connected hosts at the top of the vault',
+  'settings.vault.showOnlyUngroupedHostsInRoot': 'Only show ungrouped hosts at root',
+  'settings.vault.showOnlyUngroupedHostsInRootDesc': 'When enabled, the root host list only shows hosts without a group. Open a group from the sidebar to see grouped hosts.',
+  'settings.vault.showSftpTab': 'Show SFTP tab',
+  'settings.vault.showSftpTabDesc': 'Display the standalone SFTP view in the top tab bar. When hidden, use the in-session SFTP side panel instead.',
 
   // Update notifications
   'update.available.title': 'Update Available',
@@ -237,9 +248,9 @@ const en: Messages = {
   'settings.appearance.themeColor.dark': 'Dark palette',
   'settings.appearance.customCss': 'Custom CSS',
   'settings.appearance.customCss.desc':
-    'Add custom CSS to personalize the app appearance. Changes apply immediately.',
+    'Add custom CSS to personalize the app appearance. Changes apply immediately. Major UI regions expose a [data-section="..."] attribute you can target — e.g. snippets-panel, host-details-panel, group-details-panel, serial-host-details-panel, ai-chat-panel, vault-sidebar, vault-main, vault-hosts-header, vault-host-list, vault-view, terminal-workspace, terminal-workspace-sidebar, top-tabs.',
   'settings.appearance.customCss.placeholder':
-    '/* Example: */\n.terminal { background: #1a1a2e !important; }\n:root { --radius: 0.25rem; }',
+    '/* Examples — use !important to beat Tailwind utility specificity */\n\n/* Make snippet sidebar text larger */\n[data-section="snippets-panel"] {\n  font-size: 14px !important;\n}\n\n/* Custom terminal background */\n.terminal { background: #1a1a2e !important; }\n\n/* Tweak global border radius */\n:root { --radius: 0.25rem; }',
   'settings.appearance.language': 'Language',
   'settings.appearance.language.desc': 'Choose the UI language',
   'settings.appearance.uiFont': 'Interface Font',
@@ -251,6 +262,8 @@ const en: Messages = {
   'settings.terminal.themeModal.darkThemes': 'Dark Themes',
   'settings.terminal.themeModal.lightThemes': 'Light Themes',
   'settings.terminal.theme.selectButton': 'Select Theme',
+  'settings.terminal.theme.followApp': 'Follow Application Theme',
+  'settings.terminal.theme.followApp.desc': 'Automatically match the terminal background to the current app theme for a seamless look.',
   'settings.terminal.section.font': 'Font',
   'settings.terminal.section.cursor': 'Cursor',
   'settings.terminal.section.keyboard': 'Keyboard',
@@ -260,6 +273,17 @@ const en: Messages = {
   'settings.terminal.section.keywordHighlight': 'Keyword highlighting',
   'settings.terminal.font.family': 'Font',
   'settings.terminal.font.family.desc': 'Terminal font family',
+  'settings.terminal.font.cjk': 'CJK font',
+  'settings.terminal.font.cjk.desc': 'Font used for Chinese / Japanese / Korean characters; "Auto" picks one based on the primary font',
+  'settings.terminal.font.cjk.option.auto': 'Auto · paired with the primary font',
+  'settings.terminal.font.cjk.option.sarasaSC': 'Sarasa Mono SC (Iosevka + Source Han SC)',
+  'settings.terminal.font.cjk.option.sarasaTC': 'Sarasa Mono TC (Iosevka + Source Han TC)',
+  'settings.terminal.font.cjk.option.mapleCN': 'Maple Mono CN',
+  'settings.terminal.font.cjk.option.sourceHan': 'Source Han Mono SC',
+  'settings.terminal.font.cjk.option.notoCJK': 'Noto Sans Mono CJK SC',
+  'settings.terminal.font.cjk.option.lxgwWenkai': 'LXGW WenKai Mono',
+  'settings.terminal.font.cjk.option.simSun': 'SimSun',
+  'settings.terminal.font.cjk.option.legacy': '{font} · not recommended (proportional font)',
   'settings.terminal.font.size': 'Font size',
   'settings.terminal.font.size.desc': 'Terminal text size',
   'settings.terminal.font.weight': 'Font weight',
@@ -293,6 +317,15 @@ const en: Messages = {
   'settings.terminal.behavior.bracketedPaste': 'Bracketed paste mode',
   'settings.terminal.behavior.bracketedPaste.desc':
     'Wrap pasted text with escape sequences so the shell can distinguish paste from typed input. Disable if you see ^[[200~ artifacts.',
+  'settings.terminal.behavior.clearWipesScrollback': '`clear` wipes scrollback',
+  'settings.terminal.behavior.clearWipesScrollback.desc':
+    'Make `clear` also wipe the scrollback buffer (POSIX default). Disable to keep history visible after `clear`.',
+  'settings.terminal.behavior.preserveSelectionOnInput': 'Keep selection while typing',
+  'settings.terminal.behavior.preserveSelectionOnInput.desc':
+    'Don\'t clear mouse-selected text when typing — useful for selecting a path then pasting it after a command prefix like `sz `.',
+  'settings.terminal.behavior.forcePromptNewLine': 'Prompt on a new line',
+  'settings.terminal.behavior.forcePromptNewLine.desc':
+    'When the final line of command output is not terminated by a newline, move the recognized shell prompt to the next visual line.',
   'settings.terminal.behavior.osc52Clipboard': 'OSC-52 clipboard',
   'settings.terminal.behavior.osc52Clipboard.desc':
     'Allow remote programs (tmux, vim, etc.) to access the local clipboard via OSC-52 escape sequences.',
@@ -328,12 +361,16 @@ const en: Messages = {
   'settings.terminal.scrollback.rows': 'Number of rows *',
   'settings.terminal.keywordHighlight.title': 'Keyword highlighting',
   'settings.terminal.keywordHighlight.resetColors': 'Reset to default colors',
+  'settings.terminal.keywordHighlight.resetDefaults': 'Reset built-ins to defaults',
+  'settings.terminal.keywordHighlight.resetBuiltIn': 'Restore default label and patterns',
   'settings.terminal.keywordHighlight.addCustom': 'Add Custom Rule',
   'settings.terminal.keywordHighlight.editCustom': 'Edit Rule',
+  'settings.terminal.keywordHighlight.editBuiltIn': 'Edit Built-in Rule',
   'settings.terminal.keywordHighlight.labelField': 'Label & Color',
   'settings.terminal.keywordHighlight.labelPlaceholder': 'Label (e.g., Down)',
-  'settings.terminal.keywordHighlight.patternField': 'Regex Pattern',
-  'settings.terminal.keywordHighlight.patternPlaceholder': 'Regex (e.g., \\bdown\\b)',
+  'settings.terminal.keywordHighlight.patternField': 'Regex Patterns',
+  'settings.terminal.keywordHighlight.patternPlaceholder': 'One regex per line (e.g., \\bdown\\b)',
+  'settings.terminal.keywordHighlight.patternHint': 'One regex per line. Patterns are matched case-insensitively with the global flag.',
   'settings.terminal.keywordHighlight.invalidPattern': 'Invalid regex pattern',
   'settings.terminal.keywordHighlight.preview': 'Preview',
   'settings.terminal.section.localShell': 'Local Shell',
@@ -355,7 +392,12 @@ const en: Messages = {
   'settings.terminal.localShell.startDir.isFile': 'Path is a file, not a directory',
   'settings.terminal.section.connection': 'Connection',
   'settings.terminal.connection.keepaliveInterval': 'Keepalive Interval',
-  'settings.terminal.connection.keepaliveInterval.desc': 'How often (in seconds) to send SSH-level keepalive packets to server. Set to 0 to disable.',
+  'settings.terminal.connection.keepaliveInterval.desc': 'How often (in seconds) to send SSH-level keepalive packets. Set to 0 to disable globally — note that individual hosts can override this in their own settings.',
+  'settings.terminal.connection.keepaliveCountMax': 'Max unanswered keepalives',
+  'settings.terminal.connection.keepaliveCountMax.desc': 'Unanswered keepalives before the connection is declared dead. Higher values are more forgiving of brief network glitches and SSH servers that respond slowly.',
+  'settings.terminal.connection.x11Display': 'X11 display',
+  'settings.terminal.connection.x11Display.desc': 'Optional local display address for X11 forwarding. Leave empty to use the system default.',
+  'settings.terminal.connection.x11Display.placeholder': 'Auto (:0 or DISPLAY)',
   'settings.terminal.section.serverStats': 'Server Stats (Linux)',
   'settings.terminal.serverStats.show': 'Show Server Stats',
   'settings.terminal.serverStats.show.desc': 'Display CPU, memory, and disk usage in the terminal statusbar (Linux servers only).',
@@ -396,6 +438,7 @@ const en: Messages = {
   'settings.shortcuts.resetAll': 'Reset All',
   'settings.shortcuts.recording': 'Press keys...',
   'settings.shortcuts.none': 'None',
+  'settings.shortcuts.setDisabled': 'Set to disabled',
   'settings.shortcuts.category.tabs': 'Tabs',
   'settings.shortcuts.category.terminal': 'Terminal',
   'settings.shortcuts.category.navigation': 'Navigation',
@@ -435,13 +478,55 @@ const en: Messages = {
   'sync.toast.completedMessage': 'Sync completed successfully',
   'sync.toast.errorTitle': 'Sync Error',
   'sync.autoSync.failedTitle': 'Sync failed',
+  'sync.autoSync.inspectFailedTitle': 'Sync paused',
+  'sync.autoSync.inspectFailedMessage': 'Could not reach the cloud to check for changes. Auto-sync will retry when data changes or the app is restarted.',
   'sync.autoSync.syncedTitle': 'Synced from cloud',
   'sync.autoSync.syncedMessage': 'Your data has been updated from the cloud.',
   'sync.autoSync.noProvider': 'No cloud provider connected. Open Settings → Sync & Cloud to connect one.',
   'sync.autoSync.alreadySyncing': 'Sync is already in progress.',
+  'sync.autoSync.restoreInProgress': 'A vault restore is in progress in another window. Please wait for it to finish.',
+  'sync.autoSync.interruptedApplyTitle': 'Sync paused — previous restore interrupted',
+  'sync.autoSync.interruptedApplyMessage': 'A previous restore did not finish cleanly, so the local vault may be inconsistent. Open Settings → Sync & Cloud → Restore and apply a protective backup before auto-sync resumes.',
   'sync.autoSync.vaultLocked': 'Vault is locked. Open Settings → Sync & Cloud to unlock.',
   'sync.autoSync.conflictDetected': 'Sync conflict detected. Open Settings → Sync & Cloud to resolve.',
   'sync.autoSync.syncFailed': 'Sync failed',
+  'sync.autoSync.restoredTitle': 'Vault restored',
+  'sync.autoSync.restoredMessage': 'Your vault has been restored from the cloud.',
+  'sync.autoSync.keptLocalTitle': 'Kept local vault',
+  'sync.autoSync.keptLocalMessage': 'Your empty local vault was kept. Cloud data was not applied.',
+  'sync.autoSync.emptyVaultConflict.title': 'Empty Vault Detected',
+  'sync.autoSync.emptyVaultConflict.description': 'Your local vault is empty, but the cloud has data. This usually happens after an update or storage reset. What would you like to do?',
+  'sync.autoSync.emptyVaultConflict.cloudLabel': 'Cloud',
+  'sync.autoSync.emptyVaultConflict.restore': 'Restore from Cloud',
+  'sync.autoSync.emptyVaultConflict.restoreDesc': 'Recommended — recover your hosts, keys, and snippets from the cloud backup',
+  'sync.autoSync.emptyVaultConflict.keepEmpty': 'Keep Empty',
+  'sync.autoSync.emptyVaultConflict.keepEmptyDesc': 'Start fresh with an empty vault',
+  'sync.autoSync.emptyVaultConflict.cloudSummary': '{hosts} hosts, {keys} keys, {snippets} snippets, {proxyProfiles} proxies',
+  'sync.autoSync.emptyVaultManual': 'Cannot sync: the local vault is empty. Restore from a local backup or enable Force Push in the sync panel first.',
+
+  'sync.blocked.title': 'Sync paused',
+  'sync.blocked.reason.bulkShrink': 'Would delete {lost} of {baseCount} {entityType} from cloud ({percent}% reduction).',
+  'sync.blocked.reason.largeShrink': 'Would delete {lost} {entityType} from cloud.',
+  'sync.blocked.detail': 'This is usually caused by a degraded local state (keychain failure, partial data load). Restore from a local backup, or force-push if you truly meant to remove these entries.',
+  'sync.blocked.restoreButton': 'Restore from local backup',
+  'sync.blocked.forcePushButton': 'Force push anyway',
+
+  'sync.forcePush.title': 'Confirm force push',
+  'sync.forcePush.body': 'You are about to remove {lost} {entityType} from the cloud. This cannot be undone. Proceed?',
+  'sync.forcePush.confirm': 'Yes, push anyway',
+  'sync.forcePush.cancel': 'Cancel',
+
+  'sync.entityType.hosts': 'hosts',
+  'sync.entityType.keys': 'keys',
+  'sync.entityType.identities': 'identities',
+  'sync.entityType.proxyProfiles': 'proxy profiles',
+  'sync.entityType.snippets': 'snippets',
+  'sync.entityType.customGroups': 'groups',
+  'sync.entityType.snippetPackages': 'snippet packages',
+  'sync.entityType.knownHosts': 'known-host entries',
+  'sync.entityType.portForwardingRules': 'port-forwarding rules',
+  'sync.entityType.groupConfigs': 'group configs',
+
   'sync.credentialsUnavailable': 'This device cannot decrypt some saved credentials. Re-enter credentials locally before syncing.',
   'time.never': 'Never',
   'time.justNow': 'Just now',
@@ -450,11 +535,28 @@ const en: Messages = {
   // Vault navigation
   'vault.nav.hosts': 'Hosts',
   'vault.nav.keychain': 'Keychain',
+  'vault.nav.proxies': 'Proxies',
   'vault.nav.portForwarding': 'Port Forwarding',
   'vault.nav.snippets': 'Snippets',
   'vault.nav.knownHosts': 'Known Hosts',
   'vault.nav.logs': 'Logs',
 
+  'proxyProfiles.action.add': 'Add Proxy',
+  'proxyProfiles.search.placeholder': 'Search proxies…',
+  'proxyProfiles.section.proxies': 'Proxies',
+  'proxyProfiles.count.items': '{count} items',
+  'proxyProfiles.empty.title': 'No Proxies',
+  'proxyProfiles.empty.desc': 'Create reusable HTTP or SOCKS5 proxies and select them from host details.',
+  'proxyProfiles.usage': '{count} linked',
+  'proxyProfiles.copyName': '{name} Copy',
+  'proxyProfiles.panel.newTitle': 'New Proxy',
+  'proxyProfiles.field.name': 'Proxy name',
+  'proxyProfiles.error.required': 'Name, host, and port are required.',
+  'proxyProfiles.error.port': 'Port must be between 1 and 65535.',
+  'proxyProfiles.viewMode': 'Proxy view mode',
+  'proxyProfiles.delete.title': 'Delete proxy?',
+  'proxyProfiles.delete.desc': 'Deleting "{name}" will unlink it from {count} host or group settings.',
+
   'vault.groups.title': 'Groups',
   'vault.groups.total': '{count} total',
   'vault.groups.hostsCount': '{count} Hosts',
@@ -529,6 +631,7 @@ const en: Messages = {
   'vault.hosts.deselectAll': 'Deselect All',
   'vault.hosts.deleteSelected': 'Delete ({count})',
   'vault.hosts.deleteMultiple.success': 'Deleted {count} hosts',
+  'vault.hosts.moveToGroup.success': 'Moved {host} to {group}',
   'vault.hosts.empty.title': 'Set up your hosts',
   'vault.hosts.empty.desc': 'Save hosts to quickly connect to your servers, VMs, and containers.',
 
@@ -691,6 +794,10 @@ const en: Messages = {
   'sftp.context.permissions': 'Permissions',
   'sftp.context.delete': 'Delete',
   'sftp.context.refresh': 'Refresh',
+  'sftp.context.uploadFiles': 'Upload File(s)...',
+  'sftp.context.uploadFilesHere': 'Upload File(s) Here...',
+  'sftp.context.uploadFolder': 'Upload Folder...',
+  'sftp.context.uploadFolderHere': 'Upload Folder Here...',
   'sftp.context.downloadSelected': 'Download selected ({count})',
   'sftp.context.deleteSelected': 'Delete selected ({count})',
   'sftp.dropFilesHere': 'Drop files here',
@@ -713,6 +820,14 @@ const en: Messages = {
   'sftp.transfers.collapseChildren': 'Hide files',
   'sftp.transfers.expandChildList': 'Show detail',
   'sftp.transfers.collapseChildList': 'Hide',
+  'sftp.transfers.retryAction': 'Retry',
+  'sftp.transfers.dismissAction': 'Dismiss',
+  'sftp.transfers.openTargetFolder': 'Open target folder',
+  'sftp.transfers.openTargetFolderError': 'Could not open target folder',
+  'sftp.transfers.copyTargetPath': 'Copy target path',
+  'sftp.transfers.copyTargetPathSuccess': 'Target path copied',
+  'sftp.transfers.copyTargetPathError': 'Could not copy target path',
+  'sftp.transfers.resizeNameColumn': 'Resize file name column',
   'sftp.transfers.dragToResize': 'Drag to resize',
   'sftp.goUp': 'Go up',
   'sftp.goToTerminalCwd': 'Go to terminal directory',
@@ -779,8 +894,11 @@ const en: Messages = {
   'sftp.conflict.size': 'Size:',
   'sftp.conflict.modified': 'Modified:',
   'sftp.conflict.applyToAll': 'Apply this action to all {count} remaining conflicts',
+  'sftp.conflict.action.stop': 'Stop',
   'sftp.conflict.action.skip': 'Skip',
   'sftp.conflict.action.keepBoth': 'Keep Both',
+  'sftp.conflict.action.duplicate': 'Duplicate',
+  'sftp.conflict.action.merge': 'Merge',
   'sftp.conflict.action.replace': 'Replace',
 
   // SFTP Upload Phases
@@ -983,6 +1101,14 @@ const en: Messages = {
   'hostDetails.distro.option.almalinux': 'AlmaLinux',
   'hostDetails.distro.option.oracle': 'Oracle Linux',
   'hostDetails.distro.option.kali': 'Kali Linux',
+  'hostDetails.distro.option.cisco': 'Cisco',
+  'hostDetails.distro.option.juniper': 'Juniper Networks',
+  'hostDetails.distro.option.huawei': 'Huawei',
+  'hostDetails.distro.option.hpe': 'HPE / H3C',
+  'hostDetails.distro.option.mikrotik': 'MikroTik',
+  'hostDetails.distro.option.fortinet': 'Fortinet',
+  'hostDetails.distro.option.paloalto': 'Palo Alto Networks',
+  'hostDetails.distro.option.zyxel': 'ZyXEL',
   'hostDetails.section.mosh': 'Mosh',
   'hostDetails.username.placeholder': 'Username',
   'hostDetails.password.placeholder': 'Password',
@@ -1007,6 +1133,9 @@ const en: Messages = {
   'hostDetails.agentForwarding.agentNotRunning': 'SSH Agent is not available',
   'hostDetails.agentForwarding.agentNotRunningHint': 'No SSH agent detected. Enable OpenSSH Authentication Agent in Windows Services, or use a compatible agent such as Bitwarden, 1Password, or gpg-agent.',
   'hostDetails.section.agentForwarding': 'SSH Agent',
+  'hostDetails.x11Forwarding': 'Forward X11 apps',
+  'hostDetails.x11Forwarding.desc': 'Show remote graphical apps on your local desktop when a local X server is running.',
+  'hostDetails.section.x11Forwarding': 'X11 Forwarding',
   'hostDetails.section.deviceType': 'Device Type',
   'hostDetails.deviceType': 'Network Device Mode',
   'hostDetails.deviceType.desc': 'Enable for network equipment (switches, routers, firewalls) connected via SSH. Commands are sent as-is without shell wrapping, compatible with vendor CLIs like Huawei VRP and Cisco IOS.',
@@ -1015,6 +1144,12 @@ const en: Messages = {
   'hostDetails.legacyAlgorithms': 'Allow Legacy Algorithms',
   'hostDetails.legacyAlgorithms.desc': 'Enable deprecated SSH algorithms (diffie-hellman-group1, ssh-dss, 3des-cbc, etc.) for connecting to older network equipment.',
   'hostDetails.legacyAlgorithms.warning': 'These algorithms have known security weaknesses. Only enable for legacy devices that do not support modern cryptography.',
+  'hostDetails.section.keepalive': 'Keepalive',
+  'hostDetails.keepalive.override': 'Override global keepalive',
+  'hostDetails.keepalive.desc': 'Use a custom keepalive policy for this host instead of the global setting. Useful for older routers or switches whose SSH server does not reply to keepalive@openssh.com requests — set interval to 0 to disable keepalive entirely on this host.',
+  'hostDetails.keepalive.interval': 'Interval (seconds)',
+  'hostDetails.keepalive.countMax': 'Max unanswered keepalives',
+  'hostDetails.keepalive.disabledHint': 'Interval = 0 disables keepalive for this host. The session will rely on TCP-level timeouts to detect a dead connection.',
   'hostDetails.backspaceBehavior': 'Backspace Behavior',
   'hostDetails.backspaceBehavior.default': 'Default',
   'hostDetails.jumpHosts': 'Proxy via Hosts',
@@ -1032,6 +1167,12 @@ const en: Messages = {
   'hostDetails.proxyPanel.passwordPlaceholder': 'Password',
   'hostDetails.proxyPanel.identities': 'Identities',
   'hostDetails.proxyPanel.remove': 'Remove Proxy',
+  'hostDetails.proxyPanel.savedProxy': 'Saved proxy',
+  'hostDetails.proxyPanel.selectSaved': 'Select saved proxy',
+  'hostDetails.proxyPanel.customProxy': 'Custom proxy',
+  'hostDetails.proxyPanel.missing': 'Missing',
+  'hostDetails.proxyPanel.missingSaved': 'Missing saved proxy',
+  'hostDetails.proxyPanel.error.required': 'Proxy host and port are required.',
   'hostDetails.envVars': 'Environment Variables',
   'hostDetails.envVars.add': 'Add Environment Variable',
   'hostDetails.envVars.title': 'Environment Variables',
@@ -1123,11 +1264,12 @@ const en: Messages = {
   'terminal.toolbar.openSftp': 'Open SFTP',
   'terminal.toolbar.availableAfterConnect': 'Available after connect',
   'terminal.toolbar.sftp': 'SFTP',
+  'terminal.toolbar.more': 'More actions',
   'terminal.toolbar.scripts': 'Scripts',
   'terminal.toolbar.library': 'Library',
   'terminal.toolbar.noSnippets': 'No snippets available',
   'terminal.toolbar.terminalSettings': 'Terminal settings',
-  'terminal.toolbar.searchTerminal': 'Search terminal (Ctrl+F)',
+  'terminal.toolbar.searchTerminal': 'Search terminal',
   'terminal.toolbar.search': 'Search',
   'terminal.toolbar.broadcast': 'Broadcast',
   'terminal.toolbar.broadcastEnable': 'Enable Broadcast Mode',
@@ -1152,6 +1294,10 @@ const en: Messages = {
   'terminal.toolbar.hostHighlight.clearAll': 'Clear All',
   'terminal.toolbar.hostHighlight.changeColor': 'Change highlight color for',
   'terminal.toolbar.hostHighlight.selectColor': 'Select color for new rule',
+  'terminal.statusbar.copyHostname.label': 'Copy host address',
+  'terminal.statusbar.copyHostname.tooltip': 'Copy host address ({hostname})',
+  'terminal.statusbar.copyHostname.toast': 'Copied host address: {hostname}',
+  'terminal.statusbar.copyHostname.error': 'Failed to copy host address to clipboard',
   'terminal.serverStats.cpu': 'CPU Usage',
   'terminal.serverStats.cpuCores': 'CPU Core Usage',
   'terminal.serverStats.memory': 'Memory Usage',
@@ -1183,7 +1329,9 @@ const en: Messages = {
   'terminal.search.nextMatch': 'Next match (Enter)',
   'terminal.menu.copy': 'Copy',
   'terminal.menu.paste': 'Paste',
+  'terminal.menu.pasteSelection': 'Paste Selection',
   'terminal.menu.selectAll': 'Select All',
+  'terminal.menu.reconnect': 'Reconnect',
   'terminal.menu.splitHorizontal': 'Split Horizontal',
   'terminal.menu.splitVertical': 'Split Vertical',
   'terminal.menu.clearBuffer': 'Clear Buffer',
@@ -1217,6 +1365,16 @@ const en: Messages = {
   'terminal.connection.protocol.mosh': 'Mosh',
   'terminal.connection.protocol.serial': 'Serial',
   'terminal.connection.protocol.local': 'Local Shell',
+  'terminal.hostKey.unknownTitle': 'Confirm this host key',
+  'terminal.hostKey.changedTitle': 'Host key changed',
+  'terminal.hostKey.unknownDescription': 'The authenticity of {host} cannot be established yet.',
+  'terminal.hostKey.changedDescription': 'The saved key for {host} no longer matches this server.',
+  'terminal.hostKey.fingerprintLabel': '{keyType} fingerprint is SHA256:',
+  'terminal.hostKey.savedFingerprintLabel': 'Saved fingerprint',
+  'terminal.hostKey.unknownHint': 'Remember it if this fingerprint belongs to the server you expected.',
+  'terminal.hostKey.changedHint': 'Only continue if you expected this host to change.',
+  'terminal.hostKey.addAndContinue': 'Add and continue',
+  'terminal.hostKey.updateAndContinue': 'Update and continue',
   'terminal.themeModal.title': 'Terminal Appearance',
   'terminal.themeModal.tab.theme': 'Theme',
   'terminal.themeModal.tab.font': 'Font',
@@ -1227,6 +1385,11 @@ const en: Messages = {
   'terminal.themeModal.fontWeight': 'Font Weight',
   'terminal.themeModal.livePreview': 'Live Preview',
   'terminal.themeModal.themeType': '{type} theme',
+  'terminal.hiddenTheme.title': 'Current hidden theme',
+  'terminal.hiddenTheme.desc': 'This theme is hidden from manual picks and will be replaced when you choose another theme.',
+  'topTabs.toggleTheme.systemExitTitle': 'System theme is active',
+  'topTabs.toggleTheme.systemExitMessage': 'Open Settings to choose a fixed Light or Dark theme.',
+  'topTabs.toggleTheme.openSettings': 'Open Settings',
 
   // Custom Themes
   'terminal.customTheme.section': 'Custom Themes',
@@ -1356,6 +1519,47 @@ const en: Messages = {
   'cloudSync.history.download': 'Download',
   'cloudSync.history.resolved': 'Resolved',
   'cloudSync.history.error': 'Error',
+  'cloudSync.localBackups.title': 'Local Backup History',
+  'cloudSync.localBackups.desc': 'Netcatty keeps local restore points before app version changes and before vault restores.',
+  'cloudSync.localBackups.retentionTitle': 'Backup Retention',
+  'cloudSync.localBackups.retentionDesc': 'Choose how many local backups Netcatty should keep.',
+  'cloudSync.localBackups.maxCount': 'Max backups',
+  'cloudSync.localBackups.maxSaved': 'Saved backup retention: {count}',
+  'cloudSync.localBackups.maxInvalid': 'Please enter a number between 1 and 100.',
+  'cloudSync.localBackups.empty': 'No local backups yet.',
+  'cloudSync.localBackups.reason.appVersionChange': 'Before app version change',
+  'cloudSync.localBackups.reason.beforeRestore': 'Before restore',
+  'cloudSync.localBackups.versionChange': '{from} -> {to}',
+  'cloudSync.localBackups.counts': '{hosts} hosts, {keys} keys, {snippets} snippets',
+  'cloudSync.localBackups.restore': 'Restore',
+  'cloudSync.localBackups.restoreSuccess': 'Local backup restored.',
+  'cloudSync.localBackups.restoreFailedTitle': 'Restore failed',
+  'cloudSync.localBackups.restoreMissing': 'Backup not found.',
+  'cloudSync.localBackups.protectiveBackupFailed': 'Safety backup could not be created, so the restore was aborted to protect your current data. Resolve the underlying issue (e.g. keychain access) and try again. Details: {message}',
+  'cloudSync.localBackups.restoreConfirmTitle': 'Restore this backup?',
+  'cloudSync.localBackups.restoreConfirmDesc': 'Your current hosts, keys, snippets and settings will be replaced with the contents of this backup. A protective snapshot of your current data is taken automatically first.',
+  'cloudSync.localBackups.restoreConfirmButton': 'Restore',
+  'cloudSync.localBackups.restoreConfirmCancel': 'Cancel',
+  'cloudSync.localBackups.unavailableTitle': 'Local backups unavailable',
+  'cloudSync.localBackups.unavailableDesc': 'This platform does not expose a secure keychain to Netcatty, so local backups cannot be written safely. Install Netcatty on a system with a supported keychain to enable the local backup history.',
+  'cloudSync.localBackups.lockedTitle': 'Master key required',
+  'cloudSync.localBackups.lockedDesc': 'Set up or unlock your master key before restoring a backup, so restored credentials remain encrypted.',
+  'cloudSync.revisionHistory.viewButton': 'History',
+  'cloudSync.revisionHistory.title': 'Vault Version History',
+  'cloudSync.revisionHistory.description': 'Browse and restore previous versions of your vault from the Gist revision history.',
+  'cloudSync.revisionHistory.empty': 'No revisions found.',
+  'cloudSync.revisionHistory.current': 'Current',
+  'cloudSync.revisionHistory.revision': 'Revision',
+  'cloudSync.revisionHistory.revisionPreview': 'Revision Contents',
+  'cloudSync.revisionHistory.device': 'Device',
+  'cloudSync.revisionHistory.hosts': 'Hosts',
+  'cloudSync.revisionHistory.keys': 'Keys',
+  'cloudSync.revisionHistory.snippets': 'Snippets',
+  'cloudSync.revisionHistory.identities': 'Identities',
+  'cloudSync.revisionHistory.restoreButton': 'Restore This Version',
+  'cloudSync.revisionHistory.restored': 'Vault restored from selected revision.',
+  'cloudSync.revisionHistory.revisionNotFound': 'Revision not found or does not contain vault data.',
+  'cloudSync.revisionHistory.decryptFailed': 'Cannot decrypt this revision. It may have been encrypted with a different master password.',
   'cloudSync.changeKey.title': 'Change Master Key',
   'cloudSync.changeKey.current': 'Current Master Key',
   'cloudSync.changeKey.new': 'New Master Key',
@@ -1400,6 +1604,7 @@ const en: Messages = {
   'cloudSync.conflict.keepLocal': 'Overwrite cloud (keep local)',
   'cloudSync.conflict.useCloud': 'Download cloud (overwrite local)',
   'cloudSync.connect.browserContinue': 'Complete authorization in browser',
+  'cloudSync.connect.browserCancelled': 'Previous browser authorization was cancelled',
   'cloudSync.connect.github.success': 'GitHub connected successfully',
   'cloudSync.connect.github.failedTitle': 'GitHub connection failed',
   'cloudSync.connect.github.timeout': 'GitHub connection timed out. Check your network or proxy settings.',
@@ -1523,12 +1728,16 @@ const en: Messages = {
   'tabs.logPrefix': 'Log:',
   'tabs.logLocal': 'Local',
   'tabs.copyTab': 'Copy Tab',
+  'tabs.closeOthers': 'Close Others',
+  'tabs.closeToRight': 'Close Tabs to the Right',
+  'tabs.closeAll': 'Close All',
   'keychain.edit.labelRequired': 'Label *',
   'keychain.edit.keyLabelPlaceholder': 'Key label',
   'keychain.edit.privateKeyRequired': 'Private key *',
   'keychain.edit.publicKey': 'Public key',
   'keychain.edit.certificate': 'Certificate',
   'keychain.edit.certificatePlaceholder': 'Certificate content (optional)',
+  'keychain.edit.filePath': 'File path',
   'keychain.edit.keyExport': 'Key export',
   'keychain.edit.exportToHost': 'Export to host',
 
@@ -1562,6 +1771,8 @@ const en: Messages = {
   'snippets.breadcrumb.separator': '›',
   'snippets.empty.title': 'Create snippet',
   'snippets.empty.desc': 'Save your most used commands as snippets to reuse them in one click.',
+  'snippets.search.noResults.title': 'No matches',
+  'snippets.search.noResults.desc': 'No snippets or packages match "{query}". Try a different search term or clear the search to browse.',
   'snippets.section.packages': 'Packages',
   'snippets.section.snippets': 'Snippets',
   'snippets.package.count': '{count} snippet(s)',
@@ -1643,10 +1854,7 @@ const en: Messages = {
   'keyboard.interactive.enterResponse': 'Enter response',
   'keyboard.interactive.submit': 'Submit',
   'keyboard.interactive.verifying': 'Verifying...',
-  'keyboard.interactive.fill': 'Fill',
-  'keyboard.interactive.fillSaved': 'Fill with saved password',
-  'keyboard.interactive.useSaved': 'Use saved',
-  'keyboard.interactive.useSavedPassword': 'Use saved password',
+  'keyboard.interactive.savePassword': 'Save password',
 
   // Passphrase Modal for encrypted SSH keys
   'passphrase.title': 'SSH Key Passphrase',
@@ -1657,9 +1865,16 @@ const en: Messages = {
   'passphrase.unlock': 'Unlock',
   'passphrase.unlocking': 'Unlocking...',
   'passphrase.skip': 'Skip',
+  'passphrase.remember': 'Remember this passphrase',
 
   // Text Editor
   'sftp.editor.wordWrap': 'Word Wrap',
+  'sftp.editor.maximize': 'Maximize',
+  'sftp.editor.unsavedTitle': 'Unsaved changes',
+  'sftp.editor.unsavedMessage': '{fileName} has unsaved changes. Save before closing?',
+  'sftp.editor.discardChanges': 'Discard',
+  'sftp.editor.saveAndClose': 'Save and close',
+  'sftp.editor.quitBlockedByDirty': 'Unsaved editors — please save or discard before quitting',
 
   // AI Settings
   'ai.agentSettings': 'Agent Settings',
@@ -1697,12 +1912,16 @@ const en: Messages = {
   // AI Codex
   'ai.codex': 'Codex',
   'ai.codex.title': 'Codex CLI',
-  'ai.codex.description': 'Uses codex + codex-acp for ACP protocol streaming. Login with ChatGPT subscription here, or configure an OpenAI provider API key (passed as CODEX_API_KEY).',
+  'ai.codex.description': 'Uses codex + codex-acp for ACP protocol streaming. Login with ChatGPT here, or enable an OpenAI-compatible provider API key and custom endpoint in Settings.',
   'ai.codex.detecting': 'Detecting...',
   'ai.codex.notFound': 'Not found',
   'ai.codex.awaitingLogin': 'Awaiting login',
   'ai.codex.connectedChatGPT': 'Connected via ChatGPT',
   'ai.codex.connectedApiKey': 'Connected via API key',
+  'ai.codex.connectedCustomConfig': 'Connected via ~/.codex/config.toml',
+  'ai.codex.customConfigIncomplete': 'Custom config detected (env var missing)',
+  'ai.codex.customConfigHint': 'Using custom provider "{provider}" configured in ~/.codex/config.toml — no ChatGPT login needed.',
+  'ai.codex.customConfigMissingEnvKey': 'Warning: {envKey} is not set in your shell environment. Export it (or launch netcatty from a shell that has it) so Codex can authenticate.',
   'ai.codex.notConnected': 'Not connected',
   'ai.codex.statusUnknown': 'Status unknown',
   'ai.codex.path': 'Path:',
@@ -1713,7 +1932,6 @@ const en: Messages = {
   'ai.codex.logout': 'Logout',
   'ai.codex.connectChatGPT': 'Connect ChatGPT',
   'ai.codex.refreshStatus': 'Refresh Status',
-  'ai.codex.apiKeyHint': 'Enabled OpenAI provider API key detected. Codex ACP can also authenticate without ChatGPT login.',
 
   // AI Claude Code
   'ai.claude.title': 'Claude Code',
@@ -1741,6 +1959,22 @@ const en: Messages = {
   'ai.defaultAgent': 'Default Agent',
   'ai.defaultAgent.description': 'Agent to use when starting a new AI session',
   'ai.defaultAgent.catty': 'Catty (Built-in)',
+  'ai.toolAccess.title': 'Tool Access',
+  'ai.toolAccess.mode': 'Netcatty Access Mode',
+  'ai.toolAccess.description': 'Choose how external ACP agents access Netcatty sessions. MCP exposes the built-in server, while Skills + CLI points agents to the local Netcatty skill and CLI commands.',
+  'ai.toolAccess.mode.mcp': 'MCP',
+  'ai.toolAccess.mode.skills': 'Skills + CLI',
+  'ai.userSkills.title': 'User Skills',
+  'ai.userSkills.description': 'Open the Netcatty skills folder to add your own skill directories. Netcatty scans these skills automatically and injects only lightweight indexes unless a skill clearly matches the current request.',
+  'ai.userSkills.openFolder': 'Open Skills Folder',
+  'ai.userSkills.reload': 'Reload Skills',
+  'ai.userSkills.location': 'Location',
+  'ai.userSkills.loading': 'Scanning user skills...',
+  'ai.userSkills.summary': '{ready} ready, {warnings} warnings',
+  'ai.userSkills.empty': 'No user skills found yet. Open the folder to add skill directories with a SKILL.md file.',
+  'ai.userSkills.unavailable': 'User skills are unavailable in this environment.',
+  'ai.userSkills.status.ready': 'Ready',
+  'ai.userSkills.status.warning': 'Warning',
 
   // AI Chat
   'ai.chat.noProvider': 'No AI provider is configured. Go to **Settings → AI → Providers** to add and enable a provider.',
@@ -1795,6 +2029,7 @@ const en: Messages = {
   'ai.chat.menuFiles': 'Files',
   'ai.chat.menuImage': 'Image',
   'ai.chat.menuMentionHost': 'Mention Host',
+  'ai.chat.menuUserSkills': 'User Skills',
 
   // AI Error
   'ai.codex.bridgeError': 'Codex main-process handlers are not loaded yet. Fully restart Netcatty, or restart the Electron dev process, then try again.',
@@ -1817,7 +2052,7 @@ const en: Messages = {
   // AI Safety Settings
   'ai.safety.title': 'Safety',
   'ai.safety.permissionMode': 'Permission Mode',
-  'ai.safety.permissionMode.description': 'Controls how the AI interacts with your terminals. Observer mode blocks all write operations via MCP Server, enforced for both built-in and ACP agents. Confirm mode is advisory for ACP agents (they control their own tool approval flow).',
+  'ai.safety.permissionMode.description': 'Controls how the AI interacts with your terminals. Observer mode blocks all write operations through Netcatty, enforced for both built-in and ACP agents. Confirm mode is advisory for ACP agents (they control their own tool approval flow).',
   'ai.safety.permissionMode.observer': 'Observer - Read only, no actions',
   'ai.safety.permissionMode.confirm': 'Confirm - Ask before actions',
   'ai.safety.permissionMode.autonomous': 'Autonomous - Execute freely',
@@ -1827,11 +2062,37 @@ const en: Messages = {
   'ai.safety.maxIterations': 'Max Iterations',
   'ai.safety.maxIterations.description': 'Maximum number of AI tool-use loops to prevent runaway execution. ACP agents may have their own internal iteration limits that take precedence.',
   'ai.safety.blocklist': 'Command Blocklist',
-  'ai.safety.blocklist.description': 'Regex patterns to block dangerous commands. Applies to both built-in and ACP agents via MCP Server.',
+  'ai.safety.blocklist.description': 'Regex patterns to block dangerous commands. Applies to both built-in and ACP agents through Netcatty execution.',
   'ai.safety.blocklist.placeholder': 'Regex pattern...',
   'ai.safety.blocklist.reset': 'Reset to defaults',
   'ai.safety.blocklist.add': 'Add pattern',
   'ai.safety.note': 'Command Blocklist, Command Timeout, and Observer mode are enforced at the MCP Server level, applying to all agent types. Confirm mode and Max Iterations are fully enforced for the built-in agent; ACP agents may have their own internal controls for these settings.',
+
+  // Unified tooltips for terminal workspace and top tabs (issue #954)
+  'terminal.layer.addTerminal': 'Add Terminal',
+  'terminal.layer.switchToSplitView': 'Switch to Split View',
+  'terminal.layer.sftp': 'SFTP',
+  'terminal.layer.scripts': 'Scripts',
+  'terminal.layer.theme': 'Theme',
+  'terminal.layer.aiChat': 'AI Chat',
+  'terminal.layer.movePanelLeft': 'Move panel to left',
+  'terminal.layer.movePanelRight': 'Move panel to right',
+  'terminal.layer.closePanel': 'Close panel',
+  'topTabs.openQuickSwitcher': 'Open quick switcher',
+  'topTabs.moreTabs': 'More tabs',
+  'topTabs.aiAssistant': 'AI Assistant',
+  'topTabs.toggleTheme': 'Toggle theme',
+  'topTabs.openSettings': 'Open Settings',
+  'ai.chat.sessionHistory': 'Session history',
+  'ai.chat.attach': 'Attach',
+  'ai.chat.collapse': 'Collapse',
+  'ai.chat.expand': 'Expand',
+  'ai.chat.enableAgent': 'Enable {name}',
+  'zmodem.waitingForRemote': 'Waiting for remote...',
+  'zmodem.uploading': 'Uploading',
+  'zmodem.downloading': 'Downloading',
+  'zmodem.cancelTransfer': 'Cancel transfer (Ctrl+C)',
+  'settings.shortcuts.resetToDefault': 'Reset to default',
 };
 
 export default en;

application/i18n/locales/zh-CN.ts

@@ -43,6 +43,11 @@ const zhCN: Messages = {
   'confirm.deleteHost': '删除主机 "{name}"？',
   'confirm.deleteIdentity': '删除身份 "{name}"？',
   'confirm.removeProvider': '移除提供商 "{name}"？',
+  'confirm.closeBusyTerminal.title': '确认关闭',
+  'confirm.closeBusyTerminal.message': '进程 "{command}" 仍在运行，关闭后会被终止。',
+  'confirm.closeBusyTerminal.messageWithMore': '进程 "{command}" 及其他 {count} 个正在运行的进程将被终止。',
+  'confirm.closeBusyTerminal.cancel': '取消',
+  'confirm.closeBusyTerminal.close': '关闭',
   'dialog.renameWorkspace.title': '重命名工作区',
   'dialog.renameSession.title': '重命名会话',
   'field.name': '名称',
@@ -181,9 +186,15 @@ const zhCN: Messages = {
   'settings.application.github.subtitle': '源代码',
   'settings.application.whatsNew': '更新内容',
   'settings.application.whatsNew.subtitle': '查看发布说明',
+  'settings.application.openExternal.failedTitle': '无法打开链接',
+  'settings.application.openExternal.failedBody': '系统浏览器和内置浏览器窗口都无法打开该链接。',
   'settings.vault.title': '主机库',
   'settings.vault.showRecentHosts': '显示最近连接的主机',
   'settings.vault.showRecentHostsDesc': '在主机列表顶部显示最近连接过的主机',
+  'settings.vault.showOnlyUngroupedHostsInRoot': '根目录只显示未分组主机',
+  'settings.vault.showOnlyUngroupedHostsInRootDesc': '开启后，主机库根目录的主机列表只显示没有分组的主机，已分组主机请从左侧分组进入查看。',
+  'settings.vault.showSftpTab': '显示 SFTP 标签页',
+  'settings.vault.showSftpTabDesc': '在顶部标签栏显示独立的 SFTP 视图。关闭后可改用会话内左侧的 SFTP 侧栏。',
 
   // Update notifications
   'update.available.title': '发现新版本',
@@ -220,9 +231,10 @@ const zhCN: Messages = {
   'settings.appearance.themeColor.light': '浅色主题',
   'settings.appearance.themeColor.dark': '深色主题',
   'settings.appearance.customCss': '自定义 CSS',
-  'settings.appearance.customCss.desc': '使用自定义 CSS 个性化界面，修改会立即生效。',
+  'settings.appearance.customCss.desc':
+    '使用自定义 CSS 个性化界面，修改会立即生效。主要 UI 区块都暴露了 [data-section="..."] 属性供你定位，比如：snippets-panel、host-details-panel、group-details-panel、serial-host-details-panel、ai-chat-panel、vault-sidebar、vault-main、vault-hosts-header、vault-host-list、vault-view、terminal-workspace、terminal-workspace-sidebar、top-tabs。',
   'settings.appearance.customCss.placeholder':
-    '/* 示例：*/\n.terminal { background: #1a1a2e !important; }\n:root { --radius: 0.25rem; }',
+    '/* 示例 — 由于 Tailwind 优先级较高，需要使用 !important */\n\n/* 放大代码片段侧边栏字号 */\n[data-section="snippets-panel"] {\n  font-size: 14px !important;\n}\n\n/* 自定义终端背景色 */\n.terminal { background: #1a1a2e !important; }\n\n/* 调整全局圆角 */\n:root { --radius: 0.25rem; }',
   'settings.appearance.language': '语言',
   'settings.appearance.language.desc': '选择界面语言',
   'settings.appearance.uiFont': '界面字体',
@@ -255,13 +267,55 @@ const zhCN: Messages = {
   'sync.toast.completedMessage': '同步完成',
   'sync.toast.errorTitle': '同步错误',
   'sync.autoSync.failedTitle': '同步失败',
+  'sync.autoSync.inspectFailedTitle': '同步已暂停',
+  'sync.autoSync.inspectFailedMessage': '无法访问云端以检查变更。数据改动或下次启动时会自动重试。',
   'sync.autoSync.syncedTitle': '已从云端同步',
   'sync.autoSync.syncedMessage': '你的数据已从云端更新。',
   'sync.autoSync.noProvider': '未连接云同步 provider。请打开 设置 → Sync & Cloud 进行连接。',
   'sync.autoSync.alreadySyncing': '同步正在进行中。',
+  'sync.autoSync.restoreInProgress': '另一个窗口中的本地备份恢复正在进行中，请等待其完成。',
+  'sync.autoSync.interruptedApplyTitle': '同步已暂停 — 上次恢复未完成',
+  'sync.autoSync.interruptedApplyMessage': '上次本地恢复过程未正常结束，本地数据可能处于半应用状态。请打开「设置 → Sync & Cloud → 恢复」，从保护性备份中恢复后再让自动同步继续。',
   'sync.autoSync.vaultLocked': 'Vault 处于锁定状态。请打开 设置 → Sync & Cloud 解锁。',
   'sync.autoSync.conflictDetected': '检测到同步冲突。请打开 设置 → Sync & Cloud 处理。',
   'sync.autoSync.syncFailed': '同步失败',
+  'sync.autoSync.restoredTitle': '已恢复',
+  'sync.autoSync.restoredMessage': '已从云端恢复主机库数据。',
+  'sync.autoSync.keptLocalTitle': '已保留本地数据',
+  'sync.autoSync.keptLocalMessage': '保留了空的本地主机库，未应用云端数据。',
+  'sync.autoSync.emptyVaultConflict.title': '检测到空主机库',
+  'sync.autoSync.emptyVaultConflict.description': '本地主机库为空，但云端有数据。这通常发生在应用更新或存储重置之后。请选择如何处理：',
+  'sync.autoSync.emptyVaultConflict.cloudLabel': '云端',
+  'sync.autoSync.emptyVaultConflict.restore': '从云端恢复',
+  'sync.autoSync.emptyVaultConflict.restoreDesc': '推荐 — 从云端备份恢复主机、密钥和代码片段',
+  'sync.autoSync.emptyVaultConflict.keepEmpty': '保持为空',
+  'sync.autoSync.emptyVaultConflict.keepEmptyDesc': '从头开始，使用空的主机库',
+  'sync.autoSync.emptyVaultConflict.cloudSummary': '{hosts} 台主机，{keys} 个密钥，{snippets} 个代码片段，{proxyProfiles} 个代理',
+  'sync.autoSync.emptyVaultManual': '无法同步：本地 vault 为空。请先从本地备份恢复，或在同步面板里使用"强制推送"。',
+
+  'sync.blocked.title': '同步已暂停',
+  'sync.blocked.reason.bulkShrink': '即将从云端删除 {baseCount} 条 {entityType} 中的 {lost} 条（缩减 {percent}%）。',
+  'sync.blocked.reason.largeShrink': '即将从云端删除 {lost} 条 {entityType}。',
+  'sync.blocked.detail': '通常是本地状态异常（钥匙串故障、数据加载不全）导致。请从本地备份恢复，如果确实要删这些条目请使用强制推送。',
+  'sync.blocked.restoreButton': '从本地备份恢复',
+  'sync.blocked.forcePushButton': '强制推送',
+
+  'sync.forcePush.title': '确认强制推送',
+  'sync.forcePush.body': '你将从云端移除 {lost} 条 {entityType}，此操作不可撤销。继续？',
+  'sync.forcePush.confirm': '确认推送',
+  'sync.forcePush.cancel': '取消',
+
+  'sync.entityType.hosts': '主机',
+  'sync.entityType.keys': '密钥',
+  'sync.entityType.identities': '身份',
+  'sync.entityType.proxyProfiles': '代理配置',
+  'sync.entityType.snippets': '代码片段',
+  'sync.entityType.customGroups': '分组',
+  'sync.entityType.snippetPackages': '片段包',
+  'sync.entityType.knownHosts': '主机密钥记录',
+  'sync.entityType.portForwardingRules': '端口转发规则',
+  'sync.entityType.groupConfigs': '分组配置',
+
   'sync.credentialsUnavailable': '当前设备无法解密部分已保存凭据。请先在本地重新输入凭据后再同步。',
   'time.never': '从未',
   'time.justNow': '刚刚',
@@ -270,11 +324,28 @@ const zhCN: Messages = {
   // Vault navigation
   'vault.nav.hosts': '主机',
   'vault.nav.keychain': '钥匙串',
+  'vault.nav.proxies': '代理',
   'vault.nav.portForwarding': '端口转发',
   'vault.nav.snippets': '代码片段',
   'vault.nav.knownHosts': '已知主机',
   'vault.nav.logs': '日志',
 
+  'proxyProfiles.action.add': '添加代理',
+  'proxyProfiles.search.placeholder': '搜索代理…',
+  'proxyProfiles.section.proxies': '代理',
+  'proxyProfiles.count.items': '{count} 项',
+  'proxyProfiles.empty.title': '暂无代理',
+  'proxyProfiles.empty.desc': '创建可复用的 HTTP 或 SOCKS5 代理，然后在主机详情里选择。',
+  'proxyProfiles.usage': '已关联 {count} 处',
+  'proxyProfiles.copyName': '{name} 副本',
+  'proxyProfiles.panel.newTitle': '新建代理',
+  'proxyProfiles.field.name': '代理名称',
+  'proxyProfiles.error.required': '名称、主机和端口不能为空。',
+  'proxyProfiles.error.port': '端口必须在 1 到 65535 之间。',
+  'proxyProfiles.viewMode': '代理显示方式',
+  'proxyProfiles.delete.title': '删除代理？',
+  'proxyProfiles.delete.desc': '删除 "{name}" 会同时从 {count} 个主机或分组设置中解除关联。',
+
   'vault.groups.title': '分组',
   'vault.groups.total': '共 {count} 个',
   'vault.groups.hostsCount': '{count} 台主机',
@@ -349,6 +420,7 @@ const zhCN: Messages = {
   'vault.hosts.deselectAll': '取消全选',
   'vault.hosts.deleteSelected': '删除 ({count})',
   'vault.hosts.deleteMultiple.success': '已删除 {count} 个主机',
+  'vault.hosts.moveToGroup.success': '已将 {host} 移动到 {group}',
   'vault.hosts.empty.title': '设置你的主机',
   'vault.hosts.empty.desc': '保存主机以快速连接到你的服务器、虚拟机和容器。',
 
@@ -486,6 +558,10 @@ const zhCN: Messages = {
   'sftp.context.permissions': '权限',
   'sftp.context.delete': '删除',
   'sftp.context.refresh': '刷新',
+  'sftp.context.uploadFiles': '上传文件...',
+  'sftp.context.uploadFilesHere': '上传文件到这里...',
+  'sftp.context.uploadFolder': '上传文件夹...',
+  'sftp.context.uploadFolderHere': '上传文件夹到这里...',
   'sftp.context.downloadSelected': '下载选中项（{count}）',
   'sftp.context.deleteSelected': '删除选中项（{count}）',
   'sftp.dropFilesHere': '拖拽文件到这里',
@@ -508,6 +584,14 @@ const zhCN: Messages = {
   'sftp.transfers.collapseChildren': '收起文件',
   'sftp.transfers.expandChildList': '展开详情',
   'sftp.transfers.collapseChildList': '收起',
+  'sftp.transfers.retryAction': '重试',
+  'sftp.transfers.dismissAction': '移除',
+  'sftp.transfers.openTargetFolder': '打开目标目录',
+  'sftp.transfers.openTargetFolderError': '无法打开目标目录',
+  'sftp.transfers.copyTargetPath': '复制目标路径',
+  'sftp.transfers.copyTargetPathSuccess': '已复制目标路径',
+  'sftp.transfers.copyTargetPathError': '无法复制目标路径',
+  'sftp.transfers.resizeNameColumn': '调整文件名列宽',
   'sftp.transfers.dragToResize': '拖拽调整高度',
   'sftp.goUp': '上一级',
   'sftp.goToTerminalCwd': '定位到终端当前目录',
@@ -626,6 +710,14 @@ const zhCN: Messages = {
   'hostDetails.distro.option.almalinux': 'AlmaLinux',
   'hostDetails.distro.option.oracle': 'Oracle Linux',
   'hostDetails.distro.option.kali': 'Kali Linux',
+  'hostDetails.distro.option.cisco': '思科',
+  'hostDetails.distro.option.juniper': '瞻博网络',
+  'hostDetails.distro.option.huawei': '华为',
+  'hostDetails.distro.option.hpe': '慧与 / H3C',
+  'hostDetails.distro.option.mikrotik': 'MikroTik',
+  'hostDetails.distro.option.fortinet': '飞塔',
+  'hostDetails.distro.option.paloalto': 'Palo Alto Networks',
+  'hostDetails.distro.option.zyxel': '合勤',
   'hostDetails.section.mosh': 'Mosh',
   'hostDetails.username.placeholder': '用户名',
   'hostDetails.password.placeholder': '密码',
@@ -650,6 +742,9 @@ const zhCN: Messages = {
   'hostDetails.agentForwarding.agentNotRunning': 'SSH Agent 不可用',
   'hostDetails.agentForwarding.agentNotRunningHint': '未检测到 SSH Agent。请启用 Windows OpenSSH Authentication Agent 服务，或使用兼容的 Agent（如 Bitwarden、1Password、gpg-agent）。',
   'hostDetails.section.agentForwarding': 'SSH 代理',
+  'hostDetails.x11Forwarding': '转发 X11 图形应用',
+  'hostDetails.x11Forwarding.desc': '本机运行 X 服务时，让远程图形程序显示在本地桌面。',
+  'hostDetails.section.x11Forwarding': 'X11 转发',
   'hostDetails.section.deviceType': '设备类型',
   'hostDetails.deviceType': '网络设备模式',
   'hostDetails.deviceType.desc': '适用于通过 SSH 连接的网络设备（交换机、路由器、防火墙）。命令将原样发送，不进行 Shell 包装，兼容华为 VRP、Cisco IOS 等厂商 CLI。',
@@ -658,6 +753,12 @@ const zhCN: Messages = {
   'hostDetails.legacyAlgorithms': '允许旧版算法',
   'hostDetails.legacyAlgorithms.desc': '启用已弃用的 SSH 算法（diffie-hellman-group1、ssh-dss、3des-cbc 等）以连接老旧网络设备。',
   'hostDetails.legacyAlgorithms.warning': '这些算法存在已知安全漏洞，仅建议在老旧设备不支持现代加密时启用。',
+  'hostDetails.section.keepalive': '会话保活',
+  'hostDetails.keepalive.override': '为此主机单独配置',
+  'hostDetails.keepalive.desc': '为该主机使用专属的保活策略，而不是跟随全局设置。适用于不响应 keepalive@openssh.com 请求的老旧路由器 / 交换机——将间隔设为 0 可对该主机彻底关闭保活。',
+  'hostDetails.keepalive.interval': '间隔（秒）',
+  'hostDetails.keepalive.countMax': '最大无响应保活次数',
+  'hostDetails.keepalive.disabledHint': '间隔为 0 时该主机不发送保活包，仅依赖 TCP 层超时检测断连。',
   'hostDetails.backspaceBehavior': 'Backspace 行为',
   'hostDetails.backspaceBehavior.default': '默认',
   'hostDetails.jumpHosts': '通过主机代理',
@@ -737,11 +838,12 @@ const zhCN: Messages = {
   'terminal.toolbar.openSftp': '打开 SFTP',
   'terminal.toolbar.availableAfterConnect': '连接后可用',
   'terminal.toolbar.sftp': 'SFTP',
+  'terminal.toolbar.more': '更多操作',
   'terminal.toolbar.scripts': '脚本',
   'terminal.toolbar.library': '库',
   'terminal.toolbar.noSnippets': '暂无代码片段',
   'terminal.toolbar.terminalSettings': '终端设置',
-  'terminal.toolbar.searchTerminal': '搜索终端 (Ctrl+F)',
+  'terminal.toolbar.searchTerminal': '搜索终端',
   'terminal.toolbar.search': '搜索',
   'terminal.toolbar.broadcast': '广播',
   'terminal.toolbar.broadcastEnable': '启用广播模式',
@@ -766,6 +868,10 @@ const zhCN: Messages = {
   'terminal.toolbar.hostHighlight.clearAll': '清除全部',
   'terminal.toolbar.hostHighlight.changeColor': '更改高亮颜色',
   'terminal.toolbar.hostHighlight.selectColor': '选择新规则的颜色',
+  'terminal.statusbar.copyHostname.label': '复制主机地址',
+  'terminal.statusbar.copyHostname.tooltip': '复制主机地址（{hostname}）',
+  'terminal.statusbar.copyHostname.toast': '已复制主机地址：{hostname}',
+  'terminal.statusbar.copyHostname.error': '复制主机地址失败',
   'terminal.serverStats.cpu': 'CPU 使用率',
   'terminal.serverStats.cpuCores': 'CPU 核心使用率',
   'terminal.serverStats.memory': '内存使用',
@@ -797,7 +903,9 @@ const zhCN: Messages = {
   'terminal.search.nextMatch': '下一个匹配 (Enter)',
   'terminal.menu.copy': '复制',
   'terminal.menu.paste': '粘贴',
+  'terminal.menu.pasteSelection': '粘贴选中文本',
   'terminal.menu.selectAll': '全选',
+  'terminal.menu.reconnect': '重新连接',
   'terminal.menu.splitHorizontal': '水平分屏',
   'terminal.menu.splitVertical': '垂直分屏',
   'terminal.menu.clearBuffer': '清空缓冲区',
@@ -832,6 +940,16 @@ const zhCN: Messages = {
   'terminal.connection.protocol.mosh': 'Mosh',
   'terminal.connection.protocol.serial': '串口',
   'terminal.connection.protocol.local': '本地终端',
+  'terminal.hostKey.unknownTitle': '确认主机指纹',
+  'terminal.hostKey.changedTitle': '主机指纹已变化',
+  'terminal.hostKey.unknownDescription': '尚未确认 {host} 的真实性。',
+  'terminal.hostKey.changedDescription': '{host} 的已保存指纹与当前服务器不一致。',
+  'terminal.hostKey.fingerprintLabel': '{keyType} 指纹为 SHA256：',
+  'terminal.hostKey.savedFingerprintLabel': '已保存的指纹',
+  'terminal.hostKey.unknownHint': '如果这个指纹属于你预期连接的服务器，可以记住它。',
+  'terminal.hostKey.changedHint': '只有在你确认这台主机确实变更过时才继续。',
+  'terminal.hostKey.addAndContinue': '记住并继续',
+  'terminal.hostKey.updateAndContinue': '更新并继续',
   'terminal.themeModal.title': 'Terminal 外观',
   'terminal.themeModal.tab.theme': '主题',
   'terminal.themeModal.tab.font': '字体',
@@ -842,6 +960,11 @@ const zhCN: Messages = {
   'terminal.themeModal.fontWeight': '字体粗细',
   'terminal.themeModal.livePreview': '实时预览',
   'terminal.themeModal.themeType': '{type} 主题',
+  'terminal.hiddenTheme.title': '当前隐藏主题',
+  'terminal.hiddenTheme.desc': '这个主题已从手动选择列表中隐藏；当你选择其他可见主题后，它会被替换。',
+  'topTabs.toggleTheme.systemExitTitle': '当前正在跟随系统主题',
+  'topTabs.toggleTheme.systemExitMessage': '请到设置里选择固定的浅色或深色主题。',
+  'topTabs.toggleTheme.openSettings': '打开设置',
 
   // Custom Themes
   'terminal.customTheme.section': '自定义主题',
@@ -970,6 +1093,47 @@ const zhCN: Messages = {
   'cloudSync.history.download': '下载',
   'cloudSync.history.resolved': '已解决',
   'cloudSync.history.error': '错误',
+  'cloudSync.localBackups.title': '本地备份历史',
+  'cloudSync.localBackups.desc': 'Netcatty 会在版本变化前，以及恢复主机库前，自动留下一份本地恢复点。',
+  'cloudSync.localBackups.retentionTitle': '备份保留数量',
+  'cloudSync.localBackups.retentionDesc': '设置 Netcatty 最多保留多少份本地备份。',
+  'cloudSync.localBackups.maxCount': '最多保留',
+  'cloudSync.localBackups.maxSaved': '已保存保留数量：{count}',
+  'cloudSync.localBackups.maxInvalid': '请输入 1 到 100 之间的数字。',
+  'cloudSync.localBackups.empty': '还没有本地备份。',
+  'cloudSync.localBackups.reason.appVersionChange': '版本变化前',
+  'cloudSync.localBackups.reason.beforeRestore': '恢复前',
+  'cloudSync.localBackups.versionChange': '{from} -> {to}',
+  'cloudSync.localBackups.counts': '{hosts} 台主机，{keys} 个密钥，{snippets} 个代码片段',
+  'cloudSync.localBackups.restore': '恢复',
+  'cloudSync.localBackups.restoreSuccess': '已恢复本地备份。',
+  'cloudSync.localBackups.restoreFailedTitle': '恢复失败',
+  'cloudSync.localBackups.restoreMissing': '找不到这份备份。',
+  'cloudSync.localBackups.protectiveBackupFailed': '无法创建保护性备份，已中止恢复以避免覆盖当前数据。请先解决底层问题（例如钥匙串访问）后重试。详情：{message}',
+  'cloudSync.localBackups.restoreConfirmTitle': '确认恢复此备份？',
+  'cloudSync.localBackups.restoreConfirmDesc': '当前的主机、密钥、代码片段与设置将被替换为此备份中的内容。系统会先自动创建一个保护性快照，便于撤销。',
+  'cloudSync.localBackups.restoreConfirmButton': '恢复',
+  'cloudSync.localBackups.restoreConfirmCancel': '取消',
+  'cloudSync.localBackups.unavailableTitle': '无法使用本地备份',
+  'cloudSync.localBackups.unavailableDesc': '当前平台未提供受支持的安全密钥库，Netcatty 无法安全地写入本地备份。请在支持系统钥匙串的环境中运行，或改用云同步保留恢复点。',
+  'cloudSync.localBackups.lockedTitle': '需要主密钥',
+  'cloudSync.localBackups.lockedDesc': '请先配置或解锁主密钥再恢复备份，以确保恢复后的凭据仍保持加密。',
+  'cloudSync.revisionHistory.viewButton': '历史版本',
+  'cloudSync.revisionHistory.title': '主机库版本历史',
+  'cloudSync.revisionHistory.description': '浏览并恢复 Gist 修订历史中的旧版主机库数据。',
+  'cloudSync.revisionHistory.empty': '未找到修订记录。',
+  'cloudSync.revisionHistory.current': '当前版本',
+  'cloudSync.revisionHistory.revision': '修订',
+  'cloudSync.revisionHistory.revisionPreview': '修订内容',
+  'cloudSync.revisionHistory.device': '设备',
+  'cloudSync.revisionHistory.hosts': '主机',
+  'cloudSync.revisionHistory.keys': '密钥',
+  'cloudSync.revisionHistory.snippets': '代码片段',
+  'cloudSync.revisionHistory.identities': '身份',
+  'cloudSync.revisionHistory.restoreButton': '恢复此版本',
+  'cloudSync.revisionHistory.restored': '已从选中的修订恢复主机库数据。',
+  'cloudSync.revisionHistory.revisionNotFound': '修订未找到或不包含主机库数据。',
+  'cloudSync.revisionHistory.decryptFailed': '无法解密此修订。可能是使用了不同的主密钥加密的。',
   'cloudSync.changeKey.title': '更改主密钥',
   'cloudSync.changeKey.current': '当前主密钥',
   'cloudSync.changeKey.new': '新的主密钥',
@@ -1013,6 +1177,7 @@ const zhCN: Messages = {
   'cloudSync.conflict.keepLocal': '覆盖云端（保留本地）',
   'cloudSync.conflict.useCloud': '下载云端（覆盖本地）',
   'cloudSync.connect.browserContinue': '请在浏览器中完成授权',
+  'cloudSync.connect.browserCancelled': '已取消上一个浏览器授权流程',
   'cloudSync.connect.github.success': 'GitHub 已连接',
   'cloudSync.connect.github.failedTitle': 'GitHub 连接失败',
   'cloudSync.connect.github.timeout': '连接 GitHub 超时，请检查网络或代理设置。',
@@ -1100,8 +1265,11 @@ const zhCN: Messages = {
   'sftp.conflict.size': '大小：',
   'sftp.conflict.modified': '修改时间：',
   'sftp.conflict.applyToAll': '将此操作应用到剩余的 {count} 个冲突',
+  'sftp.conflict.action.stop': '停止',
   'sftp.conflict.action.skip': '跳过',
   'sftp.conflict.action.keepBoth': '保留两者',
+  'sftp.conflict.action.duplicate': '创建副本',
+  'sftp.conflict.action.merge': '合并',
   'sftp.conflict.action.replace': '替换',
 
   // SFTP Upload Phases
@@ -1239,6 +1407,8 @@ const zhCN: Messages = {
   'settings.terminal.themeModal.darkThemes': '深色主题',
   'settings.terminal.themeModal.lightThemes': '浅色主题',
   'settings.terminal.theme.selectButton': '选择主题',
+  'settings.terminal.theme.followApp': '跟随应用主题',
+  'settings.terminal.theme.followApp.desc': '终端背景色自动匹配当前应用主题，保持视觉一致性。',
   'settings.terminal.section.font': '字体',
   'settings.terminal.section.cursor': '光标',
   'settings.terminal.section.keyboard': '键盘',
@@ -1248,6 +1418,17 @@ const zhCN: Messages = {
   'settings.terminal.section.keywordHighlight': '关键字高亮',
   'settings.terminal.font.family': '字体',
   'settings.terminal.font.family.desc': '终端字体',
+  'settings.terminal.font.cjk': '中文 / CJK 字体',
+  'settings.terminal.font.cjk.desc': '用于渲染中 / 日 / 韩字符的字体；"Auto" 会按主字体智能搭配',
+  'settings.terminal.font.cjk.option.auto': 'Auto · 按主字体智能搭配',
+  'settings.terminal.font.cjk.option.sarasaSC': 'Sarasa Mono SC （更纱黑体 简）',
+  'settings.terminal.font.cjk.option.sarasaTC': 'Sarasa Mono TC （更纱黑体 繁）',
+  'settings.terminal.font.cjk.option.mapleCN': 'Maple Mono CN',
+  'settings.terminal.font.cjk.option.sourceHan': 'Source Han Mono SC （思源等宽）',
+  'settings.terminal.font.cjk.option.notoCJK': 'Noto Sans Mono CJK SC',
+  'settings.terminal.font.cjk.option.lxgwWenkai': 'LXGW WenKai Mono （霞鹜文楷等宽）',
+  'settings.terminal.font.cjk.option.simSun': 'SimSun （宋体）',
+  'settings.terminal.font.cjk.option.legacy': '{font} · 不推荐（非等宽字体）',
   'settings.terminal.font.size': '字体大小',
   'settings.terminal.font.size.desc': '终端文字大小',
   'settings.terminal.font.weight': '字重',
@@ -1278,6 +1459,15 @@ const zhCN: Messages = {
   'settings.terminal.behavior.bracketedPaste': '括号粘贴模式',
   'settings.terminal.behavior.bracketedPaste.desc':
     '粘贴文本时使用转义序列包裹，以便终端区分粘贴和键入。如果出现 ^[[200~ 字样请关闭此选项。',
+  'settings.terminal.behavior.clearWipesScrollback': '`clear` 同时清空回滚历史',
+  'settings.terminal.behavior.clearWipesScrollback.desc':
+    '`clear` 命令同时清空回滚历史（POSIX 默认行为）。关闭则保留历史。',
+  'settings.terminal.behavior.preserveSelectionOnInput': '输入时保留选区',
+  'settings.terminal.behavior.preserveSelectionOnInput.desc':
+    '键盘输入时不清除鼠标选中的文本，方便选中路径后输入 `sz ` 之类命令再粘贴。',
+  'settings.terminal.behavior.forcePromptNewLine': '提示符另起一行',
+  'settings.terminal.behavior.forcePromptNewLine.desc':
+    '当命令输出的最后一行未以换行符结束时，将识别到的 shell 提示符移动到下一行显示。',
   'settings.terminal.behavior.osc52Clipboard': 'OSC-52 剪贴板',
   'settings.terminal.behavior.osc52Clipboard.desc':
     '允许远程程序（tmux、vim 等）通过 OSC-52 转义序列访问本地剪贴板。',
@@ -1309,12 +1499,16 @@ const zhCN: Messages = {
   'settings.terminal.scrollback.rows': '行数 *',
   'settings.terminal.keywordHighlight.title': '关键字高亮',
   'settings.terminal.keywordHighlight.resetColors': '重置为默认颜色',
+  'settings.terminal.keywordHighlight.resetDefaults': '把内置规则恢复为默认',
+  'settings.terminal.keywordHighlight.resetBuiltIn': '恢复内置标签与正则',
   'settings.terminal.keywordHighlight.addCustom': '添加自定义规则',
   'settings.terminal.keywordHighlight.editCustom': '编辑规则',
+  'settings.terminal.keywordHighlight.editBuiltIn': '编辑内置规则',
   'settings.terminal.keywordHighlight.labelField': '标签与颜色',
   'settings.terminal.keywordHighlight.labelPlaceholder': '标签（如 Down）',
   'settings.terminal.keywordHighlight.patternField': '正则表达式',
-  'settings.terminal.keywordHighlight.patternPlaceholder': '正则表达式（如 \\bdown\\b）',
+  'settings.terminal.keywordHighlight.patternPlaceholder': '每行一个正则（如 \\bdown\\b）',
+  'settings.terminal.keywordHighlight.patternHint': '每行一个正则。匹配忽略大小写，全局匹配。',
   'settings.terminal.keywordHighlight.invalidPattern': '无效的正则表达式',
   'settings.terminal.keywordHighlight.preview': '预览',
   'settings.terminal.section.localShell': '本地 Shell',
@@ -1336,7 +1530,12 @@ const zhCN: Messages = {
   'settings.terminal.localShell.startDir.isFile': '路径是文件，不是目录',
   'settings.terminal.section.connection': '连接',
   'settings.terminal.connection.keepaliveInterval': '会话保持间隔',
-  'settings.terminal.connection.keepaliveInterval.desc': '向服务器发送 SSH 级别保活数据包的频率（秒）。设为 0 表示禁用。',
+  'settings.terminal.connection.keepaliveInterval.desc': '向服务器发送 SSH 保活数据包的频率（秒）。设为 0 表示全局禁用——单个主机可在自己的设置里覆盖此值。',
+  'settings.terminal.connection.keepaliveCountMax': '最大无响应保活次数',
+  'settings.terminal.connection.keepaliveCountMax.desc': '判定连接死亡前允许的无响应保活次数。值越大对短暂网络抖动和响应慢的 SSH 服务越宽容。',
+  'settings.terminal.connection.x11Display': 'X11 显示地址',
+  'settings.terminal.connection.x11Display.desc': '可选的本机 X11 显示地址。留空则使用系统默认值。',
+  'settings.terminal.connection.x11Display.placeholder': '自动（:0 或 DISPLAY）',
   'settings.terminal.section.serverStats': '服务器状态（Linux）',
   'settings.terminal.serverStats.show': '显示服务器状态',
   'settings.terminal.serverStats.show.desc': '在终端状态栏显示 CPU、内存和磁盘使用情况（仅限 Linux 服务器）。',
@@ -1370,6 +1569,7 @@ const zhCN: Messages = {
   'settings.shortcuts.resetAll': '全部重置',
   'settings.shortcuts.recording': '请按键...',
   'settings.shortcuts.none': '无',
+  'settings.shortcuts.setDisabled': '设为禁用',
   'settings.shortcuts.category.tabs': '标签页',
   'settings.shortcuts.category.terminal': '终端',
   'settings.shortcuts.category.navigation': '导航',
@@ -1394,6 +1594,7 @@ const zhCN: Messages = {
   'settings.shortcuts.binding.port-forwarding': '打开端口转发',
   'settings.shortcuts.binding.command-palette': '打开命令面板',
   'settings.shortcuts.binding.quick-switch': '快速切换',
+  'settings.shortcuts.binding.new-workspace': '新建工作区',
   'settings.shortcuts.binding.snippets': '打开代码片段',
   'settings.shortcuts.binding.broadcast': '切换广播模式',
   'settings.shortcuts.binding.sftp-copy': '复制文件',
@@ -1406,13 +1607,19 @@ const zhCN: Messages = {
   'settings.shortcuts.binding.sftp-new-folder': '新建文件夹',
 
   // Host Details (sub-panels)
-  'hostDetails.proxyPanel.title': 'Proxy',
-  'hostDetails.proxyPanel.hostPlaceholder': 'Proxy host',
-  'hostDetails.proxyPanel.credentials': 'Credentials',
-  'hostDetails.proxyPanel.usernamePlaceholder': 'Username',
-  'hostDetails.proxyPanel.passwordPlaceholder': 'Password',
-  'hostDetails.proxyPanel.identities': 'Identities',
-  'hostDetails.proxyPanel.remove': '移除 Proxy',
+  'hostDetails.proxyPanel.title': '通过 HTTP/SOCKS5 代理',
+  'hostDetails.proxyPanel.hostPlaceholder': '代理主机',
+  'hostDetails.proxyPanel.credentials': '凭据',
+  'hostDetails.proxyPanel.usernamePlaceholder': '用户名',
+  'hostDetails.proxyPanel.passwordPlaceholder': '密码',
+  'hostDetails.proxyPanel.identities': '身份',
+  'hostDetails.proxyPanel.remove': '移除代理',
+  'hostDetails.proxyPanel.savedProxy': '已保存代理',
+  'hostDetails.proxyPanel.selectSaved': '选择已保存代理',
+  'hostDetails.proxyPanel.customProxy': '自定义代理',
+  'hostDetails.proxyPanel.missing': '缺失',
+  'hostDetails.proxyPanel.missingSaved': '保存的代理不存在',
+  'hostDetails.proxyPanel.error.required': '代理主机和端口不能为空。',
   'hostDetails.envVars.title': '环境变量',
   'hostDetails.envVars.desc': '为 {host} 设置环境变量。',
   'hostDetails.envVars.note': '部分 SSH 服务器默认只允许以 LC_ 和 LANG_ 为前缀的变量。',
@@ -1530,12 +1737,16 @@ const zhCN: Messages = {
   'tabs.logPrefix': '日志：',
   'tabs.logLocal': '本地',
   'tabs.copyTab': '复制标签页',
+  'tabs.closeOthers': '关闭其他标签',
+  'tabs.closeToRight': '关闭右侧标签',
+  'tabs.closeAll': '关闭所有标签',
   'keychain.edit.labelRequired': 'Label *',
   'keychain.edit.keyLabelPlaceholder': '密钥 Label',
   'keychain.edit.privateKeyRequired': '私钥 *',
   'keychain.edit.publicKey': '公钥',
   'keychain.edit.certificate': '证书',
   'keychain.edit.certificatePlaceholder': '证书内容（可选）',
+  'keychain.edit.filePath': '文件路径',
   'keychain.edit.keyExport': '密钥导出',
   'keychain.edit.exportToHost': '导出到主机',
 
@@ -1569,6 +1780,8 @@ const zhCN: Messages = {
   'snippets.breadcrumb.separator': '›',
   'snippets.empty.title': '创建代码片段',
   'snippets.empty.desc': '将常用命令保存为代码片段，一键复用。',
+  'snippets.search.noResults.title': '无匹配结果',
+  'snippets.search.noResults.desc': '没有代码片段或代码包与"{query}"匹配。换一个关键字，或清除搜索进行浏览。',
   'snippets.section.packages': '代码包',
   'snippets.section.snippets': '代码片段',
   'snippets.package.count': '{count} 个代码片段',
@@ -1650,10 +1863,7 @@ const zhCN: Messages = {
   'keyboard.interactive.enterResponse': '输入响应',
   'keyboard.interactive.submit': '提交',
   'keyboard.interactive.verifying': '验证中...',
-  'keyboard.interactive.fill': '填入',
-  'keyboard.interactive.fillSaved': '填入已保存的密码',
-  'keyboard.interactive.useSaved': '使用已保存',
-  'keyboard.interactive.useSavedPassword': '使用已保存的密码',
+  'keyboard.interactive.savePassword': '保存密码',
 
   // Passphrase Modal for encrypted SSH keys
   'passphrase.title': 'SSH 密钥密码',
@@ -1664,9 +1874,16 @@ const zhCN: Messages = {
   'passphrase.unlock': '解锁',
   'passphrase.unlocking': '解锁中...',
   'passphrase.skip': '跳过',
+  'passphrase.remember': '记住此密码',
 
   // Text Editor
   'sftp.editor.wordWrap': '自动换行',
+  'sftp.editor.maximize': '最大化',
+  'sftp.editor.unsavedTitle': '未保存的修改',
+  'sftp.editor.unsavedMessage': '{fileName} 有未保存的修改，是否保存后关闭？',
+  'sftp.editor.discardChanges': '不保存',
+  'sftp.editor.saveAndClose': '保存并关闭',
+  'sftp.editor.quitBlockedByDirty': '存在未保存的编辑器，请先处理后再退出',
 
   // AI Settings
   'ai.agentSettings': 'Agent 设置',
@@ -1704,12 +1921,16 @@ const zhCN: Messages = {
   // AI Codex
   'ai.codex': 'Codex',
   'ai.codex.title': 'Codex CLI',
-  'ai.codex.description': '使用 codex + codex-acp 进行 ACP 协议流式传输。在此通过 ChatGPT 订阅登录，或配置 OpenAI 提供商的 API Key（将作为 CODEX_API_KEY 传递）。',
+  'ai.codex.description': '使用 codex + codex-acp 进行 ACP 协议流式传输。可以在这里连接 ChatGPT，也可以在设置里启用兼容 OpenAI 的 API Key 和自定义接口地址。',
   'ai.codex.detecting': '检测中...',
   'ai.codex.notFound': '未找到',
   'ai.codex.awaitingLogin': '等待登录',
   'ai.codex.connectedChatGPT': '已通过 ChatGPT 连接',
   'ai.codex.connectedApiKey': '已通过 API Key 连接',
+  'ai.codex.connectedCustomConfig': '使用 ~/.codex/config.toml 自定义 provider',
+  'ai.codex.customConfigIncomplete': '检测到自定义配置（缺少环境变量）',
+  'ai.codex.customConfigHint': '使用 ~/.codex/config.toml 中配置的自定义 provider "{provider}"，无需 ChatGPT 登录。',
+  'ai.codex.customConfigMissingEnvKey': '警告：环境变量 {envKey} 未在当前 shell 中设置。请 export 它（或从包含该变量的 shell 启动 netcatty），否则 Codex 无法鉴权。',
   'ai.codex.notConnected': '未连接',
   'ai.codex.statusUnknown': '状态未知',
   'ai.codex.path': '路径：',
@@ -1720,7 +1941,6 @@ const zhCN: Messages = {
   'ai.codex.logout': '退出登录',
   'ai.codex.connectChatGPT': '连接 ChatGPT',
   'ai.codex.refreshStatus': '刷新状态',
-  'ai.codex.apiKeyHint': '检测到已启用的 OpenAI 提供商 API Key。Codex ACP 也可以无需 ChatGPT 登录进行认证。',
 
   // AI Claude Code
   'ai.claude.title': 'Claude Code',
@@ -1748,6 +1968,22 @@ const zhCN: Messages = {
   'ai.defaultAgent': '默认 Agent',
   'ai.defaultAgent.description': '创建新 AI 会话时使用的 Agent',
   'ai.defaultAgent.catty': 'Catty（内置）',
+  'ai.toolAccess.title': '工具接入',
+  'ai.toolAccess.mode': 'Netcatty 接入模式',
+  'ai.toolAccess.description': '选择外部 ACP Agent 访问 Netcatty 会话的方式。MCP 会暴露内置服务器，Skills + CLI 会引导 Agent 读取本地 Skill 并调用 Netcatty CLI。',
+  'ai.toolAccess.mode.mcp': 'MCP',
+  'ai.toolAccess.mode.skills': 'Skills + CLI',
+  'ai.userSkills.title': '用户 Skills',
+  'ai.userSkills.description': '打开 Netcatty 的 Skills 文件夹以添加你自己的技能目录。Netcatty 会自动扫描这些 skills，默认只注入轻量索引，只有在请求明显命中某个 skill 时才展开正文。',
+  'ai.userSkills.openFolder': '打开 Skills 文件夹',
+  'ai.userSkills.reload': '重新加载 Skills',
+  'ai.userSkills.location': '位置',
+  'ai.userSkills.loading': '正在扫描用户 skills...',
+  'ai.userSkills.summary': '已就绪 {ready} 个，警告 {warnings} 个',
+  'ai.userSkills.empty': '暂未发现用户 skills。打开文件夹后可添加包含 SKILL.md 的技能目录。',
+  'ai.userSkills.unavailable': '当前环境不支持用户 skills。',
+  'ai.userSkills.status.ready': '正常',
+  'ai.userSkills.status.warning': '警告',
 
   // AI Chat
   'ai.chat.noProvider': '尚未配置 AI 提供商。请前往 **设置 → AI → 提供商** 添加并启用一个提供商。',
@@ -1802,6 +2038,7 @@ const zhCN: Messages = {
   'ai.chat.menuFiles': '文件',
   'ai.chat.menuImage': '图片',
   'ai.chat.menuMentionHost': '提及主机',
+  'ai.chat.menuUserSkills': '用户 Skills',
 
   // AI Error
   'ai.codex.bridgeError': 'Codex 主进程处理器尚未加载。请完全重启 Netcatty 或重启 Electron 开发进程，然后重试。',
@@ -1824,7 +2061,7 @@ const zhCN: Messages = {
   // AI Safety Settings
   'ai.safety.title': '安全',
   'ai.safety.permissionMode': '权限模式',
-  'ai.safety.permissionMode.description': '控制 AI 与终端的交互方式。观察者模式通过 MCP Server 阻止所有写操作，对内置和 ACP Agent 均生效。确认模式对 ACP Agent 仅为建议性（ACP Agent 有自己的工具审批流程）。',
+  'ai.safety.permissionMode.description': '控制 AI 与终端的交互方式。观察者模式会通过 Netcatty 阻止所有写操作，对内置和 ACP Agent 均生效。确认模式对 ACP Agent 仅为建议性（ACP Agent 有自己的工具审批流程）。',
   'ai.safety.permissionMode.observer': '观察者 - 只读，禁止操作',
   'ai.safety.permissionMode.confirm': '确认 - 操作前询问',
   'ai.safety.permissionMode.autonomous': '自主 - 自由执行',
@@ -1834,11 +2071,37 @@ const zhCN: Messages = {
   'ai.safety.maxIterations': '最大迭代次数',
   'ai.safety.maxIterations.description': '防止 AI 失控执行的最大工具调用循环次数。ACP Agent 可能有自己的内部迭代限制，以其为准。',
   'ai.safety.blocklist': '命令黑名单',
-  'ai.safety.blocklist.description': '用于拦截危险命令的正则表达式。通过 MCP Server 对内置和 ACP Agent 均生效。',
+  'ai.safety.blocklist.description': '用于拦截危险命令的正则表达式。通过 Netcatty 执行层对内置和 ACP Agent 均生效。',
   'ai.safety.blocklist.placeholder': '正则表达式...',
   'ai.safety.blocklist.reset': '恢复默认',
   'ai.safety.blocklist.add': '添加规则',
   'ai.safety.note': '命令黑名单、命令超时和观察者模式通过 MCP Server 层强制执行，对所有 Agent 类型生效。确认模式和最大迭代次数对内置 Agent 完全强制执行；ACP Agent 可能有自己的内部控制。',
+
+  // 统一终端工作区和顶部标签的 tooltip 文案 (issue #954)
+  'terminal.layer.addTerminal': '添加终端',
+  'terminal.layer.switchToSplitView': '切换到分屏视图',
+  'terminal.layer.sftp': '文件传输',
+  'terminal.layer.scripts': '脚本',
+  'terminal.layer.theme': '主题',
+  'terminal.layer.aiChat': 'AI 助手',
+  'terminal.layer.movePanelLeft': '面板移至左侧',
+  'terminal.layer.movePanelRight': '面板移至右侧',
+  'terminal.layer.closePanel': '关闭面板',
+  'topTabs.openQuickSwitcher': '打开快速切换',
+  'topTabs.moreTabs': '更多标签页',
+  'topTabs.aiAssistant': 'AI 助手',
+  'topTabs.toggleTheme': '切换主题',
+  'topTabs.openSettings': '打开设置',
+  'ai.chat.sessionHistory': '会话历史',
+  'ai.chat.attach': '附件',
+  'ai.chat.collapse': '收起',
+  'ai.chat.expand': '展开',
+  'ai.chat.enableAgent': '启用 {name}',
+  'zmodem.waitingForRemote': '等待远端...',
+  'zmodem.uploading': '上传中',
+  'zmodem.downloading': '下载中',
+  'zmodem.cancelTransfer': '取消传输 (Ctrl+C)',
+  'settings.shortcuts.resetToDefault': '重置为默认',
 };
 
 export default zhCN;

application/i18n/messages.ts

@@ -1,11 +1,13 @@
 import en, { type Messages } from './locales/en';
 import zhCN from './locales/zh-CN';
+import ru from './locales/ru';
 
 // Keep keys stable; add new locales by adding another import and map entry.
 export { type Messages };
 
 export const MESSAGES_BY_LOCALE: Record<string, Messages> = {
   en,
+  ru,
   'zh-CN': zhCN,
 };
 

application/localVaultBackups.ts

@@ -0,0 +1,495 @@
+import type { SyncPayload } from '../domain/sync';
+import {
+  STORAGE_KEY_LOCAL_VAULT_BACKUP_LAST_APP_VERSION,
+  STORAGE_KEY_LOCAL_VAULT_BACKUP_MAX_COUNT,
+  STORAGE_KEY_VAULT_APPLY_IN_PROGRESS,
+  STORAGE_KEY_VAULT_RESTORE_IN_PROGRESS_UNTIL,
+} from '../infrastructure/config/storageKeys';
+import { localStorageAdapter } from '../infrastructure/persistence/localStorageAdapter';
+import { getCloudSyncManager } from '../infrastructure/services/CloudSyncManager';
+import { netcattyBridge } from '../infrastructure/services/netcattyBridge';
+import { hasMeaningfulSyncData } from './syncPayload';
+
+/**
+ * Snapshot the current sync data version (the integer that increments
+ * on each successful cloud sync). Returns undefined when the value is
+ * 0 (never synced) or unavailable, so the UI can fall back to timestamp.
+ */
+function captureCurrentSyncDataVersion(): number | undefined {
+  try {
+    const state = getCloudSyncManager().getState();
+    const v = state.localVersion;
+    return typeof v === 'number' && v > 0 ? v : undefined;
+  } catch {
+    return undefined;
+  }
+}
+
+export type LocalVaultBackupReason = 'app_version_change' | 'before_restore';
+
+export interface LocalVaultBackupPreview {
+  id: string;
+  createdAt: number;
+  reason: LocalVaultBackupReason;
+  /** Sync-data version at the time the snapshot was taken (the integer
+   * that the CloudSyncManager increments on each successful cloud sync).
+   * Undefined when the user had never synced yet, or for legacy backups
+   * persisted before this field was added. */
+  syncDataVersion?: number;
+  /** App version transition fields, only for `app_version_change` records.
+   * Kept for backward compatibility with already-persisted backups. */
+  sourceAppVersion?: string;
+  targetAppVersion?: string;
+  fingerprint: string;
+  preview: {
+    hostCount: number;
+    keyCount: number;
+    snippetCount: number;
+    identityCount: number;
+    portForwardingRuleCount: number;
+  };
+}
+
+export interface LocalVaultBackupDetails {
+  backup: LocalVaultBackupPreview;
+  payload: SyncPayload;
+}
+
+export const DEFAULT_LOCAL_VAULT_BACKUP_MAX_COUNT = 20;
+export const MIN_LOCAL_VAULT_BACKUP_MAX_COUNT = 1;
+export const MAX_LOCAL_VAULT_BACKUP_MAX_COUNT = 100;
+
+export const sanitizeLocalVaultBackupMaxCount = (value: number): number => {
+  if (!Number.isFinite(value)) return DEFAULT_LOCAL_VAULT_BACKUP_MAX_COUNT;
+  return Math.max(
+    MIN_LOCAL_VAULT_BACKUP_MAX_COUNT,
+    Math.min(MAX_LOCAL_VAULT_BACKUP_MAX_COUNT, Math.round(value)),
+  );
+};
+
+export const getLocalVaultBackupMaxCount = (): number => {
+  const stored = localStorageAdapter.readNumber(STORAGE_KEY_LOCAL_VAULT_BACKUP_MAX_COUNT);
+  return sanitizeLocalVaultBackupMaxCount(
+    stored ?? DEFAULT_LOCAL_VAULT_BACKUP_MAX_COUNT,
+  );
+};
+
+export const setLocalVaultBackupMaxCount = (value: number): number => {
+  const sanitized = sanitizeLocalVaultBackupMaxCount(value);
+  localStorageAdapter.writeNumber(STORAGE_KEY_LOCAL_VAULT_BACKUP_MAX_COUNT, sanitized);
+  return sanitized;
+};
+
+export async function trimLocalVaultBackups(maxCount = getLocalVaultBackupMaxCount()): Promise<void> {
+  const bridge = netcattyBridge.get();
+  await bridge?.trimVaultBackups?.({ maxCount });
+}
+
+export async function getLocalVaultBackupCapabilities(): Promise<{
+  encryptionAvailable: boolean;
+}> {
+  const bridge = netcattyBridge.get();
+  const caps = await bridge?.getVaultBackupCapabilities?.();
+  // Conservatively treat a missing bridge (non-Electron environments, early
+  // boot) as unavailable so callers fall back to the locked-down UI path
+  // instead of assuming capabilities they can't verify.
+  return { encryptionAvailable: Boolean(caps?.encryptionAvailable) };
+}
+
+export async function listLocalVaultBackups(): Promise<LocalVaultBackupPreview[]> {
+  const bridge = netcattyBridge.get();
+  const entries = await bridge?.listVaultBackups?.();
+  return Array.isArray(entries) ? entries : [];
+}
+
+export async function readLocalVaultBackup(id: string): Promise<LocalVaultBackupDetails | null> {
+  const bridge = netcattyBridge.get();
+  if (!bridge?.readVaultBackup) return null;
+  return bridge.readVaultBackup({ id });
+}
+
+export async function openLocalVaultBackupDir(): Promise<void> {
+  const bridge = netcattyBridge.get();
+  await bridge?.openVaultBackupDir?.();
+}
+
+export async function createLocalVaultBackup(
+  payload: SyncPayload,
+  options: {
+    reason: LocalVaultBackupReason;
+    syncDataVersion?: number;
+    sourceAppVersion?: string;
+    targetAppVersion?: string;
+    maxCount?: number;
+  },
+): Promise<LocalVaultBackupPreview | null> {
+  // Intentional: an empty-vault backup has nothing to restore from, so we
+  // early-return instead of writing a zero-entry record. Callers that rely
+  // on a backup (protective-before-restore, version-change on first run)
+  // must treat `null` as "no safety net this time" and continue — blocking
+  // the user's flow on a missing backup would be worse than allowing the
+  // apply to proceed without one.
+  if (!hasMeaningfulSyncData(payload)) {
+    return null;
+  }
+
+  const bridge = netcattyBridge.get();
+  if (!bridge?.createVaultBackup) {
+    return null;
+  }
+
+  try {
+    const result = await bridge.createVaultBackup({
+      payload,
+      reason: options.reason,
+      // Default to the live cloud-sync version so every new backup carries
+      // it even when the caller didn't pass one explicitly. Bridge sanitizer
+      // drops invalid values (non-positive / non-finite), so this is safe.
+      syncDataVersion: options.syncDataVersion ?? captureCurrentSyncDataVersion(),
+      sourceAppVersion: options.sourceAppVersion,
+      targetAppVersion: options.targetAppVersion,
+      maxCount: options.maxCount ?? getLocalVaultBackupMaxCount(),
+    });
+    return result?.backup ?? null;
+  } catch (error) {
+    // The main-process bridge refuses to write backups when safeStorage is
+    // unavailable (VAULT_BACKUP_ENCRYPTION_UNAVAILABLE) because SyncPayload
+    // carries plaintext credentials that must never touch disk unencrypted.
+    // Callers (startup version-change, protective-before-restore) intentionally
+    // continue without a backup rather than blocking the user's flow, so we
+    // log and return null here.
+    const message = error instanceof Error ? error.message : String(error);
+    console.warn('[localVaultBackups] Backup skipped:', message);
+    return null;
+  }
+}
+
+/**
+ * Thrown when a caller requires a protective backup and the backup
+ * couldn't be written — safeStorage unavailable, bridge missing,
+ * main-process rejection, disk error.
+ *
+ * Callers should surface this as a user-visible abort rather than
+ * proceeding with the destructive apply. Separate from "nothing to
+ * back up" (empty vault) which is returned as `null`.
+ */
+export class ProtectiveBackupUnavailableError extends Error {
+  constructor(message: string) {
+    super(message);
+    this.name = 'ProtectiveBackupUnavailableError';
+  }
+}
+
+/**
+ * Create a protective local backup before a destructive apply (restore
+ * from backup list, restore from Gist revision, cloud download applied
+ * over meaningful local state).
+ *
+ * Returns `null` when there is nothing meaningful to back up — in that
+ * case the caller can safely proceed with the apply, because there is
+ * no local data to lose.
+ *
+ * Throws `ProtectiveBackupUnavailableError` when pre-apply state IS
+ * meaningful but the backup attempt failed. Callers MUST abort the
+ * destructive apply in that case and surface the error to the user,
+ * otherwise we regress the exact safety contract the backup system
+ * was added to enforce (the `console.error`-and-proceed pattern that
+ * previously swallowed safeStorage/keychain failures and continued).
+ */
+export async function createRequiredProtectiveLocalVaultBackup(
+  payload: SyncPayload,
+): Promise<LocalVaultBackupPreview | null> {
+  if (!hasMeaningfulSyncData(payload)) {
+    // Nothing to protect — an empty-vault backup would produce a
+    // useless record, not a safety net.
+    return null;
+  }
+
+  const bridge = netcattyBridge.get();
+  if (!bridge?.createVaultBackup) {
+    throw new ProtectiveBackupUnavailableError(
+      'Vault backup bridge is not available in this environment.',
+    );
+  }
+
+  try {
+    const result = await bridge.createVaultBackup({
+      payload,
+      reason: 'before_restore',
+      maxCount: getLocalVaultBackupMaxCount(),
+    });
+    return result?.backup ?? null;
+  } catch (error) {
+    const message = error instanceof Error ? error.message : String(error);
+    throw new ProtectiveBackupUnavailableError(message);
+  }
+}
+
+/**
+ * How long each heartbeat extends the cross-window restore barrier.
+ * Short enough that an abandoned lock (crashed window, hung task)
+ * clears itself quickly without user intervention. The heartbeat
+ * interval below refreshes the deadline as long as the caller's task
+ * is still running, so large vaults or slow keychain unlocks cannot
+ * expose a mid-apply window to concurrent auto-sync even when the
+ * total apply time exceeds this value.
+ */
+const RESTORE_BARRIER_HOLD_MS = 60_000;
+
+/**
+ * How often the heartbeat refreshes the barrier. Picked to ensure at
+ * least two refreshes land before the current deadline would expire,
+ * so a single missed tick (event-loop stall, GC pause) cannot drop
+ * the barrier prematurely.
+ */
+const RESTORE_BARRIER_HEARTBEAT_MS = Math.max(1_000, Math.floor(RESTORE_BARRIER_HOLD_MS / 3));
+
+/**
+ * Run `task` while holding a cross-window "restore in progress" barrier.
+ *
+ * The barrier is a localStorage key readable by every window of the same
+ * origin. useAutoSync reads it on each auto-sync and on each data-change
+ * debounce tick, refusing to push while the deadline is still in the
+ * future. We write a time-bounded deadline (rather than a boolean) so a
+ * crashed window can never leave sync permanently wedged.
+ *
+ * While the task runs, a heartbeat timer re-writes the deadline so a
+ * slow apply (large vault, slow keychain) keeps the barrier held rather
+ * than exposing a post-deadline window to concurrent auto-sync. The
+ * heartbeat is cleared and the barrier is released in a finally block
+ * so success, throw, and unexpected early-return all converge on the
+ * same cleanup.
+ */
+export async function withRestoreBarrier<T>(
+  task: () => Promise<T>,
+  holdMs: number = RESTORE_BARRIER_HOLD_MS,
+): Promise<T> {
+  const writeDeadline = () => {
+    try {
+      localStorageAdapter.writeNumber(
+        STORAGE_KEY_VAULT_RESTORE_IN_PROGRESS_UNTIL,
+        Date.now() + holdMs,
+      );
+    } catch (error) {
+      // If we can't write the barrier we still proceed — the UI-side
+      // `isSyncBusy` guard and same-window debounce cancellation are a
+      // secondary defense. Better to complete the restore than refuse on
+      // a broken localStorage.
+      console.warn('[localVaultBackups] Failed to set restore barrier:', error);
+    }
+  };
+
+  writeDeadline();
+  const heartbeat = setInterval(
+    writeDeadline,
+    Math.max(1_000, Math.min(holdMs / 3, RESTORE_BARRIER_HEARTBEAT_MS)),
+  );
+
+  try {
+    return await task();
+  } finally {
+    clearInterval(heartbeat);
+    try {
+      localStorageAdapter.writeNumber(STORAGE_KEY_VAULT_RESTORE_IN_PROGRESS_UNTIL, 0);
+    } catch {
+      /* ignore — the deadline will expire naturally */
+    }
+  }
+}
+
+/**
+ * Shape of the apply-in-progress sentinel record. Persisted as JSON in
+ * `STORAGE_KEY_VAULT_APPLY_IN_PROGRESS` so the next session can
+ * distinguish "the last apply completed cleanly" from "the last apply
+ * crashed mid-way and the local vault is a partial mix of states."
+ */
+export interface VaultApplyInProgressRecord {
+  startedAt: number;
+  protectiveBackupId: string | null;
+}
+
+/**
+ * Returns the persisted apply-in-progress record if a previous apply
+ * was interrupted before clearing it. Callers (notably auto-sync) use
+ * this to refuse to push a partial-apply local state over an intact
+ * cloud copy. See `applyProtectedSyncPayload` for the write side.
+ *
+ * `null` here means "no interrupted apply detected" — either nothing
+ * was ever applied, or the last apply finished cleanly.
+ */
+export function readInterruptedVaultApply(): VaultApplyInProgressRecord | null {
+  try {
+    const raw = localStorageAdapter.readString(STORAGE_KEY_VAULT_APPLY_IN_PROGRESS);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw);
+    if (!parsed || typeof parsed !== 'object') return null;
+    const startedAt = typeof parsed.startedAt === 'number' ? parsed.startedAt : 0;
+    const protectiveBackupId =
+      typeof parsed.protectiveBackupId === 'string' ? parsed.protectiveBackupId : null;
+    if (!startedAt) return null;
+    return { startedAt, protectiveBackupId };
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Clears the apply-in-progress sentinel. The normal completion path
+ * inside `applyProtectedSyncPayload` clears it automatically; this
+ * export exists so the user's explicit recovery action ("I've restored
+ * from a backup, resume sync") can acknowledge the interrupted state
+ * from the UI without re-running an apply.
+ */
+export function clearInterruptedVaultApply(): void {
+  try {
+    localStorageAdapter.remove(STORAGE_KEY_VAULT_APPLY_IN_PROGRESS);
+  } catch {
+    /* ignore — next clean apply will overwrite */
+  }
+}
+
+function writeApplyInProgressSentinel(record: VaultApplyInProgressRecord): void {
+  try {
+    localStorageAdapter.writeString(
+      STORAGE_KEY_VAULT_APPLY_IN_PROGRESS,
+      JSON.stringify(record),
+    );
+  } catch (error) {
+    // Sentinel write is best-effort: a failure here means a later crash
+    // won't be detected, but does NOT compromise the apply itself.
+    // Log so a systematic storage outage is diagnosable.
+    console.warn('[localVaultBackups] Failed to set apply-in-progress sentinel:', error);
+  }
+}
+
+/**
+ * Shared "apply a remote-sourced payload safely" helper.
+ *
+ * Holds the cross-window restore barrier, snapshots the pre-apply vault
+ * into a protective backup, persists an apply-in-progress sentinel, and
+ * only then runs the supplied `applyPayload` callback. Every destructive
+ * apply path (startup merge, conflict resolution, empty-vault restore,
+ * manual Gist-revision restore) must go through this so the protections
+ * can't drift out of sync between the main window and the settings
+ * window.
+ *
+ * The sentinel closes the partial-apply-then-crash window: `applyPayload`
+ * writes to several localStorage keys non-atomically (hosts, keys, port-
+ * forwarding rules, settings). A crash mid-sequence leaves the vault in
+ * a state that is neither pre-apply nor post-apply, and the next
+ * auto-sync would otherwise push that partial state over an intact cloud
+ * copy. The sentinel flags "local may be inconsistent" for the next
+ * session; `readInterruptedVaultApply` exposes that to callers that
+ * enforce "don't auto-push a half-applied vault."
+ *
+ * `buildPreApplyPayload` is invoked *before* the apply to snapshot the
+ * current vault. Callers pass their own React-closure builder (hosts,
+ * keys, port-forwarding rules) because the caller owns that state.
+ *
+ * `translateProtectiveBackupFailure` converts the
+ * `ProtectiveBackupUnavailableError` into a user-visible message in the
+ * caller's locale. It runs only on the thrown-and-caught path.
+ */
+export function applyProtectedSyncPayload(options: {
+  buildPreApplyPayload: () => SyncPayload;
+  applyPayload: () => void | Promise<void>;
+  translateProtectiveBackupFailure: (message: string) => string;
+}): Promise<void> {
+  const { buildPreApplyPayload, applyPayload, translateProtectiveBackupFailure } = options;
+  return withRestoreBarrier(async () => {
+    const pre = buildPreApplyPayload();
+    let protectiveBackupId: string | null = null;
+    try {
+      const backup = await createRequiredProtectiveLocalVaultBackup(pre);
+      protectiveBackupId = backup?.id ?? null;
+    } catch (error) {
+      // Destructive apply without a working safety net is exactly the
+      // overwrite-without-recovery regression this module was added to
+      // prevent. Surface the failure to the caller; every call site
+      // currently aborts the apply and shows a user-visible error.
+      if (error instanceof ProtectiveBackupUnavailableError) {
+        throw new Error(translateProtectiveBackupFailure(error.message));
+      }
+      throw error;
+    }
+
+    // Mark the apply as in-progress. If the renderer crashes between
+    // the first localStorage write inside `applyPayload` and the
+    // successful completion below, the next session will observe this
+    // sentinel and refuse to auto-sync the partial state.
+    writeApplyInProgressSentinel({
+      startedAt: Date.now(),
+      protectiveBackupId,
+    });
+
+    // Only clear the sentinel on successful completion. A throw from
+    // `applyPayload` deliberately leaves the sentinel set: the partial
+    // write is still on disk, and the next session must observe the
+    // flag so auto-sync refuses to push the half-applied state.
+    await applyPayload();
+    clearInterruptedVaultApply();
+  });
+}
+
+export async function ensureVersionChangeBackup(
+  payload: SyncPayload,
+  currentAppVersion: string | null | undefined,
+): Promise<{ created: boolean; backup: LocalVaultBackupPreview | null }> {
+  const normalizedVersion = currentAppVersion?.trim() || '';
+  if (!normalizedVersion) {
+    return { created: false, backup: null };
+  }
+
+  const previousVersion =
+    localStorageAdapter.readString(STORAGE_KEY_LOCAL_VAULT_BACKUP_LAST_APP_VERSION)?.trim() || '';
+
+  if (!previousVersion) {
+    localStorageAdapter.writeString(STORAGE_KEY_LOCAL_VAULT_BACKUP_LAST_APP_VERSION, normalizedVersion);
+    return { created: false, backup: null };
+  }
+
+  if (previousVersion === normalizedVersion) {
+    return { created: false, backup: null };
+  }
+
+  let backup: LocalVaultBackupPreview | null = null;
+  const payloadIsMeaningful = hasMeaningfulSyncData(payload);
+  if (payloadIsMeaningful) {
+    backup = await createLocalVaultBackup(payload, {
+      reason: 'app_version_change',
+      sourceAppVersion: previousVersion,
+      targetAppVersion: normalizedVersion,
+    });
+  }
+
+  // Only advance the stored version stamp when we actually wrote a
+  // backup. Two failure modes we must NOT collapse into "advance":
+  //
+  //   1. Meaningful payload + backup failed (transient keychain lock,
+  //      disk error) — leaving the stamp unchanged means the next
+  //      launch retries, instead of turning a transient error into a
+  //      permanent "the version-change backup never happened" hole.
+  //
+  //   2. Non-meaningful payload at the moment we checked — on startup
+  //      the async vault rehydrate may not have finished yet, so
+  //      `hasMeaningfulSyncData` can return false transiently even
+  //      though the user has real data. Advancing in that window would
+  //      burn the one-shot upgrade opportunity; holding keeps the
+  //      retry available on the next launch when rehydrate has
+  //      completed (or when the user genuinely starts from empty and
+  //      the next migration-boundary arrives).
+  //
+  // Trade-off: a user who truly starts empty and never adds data will
+  // hit this branch on every launch until they do. That's cheap (a
+  // single meaningful-data check) and strictly safer than silently
+  // skipping the first real upgrade backup.
+  const shouldAdvanceVersion = payloadIsMeaningful && backup !== null;
+  if (shouldAdvanceVersion) {
+    localStorageAdapter.writeString(STORAGE_KEY_LOCAL_VAULT_BACKUP_LAST_APP_VERSION, normalizedVersion);
+  }
+
+  return {
+    created: Boolean(backup),
+    backup,
+  };
+}

application/state/activeTabStore.ts

@@ -1,8 +1,20 @@
-import { useCallback,useSyncExternalStore } from 'react';
+import { useCallback, useSyncExternalStore } from 'react';
 
 // Simple store for active tab that allows fine-grained subscriptions
 type Listener = () => void;
 
+// ----- Editor tab id helpers -----
+export const EDITOR_PREFIX = 'editor:';
+
+/** Returns true when `id` is an editor tab id (starts with "editor:"). */
+export const isEditorTabId = (id: string): boolean => id.startsWith(EDITOR_PREFIX);
+
+/** Convert an editorTab's internal id to a top-tab id understood by the tab bar. */
+export const toEditorTabId = (editorId: string): string => `${EDITOR_PREFIX}${editorId}`;
+
+/** Strip the "editor:" prefix to recover the internal editorTab id. */
+export const fromEditorTabId = (tabId: string): string => tabId.slice(EDITOR_PREFIX.length);
+
 class ActiveTabStore {
   private activeTabId: string = 'vault';
   private listeners = new Set<Listener>();
@@ -70,9 +82,21 @@ export const useIsSftpActive = () => {
   );
 };
 
-// Check if terminal layer should be visible
-export const useIsTerminalLayerVisible = (draggingSessionId: string | null) => {
-  const activeTabId = useActiveTabId();
-  const isTerminalTab = activeTabId !== 'vault' && activeTabId !== 'sftp';
-  return isTerminalTab || !!draggingSessionId;
+// Check if a specific editor tab is currently active
+export const useIsEditorTabActive = (tabId: string): boolean => {
+  const editorTopId = toEditorTabId(tabId);
+  const getSnapshot = useCallback(() => activeTabStore.getActiveTabId() === editorTopId, [editorTopId]);
+  return useSyncExternalStore(activeTabStore.subscribe, getSnapshot);
+};
+
+// Check if terminal layer should be visible
+// Editor tabs are NOT terminal tabs, so exclude them from the visibility condition.
+export const useIsTerminalLayerVisible = (draggingSessionId: string | null) => {
+  const getSnapshot = useCallback(() => {
+    const activeTabId = activeTabStore.getActiveTabId();
+    const isTerminalTab = activeTabId !== 'vault' && activeTabId !== 'sftp' && !isEditorTabId(activeTabId);
+    return isTerminalTab || !!draggingSessionId;
+  }, [draggingSessionId]);
+
+  return useSyncExternalStore(activeTabStore.subscribe, getSnapshot);
 };

application/state/aiDraftState.test.ts

@@ -0,0 +1,349 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import {
+  activateDraftView,
+  bumpDraftMutationVersionState,
+  bumpDraftUploadGenerationState,
+  clearScopeDraftState,
+  createEmptyDraft,
+  ensureDraftForScopeState,
+  getDraftMutationVersionState,
+  getDraftUploadGenerationState,
+  pruneTerminalScopeState,
+  pruneTerminalTransientState,
+  resolvePanelView,
+  selectDraftForAgentSwitch,
+  setDraftView,
+  setSessionView,
+  updateDraftForScope,
+} from "./aiDraftState.ts";
+
+test("createEmptyDraft seeds selected agent and empty inputs", () => {
+  const draft = createEmptyDraft("agent-alpha");
+
+  assert.equal(draft.agentId, "agent-alpha");
+  assert.equal(draft.text, "");
+  assert.deepEqual(draft.attachments, []);
+  assert.deepEqual(draft.selectedUserSkillSlugs, []);
+  assert.equal(typeof draft.updatedAt, "number");
+});
+
+test("resolvePanelView defaults to draft when no explicit view exists", () => {
+  assert.deepEqual(resolvePanelView({}, "terminal:123"), { mode: "draft" });
+});
+
+test("setDraftView records draft mode", () => {
+  assert.deepEqual(setDraftView({}, "terminal:123"), {
+    "terminal:123": { mode: "draft" },
+  });
+});
+
+test("activateDraftView clears the terminal scope's active session owner", () => {
+  const activeSessionIdMap = {
+    "terminal:123": "session-123",
+    "workspace:abc": "session-workspace",
+  };
+  const panelViewByScope = {
+    "terminal:123": { mode: "session", sessionId: "session-123" },
+    "workspace:abc": { mode: "session", sessionId: "session-workspace" },
+  } satisfies Record<string, { mode: "draft" } | { mode: "session"; sessionId: string }>;
+
+  const next = activateDraftView(
+    activeSessionIdMap,
+    panelViewByScope,
+    "terminal:123",
+  );
+
+  assert.deepEqual(next.activeSessionIdMap, {
+    "workspace:abc": "session-workspace",
+  });
+  assert.deepEqual(next.panelViewByScope, {
+    "terminal:123": { mode: "draft" },
+    "workspace:abc": panelViewByScope["workspace:abc"],
+  });
+});
+
+test("activateDraftView is a no-op when the scope already has explicit draft view", () => {
+  const activeSessionIdMap = {
+    "workspace:abc": "session-workspace",
+  };
+  const panelViewByScope = {
+    "terminal:123": { mode: "draft" },
+    "workspace:abc": { mode: "session", sessionId: "session-workspace" },
+  } satisfies Record<string, { mode: "draft" } | { mode: "session"; sessionId: string }>;
+
+  const next = activateDraftView(
+    activeSessionIdMap,
+    panelViewByScope,
+    "terminal:123",
+  );
+
+  assert.equal(next.activeSessionIdMap, activeSessionIdMap);
+  assert.equal(next.panelViewByScope, panelViewByScope);
+});
+
+test("setSessionView records target session id", () => {
+  assert.deepEqual(setSessionView({}, "workspace:abc", "session-123"), {
+    "workspace:abc": { mode: "session", sessionId: "session-123" },
+  });
+});
+
+test("clearScopeDraftState removes both the draft and current panel view", () => {
+  const draftsByScope = {
+    "terminal:1": createEmptyDraft("agent-alpha"),
+    "workspace:2": createEmptyDraft("agent-beta"),
+  };
+  const panelViewByScope = {
+    "terminal:1": { mode: "session", sessionId: "session-123" },
+    "workspace:2": { mode: "draft" },
+  } satisfies Record<string, { mode: "draft" } | { mode: "session"; sessionId: string }>;
+
+  const next = clearScopeDraftState(draftsByScope, panelViewByScope, "terminal:1");
+
+  assert.deepEqual(next.draftsByScope, {
+    "workspace:2": draftsByScope["workspace:2"],
+  });
+  assert.deepEqual(next.panelViewByScope, {
+    "workspace:2": panelViewByScope["workspace:2"],
+  });
+});
+
+test("clearScopeDraftState is a no-op when the scope is already cleared", () => {
+  const draftsByScope = {
+    "workspace:2": createEmptyDraft("agent-beta"),
+  };
+  const panelViewByScope = {
+    "workspace:2": { mode: "draft" },
+  } satisfies Record<string, { mode: "draft" } | { mode: "session"; sessionId: string }>;
+
+  const next = clearScopeDraftState(draftsByScope, panelViewByScope, "terminal:closed");
+
+  assert.equal(next.draftsByScope, draftsByScope);
+  assert.equal(next.panelViewByScope, panelViewByScope);
+});
+
+test("updateDraftForScope creates a draft on first write and keeps other scopes untouched", () => {
+  const draftsByScope = {
+    "workspace:2": createEmptyDraft("agent-beta"),
+  };
+
+  const next = updateDraftForScope(
+    draftsByScope,
+    "terminal:1",
+    "agent-alpha",
+    (draft) => ({
+      ...draft,
+      text: "hello world",
+    }),
+  );
+
+  assert.equal(next["terminal:1"].agentId, "agent-alpha");
+  assert.equal(next["terminal:1"].text, "hello world");
+  assert.equal(next["workspace:2"], draftsByScope["workspace:2"]);
+});
+
+test("ensureDraftForScopeState adds the missing scope without dropping siblings", () => {
+  const draftsByScope = {
+    "workspace:2": createEmptyDraft("agent-beta"),
+  };
+
+  const next = ensureDraftForScopeState(
+    draftsByScope,
+    "terminal:1",
+    "agent-alpha",
+  );
+
+  assert.equal(next["terminal:1"].agentId, "agent-alpha");
+  assert.equal(next["terminal:1"].text, "");
+  assert.equal(next["workspace:2"], draftsByScope["workspace:2"]);
+});
+
+test("ensureDraftForScopeState returns the original ref when the scope already exists", () => {
+  const draftsByScope = {
+    "terminal:1": createEmptyDraft("agent-alpha"),
+  };
+
+  const next = ensureDraftForScopeState(
+    draftsByScope,
+    "terminal:1",
+    "agent-beta",
+  );
+
+  assert.equal(next, draftsByScope);
+});
+
+test("selectDraftForAgentSwitch preserves hidden draft content when leaving a populated chat session", () => {
+  const currentDraft = {
+    ...createEmptyDraft("agent-alpha"),
+    text: "keep me only if I was already drafting",
+    attachments: [{ id: "file-1", filename: "note.txt", dataUrl: "", base64Data: "", mediaType: "text/plain" }],
+    selectedUserSkillSlugs: ["skill-a"],
+  };
+
+  const next = selectDraftForAgentSwitch(currentDraft, "agent-beta", true);
+
+  assert.equal(next.agentId, "agent-beta");
+  assert.equal(next.text, "keep me only if I was already drafting");
+  assert.deepEqual(next.attachments, currentDraft.attachments);
+  assert.deepEqual(next.selectedUserSkillSlugs, ["skill-a"]);
+});
+
+test("selectDraftForAgentSwitch resets to an empty draft when leaving a populated chat session without pending draft content", () => {
+  const currentDraft = createEmptyDraft("agent-alpha");
+
+  const next = selectDraftForAgentSwitch(currentDraft, "agent-beta", true);
+
+  assert.equal(next.agentId, "agent-beta");
+  assert.equal(next.text, "");
+  assert.deepEqual(next.attachments, []);
+  assert.deepEqual(next.selectedUserSkillSlugs, []);
+});
+
+test("selectDraftForAgentSwitch preserves an existing draft while only changing agent", () => {
+  const currentDraft = {
+    ...createEmptyDraft("agent-alpha"),
+    text: "unfinished prompt",
+    selectedUserSkillSlugs: ["skill-a"],
+  };
+
+  const next = selectDraftForAgentSwitch(currentDraft, "agent-beta", false);
+
+  assert.equal(next.agentId, "agent-beta");
+  assert.equal(next.text, "unfinished prompt");
+  assert.deepEqual(next.selectedUserSkillSlugs, ["skill-a"]);
+});
+
+test("draft mutation version increments on every mutation for the same scope", () => {
+  const scopeKey = "terminal:1";
+  const initialVersion = getDraftMutationVersionState({}, scopeKey);
+  const nextVersions = bumpDraftMutationVersionState({}, scopeKey);
+  const finalVersions = bumpDraftMutationVersionState(nextVersions, scopeKey);
+
+  assert.equal(initialVersion, 0);
+  assert.equal(getDraftMutationVersionState(nextVersions, scopeKey), 1);
+  assert.equal(getDraftMutationVersionState(finalVersions, scopeKey), 2);
+});
+
+test("draft upload generation only increments when the draft lifecycle rolls over", () => {
+  const scopeKey = "terminal:1";
+  const initialGeneration = getDraftUploadGenerationState({}, scopeKey);
+  const nextGenerations = bumpDraftUploadGenerationState({}, scopeKey);
+  const finalGenerations = bumpDraftUploadGenerationState(nextGenerations, scopeKey);
+
+  assert.equal(initialGeneration, 0);
+  assert.equal(getDraftUploadGenerationState(nextGenerations, scopeKey), 1);
+  assert.equal(getDraftUploadGenerationState(finalGenerations, scopeKey), 2);
+});
+
+test("pruneTerminalScopeState removes closed terminal drafts and views only", () => {
+  const draftsByScope = {
+    "terminal:closed": createEmptyDraft("agent-alpha"),
+    "terminal:open": createEmptyDraft("agent-beta"),
+    "workspace:keep": createEmptyDraft("agent-gamma"),
+  };
+  const panelViewByScope = {
+    "terminal:closed": { mode: "draft" },
+    "terminal:open": { mode: "session", sessionId: "session-open" },
+    "workspace:keep": { mode: "session", sessionId: "session-workspace" },
+  } satisfies Record<string, { mode: "draft" } | { mode: "session"; sessionId: string }>;
+
+  const next = pruneTerminalScopeState(
+    draftsByScope,
+    panelViewByScope,
+    new Set(["open"]),
+  );
+
+  assert.deepEqual(next.draftsByScope, {
+    "terminal:open": draftsByScope["terminal:open"],
+    "workspace:keep": draftsByScope["workspace:keep"],
+  });
+  assert.deepEqual(next.panelViewByScope, {
+    "terminal:open": panelViewByScope["terminal:open"],
+    "workspace:keep": panelViewByScope["workspace:keep"],
+  });
+});
+
+test("pruneTerminalScopeState returns original refs when nothing is pruned", () => {
+  const draftsByScope = {
+    "terminal:open": createEmptyDraft("agent-alpha"),
+    "workspace:keep": createEmptyDraft("agent-beta"),
+  };
+  const panelViewByScope = {
+    "terminal:open": { mode: "draft" },
+    "workspace:keep": { mode: "session", sessionId: "session-1" },
+  } satisfies Record<string, { mode: "draft" } | { mode: "session"; sessionId: string }>;
+
+  const next = pruneTerminalScopeState(
+    draftsByScope,
+    panelViewByScope,
+    new Set(["open"]),
+  );
+
+  assert.equal(next.draftsByScope, draftsByScope);
+  assert.equal(next.panelViewByScope, panelViewByScope);
+});
+
+test("pruneTerminalTransientState clears closed terminal active session, draft, and view state only", () => {
+  const activeSessionIdMap = {
+    "terminal:closed": "session-closed",
+    "terminal:open": "session-open",
+    "workspace:keep": "session-workspace",
+  };
+  const draftsByScope = {
+    "terminal:closed": createEmptyDraft("agent-alpha"),
+    "terminal:open": createEmptyDraft("agent-beta"),
+    "workspace:keep": createEmptyDraft("agent-gamma"),
+  };
+  const panelViewByScope = {
+    "terminal:closed": { mode: "draft" },
+    "terminal:open": { mode: "session", sessionId: "session-open" },
+    "workspace:keep": { mode: "session", sessionId: "session-workspace" },
+  } satisfies Record<string, { mode: "draft" } | { mode: "session"; sessionId: string }>;
+
+  const next = pruneTerminalTransientState(
+    activeSessionIdMap,
+    draftsByScope,
+    panelViewByScope,
+    new Set(["open"]),
+  );
+
+  assert.deepEqual(next.activeSessionIdMap, {
+    "terminal:open": "session-open",
+    "workspace:keep": "session-workspace",
+  });
+  assert.deepEqual(next.draftsByScope, {
+    "terminal:open": draftsByScope["terminal:open"],
+    "workspace:keep": draftsByScope["workspace:keep"],
+  });
+  assert.deepEqual(next.panelViewByScope, {
+    "terminal:open": panelViewByScope["terminal:open"],
+    "workspace:keep": panelViewByScope["workspace:keep"],
+  });
+});
+
+test("pruneTerminalTransientState returns original refs when no terminal scopes close", () => {
+  const activeSessionIdMap = {
+    "terminal:open": "session-open",
+    "workspace:keep": "session-workspace",
+  };
+  const draftsByScope = {
+    "terminal:open": createEmptyDraft("agent-alpha"),
+    "workspace:keep": createEmptyDraft("agent-beta"),
+  };
+  const panelViewByScope = {
+    "terminal:open": { mode: "draft" },
+    "workspace:keep": { mode: "session", sessionId: "session-workspace" },
+  } satisfies Record<string, { mode: "draft" } | { mode: "session"; sessionId: string }>;
+
+  const next = pruneTerminalTransientState(
+    activeSessionIdMap,
+    draftsByScope,
+    panelViewByScope,
+    new Set(["open"]),
+  );
+
+  assert.equal(next.activeSessionIdMap, activeSessionIdMap);
+  assert.equal(next.draftsByScope, draftsByScope);
+  assert.equal(next.panelViewByScope, panelViewByScope);
+});

application/state/aiDraftState.ts

@@ -0,0 +1,282 @@
+import type {
+  AIDraft,
+  AIPanelView,
+} from '../../infrastructure/ai/types';
+
+type DraftsByScope = Partial<Record<string, AIDraft>>;
+type PanelViewByScope = Partial<Record<string, AIPanelView>>;
+type ActiveSessionIdMap = Record<string, string | null>;
+type DraftMutationVersionByScope = Record<string, number>;
+type DraftUploadGenerationByScope = Record<string, number>;
+
+const DEFAULT_PANEL_VIEW: AIPanelView = { mode: 'draft' };
+
+export function createEmptyDraft(agentId: string): AIDraft {
+  return {
+    text: '',
+    agentId,
+    attachments: [],
+    selectedUserSkillSlugs: [],
+    updatedAt: Date.now(),
+  };
+}
+
+export function getDraftMutationVersionState(
+  versionsByScope: DraftMutationVersionByScope,
+  scopeKey: string,
+): number {
+  return versionsByScope[scopeKey] ?? 0;
+}
+
+export function bumpDraftMutationVersionState(
+  versionsByScope: DraftMutationVersionByScope,
+  scopeKey: string,
+): DraftMutationVersionByScope {
+  return {
+    ...versionsByScope,
+    [scopeKey]: getDraftMutationVersionState(versionsByScope, scopeKey) + 1,
+  };
+}
+
+export function getDraftUploadGenerationState(
+  generationsByScope: DraftUploadGenerationByScope,
+  scopeKey: string,
+): number {
+  return generationsByScope[scopeKey] ?? 0;
+}
+
+export function bumpDraftUploadGenerationState(
+  generationsByScope: DraftUploadGenerationByScope,
+  scopeKey: string,
+): DraftUploadGenerationByScope {
+  return {
+    ...generationsByScope,
+    [scopeKey]: getDraftUploadGenerationState(generationsByScope, scopeKey) + 1,
+  };
+}
+
+export function resolvePanelView(
+  panelViewByScope: PanelViewByScope,
+  scopeKey: string,
+): AIPanelView {
+  return panelViewByScope[scopeKey] ?? DEFAULT_PANEL_VIEW;
+}
+
+export function setDraftView(
+  panelViewByScope: PanelViewByScope,
+  scopeKey: string,
+): PanelViewByScope {
+  const currentPanelView = panelViewByScope[scopeKey];
+  if (currentPanelView?.mode === 'draft') {
+    return panelViewByScope;
+  }
+
+  return {
+    ...panelViewByScope,
+    [scopeKey]: DEFAULT_PANEL_VIEW,
+  };
+}
+
+export function activateDraftView(
+  activeSessionIdMap: ActiveSessionIdMap,
+  panelViewByScope: PanelViewByScope,
+  scopeKey: string,
+): {
+  activeSessionIdMap: ActiveSessionIdMap;
+  panelViewByScope: PanelViewByScope;
+} {
+  const nextPanelViewByScope = setDraftView(panelViewByScope, scopeKey);
+  const hasActiveSession = activeSessionIdMap[scopeKey] != null;
+
+  if (!hasActiveSession) {
+    return {
+      activeSessionIdMap,
+      panelViewByScope: nextPanelViewByScope,
+    };
+  }
+
+  const nextActiveSessionIdMap = { ...activeSessionIdMap };
+  delete nextActiveSessionIdMap[scopeKey];
+
+  return {
+    activeSessionIdMap: nextActiveSessionIdMap,
+    panelViewByScope: nextPanelViewByScope,
+  };
+}
+
+export function setSessionView(
+  panelViewByScope: PanelViewByScope,
+  scopeKey: string,
+  sessionId: string,
+): PanelViewByScope {
+  return {
+    ...panelViewByScope,
+    [scopeKey]: { mode: 'session', sessionId },
+  };
+}
+
+export function updateDraftForScope(
+  draftsByScope: DraftsByScope,
+  scopeKey: string,
+  fallbackAgentId: string,
+  updater: (draft: AIDraft) => AIDraft,
+): DraftsByScope {
+  const currentDraft = draftsByScope[scopeKey] ?? createEmptyDraft(fallbackAgentId);
+  const nextDraft = updater(currentDraft);
+
+  return {
+    ...draftsByScope,
+    [scopeKey]: nextDraft,
+  };
+}
+
+export function ensureDraftForScopeState(
+  draftsByScope: DraftsByScope,
+  scopeKey: string,
+  agentId: string,
+): DraftsByScope {
+  if (draftsByScope[scopeKey]) {
+    return draftsByScope;
+  }
+
+  return {
+    ...draftsByScope,
+    [scopeKey]: createEmptyDraft(agentId),
+  };
+}
+
+export function selectDraftForAgentSwitch(
+  currentDraft: AIDraft | null | undefined,
+  agentId: string,
+  startFresh: boolean,
+): AIDraft {
+  const hasPendingDraftContent = Boolean(
+    currentDraft
+    && (
+      currentDraft.text.length > 0
+      || currentDraft.attachments.length > 0
+      || currentDraft.selectedUserSkillSlugs.length > 0
+    ),
+  );
+
+  if (startFresh && !hasPendingDraftContent) {
+    return createEmptyDraft(agentId);
+  }
+
+  const baseDraft = currentDraft ?? createEmptyDraft(agentId);
+  return {
+    ...baseDraft,
+    agentId,
+  };
+}
+
+export function clearScopeDraftState(
+  draftsByScope: DraftsByScope,
+  panelViewByScope: PanelViewByScope,
+  scopeKey: string,
+): {
+  draftsByScope: DraftsByScope;
+  panelViewByScope: PanelViewByScope;
+} {
+  const hasDraft = Object.prototype.hasOwnProperty.call(draftsByScope, scopeKey);
+  const hasPanelView = Object.prototype.hasOwnProperty.call(panelViewByScope, scopeKey);
+
+  if (!hasDraft && !hasPanelView) {
+    return {
+      draftsByScope,
+      panelViewByScope,
+    };
+  }
+
+  return {
+    draftsByScope: hasDraft
+      ? (() => {
+          const nextDrafts = { ...draftsByScope };
+          delete nextDrafts[scopeKey];
+          return nextDrafts;
+        })()
+      : draftsByScope,
+    panelViewByScope: hasPanelView
+      ? (() => {
+          const nextPanelViews = { ...panelViewByScope };
+          delete nextPanelViews[scopeKey];
+          return nextPanelViews;
+        })()
+      : panelViewByScope,
+  };
+}
+
+function isClosedTerminalScope(scopeKey: string, activeTerminalTargetIds: Set<string>) {
+  if (!scopeKey.startsWith('terminal:')) return false;
+
+  const targetId = scopeKey.slice('terminal:'.length);
+  if (!targetId) return false;
+
+  return !activeTerminalTargetIds.has(targetId);
+}
+
+export function pruneTerminalScopeState(
+  draftsByScope: DraftsByScope,
+  panelViewByScope: PanelViewByScope,
+  activeTerminalTargetIds: Set<string>,
+): {
+  draftsByScope: DraftsByScope;
+  panelViewByScope: PanelViewByScope;
+} {
+  const nextDraftsByScope = { ...draftsByScope };
+  const nextPanelViewByScope = { ...panelViewByScope };
+  let draftsChanged = false;
+  let panelViewsChanged = false;
+
+  for (const scopeKey of Object.keys(nextDraftsByScope)) {
+    if (!isClosedTerminalScope(scopeKey, activeTerminalTargetIds)) continue;
+    delete nextDraftsByScope[scopeKey];
+    draftsChanged = true;
+  }
+
+  for (const scopeKey of Object.keys(nextPanelViewByScope)) {
+    if (!isClosedTerminalScope(scopeKey, activeTerminalTargetIds)) continue;
+    delete nextPanelViewByScope[scopeKey];
+    panelViewsChanged = true;
+  }
+
+  return {
+    draftsByScope: draftsChanged ? nextDraftsByScope : draftsByScope,
+    panelViewByScope: panelViewsChanged ? nextPanelViewByScope : panelViewByScope,
+  };
+}
+
+export function pruneTerminalTransientState(
+  activeSessionIdMap: ActiveSessionIdMap,
+  draftsByScope: DraftsByScope,
+  panelViewByScope: PanelViewByScope,
+  activeTerminalTargetIds: Set<string>,
+): {
+  activeSessionIdMap: ActiveSessionIdMap;
+  draftsByScope: DraftsByScope;
+  panelViewByScope: PanelViewByScope;
+} {
+  let activeSessionMapChanged = false;
+  const nextActiveSessionIdMap: ActiveSessionIdMap = {};
+
+  for (const [scopeKey, sessionId] of Object.entries(activeSessionIdMap)) {
+    if (isClosedTerminalScope(scopeKey, activeTerminalTargetIds)) {
+      activeSessionMapChanged = true;
+      continue;
+    }
+
+    nextActiveSessionIdMap[scopeKey] = sessionId;
+  }
+
+  const nextTerminalScopeState = pruneTerminalScopeState(
+    draftsByScope,
+    panelViewByScope,
+    activeTerminalTargetIds,
+  );
+
+  return {
+    activeSessionIdMap: activeSessionMapChanged ? nextActiveSessionIdMap : activeSessionIdMap,
+    draftsByScope: nextTerminalScopeState.draftsByScope,
+    panelViewByScope: nextTerminalScopeState.panelViewByScope,
+  };
+}

application/state/aiScopeCleanup.test.ts

@@ -0,0 +1,160 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import type {
+  AIPanelView,
+  AISession,
+} from "../../infrastructure/ai/types.ts";
+import { createEmptyDraft } from "./aiDraftState.ts";
+import {
+  pruneInactiveScopedSessions,
+  pruneInactiveScopedTransientState,
+} from "./aiScopeCleanup.ts";
+
+function createSession(id: string, scope: AISession["scope"], externalSessionId?: string): AISession {
+  return {
+    id,
+    title: id,
+    agentId: "catty",
+    scope,
+    messages: [],
+    externalSessionId,
+    createdAt: 1,
+    updatedAt: 1,
+  };
+}
+
+test("pruneInactiveScopedTransientState removes closed workspace and terminal scope state", () => {
+  const activeSessionIdMap = {
+    "terminal:open-terminal": "session-open",
+    "terminal:closed-terminal": "session-closed-terminal",
+    "workspace:open-workspace": "session-open-workspace",
+    "workspace:closed-workspace": "session-closed-workspace",
+  };
+  const draftsByScope = {
+    "terminal:open-terminal": createEmptyDraft("catty"),
+    "terminal:closed-terminal": createEmptyDraft("catty"),
+    "workspace:open-workspace": createEmptyDraft("catty"),
+    "workspace:closed-workspace": createEmptyDraft("catty"),
+  };
+  const panelViewByScope = {
+    "terminal:open-terminal": { mode: "draft" },
+    "terminal:closed-terminal": { mode: "session", sessionId: "session-closed-terminal" },
+    "workspace:open-workspace": { mode: "draft" },
+    "workspace:closed-workspace": { mode: "session", sessionId: "session-closed-workspace" },
+  } satisfies Record<string, AIPanelView>;
+
+  const next = pruneInactiveScopedTransientState(
+    activeSessionIdMap,
+    draftsByScope,
+    panelViewByScope,
+    new Set(["open-terminal", "open-workspace"]),
+  );
+
+  assert.deepEqual(next.activeSessionIdMap, {
+    "terminal:open-terminal": "session-open",
+    "workspace:open-workspace": "session-open-workspace",
+  });
+  assert.deepEqual(next.draftsByScope, {
+    "terminal:open-terminal": draftsByScope["terminal:open-terminal"],
+    "workspace:open-workspace": draftsByScope["workspace:open-workspace"],
+  });
+  assert.deepEqual(next.panelViewByScope, {
+    "terminal:open-terminal": panelViewByScope["terminal:open-terminal"],
+    "workspace:open-workspace": panelViewByScope["workspace:open-workspace"],
+  });
+});
+
+test("pruneInactiveScopedSessions preserves restorable terminal ACP ids across reconnects", () => {
+  const sessions = [
+    createSession("terminal-restorable", {
+      type: "terminal",
+      targetId: "closed-restorable",
+      hostIds: ["host-1"],
+    }, "ext-1"),
+    createSession("terminal-local", {
+      type: "terminal",
+      targetId: "closed-local",
+      hostIds: ["local-shell"],
+    }, "ext-2"),
+    createSession("workspace-closed", {
+      type: "workspace",
+      targetId: "closed-workspace",
+    }, "ext-3"),
+    createSession("terminal-open", {
+      type: "terminal",
+      targetId: "open-terminal",
+      hostIds: ["host-2"],
+    }, "ext-4"),
+  ];
+
+  const next = pruneInactiveScopedSessions(
+    sessions,
+    new Set(["open-terminal"]),
+  );
+
+  assert.deepEqual(next.orphanedSessionIds, [
+    "terminal-restorable",
+    "terminal-local",
+    "workspace-closed",
+  ]);
+  assert.deepEqual(next.sessions, [
+    sessions[0],
+    sessions[3],
+  ]);
+});
+
+test("pruneInactiveScopedSessions preserves original sessions when orphaned restorable chats are already detached", () => {
+  const sessions = [
+    createSession("terminal-restorable", {
+      type: "terminal",
+      targetId: "closed-restorable",
+      hostIds: ["host-1"],
+    }),
+    createSession("terminal-open", {
+      type: "terminal",
+      targetId: "open-terminal",
+      hostIds: ["host-2"],
+    }, "ext-4"),
+  ];
+
+  const next = pruneInactiveScopedSessions(
+    sessions,
+    new Set(["open-terminal"]),
+  );
+
+  assert.deepEqual(next.orphanedSessionIds, ["terminal-restorable"]);
+  assert.equal(next.sessions, sessions);
+});
+
+test("pruneInactiveScopedSessions treats sessions displayed elsewhere as in-use, not orphaned", () => {
+  // terminal-restorable's original scope (terminal-closed-A) is gone, but
+  // the user resumed it into terminal-open-B from history. The session's
+  // externalSessionId must be preserved and it must not appear in the
+  // orphaned list, otherwise the active chat loses ACP continuity.
+  const resumedElsewhere = createSession("terminal-restorable", {
+    type: "terminal",
+    targetId: "terminal-closed-A",
+    hostIds: ["host-1"],
+  }, "ext-resumed");
+
+  const trulyOrphaned = createSession("terminal-stale", {
+    type: "terminal",
+    targetId: "terminal-closed-C",
+    hostIds: ["host-2"],
+  }, "ext-stale");
+
+  const sessions = [resumedElsewhere, trulyOrphaned];
+
+  const next = pruneInactiveScopedSessions(
+    sessions,
+    new Set(["terminal-open-B"]),
+    new Set(["terminal-restorable"]),
+  );
+
+  // Only the one not being displayed anywhere should show up as orphaned.
+  assert.deepEqual(next.orphanedSessionIds, ["terminal-stale"]);
+  // The resumed session must retain its externalSessionId.
+  const resumedNext = next.sessions.find((s) => s.id === "terminal-restorable");
+  assert.equal(resumedNext?.externalSessionId, "ext-resumed");
+});

application/state/aiScopeCleanup.ts

@@ -0,0 +1,145 @@
+import type {
+  AIDraft,
+  AIPanelView,
+  AISession,
+} from "../../infrastructure/ai/types";
+
+type DraftsByScope = Partial<Record<string, AIDraft>>;
+type PanelViewByScope = Partial<Record<string, AIPanelView>>;
+type ActiveSessionIdMap = Record<string, string | null>;
+
+function isInactiveScopedTarget(
+  scopeKey: string,
+  activeTargetIds: Set<string>,
+): boolean {
+  const separatorIndex = scopeKey.indexOf(":");
+  if (separatorIndex === -1) return false;
+
+  const scopeType = scopeKey.slice(0, separatorIndex);
+  if (scopeType !== "terminal" && scopeType !== "workspace") return false;
+
+  const targetId = scopeKey.slice(separatorIndex + 1);
+  if (!targetId) return false;
+
+  return !activeTargetIds.has(targetId);
+}
+
+export function pruneInactiveScopedState(
+  draftsByScope: DraftsByScope,
+  panelViewByScope: PanelViewByScope,
+  activeTargetIds: Set<string>,
+): {
+  draftsByScope: DraftsByScope;
+  panelViewByScope: PanelViewByScope;
+} {
+  const nextDraftsByScope = { ...draftsByScope };
+  const nextPanelViewByScope = { ...panelViewByScope };
+  let draftsChanged = false;
+  let panelViewsChanged = false;
+
+  for (const scopeKey of Object.keys(nextDraftsByScope)) {
+    if (!isInactiveScopedTarget(scopeKey, activeTargetIds)) continue;
+    delete nextDraftsByScope[scopeKey];
+    draftsChanged = true;
+  }
+
+  for (const scopeKey of Object.keys(nextPanelViewByScope)) {
+    if (!isInactiveScopedTarget(scopeKey, activeTargetIds)) continue;
+    delete nextPanelViewByScope[scopeKey];
+    panelViewsChanged = true;
+  }
+
+  return {
+    draftsByScope: draftsChanged ? nextDraftsByScope : draftsByScope,
+    panelViewByScope: panelViewsChanged ? nextPanelViewByScope : panelViewByScope,
+  };
+}
+
+export function pruneInactiveScopedTransientState(
+  activeSessionIdMap: ActiveSessionIdMap,
+  draftsByScope: DraftsByScope,
+  panelViewByScope: PanelViewByScope,
+  activeTargetIds: Set<string>,
+): {
+  activeSessionIdMap: ActiveSessionIdMap;
+  draftsByScope: DraftsByScope;
+  panelViewByScope: PanelViewByScope;
+} {
+  let activeSessionMapChanged = false;
+  const nextActiveSessionIdMap: ActiveSessionIdMap = {};
+
+  for (const [scopeKey, sessionId] of Object.entries(activeSessionIdMap)) {
+    if (isInactiveScopedTarget(scopeKey, activeTargetIds)) {
+      activeSessionMapChanged = true;
+      continue;
+    }
+
+    nextActiveSessionIdMap[scopeKey] = sessionId;
+  }
+
+  const nextScopedState = pruneInactiveScopedState(
+    draftsByScope,
+    panelViewByScope,
+    activeTargetIds,
+  );
+
+  return {
+    activeSessionIdMap: activeSessionMapChanged ? nextActiveSessionIdMap : activeSessionIdMap,
+    draftsByScope: nextScopedState.draftsByScope,
+    panelViewByScope: nextScopedState.panelViewByScope,
+  };
+}
+
+function isRestorableTerminalSession(session: AISession): boolean {
+  return session.scope.type === "terminal"
+    && !!session.scope.hostIds?.length
+    && session.scope.hostIds.some((id) => !id.startsWith("local-") && !id.startsWith("serial-"));
+}
+
+export function pruneInactiveScopedSessions(
+  sessions: AISession[],
+  activeTargetIds: Set<string>,
+  /**
+   * Session ids currently displayed by any live scope. A session whose
+   * `scope.targetId` is inactive but whose id is still in use somewhere
+   * (e.g. resumed from history into a different terminal) must not be
+   * treated as orphaned — deleting it outright would break the chat the
+   * user is actively continuing.
+   */
+  activeSessionIds: Set<string> = new Set(),
+): {
+  sessions: AISession[];
+  orphanedSessionIds: string[];
+} {
+  const orphanedSessionIds = sessions
+    .filter((session) => session.scope.targetId && !activeTargetIds.has(session.scope.targetId))
+    .filter((session) => !activeSessionIds.has(session.id))
+    .map((session) => session.id);
+
+  if (orphanedSessionIds.length === 0) {
+    return {
+      sessions,
+      orphanedSessionIds,
+    };
+  }
+
+  const orphanedSessionIdSet = new Set(orphanedSessionIds);
+  let sessionsChanged = false;
+
+  const nextSessions = sessions.flatMap((session) => {
+    if (!orphanedSessionIdSet.has(session.id)) {
+      return [session];
+    }
+
+    if (!isRestorableTerminalSession(session)) {
+      sessionsChanged = true;
+      return [];
+    }
+    return [session];
+  });
+
+  return {
+    sessions: sessionsChanged ? nextSessions : sessions,
+    orphanedSessionIds,
+  };
+}

application/state/customThemeStore.ts

@@ -75,7 +75,6 @@ class CustomThemeStore {
                 if (payload.key === STORAGE_KEY_CUSTOM_THEMES) {
                     // Another window changed custom themes — reload from localStorage
                     this.loadFromStorage();
-                    this.notify();
                 }
             });
         } catch {
@@ -129,6 +128,13 @@ class CustomThemeStore {
         this.notify();
         this.broadcastChange();
     };
+
+    replaceThemes = (themes: TerminalTheme[]) => {
+        this.themes = themes.map((theme) => ({ ...theme, colors: { ...theme.colors }, isCustom: true }));
+        this.saveToStorage();
+        this.notify();
+        this.broadcastChange();
+    };
 }
 
 // Singleton
@@ -172,5 +178,9 @@ export const useCustomThemeActions = () => {
         customThemeStore.deleteTheme(id);
     }, []);
 
-    return { addTheme, updateTheme, deleteTheme };
+    const replaceThemes = useCallback((themes: TerminalTheme[]) => {
+        customThemeStore.replaceThemes(themes);
+    }, []);
+
+    return { addTheme, updateTheme, deleteTheme, replaceThemes };
 };

application/state/defaultKeyPassphrases.test.ts

@@ -0,0 +1,194 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+import {
+  clearKeyPassphrasesByIds,
+  clearReferenceKeyPassphrases,
+  loadDefaultKeyPassphrase,
+  rememberKeyPassphrase,
+  shouldUpdateReferenceKeyPassphrase,
+} from "../defaultKeyPassphrases";
+import { STORAGE_KEY_DEFAULT_KEY_PASSPHRASES } from "../../infrastructure/config/storageKeys";
+import type { SSHKey } from "../../domain/models";
+
+function installLocalStorage(t: test.TestContext): void {
+  const store = new Map<string, string>();
+  const storage: Storage = {
+    get length() {
+      return store.size;
+    },
+    clear() {
+      store.clear();
+    },
+    getItem(key: string) {
+      return store.get(key) ?? null;
+    },
+    key(index: number) {
+      return Array.from(store.keys())[index] ?? null;
+    },
+    removeItem(key: string) {
+      store.delete(key);
+    },
+    setItem(key: string, value: string) {
+      store.set(key, value);
+    },
+  };
+
+  Object.defineProperty(globalThis, "localStorage", {
+    configurable: true,
+    value: storage,
+  });
+  Object.defineProperty(globalThis, "window", {
+    configurable: true,
+    value: { netcatty: undefined },
+  });
+
+  t.after(() => {
+    Reflect.deleteProperty(globalThis, "localStorage");
+    Reflect.deleteProperty(globalThis, "window");
+  });
+}
+
+const referenceKey = (): SSHKey => ({
+  id: "reference-key",
+  label: "id_ed25519",
+  type: "ED25519",
+  category: "key",
+  source: "reference",
+  filePath: "/Users/alice/.ssh/id_ed25519",
+  privateKey: "",
+  created: 1,
+});
+
+test("loadDefaultKeyPassphrase removes undecryptable credential placeholders", async (t) => {
+  installLocalStorage(t);
+  const keyPath = "/Users/alice/.ssh/id_ed25519";
+  globalThis.localStorage.setItem(
+    STORAGE_KEY_DEFAULT_KEY_PASSPHRASES,
+    JSON.stringify({
+      [keyPath]: "enc:v1:djEwYWJj",
+      "/Users/alice/.ssh/id_rsa": "still-valid",
+    }),
+  );
+
+  const result = await loadDefaultKeyPassphrase(keyPath);
+
+  assert.equal(result, null);
+  assert.deepEqual(
+    JSON.parse(globalThis.localStorage.getItem(STORAGE_KEY_DEFAULT_KEY_PASSPHRASES) ?? "{}"),
+    { "/Users/alice/.ssh/id_rsa": "still-valid" },
+  );
+});
+
+test("loadDefaultKeyPassphrase returns plain stored passphrases", async (t) => {
+  installLocalStorage(t);
+  const keyPath = "/Users/alice/.ssh/id_ed25519";
+  globalThis.localStorage.setItem(
+    STORAGE_KEY_DEFAULT_KEY_PASSPHRASES,
+    JSON.stringify({ [keyPath]: "correct horse battery staple" }),
+  );
+
+  assert.equal(await loadDefaultKeyPassphrase(keyPath), "correct horse battery staple");
+});
+
+test("clearReferenceKeyPassphrases clears matching reference key paths only", () => {
+  const keys: SSHKey[] = [
+    {
+      ...referenceKey(),
+      passphrase: "bad",
+      savePassphrase: true,
+    },
+    {
+      ...referenceKey(),
+      id: "other-key",
+      label: "other",
+      filePath: "/Users/alice/.ssh/other",
+      passphrase: "keep",
+      savePassphrase: true,
+    },
+  ];
+
+  const updated = clearReferenceKeyPassphrases(keys, ["/Users/alice/.ssh/id_ed25519"]);
+
+  assert.equal(updated[0].passphrase, undefined);
+  assert.equal(updated[0].savePassphrase, false);
+  assert.equal(updated[1].passphrase, "keep");
+});
+
+test("clearKeyPassphrasesByIds clears matching saved key passphrases", () => {
+  const keys: SSHKey[] = [
+    {
+      ...referenceKey(),
+      id: "inline-key",
+      source: "imported",
+      filePath: undefined,
+      privateKey: "PRIVATE KEY",
+      passphrase: "bad",
+      savePassphrase: true,
+    },
+    {
+      ...referenceKey(),
+      id: "other-key",
+      label: "other",
+      passphrase: "keep",
+      savePassphrase: true,
+    },
+  ];
+
+  const updated = clearKeyPassphrasesByIds(keys, ["inline-key"]);
+
+  assert.equal(updated[0].passphrase, undefined);
+  assert.equal(updated[0].savePassphrase, false);
+  assert.equal(updated[1].passphrase, "keep");
+});
+
+test("shouldUpdateReferenceKeyPassphrase replaces missing or undecryptable passphrases", () => {
+  assert.equal(shouldUpdateReferenceKeyPassphrase(null), false);
+  assert.equal(shouldUpdateReferenceKeyPassphrase(referenceKey()), true);
+  assert.equal(
+    shouldUpdateReferenceKeyPassphrase({
+      ...referenceKey(),
+      passphrase: "enc:v1:djEwAAAA",
+    }),
+    true,
+  );
+  assert.equal(
+    shouldUpdateReferenceKeyPassphrase({
+      ...referenceKey(),
+      passphrase: "saved",
+    }),
+    false,
+  );
+});
+
+test("rememberKeyPassphrase updates reference key state before completing", async (t) => {
+  installLocalStorage(t);
+  const keys = [referenceKey()];
+  let currentKeys = keys;
+  let releaseUpdate: (() => void) | undefined;
+  let rememberPromise: Promise<void> | undefined;
+  const updateStarted = new Promise<void>((resolve) => {
+    const updateKeys = async (updated: SSHKey[]) => {
+      assert.equal(currentKeys[0].passphrase, "saved");
+      assert.equal(updated[0].passphrase, "saved");
+      resolve();
+      await new Promise<void>((release) => {
+        releaseUpdate = release;
+      });
+    };
+
+    rememberPromise = rememberKeyPassphrase({
+      keyPath: "/Users/alice/.ssh/id_ed25519",
+      passphrase: "saved",
+      keys,
+      updateKeys,
+      setCurrentKeys: (updated) => {
+        currentKeys = updated;
+      },
+    });
+  });
+
+  await updateStarted;
+  assert.equal(currentKeys[0].passphrase, "saved");
+  releaseUpdate?.();
+  await rememberPromise;
+});

application/state/editorSftpBridge.ts

@@ -0,0 +1,69 @@
+import type { SftpFilenameEncoding } from "../../types";
+
+export interface EditorSftpWrite {
+  (
+    connectionId: string,
+    expectedHostId: string,
+    filePath: string,
+    content: string,
+    filenameEncoding?: SftpFilenameEncoding,
+  ): Promise<void>;
+}
+
+// `useSftpState` is instantiated in at least two places (the top-level SftpView
+// and the per-terminal SftpSidePanel), each owning its own pane registry. An
+// editor tab opened from either path must be saved via the matching instance,
+// so the bridge tracks all currently-mounted writers and dispatches by
+// attempting each in turn until one succeeds.
+//
+// Each writer throws synchronously (or rejects) if the connectionId isn't in
+// its pane registry; we use "connection no longer available" text as the
+// signal to fall through to the next writer. Any other error is re-thrown
+// immediately because it represents a real save failure the user must see.
+const writers = new Set<EditorSftpWrite>();
+
+const NOT_MY_CONNECTION_RE = /SFTP connection is no longer available/i;
+
+export const registerEditorSftpWriter = (fn: EditorSftpWrite | null) => {
+  // Pass `null` on cleanup — but cleanup also needs to know WHICH writer to
+  // remove. Callers who register once per mount should instead use
+  // `registerEditorSftpWriterScoped` below, which returns an unregister fn.
+  // This legacy signature is preserved for callers that prefer the
+  // register/unregister-with-null pattern: we clear ALL writers on null.
+  if (fn === null) {
+    writers.clear();
+    return;
+  }
+  writers.add(fn);
+};
+
+export const registerEditorSftpWriterScoped = (fn: EditorSftpWrite): (() => void) => {
+  writers.add(fn);
+  return () => {
+    writers.delete(fn);
+  };
+};
+
+export const editorSftpWrite: EditorSftpWrite = async (...args) => {
+  if (writers.size === 0) {
+    throw new Error("SFTP editor bridge not registered — cannot save (no SFTP view mounted)");
+  }
+  let lastNotMine: Error | null = null;
+  for (const fn of writers) {
+    try {
+      await fn(...args);
+      return;
+    } catch (err) {
+      const msg = err instanceof Error ? err.message : String(err);
+      if (NOT_MY_CONNECTION_RE.test(msg)) {
+        // This writer doesn't own the connectionId — try the next one.
+        lastNotMine = err instanceof Error ? err : new Error(msg);
+        continue;
+      }
+      // Real save error — surface it.
+      throw err;
+    }
+  }
+  // No writer owned the connectionId.
+  throw lastNotMine ?? new Error("SFTP connection is no longer available");
+};

application/state/editorTabSave.test.ts

@@ -0,0 +1,88 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import { EditorTabStore, type EditorTab } from "./editorTabStore.ts";
+import { createEditorTabSaveService } from "./editorTabSave.ts";
+
+const deferred = <T = void>() => {
+  let resolve!: (value: T | PromiseLike<T>) => void;
+  let reject!: (reason?: unknown) => void;
+  const promise = new Promise<T>((res, rej) => {
+    resolve = res;
+    reject = rej;
+  });
+  return { promise, resolve, reject };
+};
+
+const makeTab = (overrides: Partial<EditorTab> = {}): EditorTab => ({
+  id: "edt_1",
+  kind: "editor",
+  sessionId: "conn_1",
+  hostId: "host_1",
+  remotePath: "/tmp/file.txt",
+  fileName: "file.txt",
+  languageId: "plaintext",
+  content: "v1",
+  baselineContent: "old",
+  wordWrap: false,
+  viewState: null,
+  savingState: "idle",
+  saveError: null,
+  ...overrides,
+});
+
+test("editor tab save service joins duplicate saves for the same content", async () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab());
+  const pending = deferred();
+  const writes: string[] = [];
+  const service = createEditorTabSaveService({
+    store,
+    write: async (_sessionId, _hostId, _remotePath, content) => {
+      writes.push(content);
+      await pending.promise;
+    },
+  });
+
+  const first = service.saveTab("edt_1");
+  const second = service.saveTab("edt_1", "v1");
+
+  assert.deepEqual(writes, ["v1"]);
+  pending.resolve();
+
+  assert.equal(await first, true);
+  assert.equal(await second, true);
+  assert.deepEqual(writes, ["v1"]);
+  assert.equal(store.getTab("edt_1")?.baselineContent, "v1");
+  assert.equal(store.getTab("edt_1")?.savingState, "idle");
+});
+
+test("editor tab save service queues newer tab content after an in-flight save", async () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab());
+  const firstSave = deferred();
+  const secondSave = deferred();
+  const writes: string[] = [];
+  const service = createEditorTabSaveService({
+    store,
+    write: async (_sessionId, _hostId, _remotePath, content) => {
+      writes.push(content);
+      await (content === "v1" ? firstSave.promise : secondSave.promise);
+    },
+  });
+
+  const first = service.saveTab("edt_1");
+  store.updateContent("edt_1", "v2", null);
+  const second = service.saveTab("edt_1");
+
+  assert.deepEqual(writes, ["v1"]);
+  firstSave.resolve();
+  await new Promise<void>((resolve) => setTimeout(resolve, 0));
+  assert.deepEqual(writes, ["v1", "v2"]);
+  secondSave.resolve();
+
+  assert.equal(await first, true);
+  assert.equal(await second, true);
+  assert.equal(store.getTab("edt_1")?.baselineContent, "v2");
+  assert.equal(store.getTab("edt_1")?.content, "v2");
+});

application/state/editorTabSave.ts

@@ -0,0 +1,72 @@
+import { editorSftpWrite, type EditorSftpWrite } from "./editorSftpBridge";
+import { editorTabStore, type EditorTabId, type EditorTabStore } from "./editorTabStore";
+import {
+  createTextEditorSaveCoordinator,
+  type TextEditorSaveCoordinator,
+} from "./textEditorSaveCoordinator";
+
+interface EditorTabSaveServiceDeps {
+  store: EditorTabStore;
+  write: EditorSftpWrite;
+}
+
+export interface EditorTabSaveService {
+  saveTab(id: EditorTabId, contentOverride?: string): Promise<boolean>;
+  releaseTab(id: EditorTabId): void;
+}
+
+const formatSaveError = (error: unknown): string =>
+  error instanceof Error ? error.message : "Save failed";
+
+export const createEditorTabSaveService = ({
+  store,
+  write,
+}: EditorTabSaveServiceDeps): EditorTabSaveService => {
+  const coordinators = new Map<EditorTabId, TextEditorSaveCoordinator>();
+
+  const getCoordinator = (id: EditorTabId): TextEditorSaveCoordinator => {
+    const existing = coordinators.get(id);
+    if (existing) return existing;
+
+    const coordinator = createTextEditorSaveCoordinator({
+      onSave: async (content) => {
+        const tab = store.getTab(id);
+        if (!tab) throw new Error("Editor tab closed before save completed");
+        await write(tab.sessionId, tab.hostId, tab.remotePath, content);
+      },
+      onSaveStart: () => {
+        store.setSavingState(id, "saving");
+      },
+      onSaveSuccess: (content) => {
+        store.markSaved(id, content);
+      },
+      onSaveError: (error) => {
+        store.setSavingState(id, "error", formatSaveError(error));
+      },
+    });
+
+    coordinators.set(id, coordinator);
+    return coordinator;
+  };
+
+  return {
+    saveTab: async (id, contentOverride) => {
+      const tab = store.getTab(id);
+      if (!tab) return false;
+      return getCoordinator(id).save(contentOverride ?? tab.content);
+    },
+    releaseTab: (id) => {
+      const coordinator = coordinators.get(id);
+      coordinator?.reset();
+      coordinators.delete(id);
+    },
+  };
+};
+
+const editorTabSaveService = createEditorTabSaveService({
+  store: editorTabStore,
+  write: editorSftpWrite,
+});
+
+export const saveEditorTab = editorTabSaveService.saveTab;
+export const releaseEditorTabSaveCoordinator = editorTabSaveService.releaseTab;

application/state/editorTabStore.test.ts

@@ -0,0 +1,219 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import { EditorTabStore, type EditorTab } from "./editorTabStore.ts";
+
+const makeTab = (overrides: Partial<EditorTab> = {}): EditorTab => ({
+  id: "edt_1",
+  kind: "editor",
+  sessionId: "conn_1",
+  hostId: "host_1",
+  remotePath: "/etc/nginx/nginx.conf",
+  fileName: "nginx.conf",
+  languageId: "ini",
+  content: "worker_processes auto;",
+  baselineContent: "worker_processes auto;",
+  wordWrap: false,
+  viewState: null,
+  savingState: "idle",
+  saveError: null,
+  ...overrides,
+});
+
+test("updateContent stores content and viewState; dirty flag derives from baseline", () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab());
+  store.updateContent("edt_1", "worker_processes 4;", null);
+  const tab = store.getTab("edt_1")!;
+  assert.equal(tab.content, "worker_processes 4;");
+  assert.equal(store.isDirty("edt_1"), true);
+});
+
+test("markSaved moves baseline to current content and clears dirty", () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab({ content: "changed", baselineContent: "orig" }));
+  assert.equal(store.isDirty("edt_1"), true);
+  store.markSaved("edt_1", "changed");
+  assert.equal(store.isDirty("edt_1"), false);
+  assert.equal(store.getTab("edt_1")!.baselineContent, "changed");
+});
+
+test("setWordWrap updates only that tab", () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab({ id: "edt_1" }));
+  store._debugInsert(makeTab({ id: "edt_2", remotePath: "/b.txt", fileName: "b.txt" }));
+  store.setWordWrap("edt_1", true);
+  assert.equal(store.getTab("edt_1")!.wordWrap, true);
+  assert.equal(store.getTab("edt_2")!.wordWrap, false);
+});
+
+test("setSavingState transitions and clears error on idle", () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab());
+  store.setSavingState("edt_1", "saving");
+  assert.equal(store.getTab("edt_1")!.savingState, "saving");
+  store.setSavingState("edt_1", "error", "EACCES");
+  assert.equal(store.getTab("edt_1")!.saveError, "EACCES");
+  store.setSavingState("edt_1", "idle");
+  assert.equal(store.getTab("edt_1")!.saveError, null);
+});
+
+test("close removes the tab and returns remaining ids in order", () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab({ id: "edt_1" }));
+  store._debugInsert(makeTab({ id: "edt_2", remotePath: "/b.txt", fileName: "b.txt" }));
+  store.close("edt_1");
+  assert.equal(store.getTab("edt_1"), undefined);
+  assert.deepEqual(store.getTabs().map((t) => t.id), ["edt_2"]);
+});
+
+test("subscribers fire on change and not on read", () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab());
+  let count = 0;
+  const unsub = store.subscribe(() => { count++; });
+  store.getTab("edt_1");
+  store.getTabs();
+  assert.equal(count, 0);
+  store.updateContent("edt_1", "x", null);
+  // notifications are microtask-deferred, flush via awaiting a resolved promise
+  return Promise.resolve().then(() => {
+    assert.equal(count, 1);
+    unsub();
+  });
+});
+
+test("promoteFromModal creates a new tab and returns its id", () => {
+  const store = new EditorTabStore();
+  const id = store.promoteFromModal({
+    sessionId: "conn_1",
+    hostId: "host_1",
+    remotePath: "/etc/nginx/nginx.conf",
+    fileName: "nginx.conf",
+    languageId: "ini",
+    content: "x",
+    baselineContent: "x",
+    wordWrap: false,
+    viewState: null,
+  });
+  const tab = store.getTab(id)!;
+  assert.equal(tab.remotePath, "/etc/nginx/nginx.conf");
+  assert.equal(tab.fileName, "nginx.conf");
+  assert.equal(tab.kind, "editor");
+});
+
+test("promoteFromModal focuses existing tab for same sessionId+normalized path and overrides content", () => {
+  const store = new EditorTabStore();
+  const first = store.promoteFromModal({
+    sessionId: "conn_1",
+    hostId: "host_1",
+    remotePath: "/etc/nginx/./nginx.conf",
+    fileName: "nginx.conf",
+    languageId: "ini",
+    content: "v1",
+    baselineContent: "v1",
+    wordWrap: false,
+    viewState: null,
+  });
+  const second = store.promoteFromModal({
+    sessionId: "conn_1",
+    hostId: "host_1",
+    remotePath: "/etc/nginx/nginx.conf",
+    fileName: "nginx.conf",
+    languageId: "ini",
+    content: "v2",
+    baselineContent: "v1",
+    wordWrap: false,
+    viewState: null,
+  });
+  assert.equal(second, first);
+  assert.equal(store.getTab(first)!.content, "v2");
+  assert.equal(store.getTabs().length, 1);
+});
+
+test("dedup scope is per-sessionId — same path on different sessions are distinct tabs", () => {
+  const store = new EditorTabStore();
+  const a = store.promoteFromModal({
+    sessionId: "conn_A",
+    hostId: "host_1",
+    remotePath: "/etc/hosts",
+    fileName: "hosts",
+    languageId: "plaintext",
+    content: "", baselineContent: "", wordWrap: false, viewState: null,
+  });
+  const b = store.promoteFromModal({
+    sessionId: "conn_B",
+    hostId: "host_2",
+    remotePath: "/etc/hosts",
+    fileName: "hosts",
+    languageId: "plaintext",
+    content: "", baselineContent: "", wordWrap: false, viewState: null,
+  });
+  assert.notEqual(a, b);
+  assert.equal(store.getTabs().length, 2);
+});
+
+test("confirmCloseBySession returns true when no tabs match", async () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab());
+  const ok = await store.confirmCloseBySession("other_conn", async () => "discard");
+  assert.equal(ok, true);
+  assert.equal(store.getTabs().length, 1);
+});
+
+test("confirmCloseBySession discards all dirty matching tabs when prompt returns 'discard'", async () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab({ id: "edt_1", content: "x", baselineContent: "y" }));
+  store._debugInsert(makeTab({ id: "edt_2", remotePath: "/b.txt", fileName: "b.txt", content: "x", baselineContent: "y" }));
+  const ok = await store.confirmCloseBySession("conn_1", async () => "discard");
+  assert.equal(ok, true);
+  assert.equal(store.getTabs().length, 0);
+});
+
+test("confirmCloseBySession closes clean tabs without prompting; aborts on cancel", async () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab({ id: "edt_clean" })); // content == baseline
+  store._debugInsert(makeTab({ id: "edt_dirty", remotePath: "/b.txt", fileName: "b.txt", content: "x", baselineContent: "y" }));
+  let prompts = 0;
+  const ok = await store.confirmCloseBySession("conn_1", async () => { prompts++; return "cancel"; });
+  assert.equal(ok, false);
+  assert.equal(prompts, 1, "prompt fires only for dirty tab");
+  // clean tab was closed before the dirty cancel aborted the batch
+  assert.equal(store.getTab("edt_clean"), undefined);
+  assert.ok(store.getTab("edt_dirty"));
+});
+
+test("confirmCloseBySession invokes save callback for 'save' choice and only closes on save success", async () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab({ id: "edt_1", content: "new", baselineContent: "old" }));
+  let saved = false;
+  const ok = await store.confirmCloseBySession("conn_1", async () => "save", async (id) => {
+    assert.equal(id, "edt_1");
+    saved = true;
+    store.markSaved(id, "new");
+  });
+  assert.equal(saved, true);
+  assert.equal(ok, true);
+  assert.equal(store.getTab("edt_1"), undefined);
+});
+
+test("confirmCloseBySession reports every closed editor tab to cleanup callback", async () => {
+  const store = new EditorTabStore();
+  store._debugInsert(makeTab({ id: "edt_clean" }));
+  store._debugInsert(makeTab({ id: "edt_dirty", remotePath: "/b.txt", fileName: "b.txt", content: "new", baselineContent: "old" }));
+  const closed: string[] = [];
+
+  const ok = await store.confirmCloseBySession(
+    "conn_1",
+    async () => "save",
+    async (id) => {
+      const tab = store.getTab(id)!;
+      store.markSaved(id, tab.content);
+    },
+    (id) => closed.push(id),
+  );
+
+  assert.equal(ok, true);
+  assert.deepEqual(closed, ["edt_clean", "edt_dirty"]);
+  assert.equal(store.getTabs().length, 0);
+});

application/state/editorTabStore.ts

@@ -0,0 +1,246 @@
+import { useCallback, useSyncExternalStore } from "react";
+import type * as Monaco from "monaco-editor";
+
+import { activeTabStore, fromEditorTabId, isEditorTabId } from "./activeTabStore";
+
+// POSIX-style normalization: collapse "/./" and duplicate slashes, not ".." (remote paths
+// may contain semantic ".." segments we don't want to resolve client-side).
+const normalizePath = (p: string): string => {
+  const collapsed = p.replace(/\/+/g, "/").replace(/\/\.(?=\/|$)/g, "");
+  return collapsed.length > 1 && collapsed.endsWith("/") ? collapsed.slice(0, -1) : collapsed;
+};
+
+export type EditorTabId = string;
+
+export type EditorSavingState = "idle" | "saving" | "error";
+
+export interface EditorTab {
+  id: EditorTabId;
+  kind: "editor";
+  /** SFTP connection id (matches SftpConnection.id). Session lookup key. */
+  sessionId: string;
+  /** Stable endpoint id; used to verify the session is still the one we opened against. */
+  hostId: string;
+  remotePath: string;
+  fileName: string;
+  languageId: string;
+  content: string;
+  baselineContent: string;
+  wordWrap: boolean;
+  viewState: Monaco.editor.ICodeEditorViewState | null;
+  savingState: EditorSavingState;
+  saveError: string | null;
+}
+
+type Listener = () => void;
+
+let idCounter = 0;
+const genId = (): EditorTabId => `edt_${Date.now().toString(36)}_${(++idCounter).toString(36)}`;
+
+export class EditorTabStore {
+  private tabs: EditorTab[] = [];
+  private listeners = new Set<Listener>();
+  private pendingNotify = false;
+
+  getTabs = (): readonly EditorTab[] => this.tabs;
+  getTab = (id: EditorTabId): EditorTab | undefined => this.tabs.find((t) => t.id === id);
+  isDirty = (id: EditorTabId): boolean => {
+    const t = this.getTab(id);
+    return !!t && t.content !== t.baselineContent;
+  };
+
+  updateContent = (
+    id: EditorTabId,
+    content: string,
+    viewState: Monaco.editor.ICodeEditorViewState | null,
+  ) => {
+    this.patch(id, { content, viewState });
+  };
+
+  markSaved = (id: EditorTabId, newBaseline: string) => {
+    this.patch(id, { baselineContent: newBaseline, savingState: "idle", saveError: null });
+  };
+
+  setWordWrap = (id: EditorTabId, value: boolean) => {
+    this.patch(id, { wordWrap: value });
+  };
+
+  setLanguage = (id: EditorTabId, languageId: string) => {
+    this.patch(id, { languageId });
+  };
+
+  setSavingState = (id: EditorTabId, state: EditorSavingState, error: string | null = null) => {
+    const patch: Partial<EditorTab> = { savingState: state };
+    if (state === "idle") patch.saveError = null;
+    else if (state === "error") patch.saveError = error;
+    this.patch(id, patch);
+  };
+
+  close = (id: EditorTabId) => {
+    const next = this.tabs.filter((t) => t.id !== id);
+    if (next.length !== this.tabs.length) {
+      this.tabs = next;
+      this.notify();
+    }
+  };
+
+  /**
+   * Force-close every tab bound to any of the given sessionIds, with no dirty
+   * prompt. Intended for cases where the owning SFTP instance has gone away
+   * entirely (e.g. the hosting terminal tab was closed) and there is no
+   * realistic save channel anyway. Returns the closed tab ids.
+   */
+  forceCloseBySessions = (sessionIds: readonly string[]): EditorTabId[] => {
+    if (sessionIds.length === 0) return [];
+    const idSet = new Set(sessionIds);
+    const removed = this.tabs.filter((t) => idSet.has(t.sessionId)).map((t) => t.id);
+    if (removed.length === 0) return [];
+    this.tabs = this.tabs.filter((t) => !idSet.has(t.sessionId));
+    this.notify();
+
+    // If the current active tab was one of the editor tabs we just removed,
+    // fall back to 'vault' so the user doesn't end up on a stale id (empty
+    // chrome + no content). Any better neighbor choice would need the full
+    // orderedTabs list, which isn't available here; 'vault' is always valid.
+    const activeId = activeTabStore.getActiveTabId();
+    if (isEditorTabId(activeId)) {
+      const activeEditorId = fromEditorTabId(activeId);
+      if (activeEditorId && removed.includes(activeEditorId)) {
+        activeTabStore.setActiveTabId('vault');
+      }
+    }
+
+    return removed;
+  };
+
+  promoteFromModal = (snapshot: {
+    sessionId: string;
+    hostId: string;
+    remotePath: string;
+    fileName: string;
+    languageId: string;
+    content: string;
+    baselineContent: string;
+    wordWrap: boolean;
+    viewState: Monaco.editor.ICodeEditorViewState | null;
+  }): EditorTabId => {
+    const normalized = normalizePath(snapshot.remotePath);
+    const existing = this.tabs.find(
+      (t) => t.sessionId === snapshot.sessionId && normalizePath(t.remotePath) === normalized,
+    );
+    if (existing) {
+      this.patch(existing.id, {
+        content: snapshot.content,
+        baselineContent: snapshot.baselineContent,
+        wordWrap: snapshot.wordWrap,
+        viewState: snapshot.viewState,
+        // keep languageId/hostId/fileName stable; they shouldn't change for the same path
+      });
+      return existing.id;
+    }
+    const tab: EditorTab = {
+      id: this.makeId(),
+      kind: "editor",
+      sessionId: snapshot.sessionId,
+      hostId: snapshot.hostId,
+      remotePath: snapshot.remotePath,
+      fileName: snapshot.fileName,
+      languageId: snapshot.languageId,
+      content: snapshot.content,
+      baselineContent: snapshot.baselineContent,
+      wordWrap: snapshot.wordWrap,
+      viewState: snapshot.viewState,
+      savingState: "idle",
+      saveError: null,
+    };
+    this.tabs = [...this.tabs, tab];
+    this.notify();
+    return tab.id;
+  };
+
+  /**
+   * Walk all editor tabs bound to `sessionId`. Clean tabs close silently; dirty tabs
+   * prompt via `promptChoice`. 'save' invokes `saveTab` and closes only on its success.
+   * Any 'cancel' aborts the batch (subsequent dirty tabs are preserved) and returns false.
+   */
+  confirmCloseBySession = async (
+    sessionId: string,
+    promptChoice: (tab: EditorTab) => Promise<"save" | "discard" | "cancel">,
+    saveTab?: (tabId: EditorTabId) => Promise<void>,
+    onCloseTab?: (tabId: EditorTabId) => void,
+  ): Promise<boolean> => {
+    const matching = this.tabs.filter((t) => t.sessionId === sessionId);
+    for (const tab of matching) {
+      const dirty = tab.content !== tab.baselineContent;
+      if (!dirty) {
+        onCloseTab?.(tab.id);
+        this.close(tab.id);
+        continue;
+      }
+      const choice = await promptChoice(tab);
+      if (choice === "cancel") return false;
+      if (choice === "discard") {
+        onCloseTab?.(tab.id);
+        this.close(tab.id);
+        continue;
+      }
+      if (choice === "save") {
+        if (!saveTab) throw new Error("saveTab callback required when 'save' choice is possible");
+        try {
+          await saveTab(tab.id);
+        } catch {
+          // Save failed — treat like cancel (keep tab open, abort batch so the user sees the error)
+          return false;
+        }
+        onCloseTab?.(tab.id);
+        this.close(tab.id);
+      }
+    }
+    return true;
+  };
+
+  subscribe = (listener: Listener): (() => void) => {
+    this.listeners.add(listener);
+    return () => { this.listeners.delete(listener); };
+  };
+
+  /** TEST-ONLY: seed a tab without going through promote/openOrFocus. */
+  _debugInsert = (tab: EditorTab) => {
+    this.tabs = [...this.tabs, tab];
+    this.notify();
+  };
+
+  protected makeId = genId;
+
+  protected patch = (id: EditorTabId, patch: Partial<EditorTab>) => {
+    let changed = false;
+    this.tabs = this.tabs.map((t) => {
+      if (t.id !== id) return t;
+      changed = true;
+      return { ...t, ...patch };
+    });
+    if (changed) this.notify();
+  };
+
+  protected notify = () => {
+    if (this.pendingNotify) return;
+    this.pendingNotify = true;
+    Promise.resolve().then(() => {
+      this.pendingNotify = false;
+      this.listeners.forEach((l) => l());
+    });
+  };
+}
+
+export const editorTabStore = new EditorTabStore();
+
+// Hooks
+const getTabsSnapshot = () => editorTabStore.getTabs();
+
+export const useEditorTabs = (): readonly EditorTab[] =>
+  useSyncExternalStore(editorTabStore.subscribe, getTabsSnapshot);
+
+export const useEditorTab = (id: EditorTabId): EditorTab | undefined => {
+  const getSnapshot = useCallback(() => editorTabStore.getTab(id), [id]);
+  return useSyncExternalStore(editorTabStore.subscribe, getSnapshot);
+};

application/state/fontStore.ts

@@ -1,6 +1,7 @@
 import { useSyncExternalStore } from 'react';
 import { TERMINAL_FONTS, type TerminalFont } from '../../infrastructure/config/fonts';
-import { getMonospaceFonts } from '../../lib/localFonts';
+import { getAllSystemFontFamilies, getMonospaceFonts } from '../../lib/localFonts';
+import { setSystemFamilies } from '../../lib/fontAvailability';
 
 /**
  * Global font store - singleton pattern using useSyncExternalStore
@@ -60,7 +61,14 @@ class FontStore {
     this.setState({ isLoading: true, error: null });
 
     try {
-      const localFonts = await getMonospaceFonts();
+      // Populate the authoritative installed-family set used by
+      // fontAvailability.isFontInstalled. Runs in parallel with the
+      // monospace-only query (both share an underlying cache).
+      const [localFonts, systemFamilies] = await Promise.all([
+        getMonospaceFonts(),
+        getAllSystemFontFamilies(),
+      ]);
+      setSystemFamilies(systemFamilies);
       
       // Combine default fonts with local fonts, deduplicate by id
       const fontMap = new Map<string, TerminalFont>();

application/state/resolveCloseIntent.test.ts

@@ -0,0 +1,110 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import { resolveCloseIntent } from "./resolveCloseIntent.ts";
+
+const baseWorkspace = {
+  id: "w1",
+  focusedSessionId: "s1",
+};
+
+const baseSession = { id: "s1" };
+
+test("non-workspace tab → closeSingleTab with session id", () => {
+  const result = resolveCloseIntent({
+    activeTabId: "s1",
+    workspace: null,
+    sessionForTab: baseSession,
+    activeSidePanelTab: null,
+    focusIsInsideTerminal: true,
+  });
+  assert.deepEqual(result, { kind: "closeSingleTab", sessionId: "s1" });
+});
+
+test("non-workspace session tab + sidebar open → closeSidePanel (sidebar beats session close)", () => {
+  const r = resolveCloseIntent({
+    activeTabId: "s1",
+    workspace: null,
+    sessionForTab: { id: "s1" },
+    activeSidePanelTab: "ai",
+    focusIsInsideTerminal: true, // focus IS in terminal, but sidebar wins
+  });
+  assert.deepEqual(r, { kind: "closeSidePanel" });
+});
+
+test("vault/sftp tab → noop", () => {
+  const r = resolveCloseIntent({
+    activeTabId: "vault",
+    workspace: null,
+    sessionForTab: null,
+    activeSidePanelTab: null,
+    focusIsInsideTerminal: false,
+  });
+  assert.deepEqual(r, { kind: "noop" });
+});
+
+test("workspace + focus in terminal + sidebar open → closeSidePanel wins (sidebar beats focus)", () => {
+  const r = resolveCloseIntent({
+    activeTabId: "w1",
+    workspace: baseWorkspace,
+    sessionForTab: null,
+    activeSidePanelTab: "ai",
+    focusIsInsideTerminal: true,
+  });
+  assert.deepEqual(r, { kind: "closeSidePanel" });
+});
+
+test("workspace + focus NOT in terminal + sidebar open → closeSidePanel", () => {
+  const r = resolveCloseIntent({
+    activeTabId: "w1",
+    workspace: baseWorkspace,
+    sessionForTab: null,
+    activeSidePanelTab: "sftp",
+    focusIsInsideTerminal: false,
+  });
+  assert.deepEqual(r, { kind: "closeSidePanel" });
+});
+
+test("workspace + sidebar closed + focus in terminal → closeTerminal", () => {
+  const r = resolveCloseIntent({
+    activeTabId: "w1",
+    workspace: baseWorkspace,
+    sessionForTab: null,
+    activeSidePanelTab: null,
+    focusIsInsideTerminal: true,
+  });
+  assert.deepEqual(r, { kind: "closeTerminal", sessionId: "s1" });
+});
+
+test("workspace + sidebar closed + focus NOT in terminal → closeWorkspace", () => {
+  const r = resolveCloseIntent({
+    activeTabId: "w1",
+    workspace: baseWorkspace,
+    sessionForTab: null,
+    activeSidePanelTab: null,
+    focusIsInsideTerminal: false,
+  });
+  assert.deepEqual(r, { kind: "closeWorkspace", workspaceId: "w1" });
+});
+
+test("workspace with no focused session + sidebar closed → closeWorkspace", () => {
+  const r = resolveCloseIntent({
+    activeTabId: "w1",
+    workspace: { id: "w1", focusedSessionId: undefined },
+    sessionForTab: null,
+    activeSidePanelTab: null,
+    focusIsInsideTerminal: true, // even if flag true, no focused id → cannot closeTerminal
+  });
+  assert.deepEqual(r, { kind: "closeWorkspace", workspaceId: "w1" });
+});
+
+test("workspace with no focused session + sidebar open → closeSidePanel", () => {
+  const r = resolveCloseIntent({
+    activeTabId: "w1",
+    workspace: { id: "w1", focusedSessionId: undefined },
+    sessionForTab: null,
+    activeSidePanelTab: "ai",
+    focusIsInsideTerminal: false,
+  });
+  assert.deepEqual(r, { kind: "closeSidePanel" });
+});

application/state/resolveCloseIntent.ts

@@ -0,0 +1,43 @@
+export type CloseIntent =
+  | { kind: 'closeTerminal'; sessionId: string }
+  | { kind: 'closeSidePanel' }
+  | { kind: 'closeWorkspace'; workspaceId: string }
+  | { kind: 'closeSingleTab'; sessionId: string }
+  | { kind: 'noop' };
+
+export interface ResolveCloseInput {
+  activeTabId: string | null;
+  workspace: { id: string; focusedSessionId?: string } | null;
+  sessionForTab: { id: string } | null;
+  activeSidePanelTab: string | null;
+  focusIsInsideTerminal: boolean;
+}
+
+export function resolveCloseIntent(input: ResolveCloseInput): CloseIntent {
+  const { activeTabId, workspace, sessionForTab, activeSidePanelTab, focusIsInsideTerminal } = input;
+
+  if (!activeTabId) return { kind: 'noop' };
+
+  // Sidebar always wins — applies to any tab type (workspace, single-session, etc.).
+  // Modals take priority over this but are intercepted upstream in App.tsx before the
+  // hotkey reaches resolveCloseIntent.
+  if (activeSidePanelTab !== null) {
+    return { kind: 'closeSidePanel' };
+  }
+
+  if (sessionForTab && !workspace) {
+    return { kind: 'closeSingleTab', sessionId: sessionForTab.id };
+  }
+
+  if (!workspace) {
+    // e.g. 'vault', 'sftp', or any non-closable pinned tab
+    return { kind: 'noop' };
+  }
+
+  const focusedSessionId = workspace.focusedSessionId;
+  if (focusedSessionId && focusIsInsideTerminal) {
+    return { kind: 'closeTerminal', sessionId: focusedSessionId };
+  }
+
+  return { kind: 'closeWorkspace', workspaceId: workspace.id };
+}

application/state/resolveSnippetsShortcutIntent.test.ts

@@ -0,0 +1,64 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import {
+  resolveScriptsSidePanelShortcutIntent,
+  resolveSnippetsShortcutIntent,
+} from "./resolveSnippetsShortcutIntent.ts";
+
+test("active single terminal tab toggles the terminal scripts panel", () => {
+  const result = resolveSnippetsShortcutIntent({
+    activeTabId: "s1",
+    sessionForTab: { id: "s1" },
+    workspaceForTab: null,
+  });
+
+  assert.deepEqual(result, { kind: "toggleTerminalScripts" });
+});
+
+test("active workspace tab toggles the terminal scripts panel", () => {
+  const result = resolveSnippetsShortcutIntent({
+    activeTabId: "w1",
+    sessionForTab: null,
+    workspaceForTab: { id: "w1" },
+  });
+
+  assert.deepEqual(result, { kind: "toggleTerminalScripts" });
+});
+
+test("non-terminal tabs navigate to the vault snippets section", () => {
+  for (const activeTabId of ["vault", "sftp", "editor:notes", "log1", null]) {
+    const result = resolveSnippetsShortcutIntent({
+      activeTabId,
+      sessionForTab: null,
+      workspaceForTab: null,
+    });
+
+    assert.deepEqual(result, { kind: "openVaultSnippets" });
+  }
+});
+
+test("terminal tabs fall back to vault snippets when terminal toggle is unavailable", () => {
+  const result = resolveSnippetsShortcutIntent({
+    activeTabId: "s1",
+    sessionForTab: { id: "s1" },
+    workspaceForTab: null,
+    terminalScriptsToggleAvailable: false,
+  });
+
+  assert.deepEqual(result, { kind: "openVaultSnippets" });
+});
+
+test("scripts panel shortcut closes when scripts is already open", () => {
+  const result = resolveScriptsSidePanelShortcutIntent("scripts");
+
+  assert.deepEqual(result, { kind: "closeTerminalSidePanel" });
+});
+
+test("scripts panel shortcut opens scripts from closed or other panel states", () => {
+  for (const activePanel of [null, "sftp", "theme", "ai"]) {
+    const result = resolveScriptsSidePanelShortcutIntent(activePanel);
+
+    assert.deepEqual(result, { kind: "openTerminalScripts" });
+  }
+});

application/state/resolveSnippetsShortcutIntent.ts

@@ -0,0 +1,42 @@
+export type SnippetsShortcutIntent =
+  | { kind: 'toggleTerminalScripts' }
+  | { kind: 'openVaultSnippets' };
+
+export type ScriptsSidePanelShortcutIntent =
+  | { kind: 'closeTerminalSidePanel' }
+  | { kind: 'openTerminalScripts' };
+
+export interface ResolveSnippetsShortcutIntentInput {
+  activeTabId: string | null;
+  sessionForTab: { id: string } | null;
+  workspaceForTab: { id: string } | null;
+  terminalScriptsToggleAvailable?: boolean;
+}
+
+export function resolveSnippetsShortcutIntent(
+  input: ResolveSnippetsShortcutIntentInput,
+): SnippetsShortcutIntent {
+  const {
+    activeTabId,
+    sessionForTab,
+    workspaceForTab,
+    terminalScriptsToggleAvailable = true,
+  } = input;
+  if (!activeTabId) return { kind: 'openVaultSnippets' };
+
+  if ((sessionForTab || workspaceForTab) && terminalScriptsToggleAvailable) {
+    return { kind: 'toggleTerminalScripts' };
+  }
+
+  return { kind: 'openVaultSnippets' };
+}
+
+export function resolveScriptsSidePanelShortcutIntent(
+  activePanel: string | null,
+): ScriptsSidePanelShortcutIntent {
+  if (activePanel === 'scripts') {
+    return { kind: 'closeTerminalSidePanel' };
+  }
+
+  return { kind: 'openTerminalScripts' };
+}

application/state/resolveTerminalSessionExitIntent.test.ts

@@ -0,0 +1,18 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import { resolveTerminalSessionExitIntent } from "./resolveTerminalSessionExitIntent.ts";
+
+test("backend exited events keep the tab and mark it disconnected", () => {
+  assert.deepEqual(
+    resolveTerminalSessionExitIntent({ reason: "exited", exitCode: 0 }),
+    { kind: "markDisconnected" },
+  );
+});
+
+test("backend timeout events keep the tab and mark it disconnected", () => {
+  assert.deepEqual(
+    resolveTerminalSessionExitIntent({ reason: "timeout", error: "idle timeout" }),
+    { kind: "markDisconnected" },
+  );
+});

application/state/resolveTerminalSessionExitIntent.ts

@@ -0,0 +1,17 @@
+export type TerminalSessionExitEvent = {
+  exitCode?: number;
+  signal?: number;
+  error?: string;
+  reason?: "exited" | "error" | "timeout" | "closed";
+};
+
+export type TerminalSessionExitIntent =
+  | { kind: "markDisconnected" };
+
+export function resolveTerminalSessionExitIntent(
+  _evt: TerminalSessionExitEvent,
+): TerminalSessionExitIntent {
+  // Backend exits can be remote idle timeouts, shell termination, or transport closes.
+  // Explicit user closes bypass this policy and call the close-session path directly.
+  return { kind: "markDisconnected" };
+}

application/state/sftp/bookmarkHelpers.ts

@@ -0,0 +1,23 @@
+import type { SftpBookmark } from "../../../domain/models";
+
+const ROOT_PATH_RE = /^[A-Za-z]:[\\/]?$/;
+
+export function getSftpBookmarkLabel(path: string): string {
+  const trimmed = path.trim();
+  if (trimmed === "/" || ROOT_PATH_RE.test(trimmed)) return trimmed;
+  return trimmed.split(/[\\/]/).filter(Boolean).pop() || trimmed;
+}
+
+export function createSftpBookmark(
+  path: string,
+  options: { global?: boolean; idPrefix?: string } = {},
+): SftpBookmark {
+  const global = options.global === true;
+  const idPrefix = options.idPrefix ?? (global ? "gbm" : "bm");
+  return {
+    id: `${idPrefix}-${Date.now()}-${Math.random().toString(36).slice(2, 6)}`,
+    path,
+    label: getSftpBookmarkLabel(path),
+    ...(global ? { global: true } : {}),
+  };
+}

application/state/sftp/globalSftpBookmarks.ts

@@ -0,0 +1,45 @@
+import type { SftpBookmark } from "../../../domain/models";
+import { STORAGE_KEY_SFTP_GLOBAL_BOOKMARKS } from "../../../infrastructure/config/storageKeys";
+import { localStorageAdapter } from "../../../infrastructure/persistence/localStorageAdapter";
+
+type Listener = () => void;
+
+const listeners = new Set<Listener>();
+
+let snapshot: SftpBookmark[] =
+  localStorageAdapter.read<SftpBookmark[]>(STORAGE_KEY_SFTP_GLOBAL_BOOKMARKS) ?? [];
+
+export function subscribeGlobalSftpBookmarks(listener: Listener) {
+  listeners.add(listener);
+  return () => {
+    listeners.delete(listener);
+  };
+}
+
+export function getGlobalSftpBookmarksSnapshot() {
+  return snapshot;
+}
+
+export function rehydrateGlobalSftpBookmarks() {
+  snapshot = localStorageAdapter.read<SftpBookmark[]>(STORAGE_KEY_SFTP_GLOBAL_BOOKMARKS) ?? [];
+  for (const listener of listeners) listener();
+}
+
+export function setGlobalSftpBookmarks(
+  next: SftpBookmark[] | ((prev: SftpBookmark[]) => SftpBookmark[]),
+) {
+  snapshot = typeof next === "function" ? next(snapshot) : next;
+  localStorageAdapter.write(STORAGE_KEY_SFTP_GLOBAL_BOOKMARKS, snapshot);
+  for (const listener of listeners) listener();
+  if (typeof window !== "undefined") {
+    window.dispatchEvent(new CustomEvent("sftp-bookmarks-changed"));
+  }
+}
+
+if (typeof window !== "undefined") {
+  window.addEventListener("storage", (event) => {
+    if (event.key === STORAGE_KEY_SFTP_GLOBAL_BOOKMARKS) {
+      rehydrateGlobalSftpBookmarks();
+    }
+  });
+}

application/state/sftp/types.ts

@@ -64,4 +64,10 @@ export interface SftpStateOptions {
   useCompressedUpload?: boolean;
   defaultShowHiddenFiles?: boolean;
   autoConnectLocalOnMount?: boolean;
+  /**
+   * Global SSH keepalive settings, forwarded through to per-SFTP-connection
+   * keepalive resolution so a host that has opted into its own override
+   * is honored for SFTP browsing too (not just the terminal session).
+   */
+  terminalSettings?: { keepaliveInterval: number; keepaliveCountMax: number };
 }

application/state/sftp/useSftpConnections.ts

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef } from "react";
+import React, { useCallback, useEffect, useRef } from "react";
 import type { MutableRefObject } from "react";
 import { netcattyBridge } from "../../../infrastructure/services/netcattyBridge";
 import type { Host, Identity, SftpConnection, SftpFileEntry, SftpFilenameEncoding, SSHKey } from "../../../domain/models";
@@ -11,6 +11,7 @@ interface UseSftpConnectionsParams {
   hosts: Host[];
   keys: SSHKey[];
   identities: Identity[];
+  terminalSettings?: { keepaliveInterval: number; keepaliveCountMax: number };
   leftTabsRef: MutableRefObject<{ tabs: SftpPane[]; activeTabId: string | null }>;
   rightTabsRef: MutableRefObject<{ tabs: SftpPane[]; activeTabId: string | null }>;
   leftTabs: { tabs: SftpPane[] };
@@ -44,6 +45,7 @@ export const useSftpConnections = ({
   hosts,
   keys,
   identities,
+  terminalSettings,
   leftTabsRef,
   rightTabsRef,
   leftTabs,
@@ -65,7 +67,7 @@ export const useSftpConnections = ({
   createEmptyPane,
   autoConnectLocalOnMount = true,
 }: UseSftpConnectionsParams): UseSftpConnectionsResult => {
-  const getHostCredentials = useSftpHostCredentials({ hosts, keys, identities });
+  const getHostCredentials = useSftpHostCredentials({ hosts, keys, identities, terminalSettings });
   const { listLocalFiles, listRemoteFiles } = useSftpDirectoryListing();
 
   const connect = useCallback(
@@ -281,7 +283,7 @@ export const useSftpConnections = ({
             );
           };
 
-          const hasKey = !!credentials.privateKey;
+          const hasKey = !!credentials.privateKey || !!credentials.identityFilePaths?.length;
           const hasPassword = !!credentials.password;
 
           let sftpId: string | undefined;
@@ -305,6 +307,7 @@ export const useSftpConnections = ({
                   publicKey: undefined,
                   keyId: undefined,
                   keySource: undefined,
+                  identityFilePaths: undefined,
                 });
               } else {
                 throw err;

application/state/sftp/useSftpExternalOperations.ts

@@ -1,5 +1,5 @@
-import React, { useCallback, useRef, useMemo } from "react";
-import { TransferTask, TransferStatus } from "../../../domain/models";
+import React, { useCallback, useRef, useMemo, useState } from "react";
+import { FileConflict, FileConflictAction, TransferTask, TransferStatus, SftpFilenameEncoding } from "../../../domain/models";
 import { netcattyBridge } from "../../../infrastructure/services/netcattyBridge";
 import { logger } from "../../../lib/logger";
 import { SftpPane } from "./types";
@@ -7,11 +7,13 @@ import { joinPath } from "./utils";
 import {
   UploadController,
   uploadFromDataTransfer,
+  uploadFromFileList,
   uploadEntriesDirect,
   UploadBridge,
   UploadCallbacks,
   UploadResult,
   UploadTaskInfo,
+  startUploadScanningTask,
 } from "../../../lib/uploadService";
 import type { DropEntry } from "../../../lib/sftpFileUtils";
 
@@ -20,6 +22,7 @@ export type { UploadResult };
 
 interface UseSftpExternalOperationsParams {
   getActivePane: (side: "left" | "right") => SftpPane | null;
+  getPaneByConnectionId: (connectionId: string) => SftpPane | null;
   refresh: (side: "left" | "right", options?: { tabId?: string }) => Promise<void>;
   sftpSessionsRef: React.MutableRefObject<Map<string, string>>;
   connectionCacheKeyMapRef: React.MutableRefObject<Map<string, string>>;
@@ -35,6 +38,13 @@ interface SftpExternalOperationsResult {
   readTextFile: (side: "left" | "right", filePath: string) => Promise<string>;
   readBinaryFile: (side: "left" | "right", filePath: string) => Promise<ArrayBuffer>;
   writeTextFile: (side: "left" | "right", filePath: string, content: string) => Promise<void>;
+  writeTextFileByConnection: (
+    connectionId: string,
+    expectedHostId: string,
+    filePath: string,
+    content: string,
+    filenameEncoding?: SftpFilenameEncoding,
+  ) => Promise<void>;
   downloadToTempAndOpen: (
     side: "left" | "right",
     remotePath: string,
@@ -48,6 +58,16 @@ interface SftpExternalOperationsResult {
     dataTransfer: DataTransfer,
     targetPath?: string
   ) => Promise<UploadResult[]>;
+  uploadExternalFileList: (
+    side: "left" | "right",
+    fileList: FileList | File[],
+    targetPath?: string
+  ) => Promise<UploadResult[]>;
+  uploadExternalFolderPath: (
+    side: "left" | "right",
+    folderPath: string,
+    targetPath?: string
+  ) => Promise<UploadResult[]>;
   uploadExternalEntries: (
     side: "left" | "right",
     entries: DropEntry[],
@@ -55,6 +75,8 @@ interface SftpExternalOperationsResult {
   ) => Promise<UploadResult[]>;
   cancelExternalUpload: () => Promise<void>;
   selectApplication: () => Promise<{ path: string; name: string } | null>;
+  uploadConflicts: FileConflict[];
+  resolveUploadConflict: (conflictId: string, action: FileConflictAction, applyToAll?: boolean) => void;
 }
 
 export const useSftpExternalOperations = (
@@ -62,6 +84,7 @@ export const useSftpExternalOperations = (
 ): SftpExternalOperationsResult => {
   const {
     getActivePane,
+    getPaneByConnectionId,
     refresh,
     sftpSessionsRef,
     connectionCacheKeyMapRef,
@@ -79,6 +102,11 @@ export const useSftpExternalOperations = (
   // Track active file watches so the side panel can block host-switching.
   // Reset to 0 when the SFTP session disconnects (handled in SftpSidePanel).
   const activeFileWatchCountRef = useRef(0);
+  const [uploadConflicts, setUploadConflicts] = useState<FileConflict[]>([]);
+  const uploadConflictResolversRef = useRef(new Map<string, {
+    resolve: (action: FileConflictAction) => void;
+    setDefault: (action: FileConflictAction) => void;
+  }>());
 
   const readTextFile = useCallback(
     async (side: "left" | "right", filePath: string): Promise<string> => {
@@ -173,6 +201,41 @@ export const useSftpExternalOperations = (
     [getActivePane, sftpSessionsRef],
   );
 
+  const writeTextFileByConnection = useCallback(
+    async (
+      connectionId: string,
+      expectedHostId: string,
+      filePath: string,
+      content: string,
+      filenameEncoding?: SftpFilenameEncoding,
+    ): Promise<void> => {
+      const pane = getPaneByConnectionId(connectionId);
+      if (!pane?.connection) {
+        throw new Error("SFTP connection is no longer available");
+      }
+      if (pane.connection.hostId !== expectedHostId) {
+        throw new Error("SFTP connection changed while editing — file not saved to prevent writing to wrong host");
+      }
+
+      if (pane.connection.isLocal) {
+        const bridge = netcattyBridge.get();
+        if (!bridge?.writeLocalFile) throw new Error("Local file writing not supported");
+        const data = new TextEncoder().encode(content);
+        await bridge.writeLocalFile(filePath, data.buffer);
+        return;
+      }
+
+      const sftpId = sftpSessionsRef.current.get(pane.connection.id);
+      if (!sftpId) throw new Error("SFTP session not found");
+
+      const bridge = netcattyBridge.get();
+      if (!bridge) throw new Error("Bridge not available");
+
+      await bridge.writeSftp(sftpId, filePath, content, filenameEncoding ?? pane.filenameEncoding);
+    },
+    [getPaneByConnectionId, sftpSessionsRef],
+  );
+
   const downloadToTempAndOpen = useCallback(
     async (
       side: "left" | "right",
@@ -452,18 +515,99 @@ export const useSftpExternalOperations = (
     };
   }, [addExternalUpload, updateExternalUpload, dismissExternalUpload]);
 
+  const resolveUploadConflict = useCallback((conflictId: string, action: FileConflictAction, applyToAll = false) => {
+    const conflict = uploadConflicts.find((item) => item.transferId === conflictId);
+    setUploadConflicts((prev) => prev.filter((item) => item.transferId !== conflictId));
+    const resolver = uploadConflictResolversRef.current.get(conflictId);
+    if (!resolver) return;
+    uploadConflictResolversRef.current.delete(conflictId);
+    if (conflict && applyToAll) {
+      resolver.setDefault(action);
+    }
+    resolver.resolve(action);
+  }, [uploadConflicts]);
+
+  const cancelPendingUploadConflicts = useCallback(() => {
+    const resolvers = Array.from(uploadConflictResolversRef.current.values());
+    if (resolvers.length === 0) return;
+
+    uploadConflictResolversRef.current.clear();
+    setUploadConflicts([]);
+    for (const resolver of resolvers) {
+      resolver.resolve("stop");
+    }
+  }, []);
+
+  const createUploadConflictResolver = useCallback(() => {
+    const conflictDefaults = new Map<string, FileConflictAction>();
+
+    return async (conflict: {
+      fileName: string;
+      targetPath: string;
+      isDirectory: boolean;
+      existingType?: 'file' | 'directory' | 'symlink';
+      existingSize: number;
+      newSize: number;
+      existingModified: number;
+      newModified: number;
+      applyToAllCount: number;
+    }): Promise<FileConflictAction> => {
+      const conflictType = conflict.isDirectory ? "directory" : "file";
+      const defaultAction = conflictDefaults.get(conflictType);
+      if (defaultAction) return defaultAction;
+
+      const conflictId = `upload-conflict-${crypto.randomUUID()}`;
+      const fileConflict: FileConflict = {
+        transferId: conflictId,
+        fileName: conflict.fileName,
+        sourcePath: "local",
+        targetPath: conflict.targetPath,
+        isDirectory: conflict.isDirectory,
+        existingType: conflict.existingType,
+        applyToAllCount: conflict.applyToAllCount,
+        existingSize: conflict.existingSize,
+        newSize: conflict.newSize,
+        existingModified: conflict.existingModified,
+        newModified: conflict.newModified,
+      };
+
+      setUploadConflicts((prev) => [...prev, fileConflict]);
+      return new Promise<FileConflictAction>((resolve) => {
+        uploadConflictResolversRef.current.set(conflictId, {
+          resolve,
+          setDefault: (action) => {
+            conflictDefaults.set(conflictType, action);
+          },
+        });
+      });
+    };
+  }, []);
+
   // Create upload bridge that wraps netcattyBridge
   const createUploadBridge = useMemo((): UploadBridge => {
     const bridge = netcattyBridge.get();
     return {
       writeLocalFile: bridge?.writeLocalFile,
       mkdirLocal: bridge?.mkdirLocal,
+      statLocal: bridge?.statLocal,
+      deleteLocalFile: bridge?.deleteLocalFile,
       mkdirSftp: async (sftpId: string, path: string) => {
         const b = netcattyBridge.get();
         if (b?.mkdirSftp) {
           await b.mkdirSftp(sftpId, path);
         }
       },
+      statSftp: async (sftpId: string, path: string) => {
+        const b = netcattyBridge.get();
+        if (!b?.statSftp) return null;
+        return b.statSftp(sftpId, path);
+      },
+      deleteSftp: async (sftpId: string, path: string) => {
+        const b = netcattyBridge.get();
+        if (b?.deleteSftp) {
+          await b.deleteSftp(sftpId, path);
+        }
+      },
       writeSftpBinary: bridge?.writeSftpBinary,
       // Wrap writeSftpBinaryWithProgress to adapt UploadBridge interface to NetcattyBridge interface
       // UploadBridge: (sftpId, path, data, taskId, onProgress, onComplete, onError)
@@ -552,6 +696,7 @@ export const useSftpExternalOperations = (
             joinPath,
             callbacks,
             useCompressedUpload,
+            resolveConflict: createUploadConflictResolver(),
           },
           controller
         );
@@ -580,6 +725,217 @@ export const useSftpExternalOperations = (
       sftpSessionsRef,
       createUploadCallbacks,
       createUploadBridge,
+      createUploadConflictResolver,
+      useCompressedUpload,
+    ],
+  );
+
+  // Upload from a FileList. This keeps the original File objects from the file
+  // picker so Electron can resolve local file paths for stream uploads.
+  const uploadExternalFileList = useCallback(
+    async (
+      side: "left" | "right",
+      fileList: FileList | File[],
+      targetPath?: string,
+    ): Promise<UploadResult[]> => {
+      const pane = getActivePane(side);
+      if (!pane?.connection) {
+        throw new Error("No active connection");
+      }
+
+      const bridge = netcattyBridge.get();
+      if (!bridge) {
+        throw new Error("Bridge not available");
+      }
+
+      const sftpId = pane.connection.isLocal
+        ? null
+        : sftpSessionsRef.current.get(pane.connection.id) || null;
+
+      if (!pane.connection.isLocal && !sftpId) {
+        throw new Error("SFTP session not found");
+      }
+
+      const uploadPaneId = pane.id;
+      const uploadTargetPath = targetPath || pane.connection.currentPath;
+      const controller = new UploadController();
+      uploadControllerRef.current = controller;
+
+      const callbacks = createUploadCallbacks(
+        pane.connection.id,
+        uploadTargetPath,
+        pane.connection.isLocal ? undefined : pane.connection.hostId,
+        pane.connection.isLocal ? undefined : connectionCacheKeyMapRef.current.get(pane.connection.id),
+      );
+
+      try {
+        const results = await uploadFromFileList(
+          fileList,
+          {
+            targetPath: uploadTargetPath,
+            sftpId,
+            isLocal: pane.connection.isLocal,
+            bridge: createUploadBridge,
+            joinPath,
+            callbacks,
+            useCompressedUpload,
+            resolveConflict: createUploadConflictResolver(),
+          },
+          controller,
+        );
+
+        if (clearDirCacheEntry && targetPath) {
+          clearDirCacheEntry(pane.connection.id, uploadTargetPath);
+        }
+        if (uploadTargetPath === pane.connection.currentPath) {
+          await refresh(side, { tabId: uploadPaneId });
+        }
+        return results;
+      } catch (error) {
+        logger.error("[SFTP] File picker upload failed:", error);
+        throw error;
+      } finally {
+        uploadControllerRef.current = null;
+      }
+    },
+    [
+      clearDirCacheEntry,
+      connectionCacheKeyMapRef,
+      getActivePane,
+      refresh,
+      sftpSessionsRef,
+      createUploadCallbacks,
+      createUploadBridge,
+      createUploadConflictResolver,
+      useCompressedUpload,
+    ],
+  );
+
+  const uploadExternalFolderPath = useCallback(
+    async (
+      side: "left" | "right",
+      folderPath: string,
+      targetPath?: string,
+    ): Promise<UploadResult[]> => {
+      const pane = getActivePane(side);
+      if (!pane?.connection) {
+        throw new Error("No active connection");
+      }
+
+      const bridge = netcattyBridge.get();
+      if (!bridge) {
+        throw new Error("Bridge not available");
+      }
+      if (!bridge.listLocalTree) {
+        throw new Error("Folder upload not supported");
+      }
+
+      const sftpId = pane.connection.isLocal
+        ? null
+        : sftpSessionsRef.current.get(pane.connection.id) || null;
+
+      if (!pane.connection.isLocal && !sftpId) {
+        throw new Error("SFTP session not found");
+      }
+
+      const uploadPaneId = pane.id;
+      const uploadTargetPath = targetPath || pane.connection.currentPath;
+      const controller = new UploadController();
+      uploadControllerRef.current = controller;
+
+      const callbacks = createUploadCallbacks(
+        pane.connection.id,
+        uploadTargetPath,
+        pane.connection.isLocal ? undefined : pane.connection.hostId,
+        pane.connection.isLocal ? undefined : connectionCacheKeyMapRef.current.get(pane.connection.id),
+      );
+
+      const scanningTask = startUploadScanningTask(callbacks);
+
+      try {
+        const localEntries = await bridge.listLocalTree(folderPath);
+        if (controller.isCancelled()) {
+          scanningTask.cancel();
+          return [{ fileName: "", success: false, cancelled: true }];
+        }
+        scanningTask.complete();
+
+        const entries: DropEntry[] = localEntries.map((entry) => {
+          if (entry.type === "directory") {
+            return {
+              file: null,
+              relativePath: entry.relativePath,
+              isDirectory: true,
+            };
+          }
+
+          const file = {
+            name: entry.relativePath.split("/").pop() || entry.relativePath,
+            size: entry.size,
+            lastModified: entry.lastModified,
+            type: "",
+            path: entry.localPath,
+            arrayBuffer: async () => {
+              const currentBridge = netcattyBridge.get();
+              if (!currentBridge?.readLocalFile) {
+                throw new Error("Local file reading not supported");
+              }
+              return currentBridge.readLocalFile(entry.localPath);
+            },
+          } as File & { path?: string };
+
+          return {
+            file,
+            relativePath: entry.relativePath,
+            isDirectory: false,
+          };
+        });
+
+        const results = await uploadEntriesDirect(
+          entries,
+          {
+            targetPath: uploadTargetPath,
+            sftpId,
+            isLocal: pane.connection.isLocal,
+            bridge: createUploadBridge,
+            joinPath,
+            callbacks,
+            useCompressedUpload,
+            resolveConflict: createUploadConflictResolver(),
+          },
+          controller,
+        );
+
+        if (clearDirCacheEntry) {
+          clearDirCacheEntry(pane.connection.id, uploadTargetPath);
+        }
+        if (uploadTargetPath === pane.connection.currentPath) {
+          await refresh(side, { tabId: uploadPaneId });
+        }
+        return results;
+      } catch (error) {
+        if (controller.isCancelled()) {
+          scanningTask.cancel();
+          return [{ fileName: "", success: false, cancelled: true }];
+        }
+        if (scanningTask.isOpen()) {
+          scanningTask.fail(error);
+        }
+        logger.error("[SFTP] Folder picker upload failed:", error);
+        throw error;
+      } finally {
+        uploadControllerRef.current = null;
+      }
+    },
+    [
+      clearDirCacheEntry,
+      connectionCacheKeyMapRef,
+      createUploadCallbacks,
+      createUploadBridge,
+      createUploadConflictResolver,
+      getActivePane,
+      refresh,
+      sftpSessionsRef,
       useCompressedUpload,
     ],
   );
@@ -636,6 +992,7 @@ export const useSftpExternalOperations = (
             joinPath,
             callbacks,
             useCompressedUpload,
+            resolveConflict: createUploadConflictResolver(),
           },
           controller,
         );
@@ -663,6 +1020,7 @@ export const useSftpExternalOperations = (
       connectionCacheKeyMapRef,
       createUploadCallbacks,
       createUploadBridge,
+      createUploadConflictResolver,
       getActivePane,
       refresh,
       sftpSessionsRef,
@@ -672,11 +1030,14 @@ export const useSftpExternalOperations = (
 
   const cancelExternalUpload = useCallback(async () => {
     const controller = uploadControllerRef.current;
+    let cancelPromise: Promise<void> | undefined;
     if (controller) {
       logger.info("[SFTP] Cancelling external upload");
-      await controller.cancel();
+      cancelPromise = controller.cancel();
     }
-  }, []);
+    cancelPendingUploadConflicts();
+    await cancelPromise;
+  }, [cancelPendingUploadConflicts]);
 
   const selectApplication = useCallback(
     async (): Promise<{ path: string; name: string } | null> => {
@@ -693,11 +1054,16 @@ export const useSftpExternalOperations = (
     readTextFile,
     readBinaryFile,
     writeTextFile,
+    writeTextFileByConnection,
     downloadToTempAndOpen,
     uploadExternalFiles,
+    uploadExternalFileList,
+    uploadExternalFolderPath,
     uploadExternalEntries,
     cancelExternalUpload,
     selectApplication,
     activeFileWatchCountRef,
+    uploadConflicts,
+    resolveUploadConflict,
   };
 };

application/state/sftp/useSftpHostCredentials.test.ts

@@ -0,0 +1,187 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import { buildSftpHostCredentials } from "./useSftpHostCredentials.ts";
+import type { Host, SSHKey } from "../../../domain/models.ts";
+
+const host = (overrides: Partial<Host> = {}): Host => ({
+  id: "host-1",
+  label: "Host",
+  hostname: "example.com",
+  username: "root",
+  tags: [],
+  os: "linux",
+  ...overrides,
+});
+
+test("buildSftpHostCredentials rejects missing jump hosts", () => {
+  assert.throws(
+    () => buildSftpHostCredentials({
+      host: host({ hostChain: { hostIds: ["missing-jump"] } }),
+      hosts: [],
+      keys: [],
+      identities: [],
+    }),
+    /Jump host "missing-jump" is missing/,
+  );
+});
+
+test("buildSftpHostCredentials rejects missing saved proxy profiles", () => {
+  assert.throws(
+    () => buildSftpHostCredentials({
+      host: host({ proxyProfileId: "missing-proxy" }),
+      hosts: [],
+      keys: [],
+      identities: [],
+    }),
+    /Saved proxy for host "Host" is missing/,
+  );
+});
+
+test("buildSftpHostCredentials rejects missing saved proxy profiles on jump hosts", () => {
+  const jumpHost = host({ id: "jump-1", label: "Jump", proxyProfileId: "missing-proxy" });
+
+  assert.throws(
+    () => buildSftpHostCredentials({
+      host: host({ hostChain: { hostIds: ["jump-1"] } }),
+      hosts: [jumpHost],
+      keys: [],
+      identities: [],
+    }),
+    /Saved proxy for jump host "Jump" is missing/,
+  );
+});
+
+test("buildSftpHostCredentials passes reference keys as identity file paths", () => {
+  const key: SSHKey = {
+    id: "key-1",
+    label: "Reference key",
+    type: "ED25519",
+    privateKey: "",
+    source: "reference",
+    category: "key",
+    created: 1,
+    filePath: "/Users/alice/.ssh/id_ed25519",
+    passphrase: "saved-passphrase",
+  };
+
+  const credentials = buildSftpHostCredentials({
+    host: host({ authMethod: "key", identityFileId: "key-1" }),
+    hosts: [],
+    keys: [key],
+    identities: [],
+  });
+
+  assert.equal(credentials.privateKey, undefined);
+  assert.deepEqual(credentials.identityFilePaths, ["/Users/alice/.ssh/id_ed25519"]);
+  assert.equal(credentials.passphrase, "saved-passphrase");
+});
+
+test("buildSftpHostCredentials passes jump host reference keys as identity file paths", () => {
+  const key: SSHKey = {
+    id: "jump-key",
+    label: "Jump key",
+    type: "ED25519",
+    privateKey: "",
+    source: "reference",
+    category: "key",
+    created: 1,
+    filePath: "/Users/alice/.ssh/jump_ed25519",
+  };
+  const jumpHost = host({
+    id: "jump-1",
+    label: "Jump",
+    authMethod: "key",
+    identityFileId: "jump-key",
+  });
+
+  const credentials = buildSftpHostCredentials({
+    host: host({ hostChain: { hostIds: ["jump-1"] } }),
+    hosts: [jumpHost],
+    keys: [key],
+    identities: [],
+  });
+
+  assert.equal(credentials.jumpHosts?.[0]?.privateKey, undefined);
+  assert.deepEqual(credentials.jumpHosts?.[0]?.identityFilePaths, ["/Users/alice/.ssh/jump_ed25519"]);
+});
+
+test("buildSftpHostCredentials rejects undecryptable saved password credentials", () => {
+  assert.throws(
+    () => buildSftpHostCredentials({
+      host: host({
+        authMethod: "password",
+        password: "enc:v1:djEwAAAA",
+      }),
+      hosts: [],
+      keys: [],
+      identities: [],
+    }),
+    /Saved credentials cannot be decrypted/,
+  );
+});
+
+test("buildSftpHostCredentials omits local key file paths for password auth", () => {
+  const credentials = buildSftpHostCredentials({
+    host: host({
+      authMethod: "password",
+      password: "secret",
+      identityFilePaths: ["/Users/alice/.ssh/id_ed25519"],
+    }),
+    hosts: [],
+    keys: [],
+    identities: [],
+  });
+
+  assert.equal(credentials.password, "secret");
+  assert.equal(credentials.privateKey, undefined);
+  assert.equal(credentials.identityFilePaths, undefined);
+});
+
+test("buildSftpHostCredentials rejects undecryptable saved key material without fallback credentials", () => {
+  const key: SSHKey = {
+    id: "key-1",
+    label: "Imported key",
+    type: "ED25519",
+    privateKey: "enc:v1:djEwAAAA",
+    source: "imported",
+    category: "key",
+    created: 1,
+  };
+
+  assert.throws(
+    () => buildSftpHostCredentials({
+      host: host({ authMethod: "key", identityFileId: "key-1" }),
+      hosts: [],
+      keys: [key],
+      identities: [],
+    }),
+    /Saved credentials cannot be decrypted/,
+  );
+});
+
+test("buildSftpHostCredentials does not use stale local key paths when a selected key is unavailable", () => {
+  const key: SSHKey = {
+    id: "key-1",
+    label: "Imported key",
+    type: "ED25519",
+    privateKey: "enc:v1:djEwAAAA",
+    source: "imported",
+    category: "key",
+    created: 1,
+  };
+
+  assert.throws(
+    () => buildSftpHostCredentials({
+      host: host({
+        authMethod: "key",
+        identityFileId: "key-1",
+        identityFilePaths: ["/Users/alice/.ssh/stale_ed25519"],
+      }),
+      hosts: [],
+      keys: [key],
+      identities: [],
+    }),
+    /Saved credentials cannot be decrypted/,
+  );
+});

application/state/sftp/useSftpHostCredentials.ts

@@ -1,102 +1,174 @@
 import { useCallback } from "react";
-import type { Host, Identity, SSHKey } from "../../../domain/models";
+import type { Host, Identity, SSHKey, TerminalSettings } from "../../../domain/models";
 import { isEncryptedCredentialPlaceholder, sanitizeCredentialValue } from "../../../domain/credentials";
-import { resolveHostAuth } from "../../../domain/sshAuth";
+import { resolveBridgeKeyAuth, resolveHostAuth } from "../../../domain/sshAuth";
+import { resolveHostKeepalive } from "../../../domain/host";
+
+// Fallback used when no global TerminalSettings are wired through (older
+// call sites or tests). Matches DEFAULT_TERMINAL_SETTINGS so behavior is
+// identical whether or not the caller passes settings.
+const FALLBACK_KEEPALIVE = { keepaliveInterval: 30, keepaliveCountMax: 10 };
 
 interface UseSftpHostCredentialsParams {
   hosts: Host[];
   keys: SSHKey[];
   identities: Identity[];
+  terminalSettings?: Pick<TerminalSettings, 'keepaliveInterval' | 'keepaliveCountMax'>;
 }
 
+export const buildSftpHostCredentials = ({
+  host,
+  hosts,
+  keys,
+  identities,
+  terminalSettings,
+}: UseSftpHostCredentialsParams & { host: Host }): NetcattySSHOptions => {
+  const globalKeepalive = terminalSettings ?? FALLBACK_KEEPALIVE;
+  if (host.proxyProfileId && !host.proxyConfig) {
+    throw new Error(`Saved proxy for host "${host.label || host.hostname}" is missing. Open host settings and select a valid proxy.`);
+  }
+
+  const resolved = resolveHostAuth({ host, keys, identities });
+  const key = resolved.key || null;
+
+  const proxyConfig = host.proxyConfig
+    ? {
+      type: host.proxyConfig.type,
+      host: host.proxyConfig.host,
+      port: host.proxyConfig.port,
+      username: host.proxyConfig.username,
+      password: sanitizeCredentialValue(host.proxyConfig.password),
+    }
+    : undefined;
+  let jumpHosts: NetcattyJumpHost[] | undefined;
+  if (host.hostChain?.hostIds && host.hostChain.hostIds.length > 0) {
+    jumpHosts = host.hostChain.hostIds.map((hostId) => {
+      const jumpHost = hosts.find((candidate) => candidate.id === hostId);
+      if (!jumpHost) {
+        throw new Error(`Jump host "${hostId}" is missing. Open host settings and repair the jump host chain.`);
+      }
+      if (jumpHost.proxyProfileId && !jumpHost.proxyConfig) {
+        throw new Error(`Saved proxy for jump host "${jumpHost.label || jumpHost.hostname}" is missing. Open host settings and select a valid proxy.`);
+      }
+      return jumpHost;
+    }).map((jumpHost, index) => {
+      const jumpAuth = resolveHostAuth({
+        host: jumpHost,
+        keys,
+        identities,
+      });
+      const jumpKey = jumpAuth.key;
+      const jumpPassword = sanitizeCredentialValue(jumpAuth.password);
+      const jumpKeyAuth = resolveBridgeKeyAuth({
+        key: jumpKey,
+        fallbackIdentityFilePaths: jumpAuth.authMethod === "password" || jumpAuth.keyId
+          ? undefined
+          : jumpHost.identityFilePaths,
+        passphrase: jumpAuth.passphrase,
+      });
+      const hasJumpKeyMaterial = Boolean(jumpKeyAuth.privateKey || jumpKeyAuth.identityFilePaths?.length);
+      const hasConfiguredJumpProxyEndpoint =
+        index === 0 &&
+        !!(jumpHost.proxyConfig?.host && jumpHost.proxyConfig?.port);
+      if (
+        hasConfiguredJumpProxyEndpoint &&
+        jumpHost.proxyConfig?.username &&
+        isEncryptedCredentialPlaceholder(jumpHost.proxyConfig.password) &&
+        !sanitizeCredentialValue(jumpHost.proxyConfig.password)
+      ) {
+        throw new Error(`Proxy credentials for jump host "${jumpHost.label || jumpHost.hostname}" cannot be decrypted on this device. Open host settings and re-enter the proxy password.`);
+      }
+      const hasUnreadableJumpCredential =
+        isEncryptedCredentialPlaceholder(jumpAuth.password) ||
+        isEncryptedCredentialPlaceholder(jumpKey?.privateKey) ||
+        isEncryptedCredentialPlaceholder(jumpAuth.passphrase);
+      if (
+        (jumpAuth.authMethod === "password" && isEncryptedCredentialPlaceholder(jumpAuth.password) && !jumpPassword) ||
+        (jumpAuth.authMethod !== "password" && hasUnreadableJumpCredential && !jumpPassword && !hasJumpKeyMaterial)
+      ) {
+        throw new Error(`Saved credentials for jump host "${jumpHost.label || jumpHost.hostname}" cannot be decrypted on this device. Open host settings and re-enter them.`);
+      }
+      const hopKeepalive = resolveHostKeepalive(jumpHost, globalKeepalive);
+      return {
+        hostname: jumpHost.hostname,
+        port: jumpHost.port || 22,
+        username: jumpAuth.username || "root",
+        password: jumpPassword,
+        privateKey: jumpKeyAuth.privateKey,
+        certificate: jumpKey?.certificate,
+        passphrase: jumpKeyAuth.passphrase,
+        publicKey: jumpKey?.publicKey,
+        keyId: jumpAuth.keyId,
+        keySource: jumpKey?.source,
+        label: jumpHost.label,
+        proxy: jumpHost.proxyConfig?.host && jumpHost.proxyConfig?.port
+          ? {
+            type: jumpHost.proxyConfig.type,
+            host: jumpHost.proxyConfig.host,
+            port: jumpHost.proxyConfig.port,
+            username: jumpHost.proxyConfig.username,
+            password: sanitizeCredentialValue(jumpHost.proxyConfig.password),
+          }
+          : undefined,
+        identityFilePaths: jumpKeyAuth.identityFilePaths,
+        keepaliveInterval: hopKeepalive.interval,
+        keepaliveCountMax: hopKeepalive.countMax,
+      };
+    });
+  }
+  const usesTargetProxyForFirstHop = !!proxyConfig && !jumpHosts?.[0]?.proxy;
+  if (usesTargetProxyForFirstHop && host.proxyConfig?.username && isEncryptedCredentialPlaceholder(host.proxyConfig.password) && !proxyConfig?.password) {
+    throw new Error("Proxy credentials cannot be decrypted on this device. Open host settings and re-enter the proxy password.");
+  }
+
+  const keyAuth = resolveBridgeKeyAuth({
+    key,
+    fallbackIdentityFilePaths: resolved.authMethod === "password" || resolved.keyId
+      ? undefined
+      : host.identityFilePaths,
+    passphrase: resolved.passphrase,
+  });
+  const password = sanitizeCredentialValue(resolved.password);
+  const hasKeyMaterial = Boolean(keyAuth.privateKey || keyAuth.identityFilePaths?.length);
+  const hasUnreadableCredential =
+    isEncryptedCredentialPlaceholder(resolved.password) ||
+    isEncryptedCredentialPlaceholder(key?.privateKey) ||
+    isEncryptedCredentialPlaceholder(resolved.passphrase);
+  if (
+    (resolved.authMethod === "password" && isEncryptedCredentialPlaceholder(resolved.password) && !password) ||
+    (resolved.authMethod !== "password" && hasUnreadableCredential && !password && !hasKeyMaterial)
+  ) {
+    throw new Error("Saved credentials cannot be decrypted on this device. Open host settings and re-enter them.");
+  }
+
+  const targetKeepalive = resolveHostKeepalive(host, globalKeepalive);
+  return {
+    hostname: host.hostname,
+    username: resolved.username,
+    port: host.port || 22,
+    password,
+    privateKey: keyAuth.privateKey,
+    certificate: key?.certificate,
+    passphrase: keyAuth.passphrase,
+    publicKey: key?.publicKey,
+    keyId: resolved.keyId,
+    keySource: key?.source,
+    proxy: proxyConfig,
+    jumpHosts: jumpHosts && jumpHosts.length > 0 ? jumpHosts : undefined,
+    sudo: host.sftpSudo,
+    identityFilePaths: keyAuth.identityFilePaths,
+    keepaliveInterval: targetKeepalive.interval,
+    keepaliveCountMax: targetKeepalive.countMax,
+  };
+};
+
 export const useSftpHostCredentials = ({
   hosts,
   keys,
   identities,
+  terminalSettings,
 }: UseSftpHostCredentialsParams) =>
   useCallback(
-    (host: Host): NetcattySSHOptions => {
-      const resolved = resolveHostAuth({ host, keys, identities });
-      const key = resolved.key || null;
-
-      const proxyConfig = host.proxyConfig
-        ? {
-          type: host.proxyConfig.type,
-          host: host.proxyConfig.host,
-          port: host.proxyConfig.port,
-          username: host.proxyConfig.username,
-          password: sanitizeCredentialValue(host.proxyConfig.password),
-        }
-        : undefined;
-      let jumpHosts: NetcattyJumpHost[] | undefined;
-      if (host.hostChain?.hostIds && host.hostChain.hostIds.length > 0) {
-        jumpHosts = host.hostChain.hostIds
-          .map((hostId) => hosts.find((h) => h.id === hostId))
-          .filter((h): h is Host => !!h)
-          .map((jumpHost, index) => {
-            const jumpAuth = resolveHostAuth({
-              host: jumpHost,
-              keys,
-              identities,
-            });
-            const jumpKey = jumpAuth.key;
-            const hasConfiguredJumpProxyEndpoint =
-              index === 0 &&
-              !!(jumpHost.proxyConfig?.host && jumpHost.proxyConfig?.port);
-            if (
-              hasConfiguredJumpProxyEndpoint &&
-              jumpHost.proxyConfig?.username &&
-              isEncryptedCredentialPlaceholder(jumpHost.proxyConfig.password) &&
-              !sanitizeCredentialValue(jumpHost.proxyConfig.password)
-            ) {
-              throw new Error(`Proxy credentials for jump host "${jumpHost.label || jumpHost.hostname}" cannot be decrypted on this device. Open host settings and re-enter the proxy password.`);
-            }
-            return {
-              hostname: jumpHost.hostname,
-              port: jumpHost.port || 22,
-              username: jumpAuth.username || "root",
-              password: jumpAuth.password,
-              privateKey: jumpKey?.privateKey,
-              certificate: jumpKey?.certificate,
-              passphrase: jumpAuth.passphrase || jumpKey?.passphrase,
-              publicKey: jumpKey?.publicKey,
-              keyId: jumpAuth.keyId,
-              keySource: jumpKey?.source,
-              label: jumpHost.label,
-              proxy: jumpHost.proxyConfig?.host && jumpHost.proxyConfig?.port
-                ? {
-                  type: jumpHost.proxyConfig.type,
-                  host: jumpHost.proxyConfig.host,
-                  port: jumpHost.proxyConfig.port,
-                  username: jumpHost.proxyConfig.username,
-                  password: sanitizeCredentialValue(jumpHost.proxyConfig.password),
-                }
-                : undefined,
-              identityFilePaths: jumpHost.identityFilePaths,
-            };
-          });
-      }
-      const usesTargetProxyForFirstHop = !!proxyConfig && !jumpHosts?.[0]?.proxy;
-      if (usesTargetProxyForFirstHop && host.proxyConfig?.username && isEncryptedCredentialPlaceholder(host.proxyConfig.password) && !proxyConfig?.password) {
-        throw new Error("Proxy credentials cannot be decrypted on this device. Open host settings and re-enter the proxy password.");
-      }
-
-      return {
-        hostname: host.hostname,
-        username: resolved.username,
-        port: host.port || 22,
-        password: resolved.password,
-        privateKey: key?.privateKey,
-        certificate: key?.certificate,
-        passphrase: resolved.passphrase || key?.passphrase,
-        publicKey: key?.publicKey,
-        keyId: resolved.keyId,
-        keySource: key?.source,
-        proxy: proxyConfig,
-        jumpHosts: jumpHosts && jumpHosts.length > 0 ? jumpHosts : undefined,
-        sudo: host.sftpSudo,
-        identityFilePaths: host.identityFilePaths,
-      };
-    },
-    [hosts, identities, keys],
+    (host: Host): NetcattySSHOptions => buildSftpHostCredentials({ host, hosts, keys, identities, terminalSettings }),
+    [hosts, identities, keys, terminalSettings],
   );

application/state/sftp/useSftpPaneActions.ts

@@ -1,4 +1,4 @@
-import { useCallback, useRef } from "react";
+import React, { useCallback, useRef } from "react";
 import type { Host, SftpFileEntry, SftpFilenameEncoding } from "../../../domain/models";
 import { netcattyBridge } from "../../../infrastructure/services/netcattyBridge";
 import { logger } from "../../../lib/logger";

application/state/sftp/useSftpTransfers.ts

@@ -1,6 +1,7 @@
 import React, { useCallback, useMemo, useRef, useState } from "react";
 import {
   FileConflict,
+  FileConflictAction,
   SftpFileEntry,
   SftpFilenameEncoding,
   TransferDirection,
@@ -61,7 +62,7 @@ interface UseSftpTransfersResult {
   retryTransfer: (transferId: string) => Promise<void>;
   clearCompletedTransfers: () => void;
   dismissTransfer: (transferId: string) => void;
-  resolveConflict: (conflictId: string, action: "replace" | "skip" | "duplicate") => Promise<void>;
+  resolveConflict: (conflictId: string, action: FileConflictAction, applyToAll?: boolean) => Promise<void>;
 }
 
 interface TransferResult {
@@ -96,6 +97,7 @@ export const useSftpTransfers = ({
   const conflictsRef = useRef(conflicts);
   conflictsRef.current = conflicts;
   const completionHandlersRef = useRef<Map<string, (result: TransferResult) => void | Promise<void>>>(new Map());
+  const conflictDefaultsRef = useRef<Map<string, FileConflictAction>>(new Map());
 
   const clearCancelledTask = useCallback((taskId: string) => {
     cancelledTasksRef.current.delete(taskId);
@@ -122,6 +124,196 @@ export const useSftpTransfers = ({
     [],
   );
 
+  const conflictDefaultKey = useCallback(
+    (batchId: string | undefined, isDirectory: boolean) =>
+      `${batchId ?? "global"}:${isDirectory ? "directory" : "file"}`,
+    [],
+  );
+
+  const splitNameForDuplicate = useCallback((fileName: string, isDirectory: boolean) => {
+    if (isDirectory) return { baseName: fileName, ext: "" };
+    const lastDot = fileName.lastIndexOf(".");
+    if (lastDot <= 0) return { baseName: fileName, ext: "" };
+    return {
+      baseName: fileName.slice(0, lastDot),
+      ext: fileName.slice(lastDot),
+    };
+  }, []);
+
+  const statTargetPath = useCallback(
+    async (
+      targetPane: SftpPane,
+      targetSftpId: string | null,
+      targetPath: string,
+      targetEncoding: SftpFilenameEncoding,
+    ): Promise<{ type?: "file" | "directory" | "symlink"; size: number; mtime: number } | null> => {
+      if (!targetPane.connection) return null;
+
+      if (targetPane.connection.isLocal) {
+        const stat = await netcattyBridge.get()?.statLocal?.(targetPath);
+        if (!stat) return null;
+        return {
+          type: stat.type as "file" | "directory" | "symlink" | undefined,
+          size: stat.size,
+          mtime: stat.lastModified || Date.now(),
+        };
+      }
+
+      if (!targetSftpId) return null;
+      const stat = await netcattyBridge.get()?.statSftp?.(
+        targetSftpId,
+        targetPath,
+        targetEncoding,
+      );
+      if (!stat) return null;
+      return {
+        type: stat.type as "file" | "directory" | "symlink" | undefined,
+        size: stat.size,
+        mtime: stat.lastModified || Date.now(),
+      };
+    },
+    [],
+  );
+
+  const getDuplicateTarget = useCallback(
+    async (
+      task: TransferTask,
+      targetPane: SftpPane,
+      targetSftpId: string | null,
+      targetEncoding: SftpFilenameEncoding,
+    ) => {
+      const parentPath = getParentPath(task.targetPath);
+      const { baseName, ext } = splitNameForDuplicate(task.fileName, task.isDirectory);
+
+      for (let index = 1; index < 1000; index++) {
+        const suffix = index === 1 ? " (copy)" : ` (copy ${index})`;
+        const fileName = `${baseName}${suffix}${ext}`;
+        const targetPath = joinPath(parentPath, fileName);
+        try {
+          const existing = await statTargetPath(targetPane, targetSftpId, targetPath, targetEncoding);
+          if (!existing) return { fileName, targetPath };
+        } catch {
+          return { fileName, targetPath };
+        }
+      }
+
+      const fallbackName = `${baseName} (copy ${Date.now()})${ext}`;
+      return { fileName: fallbackName, targetPath: joinPath(parentPath, fallbackName) };
+    },
+    [splitNameForDuplicate, statTargetPath],
+  );
+
+  const completeCancelledTask = useCallback(
+    async (task: TransferTask) => {
+      const completionHandler = completionHandlersRef.current.get(task.id);
+      if (completionHandler) {
+        try {
+          await completionHandler({
+            id: task.id,
+            fileName: task.fileName,
+            originalFileName: task.originalFileName ?? task.fileName,
+            status: "cancelled",
+          });
+        } finally {
+          completionHandlersRef.current.delete(task.id);
+        }
+      }
+    },
+    [],
+  );
+
+  const cancelBackendTransfers = useCallback(async (transferIds: string[]) => {
+    const idsToCancel = new Set<string>();
+    const currentTransfers = transfersRef.current;
+    for (const transferId of transferIds) {
+      idsToCancel.add(transferId);
+      const trackedChildren = activeChildIdsRef.current.get(transferId);
+      if (trackedChildren) {
+        for (const childId of trackedChildren) {
+          idsToCancel.add(childId);
+          cancelledTasksRef.current.add(childId);
+        }
+      }
+      for (const transfer of currentTransfers) {
+        if (
+          transfer.parentTaskId === transferId &&
+          (transfer.status === "transferring" || transfer.status === "pending")
+        ) {
+          idsToCancel.add(transfer.id);
+          cancelledTasksRef.current.add(transfer.id);
+        }
+      }
+    }
+
+    const cancelTransferAtBackend = netcattyBridge.get()?.cancelTransfer;
+    if (!cancelTransferAtBackend) return;
+
+    await Promise.all(
+      Array.from(idsToCancel).map((id) =>
+        cancelTransferAtBackend(id).catch((err) => {
+          logger.warn("Failed to cancel transfer at backend:", err);
+        }),
+      ),
+    );
+  }, []);
+
+  const markBatchStopped = useCallback(
+    async (task: TransferTask) => {
+      const batchId = task.batchId;
+      const affected = transfersRef.current.filter((candidate) =>
+        candidate.id === task.id ||
+        (!!batchId && candidate.batchId === batchId && (candidate.status === "pending" || candidate.status === "transferring")),
+      );
+
+      affected.forEach((candidate) => cancelledTasksRef.current.add(candidate.id));
+      const affectedIds = new Set(affected.map((candidate) => candidate.id));
+      setConflicts((prev) => prev.filter((conflict) => conflict.transferId !== task.id && (!batchId || conflict.batchId !== batchId)));
+      setTransfers((prev) => {
+        for (const candidate of prev) {
+          if (candidate.parentTaskId && affectedIds.has(candidate.parentTaskId)) {
+            cancelledTasksRef.current.add(candidate.id);
+          }
+        }
+
+        return prev
+          .filter((candidate) => !(candidate.parentTaskId && affectedIds.has(candidate.parentTaskId)))
+          .map((candidate) =>
+            affectedIds.has(candidate.id)
+              ? { ...candidate, status: "cancelled" as TransferStatus, endTime: Date.now() }
+              : candidate,
+          );
+      });
+      await cancelBackendTransfers(affected.map((candidate) => candidate.id));
+
+      for (const candidate of affected) {
+        await completeCancelledTask(candidate);
+      }
+    },
+    [cancelBackendTransfers, completeCancelledTask],
+  );
+
+  const deleteTargetPath = useCallback(
+    async (
+      task: TransferTask,
+      targetPane: SftpPane,
+      targetSftpId: string | null,
+      targetEncoding: SftpFilenameEncoding,
+    ) => {
+      if (!targetPane.connection) return;
+      if (targetPane.connection.isLocal) {
+        const deleteLocalFile = netcattyBridge.get()?.deleteLocalFile;
+        if (!deleteLocalFile) throw new Error("Local delete unavailable");
+        await deleteLocalFile(task.targetPath);
+        return;
+      }
+      if (!targetSftpId) throw new Error("Target SFTP session not found");
+      const deleteSftp = netcattyBridge.get()?.deleteSftp;
+      if (!deleteSftp) throw new Error("SFTP delete unavailable");
+      await deleteSftp(targetSftpId, task.targetPath, targetEncoding);
+    },
+    [],
+  );
+
   const getEntrySize = useCallback((entry: SftpFileEntry): number => {
     if (typeof entry.size === "string") {
       const parsed = parseInt(entry.size, 10);
@@ -557,6 +749,10 @@ export const useSftpTransfers = ({
     targetPane: SftpPane,
     targetSide: "left" | "right",
   ): Promise<TransferStatus> => {
+    if (cancelledTasksRef.current.has(task.id)) {
+      return "cancelled";
+    }
+
     const updateTask = (updates: Partial<TransferTask>) => {
       setTransfers((prev) =>
         prev.map((t) => (t.id === task.id ? { ...t, ...updates } : t)),
@@ -676,7 +872,7 @@ export const useSftpTransfers = ({
 
       // Run size discovery and conflict check in parallel
       const conflictCheckPromise = (async (): Promise<FileConflict | null> => {
-        if (task.skipConflictCheck || task.isDirectory || !targetPane.connection) return null;
+        if (task.skipConflictCheck || !targetPane.connection) return null;
 
         const sourceStat: { size: number; mtime: number } | null =
           (task.totalBytes > 0 || task.sourceLastModified)
@@ -684,30 +880,26 @@ export const useSftpTransfers = ({
             : null;
 
         try {
-          let existingStat: { size: number; mtime: number } | null = null;
-
-          if (targetPane.connection.isLocal) {
-            const stat = await netcattyBridge.get()?.statLocal?.(task.targetPath);
-            if (stat) {
-              existingStat = { size: stat.size, mtime: stat.lastModified || Date.now() };
-            }
-          } else if (targetSftpId) {
-            const stat = await netcattyBridge.get()?.statSftp?.(
-              targetSftpId,
-              task.targetPath,
-              targetEncoding,
-            );
-            if (stat) {
-              existingStat = { size: stat.size, mtime: stat.lastModified || Date.now() };
-            }
-          }
+          const existingStat = await statTargetPath(targetPane, targetSftpId, task.targetPath, targetEncoding);
 
           if (existingStat) {
             return {
               transferId: task.id,
+              batchId: task.batchId,
               fileName: task.fileName,
               sourcePath: task.sourcePath,
               targetPath: task.targetPath,
+              isDirectory: task.isDirectory,
+              existingType: existingStat.type,
+              applyToAllCount: task.batchId
+                ? transfersRef.current.filter((candidate) =>
+                    candidate.batchId === task.batchId &&
+                    candidate.isDirectory === task.isDirectory &&
+                    !candidate.parentTaskId &&
+                    candidate.status !== "completed" &&
+                    candidate.status !== "cancelled",
+                  ).length
+                : 1,
               existingSize: existingStat.size,
               newSize: sourceStat?.size || task.totalBytes || 0,
               existingModified: existingStat.mtime,
@@ -729,6 +921,44 @@ export const useSftpTransfers = ({
       const conflict = await conflictCheckPromise;
 
       if (conflict) {
+        const defaultAction = conflictDefaultsRef.current.get(conflictDefaultKey(task.batchId, task.isDirectory));
+        if (defaultAction) {
+          if (defaultAction === "stop") {
+            await markBatchStopped(task);
+            return "cancelled";
+          }
+
+          if (defaultAction === "skip") {
+            cancelledTasksRef.current.add(task.id);
+            updateTask({ status: "cancelled", endTime: Date.now() });
+            await completeCancelledTask(task);
+            return "cancelled";
+          }
+
+          const duplicateTarget = defaultAction === "duplicate"
+            ? await getDuplicateTarget(task, targetPane, targetSftpId, targetEncoding)
+            : null;
+          const updatedTask: TransferTask = {
+            ...task,
+            ...(duplicateTarget
+              ? {
+                  fileName: duplicateTarget.fileName,
+                  targetPath: duplicateTarget.targetPath,
+                }
+              : null),
+            skipConflictCheck: true,
+            replaceExistingTarget: defaultAction === "replace",
+          };
+          setTransfers((prev) =>
+            prev.map((t) =>
+              t.id === task.id
+                ? { ...updatedTask, status: "pending" as TransferStatus }
+                : t,
+            ),
+          );
+          return processTransfer(updatedTask, sourcePane, targetPane, targetSide);
+        }
+
         setConflicts((prev) => [...prev, conflict]);
         updateTask({
           status: "pending",
@@ -741,6 +971,10 @@ export const useSftpTransfers = ({
 
       let dirPartialFailure = false;
 
+      if (task.replaceExistingTarget) {
+        await deleteTargetPath(task, targetPane, targetSftpId, targetEncoding);
+      }
+
       // Same-host exec-based paths are only safe for UTF-8 compatible encodings.
       // "auto" is allowed here — the backend resolves it to the actual encoding
       // and skips exec if it resolved to non-UTF-8 (e.g. gb18030).
@@ -816,6 +1050,10 @@ export const useSftpTransfers = ({
         );
       }
 
+      if (cancelledTasksRef.current.has(task.id)) {
+        throw new Error("Transfer cancelled");
+      }
+
       const finalStatus: TransferStatus = dirPartialFailure ? "failed" : "completed";
       setTransfers((prev) => {
         return prev.map((t) => {
@@ -940,6 +1178,7 @@ export const useSftpTransfers = ({
       const sourcePath = options?.sourcePath ?? sourcePane.connection.currentPath;
       const targetPath = options?.targetPath ?? targetPane.connection.currentPath;
       const sourceConnectionId = options?.sourceConnectionId ?? sourcePane.connection.id;
+      const batchId = crypto.randomUUID();
 
       const newTasks: TransferTask[] = [];
 
@@ -965,6 +1204,7 @@ export const useSftpTransfers = ({
 
         newTasks.push({
           id: crypto.randomUUID(),
+          batchId,
           fileName: file.name,
           originalFileName: file.name,
           sourcePath: joinPath(sourcePath, file.name),
@@ -1032,37 +1272,10 @@ export const useSftpTransfers = ({
 
       setConflicts((prev) => prev.filter((c) => c.transferId !== transferId));
 
-      if (netcattyBridge.get()?.cancelTransfer) {
-        // Cancel parent and all active child streams at the backend.
-        // Use activeChildIdsRef for immediate visibility (not subject to
-        // React state batching delays like transfersRef).
-        const idsToCancel = [transferId];
-        const trackedChildren = activeChildIdsRef.current.get(transferId);
-        if (trackedChildren) {
-          for (const childId of trackedChildren) {
-            idsToCancel.push(childId);
-            cancelledTasksRef.current.add(childId);
-          }
-        }
-        // Also check rendered state as fallback for transfers started
-        // via other paths (e.g. startTransfer/processTransfer)
-        const currentTransfers = transfersRef.current;
-        for (const t of currentTransfers) {
-          if (t.parentTaskId === transferId && (t.status === "transferring" || t.status === "pending") && !idsToCancel.includes(t.id)) {
-            idsToCancel.push(t.id);
-          }
-        }
-        await Promise.all(
-          idsToCancel.map((id) =>
-            netcattyBridge.get()!.cancelTransfer!(id).catch((err) => {
-              logger.warn("Failed to cancel transfer at backend:", err);
-            }),
-          ),
-        );
-      }
+      await cancelBackendTransfers([transferId]);
 
     },
-    [],
+    [cancelBackendTransfers],
   );
 
   const retryTransfer = useCallback(
@@ -1155,79 +1368,123 @@ export const useSftpTransfers = ({
   }, []);
 
   const resolveConflict = useCallback(
-    async (conflictId: string, action: "replace" | "skip" | "duplicate") => {
+    async (conflictId: string, action: FileConflictAction, applyToAll = false) => {
       const conflict = conflictsRef.current.find((c) => c.transferId === conflictId);
       if (!conflict) return;
 
-      setConflicts((prev) => prev.filter((c) => c.transferId !== conflictId));
-
       const task = transfersRef.current.find((t) => t.id === conflictId);
-      if (!task) return;
+      if (!task) {
+        setConflicts((prev) => prev.filter((c) => c.transferId !== conflictId));
+        return;
+      }
+
+      const selectedConflictKey = conflictDefaultKey(task.batchId, task.isDirectory);
+      const affectedConflicts = applyToAll
+        ? conflictsRef.current.filter((candidate) =>
+            conflictDefaultKey(candidate.batchId, candidate.isDirectory) === selectedConflictKey,
+          )
+        : [conflict];
+      const affectedConflictIds = new Set(affectedConflicts.map((candidate) => candidate.transferId));
+      const affectedTasks = affectedConflicts
+        .map((candidate) => transfersRef.current.find((transfer) => transfer.id === candidate.transferId))
+        .filter((candidate): candidate is TransferTask => Boolean(candidate));
+
+      if (applyToAll) {
+        conflictDefaultsRef.current.set(selectedConflictKey, action);
+      }
+
+      setConflicts((prev) => prev.filter((c) => !affectedConflictIds.has(c.transferId)));
+
+      if (affectedTasks.length === 0) {
+        return;
+      }
+
+      if (action === "stop") {
+        await markBatchStopped(task);
+        return;
+      }
 
       if (action === "skip") {
+        for (const affectedTask of affectedTasks) {
+          cancelledTasksRef.current.add(affectedTask.id);
+        }
         setTransfers((prev) =>
-          prev.map((t) =>
-            t.id === conflictId
-              ? { ...t, status: "cancelled" as TransferStatus }
+          prev.map((t) => affectedConflictIds.has(t.id)
+              ? { ...t, status: "cancelled" as TransferStatus, endTime: Date.now() }
               : t,
           ),
         );
-        const completionHandler = completionHandlersRef.current.get(conflictId);
-        if (completionHandler) {
-          try {
-            await completionHandler({
-              id: task.id,
-              fileName: task.fileName,
-              originalFileName: task.originalFileName ?? task.fileName,
-              status: "cancelled",
-            });
-          } finally {
-            completionHandlersRef.current.delete(conflictId);
-          }
+        for (const affectedTask of affectedTasks) {
+          await completeCancelledTask(affectedTask);
         }
         return;
       }
 
-      let updatedTask = { ...task };
+      const updatedTasks: TransferTask[] = [];
 
-      if (action === "duplicate") {
-        const ext = task.fileName.includes(".")
-          ? "." + task.fileName.split(".").pop()
-          : "";
-        const baseName = task.fileName.includes(".")
-          ? task.fileName.slice(0, task.fileName.lastIndexOf("."))
-          : task.fileName;
-        const newName = `${baseName} (copy)${ext}`;
-        const newTargetPath = joinPath(getParentPath(task.targetPath), newName);
-        updatedTask = {
-          ...task,
-          fileName: newName,
-          targetPath: newTargetPath,
-          skipConflictCheck: true,
-        };
-      } else if (action === "replace") {
-        updatedTask = {
-          ...task,
-          skipConflictCheck: true,
-        };
+      for (const affectedTask of affectedTasks) {
+        let updatedTask = { ...affectedTask };
+
+        if (action === "duplicate") {
+          const endpoints = resolveTaskEndpoints(affectedTask);
+          if (!endpoints) continue;
+          const targetSftpId = endpoints.targetPane.connection?.isLocal
+            ? null
+            : sftpSessionsRef.current.get(endpoints.targetPane.connection!.id) ?? null;
+          const targetEncoding = endpoints.targetPane.connection?.isLocal
+            ? "auto"
+            : endpoints.targetPane.filenameEncoding || "auto";
+          const duplicateTarget = await getDuplicateTarget(affectedTask, endpoints.targetPane, targetSftpId, targetEncoding);
+          updatedTask = {
+            ...affectedTask,
+            fileName: duplicateTarget.fileName,
+            targetPath: duplicateTarget.targetPath,
+            skipConflictCheck: true,
+          };
+        } else if (action === "replace") {
+          updatedTask = {
+            ...affectedTask,
+            skipConflictCheck: true,
+            replaceExistingTarget: true,
+          };
+        } else if (action === "merge") {
+          updatedTask = {
+            ...affectedTask,
+            skipConflictCheck: true,
+            replaceExistingTarget: false,
+          };
+        }
+
+        updatedTasks.push(updatedTask);
       }
 
+      const updatedTaskMap = new Map(updatedTasks.map((updatedTask) => [updatedTask.id, updatedTask]));
       setTransfers((prev) =>
-        prev.map((t) =>
-          t.id === conflictId
+        prev.map((t) => {
+          const updatedTask = updatedTaskMap.get(t.id);
+          return updatedTask
             ? { ...updatedTask, status: "pending" as TransferStatus }
-            : t,
-        ),
+            : t;
+        }),
       );
 
-      setTimeout(async () => {
-        const endpoints = resolveTaskEndpoints(updatedTask);
-        if (!endpoints) return;
-        await processTransfer(updatedTask, endpoints.sourcePane, endpoints.targetPane, endpoints.targetSide);
-      }, 100);
+      for (const updatedTask of updatedTasks) {
+        setTimeout(async () => {
+          const endpoints = resolveTaskEndpoints(updatedTask);
+          if (!endpoints) return;
+          await processTransfer(updatedTask, endpoints.sourcePane, endpoints.targetPane, endpoints.targetSide);
+        }, 100);
+      }
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps -- processTransfer is defined inline; transfers/conflicts accessed via refs
-    [resolveTaskEndpoints],
+    [
+      completeCancelledTask,
+      conflictDefaultKey,
+      getDuplicateTarget,
+      markBatchStopped,
+      resolveTaskEndpoints,
+      sftpSessionsRef,
+    ],
   );
 
   const activeTransfersCount = useMemo(() => transfers.filter(

application/state/sftp/utils.test.ts

@@ -0,0 +1,11 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import { isConcreteTransferTargetPath } from "./utils";
+
+test("concrete transfer target paths exclude temporary placeholders", () => {
+  assert.equal(isConcreteTransferTargetPath({ targetPath: "/Users/alice/Downloads/report.pdf" }), true);
+  assert.equal(isConcreteTransferTargetPath({ targetPath: "C:\\Users\\alice\\Downloads\\report.pdf" }), true);
+  assert.equal(isConcreteTransferTargetPath({ targetPath: "(temp)" }), false);
+  assert.equal(isConcreteTransferTargetPath({ targetPath: "   " }), false);
+});

application/state/sftp/utils.ts

@@ -1,4 +1,4 @@
-import { SftpFileEntry } from "../../../domain/models";
+import { SftpFileEntry, TransferTask } from "../../../domain/models";
 
 export const formatFileSize = (bytes: number): string => {
   if (bytes === 0) return "--";
@@ -76,6 +76,11 @@ export const getParentPath = (path: string): string => {
   return result;
 };
 
+export const isConcreteTransferTargetPath = (task: Pick<TransferTask, "targetPath">): boolean => {
+  const targetPath = task.targetPath.trim();
+  return targetPath.length > 0 && targetPath !== "(temp)";
+};
+
 export const getFileName = (path: string): string => {
   const parts = path.split(/[\\/]/).filter(Boolean);
   return parts[parts.length - 1] || "";

application/state/textEditorSaveCoordinator.test.ts

@@ -0,0 +1,130 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import { createTextEditorSaveCoordinator } from "./textEditorSaveCoordinator.ts";
+
+const deferred = <T = void>() => {
+  let resolve!: (value: T | PromiseLike<T>) => void;
+  let reject!: (reason?: unknown) => void;
+  const promise = new Promise<T>((res, rej) => {
+    resolve = res;
+    reject = rej;
+  });
+  return { promise, resolve, reject };
+};
+
+test("text editor save coordinator joins duplicate saves already in flight", async () => {
+  const pending = deferred();
+  const saved: string[] = [];
+  const savingStates: boolean[] = [];
+  const coordinator = createTextEditorSaveCoordinator({
+    onSave: async (content) => {
+      saved.push(content);
+      await pending.promise;
+    },
+    onSavingChange: (saving) => savingStates.push(saving),
+  });
+
+  const first = coordinator.save("remote text");
+  const second = coordinator.save("remote text");
+
+  assert.deepEqual(saved, ["remote text"]);
+  pending.resolve();
+
+  assert.equal(await first, true);
+  assert.equal(await second, true);
+  assert.deepEqual(saved, ["remote text"]);
+  assert.deepEqual(savingStates, [true, false]);
+});
+
+test("text editor save coordinator saves newer content after an in-flight save finishes", async () => {
+  const firstSave = deferred();
+  const secondSave = deferred();
+  const saved: string[] = [];
+  const coordinator = createTextEditorSaveCoordinator({
+    onSave: async (content) => {
+      saved.push(content);
+      await (content === "v1" ? firstSave.promise : secondSave.promise);
+    },
+  });
+
+  const first = coordinator.save("v1");
+  const second = coordinator.save("v2");
+
+  assert.deepEqual(saved, ["v1"]);
+  firstSave.resolve();
+  await new Promise<void>((resolve) => setTimeout(resolve, 0));
+  assert.deepEqual(saved, ["v1", "v2"]);
+  secondSave.resolve();
+
+  assert.equal(await first, true);
+  assert.equal(await second, true);
+});
+
+test("text editor save coordinator returns false to duplicate callers when the in-flight save fails", async () => {
+  const pending = deferred();
+  const errors: string[] = [];
+  const coordinator = createTextEditorSaveCoordinator({
+    onSave: async () => {
+      await pending.promise;
+      throw new Error("denied");
+    },
+    onSaveError: (error) => {
+      errors.push(error instanceof Error ? error.message : String(error));
+    },
+  });
+
+  const first = coordinator.save("content");
+  const second = coordinator.save("content");
+
+  pending.resolve();
+
+  assert.equal(await first, false);
+  assert.equal(await second, false);
+  assert.deepEqual(errors, ["denied"]);
+});
+
+test("text editor save coordinator reset prevents an old in-flight save from updating the next file", async () => {
+  const pending = deferred();
+  const successes: string[] = [];
+  const errors: string[] = [];
+  const savingStates: boolean[] = [];
+  const coordinator = createTextEditorSaveCoordinator({
+    onSave: async () => {
+      await pending.promise;
+    },
+    onSaveSuccess: (content) => successes.push(content),
+    onSaveError: (error) => errors.push(error instanceof Error ? error.message : String(error)),
+    onSavingChange: (saving) => savingStates.push(saving),
+  });
+
+  const save = coordinator.save("old file");
+  coordinator.reset();
+  pending.resolve();
+
+  assert.equal(await save, false);
+  assert.deepEqual(successes, []);
+  assert.deepEqual(errors, []);
+  assert.deepEqual(savingStates, [true, false]);
+});
+
+test("text editor save coordinator reset cancels queued stale saves", async () => {
+  const firstSave = deferred();
+  const saved: string[] = [];
+  const coordinator = createTextEditorSaveCoordinator({
+    onSave: async (content) => {
+      saved.push(content);
+      await firstSave.promise;
+    },
+  });
+
+  const first = coordinator.save("old v1");
+  const queued = coordinator.save("old v2");
+  coordinator.reset();
+  firstSave.resolve();
+  await new Promise<void>((resolve) => setTimeout(resolve, 0));
+
+  assert.equal(await first, false);
+  assert.equal(await queued, false);
+  assert.deepEqual(saved, ["old v1"]);
+});

application/state/textEditorSaveCoordinator.ts

@@ -0,0 +1,90 @@
+export interface TextEditorSaveCoordinator {
+  save(content: string): Promise<boolean>;
+  isSaving(): boolean;
+  reset(): void;
+}
+
+export interface TextEditorSaveCoordinatorOptions {
+  onSave: (content: string) => Promise<void>;
+  onSaveStart?: (content: string) => void;
+  onSaveSuccess?: (content: string) => void;
+  onSaveError?: (error: unknown) => void;
+  onSavingChange?: (saving: boolean) => void;
+}
+
+interface InFlightSave {
+  content: string;
+  promise: Promise<boolean>;
+}
+
+export const createTextEditorSaveCoordinator = (
+  options: TextEditorSaveCoordinatorOptions,
+): TextEditorSaveCoordinator => {
+  let inFlight: InFlightSave | null = null;
+  let generation = 0;
+
+  const notifySavingChange = () => {
+    options.onSavingChange?.(inFlight !== null);
+  };
+
+  const startSave = (content: string): Promise<boolean> => {
+    const saveGeneration = generation;
+    options.onSaveStart?.(content);
+
+    const promise = (async () => {
+      try {
+        await options.onSave(content);
+        if (saveGeneration !== generation) {
+          return false;
+        }
+        if (saveGeneration === generation) {
+          options.onSaveSuccess?.(content);
+        }
+        return true;
+      } catch (error) {
+        if (saveGeneration !== generation) {
+          return false;
+        }
+        if (saveGeneration === generation) {
+          options.onSaveError?.(error);
+        }
+        return false;
+      }
+    })();
+
+    const entry = { content, promise };
+    inFlight = entry;
+    notifySavingChange();
+    void promise.finally(() => {
+      if (inFlight === entry) {
+        inFlight = null;
+        notifySavingChange();
+      }
+    });
+    return promise;
+  };
+
+  const save = async (content: string): Promise<boolean> => {
+    const current = inFlight;
+    if (current) {
+      const waitGeneration = generation;
+      const ok = await current.promise;
+      if (waitGeneration !== generation) return false;
+      if (!ok || current.content === content) return ok;
+      return save(content);
+    }
+    return startSave(content);
+  };
+
+  return {
+    save,
+    isSaving: () => inFlight !== null,
+    reset: () => {
+      generation += 1;
+      if (inFlight) {
+        inFlight = null;
+        notifySavingChange();
+      }
+    },
+  };
+};

application/state/uploadService.test.ts

@@ -0,0 +1,197 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import {
+  UploadController,
+  startUploadScanningTask,
+  uploadEntriesDirect,
+  uploadFromDataTransfer,
+  uploadFromFileList,
+} from "../../lib/uploadService.ts";
+
+function createDataTransfer(files: File[]): DataTransfer {
+  return {
+    items: { length: 0 },
+    files,
+  } as unknown as DataTransfer;
+}
+
+function createDataTransferWithNullEntries(files: File[]): DataTransfer {
+  const items = files.map((file) => ({
+    kind: "file",
+    getAsFile: () => file,
+    webkitGetAsEntry: () => null,
+  }));
+  return {
+    items,
+    files,
+  } as unknown as DataTransfer;
+}
+
+test("upload scanning task can be shown and cancelled before transfers start", () => {
+  const events: string[] = [];
+  const scanningTask = startUploadScanningTask(
+    {
+      onScanningStart: (taskId) => events.push(`start:${taskId}`),
+      onScanningEnd: (taskId) => events.push(`end:${taskId}`),
+      onTaskCancelled: (taskId) => events.push(`cancel:${taskId}`),
+    },
+    "scan-folder-1",
+  );
+
+  assert.equal(scanningTask.isOpen(), true);
+  scanningTask.cancel();
+  scanningTask.complete();
+
+  assert.equal(scanningTask.isOpen(), false);
+  assert.deepEqual(events, ["start:scan-folder-1", "cancel:scan-folder-1"]);
+});
+
+test("clears the scanning placeholder when every dropped file is skipped by conflict resolution", async () => {
+  const events: string[] = [];
+  const file = new File(["local"], "conflict.txt", { lastModified: 1234 });
+
+  const results = await uploadFromDataTransfer(
+    createDataTransfer([file]),
+    {
+      targetPath: "/target",
+      sftpId: null,
+      isLocal: true,
+      bridge: {
+        mkdirSftp: async () => {},
+        statLocal: async () => ({ type: "file", size: 10, lastModified: 1000 }),
+        writeLocalFile: async () => {
+          throw new Error("skipped conflicts should not upload");
+        },
+      },
+      joinPath: (base, name) => `${base}/${name}`,
+      callbacks: {
+        onScanningStart: () => events.push("scan:start"),
+        onScanningEnd: () => events.push("scan:end"),
+        onTaskCreated: () => events.push("task:create"),
+      },
+      resolveConflict: async () => "skip",
+    },
+  );
+
+  assert.deepEqual(results, [
+    { fileName: "conflict.txt", success: false, cancelled: true },
+  ]);
+  assert.deepEqual(events, ["scan:start", "scan:end"]);
+});
+
+test("uploads DataTransfer files when entry extraction returns no entries", async () => {
+  const file = new File(["picked"], "picked.txt", { lastModified: 1234 });
+  const uploadedPaths: string[] = [];
+
+  const results = await uploadFromDataTransfer(
+    createDataTransferWithNullEntries([file]),
+    {
+      targetPath: "/target",
+      sftpId: "sftp-1",
+      isLocal: false,
+      bridge: {
+        mkdirSftp: async () => {},
+        writeSftpBinary: async (_sftpId, path) => {
+          uploadedPaths.push(path);
+        },
+      },
+      joinPath: (base, name) => `${base}/${name}`,
+    },
+  );
+
+  assert.deepEqual(uploadedPaths, ["/target/picked.txt"]);
+  assert.deepEqual(results, [
+    { fileName: "picked.txt", success: true },
+  ]);
+});
+
+test("uploads picked folder files with their relative directory structure", async () => {
+  const file = new File(["nested"], "file.txt", { lastModified: 1234 });
+  Object.defineProperty(file, "webkitRelativePath", {
+    value: "folder/sub/file.txt",
+  });
+  const madeDirs: string[] = [];
+  const uploadedPaths: string[] = [];
+
+  const results = await uploadFromFileList(
+    [file],
+    {
+      targetPath: "/target",
+      sftpId: "sftp-1",
+      isLocal: false,
+      bridge: {
+        mkdirSftp: async (_sftpId, path) => {
+          madeDirs.push(path);
+        },
+        writeSftpBinary: async (_sftpId, path) => {
+          uploadedPaths.push(path);
+        },
+      },
+      joinPath: (base, name) => `${base}/${name}`,
+    },
+  );
+
+  assert.deepEqual(madeDirs, ["/target/folder", "/target/folder/sub"]);
+  assert.deepEqual(uploadedPaths, ["/target/folder/sub/file.txt"]);
+  assert.deepEqual(results, [
+    { fileName: "folder/sub/file.txt", success: true },
+  ]);
+});
+
+test("reports empty directory creation failures", async () => {
+  const madeDirs: string[] = [];
+
+  const results = await uploadEntriesDirect(
+    [
+      { file: null, relativePath: "folder", isDirectory: true },
+      { file: null, relativePath: "folder/empty", isDirectory: true },
+    ],
+    {
+      targetPath: "/target",
+      sftpId: "sftp-1",
+      isLocal: false,
+      bridge: {
+        mkdirSftp: async (_sftpId, path) => {
+          madeDirs.push(path);
+          if (path.endsWith("/empty")) {
+            throw new Error("permission denied");
+          }
+        },
+      },
+      joinPath: (base, name) => `${base}/${name}`,
+    },
+  );
+
+  assert.deepEqual(madeDirs, ["/target/folder", "/target/folder/empty"]);
+  assert.deepEqual(results, [
+    { fileName: "folder/empty", success: false, error: "permission denied" },
+  ]);
+});
+
+test("does not restart a direct upload that was already cancelled", async () => {
+  const controller = new UploadController();
+  await controller.cancel();
+  let mkdirCalled = false;
+
+  const results = await uploadEntriesDirect(
+    [{ file: null, relativePath: "folder", isDirectory: true }],
+    {
+      targetPath: "/target",
+      sftpId: "sftp-1",
+      isLocal: false,
+      bridge: {
+        mkdirSftp: async () => {
+          mkdirCalled = true;
+        },
+      },
+      joinPath: (base, name) => `${base}/${name}`,
+    },
+    controller,
+  );
+
+  assert.equal(mkdirCalled, false);
+  assert.deepEqual(results, [
+    { fileName: "", success: false, cancelled: true },
+  ]);
+});

application/state/useAIState.ts

@@ -5,6 +5,7 @@ import {
   STORAGE_KEY_AI_ACTIVE_PROVIDER,
   STORAGE_KEY_AI_ACTIVE_MODEL,
   STORAGE_KEY_AI_PERMISSION_MODE,
+  STORAGE_KEY_AI_TOOL_INTEGRATION_MODE,
   STORAGE_KEY_AI_HOST_PERMISSIONS,
   STORAGE_KEY_AI_EXTERNAL_AGENTS,
   STORAGE_KEY_AI_DEFAULT_AGENT,
@@ -17,8 +18,11 @@ import {
   STORAGE_KEY_AI_WEB_SEARCH,
 } from '../../infrastructure/config/storageKeys';
 import type {
+  AIDraft,
+  AIPanelView,
   AISession,
   AIPermissionMode,
+  AIToolIntegrationMode,
   ProviderConfig,
   HostAIPermission,
   ExternalAgentConfig,
@@ -27,13 +31,42 @@ import type {
   WebSearchConfig,
 } from '../../infrastructure/ai/types';
 import { DEFAULT_COMMAND_BLOCKLIST } from '../../infrastructure/ai/types';
+import {
+  activateDraftView,
+  bumpDraftMutationVersionState,
+  bumpDraftUploadGenerationState,
+  clearScopeDraftState,
+  ensureDraftForScopeState,
+  getDraftUploadGenerationState,
+  setSessionView,
+  updateDraftForScope,
+} from './aiDraftState';
+import {
+  pruneInactiveScopedSessions,
+  pruneInactiveScopedTransientState,
+} from './aiScopeCleanup';
+import { convertFilesToUploads } from './useFileUpload';
 
 /** Typed accessor for the Electron IPC bridge exposed on `window.netcatty`. */
+interface AIBridge {
+  aiAcpCleanup?: (chatSessionId: string) => Promise<{ ok: boolean }>;
+  aiMcpSetPermissionMode?: (mode: AIPermissionMode) => Promise<unknown> | unknown;
+  aiMcpSetToolIntegrationMode?: (mode: AIToolIntegrationMode) => Promise<unknown> | unknown;
+  aiMcpSetCommandBlocklist?: (blocklist: string[]) => Promise<unknown> | unknown;
+  aiMcpSetCommandTimeout?: (timeout: number) => Promise<unknown> | unknown;
+  aiMcpSetMaxIterations?: (maxIterations: number) => Promise<unknown> | unknown;
+}
+
 function getAIBridge() {
-  return (window as unknown as { netcatty?: Record<string, (...args: unknown[]) => unknown> }).netcatty;
+  return (window as unknown as { netcatty?: AIBridge }).netcatty;
 }
 
 const AI_STATE_CHANGED_EVENT = 'netcatty:ai-state-changed';
+const AI_STATE_CHANGED_DRAFTS_BY_SCOPE = 'netcatty:ai-drafts-by-scope';
+const AI_STATE_CHANGED_PANEL_VIEW_BY_SCOPE = 'netcatty:ai-panel-view-by-scope';
+
+type DraftsByScope = Partial<Record<string, AIDraft>>;
+type PanelViewByScope = Partial<Record<string, AIPanelView>>;
 
 function emitAIStateChanged(key: string) {
   window.dispatchEvent(new CustomEvent<{ key: string }>(AI_STATE_CHANGED_EVENT, { detail: { key } }));
@@ -61,53 +94,41 @@ export function cleanupOrphanedAISessions(activeTargetIds: Set<string>) {
   const currentSessions = latestAISessionsSnapshot
     ?? localStorageAdapter.read<AISession[]>(STORAGE_KEY_AI_SESSIONS)
     ?? [];
-  const orphanedSessionIds = currentSessions
-    .filter((session) => session.scope.targetId && !activeTargetIds.has(session.scope.targetId))
-    .map((session) => session.id);
 
-  if (orphanedSessionIds.length > 0) {
-    const orphanedSessionIdSet = new Set(orphanedSessionIds);
-
-    // Determine which sessions can be restored via host-based matching
-    const preservedIds = new Set<string>();
-    for (const session of currentSessions) {
-      if (!orphanedSessionIdSet.has(session.id)) continue;
-      // Only preserve remote terminal sessions with real hostIds
-      const isRestorable = session.scope.type === 'terminal'
-        && session.scope.hostIds?.length
-        && session.scope.hostIds.some((id) => !id.startsWith('local-') && !id.startsWith('serial-'));
-      if (isRestorable) {
-        preservedIds.add(session.id);
-      }
-    }
-
-    // Cleanup ACP sessions for all orphans (both deleted and preserved).
-    // Preserved sessions will get a new externalSessionId on next use,
-    // so cleaning the old one is safe and prevents subprocess leaks.
-    cleanupAcpSessions(orphanedSessionIds);
-
-    const nextSessions = currentSessions
-      .filter((session) => !orphanedSessionIdSet.has(session.id) || preservedIds.has(session.id))
-      .map((session) => {
-        if (!preservedIds.has(session.id) || !session.externalSessionId) {
-          return session;
-        }
-        // Drop transient ACP session handles so the next turn starts cleanly.
-        return { ...session, externalSessionId: undefined };
-      });
-
-    const sessionsChanged = nextSessions.length !== currentSessions.length
-      || nextSessions.some((session, index) => session !== currentSessions[index]);
-    if (sessionsChanged) {
-      setLatestAISessionsSnapshot(nextSessions);
-      localStorageAdapter.write(STORAGE_KEY_AI_SESSIONS, pruneSessionsForStorage(nextSessions));
-      emitAIStateChanged(STORAGE_KEY_AI_SESSIONS);
-    }
-  }
-
-  const activeSessionIdMap = latestAIActiveSessionMapSnapshot
+  // Sessions shown by a still-live scope must be protected from cleanup
+  // even when their own `scope.targetId` points at a closed terminal —
+  // history can be resumed into a different terminal and we must not
+  // delete it outright while it's actively being used.
+  const preCleanupActiveSessionMap = latestAIActiveSessionMapSnapshot
     ?? localStorageAdapter.read<Record<string, string | null>>(STORAGE_KEY_AI_ACTIVE_SESSION_MAP)
     ?? {};
+  const activeSessionIds = new Set<string>();
+  for (const [scopeKey, sessionId] of Object.entries(preCleanupActiveSessionMap)) {
+    if (!sessionId) continue;
+    if (!isScopeKeyActive(scopeKey, activeTargetIds)) continue;
+    activeSessionIds.add(sessionId);
+  }
+
+  const nextSessionCleanup = pruneInactiveScopedSessions(
+    currentSessions,
+    activeTargetIds,
+    activeSessionIds,
+  );
+
+  if (nextSessionCleanup.orphanedSessionIds.length > 0) {
+    cleanupAcpSessions(nextSessionCleanup.orphanedSessionIds);
+  }
+
+  if (nextSessionCleanup.sessions !== currentSessions) {
+    setLatestAISessionsSnapshot(nextSessionCleanup.sessions);
+    localStorageAdapter.write(
+      STORAGE_KEY_AI_SESSIONS,
+      pruneSessionsForStorage(nextSessionCleanup.sessions),
+    );
+    emitAIStateChanged(STORAGE_KEY_AI_SESSIONS);
+  }
+
+  const activeSessionIdMap = preCleanupActiveSessionMap;
   let activeSessionMapChanged = false;
   const nextActiveSessionIdMap = { ...activeSessionIdMap };
 
@@ -122,6 +143,46 @@ export function cleanupOrphanedAISessions(activeTargetIds: Set<string>) {
     localStorageAdapter.write(STORAGE_KEY_AI_ACTIVE_SESSION_MAP, nextActiveSessionIdMap);
     emitAIStateChanged(STORAGE_KEY_AI_ACTIVE_SESSION_MAP);
   }
+
+  const currentActiveSessionIdMap = activeSessionMapChanged
+    ? nextActiveSessionIdMap
+    : activeSessionIdMap;
+  const currentDraftsByScope = latestAIDraftsByScopeSnapshot ?? {};
+  const currentPanelViewByScope = latestAIPanelViewByScopeSnapshot ?? {};
+  const prunedScopedTransientState = pruneInactiveScopedTransientState(
+    currentActiveSessionIdMap,
+    currentDraftsByScope,
+    currentPanelViewByScope,
+    activeTargetIds,
+  );
+
+  if (prunedScopedTransientState.activeSessionIdMap !== currentActiveSessionIdMap) {
+    setLatestAIActiveSessionMapSnapshot(prunedScopedTransientState.activeSessionIdMap);
+    localStorageAdapter.write(
+      STORAGE_KEY_AI_ACTIVE_SESSION_MAP,
+      prunedScopedTransientState.activeSessionIdMap,
+    );
+    emitAIStateChanged(STORAGE_KEY_AI_ACTIVE_SESSION_MAP);
+  }
+
+  if (prunedScopedTransientState.draftsByScope !== currentDraftsByScope) {
+    for (const scopeKey of Object.keys(currentDraftsByScope)) {
+      if (scopeKey in prunedScopedTransientState.draftsByScope) continue;
+      bumpDraftMutationVersion(scopeKey);
+      bumpDraftUploadGeneration(scopeKey);
+    }
+    setLatestAIDraftsByScopeSnapshot(prunedScopedTransientState.draftsByScope);
+    emitAIStateChanged(AI_STATE_CHANGED_DRAFTS_BY_SCOPE);
+  }
+
+  if (prunedScopedTransientState.panelViewByScope !== currentPanelViewByScope) {
+    for (const scopeKey of Object.keys(currentPanelViewByScope)) {
+      if (scopeKey in prunedScopedTransientState.panelViewByScope) continue;
+      bumpDraftMutationVersion(scopeKey);
+    }
+    setLatestAIPanelViewByScopeSnapshot(prunedScopedTransientState.panelViewByScope);
+    emitAIStateChanged(AI_STATE_CHANGED_PANEL_VIEW_BY_SCOPE);
+  }
 }
 
 
@@ -152,6 +213,10 @@ function pruneSessionsForStorage(sessions: AISession[]): AISession[] {
 
 let latestAISessionsSnapshot: AISession[] | null = null;
 let latestAIActiveSessionMapSnapshot: Record<string, string | null> | null = null;
+let latestAIDraftsByScopeSnapshot: DraftsByScope | null = null;
+let latestAIPanelViewByScopeSnapshot: PanelViewByScope | null = null;
+let latestAIDraftMutationVersionByScopeSnapshot: Record<string, number> = {};
+let latestAIDraftUploadGenerationByScopeSnapshot: Record<string, number> = {};
 
 function setLatestAISessionsSnapshot(sessions: AISession[]) {
   latestAISessionsSnapshot = sessions;
@@ -161,17 +226,33 @@ function setLatestAIActiveSessionMapSnapshot(activeSessionIdMap: Record<string,
   latestAIActiveSessionMapSnapshot = activeSessionIdMap;
 }
 
-function buildScopeKey(scope: AISessionScope) {
-  return `${scope.type}:${scope.targetId ?? ''}`;
+function setLatestAIDraftsByScopeSnapshot(draftsByScope: DraftsByScope) {
+  latestAIDraftsByScopeSnapshot = draftsByScope;
 }
 
-function areHostIdsEqual(left?: string[], right?: string[]) {
-  const leftIds = left ?? [];
-  const rightIds = right ?? [];
-  if (leftIds.length !== rightIds.length) return false;
+function setLatestAIPanelViewByScopeSnapshot(panelViewByScope: PanelViewByScope) {
+  latestAIPanelViewByScopeSnapshot = panelViewByScope;
+}
 
-  const rightSet = new Set(rightIds);
-  return leftIds.every((hostId) => rightSet.has(hostId));
+function bumpDraftMutationVersion(scopeKey: string) {
+  latestAIDraftMutationVersionByScopeSnapshot = bumpDraftMutationVersionState(
+    latestAIDraftMutationVersionByScopeSnapshot,
+    scopeKey,
+  );
+}
+
+function getDraftUploadGeneration(scopeKey: string) {
+  return getDraftUploadGenerationState(
+    latestAIDraftUploadGenerationByScopeSnapshot,
+    scopeKey,
+  );
+}
+
+function bumpDraftUploadGeneration(scopeKey: string) {
+  latestAIDraftUploadGenerationByScopeSnapshot = bumpDraftUploadGenerationState(
+    latestAIDraftUploadGenerationByScopeSnapshot,
+    scopeKey,
+  );
 }
 
 export function useAIState() {
@@ -192,6 +273,10 @@ export function useAIState() {
     if (stored === 'observer' || stored === 'confirm' || stored === 'autonomous') return stored;
     return 'confirm';
   });
+  const [toolIntegrationMode, setToolIntegrationModeRaw] = useState<AIToolIntegrationMode>(() => {
+    const stored = localStorageAdapter.readString(STORAGE_KEY_AI_TOOL_INTEGRATION_MODE);
+    return stored === 'skills' ? 'skills' : 'mcp';
+  });
   const [hostPermissions, setHostPermissionsRaw] = useState<HostAIPermission[]>(() =>
     localStorageAdapter.read<HostAIPermission[]>(STORAGE_KEY_AI_HOST_PERMISSIONS) ?? []
   );
@@ -228,6 +313,14 @@ export function useAIState() {
   const [activeSessionIdMap, setActiveSessionIdMapRaw] = useState<Record<string, string | null>>(() =>
     localStorageAdapter.read<Record<string, string | null>>(STORAGE_KEY_AI_ACTIVE_SESSION_MAP) ?? {}
   );
+  // Per-scope draft/view state is intentionally memory-only so a relaunch
+  // does not restore stale composer input or panel intent against new history.
+  const [draftsByScope, setDraftsByScopeRaw] = useState<DraftsByScope>(() =>
+    latestAIDraftsByScopeSnapshot ?? {}
+  );
+  const [panelViewByScope, setPanelViewByScopeRaw] = useState<PanelViewByScope>(() =>
+    latestAIPanelViewByScopeSnapshot ?? {}
+  );
 
   // Per-agent model selection: remembers last selected model per agent
   const [agentModelMap, setAgentModelMapRaw] = useState<Record<string, string>>(() =>
@@ -247,12 +340,20 @@ export function useAIState() {
     setLatestAIActiveSessionMapSnapshot(activeSessionIdMap);
   }, [activeSessionIdMap]);
 
+  useEffect(() => {
+    setLatestAIDraftsByScopeSnapshot(draftsByScope);
+  }, [draftsByScope]);
+
+  useEffect(() => {
+    setLatestAIPanelViewByScopeSnapshot(panelViewByScope);
+  }, [panelViewByScope]);
+
   useEffect(() => {
     const validSessionIds = new Set(sessions.map((session) => session.id));
     let changed = false;
     const nextActiveSessionIdMap: Record<string, string | null> = {};
 
-    for (const [scopeKey, sessionId] of Object.entries(activeSessionIdMap)) {
+    for (const [scopeKey, sessionId] of Object.entries(activeSessionIdMap) as Array<[string, string | null]>) {
       const nextSessionId = sessionId && validSessionIds.has(sessionId) ? sessionId : null;
       nextActiveSessionIdMap[scopeKey] = nextSessionId;
       if (nextSessionId !== sessionId) {
@@ -269,13 +370,39 @@ export function useAIState() {
   }, [sessions, activeSessionIdMap]);
 
   const setActiveSessionId = useCallback((scopeKey: string, id: string | null) => {
+    let nextActiveSessionIdMap: Record<string, string | null> | null = null;
+
     setActiveSessionIdMapRaw(prev => {
+      if (prev[scopeKey] === id) {
+        return prev;
+      }
+
       const next = { ...prev, [scopeKey]: id };
-      setLatestAIActiveSessionMapSnapshot(next);
-      localStorageAdapter.write(STORAGE_KEY_AI_ACTIVE_SESSION_MAP, next);
-      emitAIStateChanged(STORAGE_KEY_AI_ACTIVE_SESSION_MAP);
+      nextActiveSessionIdMap = next;
       return next;
     });
+
+    if (!nextActiveSessionIdMap) return;
+
+    setLatestAIActiveSessionMapSnapshot(nextActiveSessionIdMap);
+    localStorageAdapter.write(STORAGE_KEY_AI_ACTIVE_SESSION_MAP, nextActiveSessionIdMap);
+    emitAIStateChanged(STORAGE_KEY_AI_ACTIVE_SESSION_MAP);
+  }, []);
+
+  const setPanelViewByScope = useCallback((value: PanelViewByScope | ((prev: PanelViewByScope) => PanelViewByScope)) => {
+    let nextPanelViewByScope: PanelViewByScope | null = null;
+
+    setPanelViewByScopeRaw((prev) => {
+      const next = typeof value === 'function' ? value(prev) : value;
+      if (next === prev) return prev;
+      nextPanelViewByScope = next;
+      return next;
+    });
+
+    if (!nextPanelViewByScope) return;
+
+    setLatestAIPanelViewByScopeSnapshot(nextPanelViewByScope);
+    emitAIStateChanged(AI_STATE_CHANGED_PANEL_VIEW_BY_SCOPE);
   }, []);
 
   const setAgentModel = useCallback((agentId: string, modelId: string) => {
@@ -330,6 +457,13 @@ export function useAIState() {
     });
   }, []);
 
+  const setToolIntegrationMode = useCallback((mode: AIToolIntegrationMode) => {
+    setToolIntegrationModeRaw(mode);
+    localStorageAdapter.writeString(STORAGE_KEY_AI_TOOL_INTEGRATION_MODE, mode);
+    const bridge = getAIBridge();
+    bridge?.aiMcpSetToolIntegrationMode?.(mode);
+  }, []);
+
   const setExternalAgents = useCallback((value: ExternalAgentConfig[] | ((prev: ExternalAgentConfig[]) => ExternalAgentConfig[])) => {
     setExternalAgentsRaw(prev => {
       const next = typeof value === 'function' ? value(prev) : value;
@@ -396,6 +530,15 @@ export function useAIState() {
             }
             break;
           }
+          case STORAGE_KEY_AI_TOOL_INTEGRATION_MODE:
+            {
+              const mode = localStorageAdapter.readString(STORAGE_KEY_AI_TOOL_INTEGRATION_MODE) === 'skills'
+                ? 'skills'
+                : 'mcp';
+              setToolIntegrationModeRaw(mode);
+              getAIBridge()?.aiMcpSetToolIntegrationMode?.(mode);
+            }
+            break;
           case STORAGE_KEY_AI_EXTERNAL_AGENTS: {
             const agents = localStorageAdapter.read<ExternalAgentConfig[]>(STORAGE_KEY_AI_EXTERNAL_AGENTS);
             if (agents != null && !Array.isArray(agents)) {
@@ -491,6 +634,12 @@ export function useAIState() {
               ?? {},
           );
           return;
+        case AI_STATE_CHANGED_DRAFTS_BY_SCOPE:
+          setDraftsByScopeRaw(latestAIDraftsByScopeSnapshot ?? {});
+          return;
+        case AI_STATE_CHANGED_PANEL_VIEW_BY_SCOPE:
+          setPanelViewByScopeRaw(latestAIPanelViewByScopeSnapshot ?? {});
+          return;
         default:
           handleStorage({ key } as StorageEvent);
       }
@@ -511,8 +660,17 @@ export function useAIState() {
     bridge?.aiMcpSetCommandTimeout?.(initialTimeout);
     const initialMaxIter = localStorageAdapter.readNumber(STORAGE_KEY_AI_MAX_ITERATIONS) ?? 20;
     bridge?.aiMcpSetMaxIterations?.(initialMaxIter);
-    const initialPermMode = localStorageAdapter.readString(STORAGE_KEY_AI_PERMISSION_MODE) ?? 'confirm';
+    const storedPermMode = localStorageAdapter.readString(STORAGE_KEY_AI_PERMISSION_MODE);
+    const initialPermMode: AIPermissionMode =
+      storedPermMode === 'observer' || storedPermMode === 'confirm' || storedPermMode === 'autonomous'
+        ? storedPermMode
+        : 'confirm';
     bridge?.aiMcpSetPermissionMode?.(initialPermMode);
+    const initialToolMode: AIToolIntegrationMode =
+      localStorageAdapter.readString(STORAGE_KEY_AI_TOOL_INTEGRATION_MODE) === 'skills'
+        ? 'skills'
+        : 'mcp';
+    bridge?.aiMcpSetToolIntegrationMode?.(initialToolMode);
   }, []);
 
   // ── Session CRUD ──
@@ -646,61 +804,6 @@ export function useAIState() {
     });
   }, [debouncedPersistSessions]);
 
-  const retargetSessionScope = useCallback((sessionId: string, scope: AISessionScope) => {
-    const currentSession = sessionsRef.current.find((session) => session.id === sessionId);
-    if (!currentSession) return;
-
-    const currentScope = currentSession.scope;
-    const scopeChanged =
-      currentScope.type !== scope.type
-      || currentScope.targetId !== scope.targetId
-      || !areHostIdsEqual(currentScope.hostIds, scope.hostIds);
-
-    const nextScopeKey = buildScopeKey(scope);
-    const currentScopeKey = buildScopeKey(currentScope);
-
-    if (scopeChanged) {
-      setSessionsRaw((prev) => {
-        let changed = false;
-        const next = prev.map((session) => {
-          if (session.id !== sessionId) return session;
-          changed = true;
-          // Clear stale ACP handle — retarget may run before orphan cleanup
-          return { ...session, scope, externalSessionId: undefined };
-        });
-
-        if (!changed) return prev;
-
-        sessionsRef.current = next;
-        setLatestAISessionsSnapshot(next);
-        persistSessions(next);
-        return next;
-      });
-    }
-
-    setActiveSessionIdMapRaw((prev) => {
-      let changed = false;
-      const next = { ...prev };
-
-      if (currentScopeKey !== nextScopeKey && next[currentScopeKey] === sessionId) {
-        delete next[currentScopeKey];
-        changed = true;
-      }
-
-      if (next[nextScopeKey] !== sessionId) {
-        next[nextScopeKey] = sessionId;
-        changed = true;
-      }
-
-      if (!changed) return prev;
-
-      setLatestAIActiveSessionMapSnapshot(next);
-      localStorageAdapter.write(STORAGE_KEY_AI_ACTIVE_SESSION_MAP, next);
-      emitAIStateChanged(STORAGE_KEY_AI_ACTIVE_SESSION_MAP);
-      return next;
-    });
-  }, [persistSessions]);
-
   // Maximum messages per session to prevent unbounded memory growth
   const MAX_MESSAGES_PER_SESSION = 500;
 
@@ -768,14 +871,193 @@ export function useAIState() {
     });
   }, [persistSessions]);
 
+  const ensureDraftForScope = useCallback((scopeKey: string, agentId: string): void => {
+    let nextDraftsByScope: DraftsByScope | null = null;
+
+    setDraftsByScopeRaw((prev) => {
+      const next = ensureDraftForScopeState(prev, scopeKey, agentId);
+      if (next === prev) return prev;
+      nextDraftsByScope = next;
+      return next;
+    });
+
+    if (!nextDraftsByScope) return;
+
+    bumpDraftMutationVersion(scopeKey);
+    setLatestAIDraftsByScopeSnapshot(nextDraftsByScope);
+    emitAIStateChanged(AI_STATE_CHANGED_DRAFTS_BY_SCOPE);
+  }, []);
+
+  const updateDraft = useCallback((
+    scopeKey: string,
+    fallbackAgentId: string,
+    updater: (draft: AIDraft) => AIDraft,
+  ): void => {
+    setDraftsByScopeRaw((prev) => {
+      const next = updateDraftForScope(
+        prev,
+        scopeKey,
+        fallbackAgentId,
+        (draft) => {
+          return {
+            ...updater(draft),
+            updatedAt: Date.now(),
+          };
+        },
+      );
+      setLatestAIDraftsByScopeSnapshot(next);
+      emitAIStateChanged(AI_STATE_CHANGED_DRAFTS_BY_SCOPE);
+      return next;
+    });
+    bumpDraftMutationVersion(scopeKey);
+  }, []);
+
+  const updateDraftIfPresent = useCallback((
+    scopeKey: string,
+    updater: (draft: AIDraft) => AIDraft,
+  ): void => {
+    let updated = false;
+
+    setDraftsByScopeRaw((prev) => {
+      const currentDraft = prev[scopeKey];
+      if (!currentDraft) return prev;
+
+      const nextDraft = {
+        ...updater(currentDraft),
+        updatedAt: Date.now(),
+      };
+      const next = {
+        ...prev,
+        [scopeKey]: nextDraft,
+      };
+      updated = true;
+      setLatestAIDraftsByScopeSnapshot(next);
+      emitAIStateChanged(AI_STATE_CHANGED_DRAFTS_BY_SCOPE);
+      return next;
+    });
+
+    if (updated) {
+      bumpDraftMutationVersion(scopeKey);
+    }
+  }, []);
+
+  const showDraftView = useCallback((scopeKey: string) => {
+    const currentPanelViewByScope = panelViewByScope;
+    let nextActiveSessionIdMap: Record<string, string | null> | null = null;
+    let nextPanelViewByScope: PanelViewByScope | null = null;
+    let activeSessionMapChanged = false;
+    let panelViewChanged = false;
+
+    setActiveSessionIdMapRaw((prevActiveSessionIdMap) => {
+      const next = activateDraftView(
+        prevActiveSessionIdMap,
+        currentPanelViewByScope,
+        scopeKey,
+      );
+      activeSessionMapChanged = next.activeSessionIdMap !== prevActiveSessionIdMap;
+      panelViewChanged = next.panelViewByScope !== currentPanelViewByScope;
+      nextActiveSessionIdMap = next.activeSessionIdMap;
+      nextPanelViewByScope = next.panelViewByScope;
+      return activeSessionMapChanged ? next.activeSessionIdMap : prevActiveSessionIdMap;
+    });
+
+    if (activeSessionMapChanged && nextActiveSessionIdMap) {
+      setLatestAIActiveSessionMapSnapshot(nextActiveSessionIdMap);
+      localStorageAdapter.write(STORAGE_KEY_AI_ACTIVE_SESSION_MAP, nextActiveSessionIdMap);
+      emitAIStateChanged(STORAGE_KEY_AI_ACTIVE_SESSION_MAP);
+    }
+
+    if (panelViewChanged && nextPanelViewByScope) {
+      setLatestAIPanelViewByScopeSnapshot(nextPanelViewByScope);
+      setPanelViewByScopeRaw(nextPanelViewByScope);
+      emitAIStateChanged(AI_STATE_CHANGED_PANEL_VIEW_BY_SCOPE);
+    }
+  }, [panelViewByScope]);
+
+  const showSessionView = useCallback((scopeKey: string, sessionId: string) => {
+    setPanelViewByScope((prev) => setSessionView(prev, scopeKey, sessionId));
+  }, [setPanelViewByScope]);
+
+  const clearDraftForScope = useCallback((scopeKey: string) => {
+    const currentPanelViewByScope = panelViewByScope;
+    let nextDraftsByScope: DraftsByScope | null = null;
+    let nextPanelViewByScope: PanelViewByScope | null = null;
+    let draftsChanged = false;
+    let panelViewChanged = false;
+
+    setDraftsByScopeRaw((prevDraftsByScope) => {
+      const next = clearScopeDraftState(
+        prevDraftsByScope,
+        currentPanelViewByScope,
+        scopeKey,
+      );
+      draftsChanged = next.draftsByScope !== prevDraftsByScope;
+      panelViewChanged = next.panelViewByScope !== currentPanelViewByScope;
+      nextDraftsByScope = next.draftsByScope;
+      nextPanelViewByScope = next.panelViewByScope;
+      return draftsChanged ? next.draftsByScope : prevDraftsByScope;
+    });
+
+    if (!draftsChanged && !panelViewChanged) return;
+
+    bumpDraftMutationVersion(scopeKey);
+    bumpDraftUploadGeneration(scopeKey);
+
+    if (draftsChanged && nextDraftsByScope) {
+      setLatestAIDraftsByScopeSnapshot(nextDraftsByScope);
+      emitAIStateChanged(AI_STATE_CHANGED_DRAFTS_BY_SCOPE);
+    }
+
+    if (panelViewChanged && nextPanelViewByScope) {
+      setLatestAIPanelViewByScopeSnapshot(nextPanelViewByScope);
+      setPanelViewByScopeRaw(nextPanelViewByScope);
+      emitAIStateChanged(AI_STATE_CHANGED_PANEL_VIEW_BY_SCOPE);
+    }
+  }, [panelViewByScope]);
+
+  const addDraftFiles = useCallback(async (
+    scopeKey: string,
+    fallbackAgentId: string,
+    inputFiles: File[],
+  ) => {
+    ensureDraftForScope(scopeKey, fallbackAgentId);
+    const initialUploadGeneration = getDraftUploadGeneration(scopeKey);
+    const uploads = await convertFilesToUploads(inputFiles);
+    if (uploads.length === 0) return;
+
+    if (getDraftUploadGeneration(scopeKey) !== initialUploadGeneration) {
+      return;
+    }
+
+    updateDraftIfPresent(scopeKey, (draft) => ({
+      ...draft,
+      attachments: [...draft.attachments, ...uploads],
+    }));
+  }, [ensureDraftForScope, updateDraftIfPresent]);
+
+  const removeDraftFile = useCallback((scopeKey: string, fallbackAgentId: string, fileId: string) => {
+    updateDraft(scopeKey, fallbackAgentId, (draft) => ({
+      ...draft,
+      attachments: draft.attachments.filter((file) => file.id !== fileId),
+    }));
+  }, [updateDraft]);
+
   const cleanupOrphanedSessions = useCallback((activeTargetIds: Set<string>) => {
     cleanupOrphanedAISessions(activeTargetIds);
-    setSessionsRaw(latestAISessionsSnapshot ?? localStorageAdapter.read<AISession[]>(STORAGE_KEY_AI_SESSIONS) ?? []);
+
+    const nextSessions =
+      latestAISessionsSnapshot
+      ?? localStorageAdapter.read<AISession[]>(STORAGE_KEY_AI_SESSIONS)
+      ?? [];
+    sessionsRef.current = nextSessions;
+    setSessionsRaw(nextSessions);
     setActiveSessionIdMapRaw(
       latestAIActiveSessionMapSnapshot
         ?? localStorageAdapter.read<Record<string, string | null>>(STORAGE_KEY_AI_ACTIVE_SESSION_MAP)
         ?? {},
     );
+    setDraftsByScopeRaw(latestAIDraftsByScopeSnapshot ?? {});
+    setPanelViewByScopeRaw(latestAIPanelViewByScopeSnapshot ?? {});
   }, []);
 
   // ── Provider CRUD helpers ──
@@ -819,6 +1101,8 @@ export function useAIState() {
     // Permission model
     globalPermissionMode,
     setGlobalPermissionMode,
+    toolIntegrationMode,
+    setToolIntegrationMode,
     hostPermissions,
     setHostPermissions,
 
@@ -847,13 +1131,21 @@ export function useAIState() {
     // Sessions (per-scope active session)
     sessions,
     activeSessionIdMap,
+    draftsByScope,
+    panelViewByScope,
     setActiveSessionId,
+    ensureDraftForScope,
+    updateDraft,
+    showDraftView,
+    showSessionView,
+    clearDraftForScope,
+    addDraftFiles,
+    removeDraftFile,
     createSession,
     deleteSession,
     deleteSessionsByTarget,
     updateSessionTitle,
     updateSessionExternalSessionId,
-    retargetSessionScope,
     addMessageToSession,
     updateLastMessage,
     updateMessageById,

application/state/useApplicationBackend.ts

@@ -15,15 +15,15 @@ export type SshAgentStatus = {
 
 export const useApplicationBackend = () => {
   const openExternal = useCallback(async (url: string) => {
-    try {
-      const bridge = netcattyBridge.get();
-      if (bridge?.openExternal) {
-        await bridge.openExternal(url);
-        return;
-      }
-    } catch {
-      // Ignore and fall back below
+    const bridge = netcattyBridge.get();
+    if (bridge?.openExternal) {
+      // Bridge resolves on success (either via system browser or in-app
+      // fallback window) and rejects only when both paths fail. Let the
+      // rejection propagate so callers can present a user-facing message.
+      await bridge.openExternal(url);
+      return;
     }
+    // Fallback for non-Electron environments (tests, dev server, etc.).
     window.open(url, "_blank", "noopener,noreferrer");
   }, []);
 

application/state/useAutoSync.ts

@@ -16,10 +16,20 @@ import {
   findSyncPayloadEncryptedCredentialPaths,
 } from '../../domain/credentials';
 import { isProviderReadyForSync, type CloudProvider, type SyncPayload } from '../../domain/sync';
-import { collectSyncableSettings } from '../syncPayload';
-import { STORAGE_KEY_PORT_FORWARDING } from '../../infrastructure/config/storageKeys';
-import { localStorageAdapter } from '../../infrastructure/persistence/localStorageAdapter';
-import { getEffectiveKnownHosts } from '../../infrastructure/syncHelpers';
+import {
+  SYNCABLE_SETTING_STORAGE_KEYS,
+  collectSyncableSettings,
+  getEffectivePortForwardingRulesForSync,
+  hasMeaningfulCloudSyncData,
+} from '../syncPayload';
+import { readInterruptedVaultApply } from '../localVaultBackups';
+import {
+  STORAGE_KEY_VAULT_RESTORE_IN_PROGRESS_UNTIL,
+} from '../../infrastructure/config/storageKeys';
+import {
+  LOCAL_STORAGE_ADAPTER_CHANGED_EVENT,
+  localStorageAdapter,
+} from '../../infrastructure/persistence/localStorageAdapter';
 import { notify } from '../notification';
 
 interface AutoSyncConfig {
@@ -27,22 +37,57 @@ interface AutoSyncConfig {
   hosts: SyncPayload['hosts'];
   keys: SyncPayload['keys'];
   identities?: SyncPayload['identities'];
+  proxyProfiles?: SyncPayload['proxyProfiles'];
   snippets: SyncPayload['snippets'];
   customGroups: SyncPayload['customGroups'];
   snippetPackages?: SyncPayload['snippetPackages'];
   portForwardingRules?: SyncPayload['portForwardingRules'];
-  knownHosts?: SyncPayload['knownHosts'];
   groupConfigs?: SyncPayload['groupConfigs'];
   /** Opaque token that changes whenever a synced setting changes. */
   settingsVersion?: number;
+  startupReady?: boolean;
 
   // Callbacks
-  onApplyPayload: (payload: SyncPayload) => void;
+  onApplyPayload: (payload: SyncPayload) => void | Promise<void>;
 }
 
 // Get manager singleton for direct state access
 const manager = getCloudSyncManager();
 const AUTO_SYNC_PROVIDER_ORDER: CloudProvider[] = ['github', 'google', 'onedrive', 'webdav', 's3'];
+const SYNCABLE_SETTING_STORAGE_KEY_SET = new Set<string>(SYNCABLE_SETTING_STORAGE_KEYS);
+
+// Cross-window restore barrier: stored as an epoch-ms deadline. Any value
+// in the future means a restore is applying in some window and auto-sync
+// must not push concurrently. The writer (`withRestoreBarrier`) heartbeats
+// the deadline to keep it alive; a crashed window naturally expires within
+// ~RESTORE_BARRIER_HOLD_MS. We still defend against two degenerate cases:
+// (1) a stale deadline sitting in the past — harmless but pollutes debug
+//     state, so we opportunistically clear it; (2) a deadline absurdly far
+//     in the future (clock skew between windows, pathological holdMs, or a
+//     tampered value) — would otherwise lock auto-sync indefinitely, so we
+//     clear it and treat the barrier as inactive.
+const RESTORE_BARRIER_SANITY_MAX_MS = 10 * 60 * 1000; // 10 minutes
+const isRestoreInProgress = (): boolean => {
+  const raw = localStorageAdapter.readNumber(STORAGE_KEY_VAULT_RESTORE_IN_PROGRESS_UNTIL);
+  if (typeof raw !== 'number' || raw <= 0) return false;
+  const now = Date.now();
+  if (raw <= now) {
+    // Deadline is in the past — either a clean finish that failed to
+    // overwrite the key, or a crashed heartbeat. Clear so subsequent
+    // reads are cheap and the key doesn't linger forever.
+    localStorageAdapter.writeNumber(STORAGE_KEY_VAULT_RESTORE_IN_PROGRESS_UNTIL, 0);
+    return false;
+  }
+  if (raw - now > RESTORE_BARRIER_SANITY_MAX_MS) {
+    console.warn(
+      '[useAutoSync] Restore barrier deadline is absurdly far in the future; treating as corrupt and clearing.',
+      { deadline: raw, now },
+    );
+    localStorageAdapter.writeNumber(STORAGE_KEY_VAULT_RESTORE_IN_PROGRESS_UNTIL, 0);
+    return false;
+  }
+  return true;
+};
 
 type SyncTrigger = 'auto' | 'manual';
 
@@ -57,10 +102,28 @@ export const useAutoSync = (config: AutoSyncConfig) => {
   const syncTimeoutRef = useRef<NodeJS.Timeout | null>(null);
   const lastSyncedDataRef = useRef<string>('');
   const hasCheckedRemoteRef = useRef(false);
+  /** True once checkRemoteVersion has completed (success or failure). Until
+   *  this is set, the debounced auto-sync effect will not fire, preventing
+   *  an empty local vault from racing ahead and overwriting a non-empty
+   *  cloud vault before the startup pull has run. See #679. */
+  const remoteCheckDoneRef = useRef(false);
   const isInitializedRef = useRef(false);
   const isSyncRunningRef = useRef(false);
   const skipNextSyncRef = useRef(false);
 
+  // State for the empty-vault-vs-cloud confirmation dialog (Fix D).
+  // When checkRemoteVersion detects that the local vault is empty but
+  // the cloud has data, it pauses and exposes this state so the root
+  // component can render a confirmation dialog.
+  const [emptyVaultConflict, setEmptyVaultConflict] = useState<{
+    remotePayload: SyncPayload;
+    hostCount: number;
+    keyCount: number;
+    proxyProfileCount: number;
+    snippetCount: number;
+  } | null>(null);
+  const emptyVaultResolveRef = useRef<((action: 'restore' | 'keep-empty') => void) | null>(null);
+
   // Listen for SFTP bookmark changes to trigger auto-sync
   const [bookmarksVersion, setBookmarksVersion] = useState(0);
   useEffect(() => {
@@ -69,44 +132,50 @@ export const useAutoSync = (config: AutoSyncConfig) => {
     return () => window.removeEventListener('sftp-bookmarks-changed', handler);
   }, []);
 
+  const [syncableSettingsStorageVersion, setSyncableSettingsStorageVersion] = useState(0);
+  useEffect(() => {
+    const bumpIfSyncableSetting = (key: string | null | undefined) => {
+      if (!key || !SYNCABLE_SETTING_STORAGE_KEY_SET.has(key)) return;
+      setSyncableSettingsStorageVersion((v) => v + 1);
+    };
+
+    const handleStorage = (event: StorageEvent) => {
+      bumpIfSyncableSetting(event.key);
+    };
+    const handleLocalStorageAdapterChanged = (event: Event) => {
+      const key = (event as CustomEvent<{ key?: string }>).detail?.key;
+      bumpIfSyncableSetting(key);
+    };
+
+    window.addEventListener('storage', handleStorage);
+    window.addEventListener(LOCAL_STORAGE_ADAPTER_CHANGED_EVENT, handleLocalStorageAdapterChanged);
+    return () => {
+      window.removeEventListener('storage', handleStorage);
+      window.removeEventListener(LOCAL_STORAGE_ADAPTER_CHANGED_EVENT, handleLocalStorageAdapterChanged);
+    };
+  }, []);
+
   const getSyncSnapshot = useCallback(() => {
-    let effectivePFRules = config.portForwardingRules;
-    if (!effectivePFRules || effectivePFRules.length === 0) {
-      const stored = localStorageAdapter.read<SyncPayload['portForwardingRules']>(
-        STORAGE_KEY_PORT_FORWARDING,
-      );
-      if (stored && Array.isArray(stored) && stored.length > 0) {
-        effectivePFRules = stored.map((rule) => ({
-          ...rule,
-          status: 'inactive' as const,
-          error: undefined,
-          lastUsedAt: undefined,
-        }));
-      }
-    }
-
-    const effectiveKnownHosts = getEffectiveKnownHosts(config.knownHosts);
-
     return {
       hosts: config.hosts,
       keys: config.keys,
       identities: config.identities,
+      proxyProfiles: config.proxyProfiles,
       snippets: config.snippets,
       customGroups: config.customGroups,
       snippetPackages: config.snippetPackages,
-      portForwardingRules: effectivePFRules,
-      knownHosts: effectiveKnownHosts,
+      portForwardingRules: getEffectivePortForwardingRulesForSync(config.portForwardingRules),
       groupConfigs: config.groupConfigs,
     };
   }, [
     config.hosts,
     config.keys,
     config.identities,
+    config.proxyProfiles,
     config.snippets,
     config.customGroups,
     config.snippetPackages,
     config.portForwardingRules,
-    config.knownHosts,
     config.groupConfigs,
   ]);
 
@@ -147,6 +216,50 @@ export const useAutoSync = (config: AutoSyncConfig) => {
         throw new Error(t('sync.autoSync.alreadySyncing'));
       }
 
+      // Cross-window guard: another window may be in the middle of
+      // applying a local vault restore. If we push right now we'd upload
+      // the pre-restore snapshot (the main window's React state hasn't
+      // observed the localStorage writes yet), clobbering the just-
+      // restored cloud copy. Skip silently on auto triggers and fail
+      // loudly on manual ones so the user understands why their click
+      // did nothing.
+      //
+      // Pairs with `withRestoreBarrier` in application/localVaultBackups.ts
+      // (the writer) and with the matching early-return in the
+      // debounced-sync effect below (the other reader, which prevents
+      // scheduling a push while the barrier is held).
+      if (isRestoreInProgress()) {
+        if (trigger === 'auto') {
+          console.info('[AutoSync] Skipping: a vault restore is in progress in another window.');
+          return;
+        }
+        throw new Error(t('sync.autoSync.restoreInProgress'));
+      }
+
+      // Refuse to auto-push when a previous apply crashed mid-way and
+      // left the vault in a partial state. `applyProtectedSyncPayload`
+      // sets a sentinel before its non-atomic localStorage writes and
+      // clears it on successful completion; the sentinel's presence
+      // here means the renderer crashed between a first write and the
+      // clean-up, so the in-memory payload is a mix of pre-apply and
+      // post-apply entries. Pushing that would silently overwrite an
+      // intact cloud copy with corrupted data.
+      //
+      // Manual triggers surface a user-visible error that points the
+      // user at the Restore UI; auto triggers return quietly (the
+      // next startup toast below flags the state).
+      const interruptedApply = readInterruptedVaultApply();
+      if (interruptedApply) {
+        if (trigger === 'auto') {
+          console.warn(
+            '[AutoSync] Skipping: previous apply was interrupted — refusing to push partial state.',
+            interruptedApply,
+          );
+          return;
+        }
+        throw new Error(t('sync.autoSync.interruptedApplyMessage'));
+      }
+
       // If another window unlocked, reuse the in-memory session password from main process.
       if (state.securityState !== 'UNLOCKED') {
         const bridge = netcattyBridge.get();
@@ -173,13 +286,32 @@ export const useAutoSync = (config: AutoSyncConfig) => {
         throw new Error(t('sync.credentialsUnavailable'));
       }
 
+      // Refuse to push an empty vault to cloud. This is almost always
+      // a sign that the local state was lost (update, import failure,
+      // storage corruption) rather than a deliberate "delete everything".
+      // Both auto and manual triggers are blocked; the user can still
+      // use Force Push from the SyncBlocked banner if they genuinely
+      // want to wipe the cloud.
+      //
+      // This pairs with the inspect-failure "fail open" behavior in
+      // checkRemoteVersion below: if inspect transiently errors we still
+      // let auto-sync run, trusting this guard to refuse if local is
+      // truly empty rather than letting an empty state clobber remote.
+      if (!hasMeaningfulCloudSyncData(payload)) {
+        if (trigger === 'auto') {
+          console.warn('[AutoSync] Blocked: refusing to auto-sync an empty vault to cloud');
+          return;
+        }
+        throw new Error(t('sync.autoSync.emptyVaultManual'));
+      }
+
       const results = await sync.syncNow(payload);
 
       // Apply merged payloads first (before checking for failures) so local
       // state gets updated even when some providers failed
       for (const result of results.values()) {
         if (result.mergedPayload) {
-          onApplyPayload(result.mergedPayload);
+          await Promise.resolve(onApplyPayload(result.mergedPayload));
           skipNextSyncRef.current = true;
           break; // All providers share the same merged payload
         }
@@ -195,6 +327,18 @@ export const useAutoSync = (config: AutoSyncConfig) => {
       }
 
       lastSyncedDataRef.current = dataHash;
+
+      // Successful sync implies a successful per-provider
+      // `checkProviderConflict` (which inspects remote) — equivalent
+      // to a successful startup reconciliation from the auto-sync
+      // gate's point of view. Opening the gate here is the escape
+      // hatch when a network outage exhausted the startup retry
+      // timer: a user-triggered manual sync (or any first successful
+      // auto sync that somehow ran anyway) resumes auto-sync for the
+      // rest of the session. Without this, a degraded-startup session
+      // would require the user to manually sync after every edit.
+      hasCheckedRemoteRef.current = true;
+      remoteCheckDoneRef.current = true;
     } catch (error) {
       if (trigger === 'manual') {
         throw error;
@@ -208,46 +352,233 @@ export const useAutoSync = (config: AutoSyncConfig) => {
       isSyncRunningRef.current = false;
     }
   }, [sync, buildPayload, getDataHash, onApplyPayload, t]);
-  
+
+  // One-shot toast per mount when a previous apply was interrupted, so the
+  // user understands why auto-sync is silently paused and where to go to
+  // recover. `applyProtectedSyncPayload` clears the sentinel on a clean
+  // apply, so this only fires once per genuine crash and naturally stops
+  // after the user completes a recovery.
+  const interruptedApplyNotifiedRef = useRef(false);
+  useEffect(() => {
+    if (interruptedApplyNotifiedRef.current) return;
+    if (!sync.isUnlocked) return;
+    const interrupted = readInterruptedVaultApply();
+    if (!interrupted) return;
+    interruptedApplyNotifiedRef.current = true;
+    notify.error(
+      t('sync.autoSync.interruptedApplyMessage'),
+      t('sync.autoSync.interruptedApplyTitle'),
+    );
+  }, [sync.isUnlocked, t]);
+
+  // Stabilize the fields `checkRemoteVersion` reads from `config`.
+  // AutoSyncConfig is a fresh object literal on every App render, so a
+  // naive `config` dep would rebuild `checkRemoteVersion`'s identity on
+  // every unrelated state change — re-firing the retry effect with
+  // `attempt=0` and spawning overlapping in-flight inspections. The
+  // refs below let `checkRemoteVersion` read the latest callback and
+  // readiness flag without pulling the object identity into deps.
+  const onApplyPayloadRef = useRef(config.onApplyPayload);
+  useEffect(() => {
+    onApplyPayloadRef.current = config.onApplyPayload;
+  }, [config.onApplyPayload]);
+  const startupReadyRef = useRef(config.startupReady);
+  useEffect(() => {
+    startupReadyRef.current = config.startupReady;
+  }, [config.startupReady]);
+  // `buildPayload` closes over live React state so its identity flips
+  // on every vault edit; route it through a ref so `checkRemoteVersion`
+  // can read the latest builder without churning its memo identity.
+  const buildPayloadRef = useRef(buildPayload);
+  useEffect(() => {
+    buildPayloadRef.current = buildPayload;
+  }, [buildPayload]);
+
+  // Serialize `checkRemoteVersion` invocations. Overlapping runs would
+  // race on `commitRemoteInspection` + `onApplyPayload`: two merges
+  // could both write-then-clear the apply-in-progress sentinel around
+  // interleaved applies, and both could push post-merge snapshots to
+  // remote. The cross-window `withRestoreBarrier` protects other
+  // windows but does NOT serialize same-window re-entry, so this
+  // in-flight guard closes that gap at the top of the call.
+  const checkRemoteInFlightRef = useRef(false);
+
   // Check remote version and pull if newer (on startup)
   const checkRemoteVersion = useCallback(async () => {
+    if (checkRemoteInFlightRef.current) {
+      return;
+    }
     const state = manager.getState();
     const hasProvider = Object.values(state.providers).some((provider) => isProviderReadyForSync(provider));
     const unlocked = state.securityState === 'UNLOCKED';
-    
-    if (!hasProvider || !unlocked || hasCheckedRemoteRef.current) {
+
+    if (!hasProvider || !unlocked || hasCheckedRemoteRef.current || startupReadyRef.current === false) {
       return;
     }
-    
-    hasCheckedRemoteRef.current = true;
-    
-    // Find connected provider
+
+    // Find connected provider BEFORE acquiring the in-flight lock so the
+    // "nothing to check" early return doesn't leak the lock and wedge
+    // the retry timer. Any path that takes the lock MUST reach the
+    // finally-release below.
     const connectedProvider = AUTO_SYNC_PROVIDER_ORDER.find((provider) =>
       isProviderReadyForSync(state.providers[provider]),
     ) ?? null;
-    
-    if (!connectedProvider) return;
-    
+
+    if (!connectedProvider) {
+      // Nothing to check — mark as done so the auto-sync gate opens.
+      remoteCheckDoneRef.current = true;
+      return;
+    }
+
+    checkRemoteInFlightRef.current = true;
+
+    // Track whether the startup path completed in a state where the anchor/base
+    // are consistent with the local vault. Only then should we latch
+    // hasCheckedRemoteRef so that transient failures are retryable.
+    let startupConsistent = false;
     try {
-      // Load base BEFORE downloading (downloadFromProvider overwrites the base)
+      // Load base BEFORE observing the remote payload (commitRemoteInspection overwrites the base).
       const base = await manager.loadSyncBase(connectedProvider);
-      const remotePayload = await sync.downloadFromProvider(connectedProvider);
+      const inspection = await manager.inspectProviderRemote(connectedProvider);
 
-      if (remotePayload && remotePayload.syncedAt > state.localUpdatedAt) {
-        const { mergeSyncPayloads } = await import('../../domain/syncMerge');
-        const localPayload = buildPayload();
-        const mergeResult = mergeSyncPayloads(base, localPayload, remotePayload);
+      if (!inspection.payload || !inspection.remoteChanged || !inspection.remoteFile) {
+        // Remote unchanged (or empty) — no local mutation needed; anchor/base
+        // are already in sync with remote from a previous run.
+        startupConsistent = true;
+        return;
+      }
 
-        config.onApplyPayload(mergeResult.payload);
-        // Don't save base or skip auto-sync — let the data-change effect
-        // naturally trigger an upload of the merged payload (which will
-        // go through syncAllProviders and save base on success).
-        notify.success(t('sync.autoSync.syncedMessage'), t('sync.autoSync.syncedTitle'));
+      const remoteFile = inspection.remoteFile;
+      const remotePayload = inspection.payload;
+      const localPayload = buildPayloadRef.current();
+      const localIsEmpty = !hasMeaningfulCloudSyncData(localPayload);
+      const remoteHasData = hasMeaningfulCloudSyncData(remotePayload);
+
+      // If local vault is empty but cloud has data, this almost certainly
+      // means the user's data was lost (update, storage corruption, etc.).
+      // Pause and ask the user what to do instead of silently merging.
+      if (localIsEmpty && remoteHasData) {
+        const userAction = await new Promise<'restore' | 'keep-empty'>((resolve) => {
+          emptyVaultResolveRef.current = resolve;
+          setEmptyVaultConflict({
+            remotePayload,
+            hostCount: remotePayload.hosts?.length ?? 0,
+            keyCount: remotePayload.keys?.length ?? 0,
+            proxyProfileCount: remotePayload.proxyProfiles?.length ?? 0,
+            snippetCount: remotePayload.snippets?.length ?? 0,
+          });
+        });
+        setEmptyVaultConflict(null);
+        emptyVaultResolveRef.current = null;
+
+        if (userAction === 'restore') {
+          // Apply remote FIRST; only commit anchor/base after the UI-side
+          // state has accepted the remote payload, otherwise a failure
+          // between commit and apply would leave the anchor pointing at
+          // remote while local is still empty — the exact overwrite window
+          // we're trying to close.
+          await Promise.resolve(onApplyPayloadRef.current(remotePayload));
+          await manager.commitRemoteInspection(connectedProvider, remoteFile, remotePayload);
+          skipNextSyncRef.current = true;
+          startupConsistent = true;
+          notify.success(t('sync.autoSync.restoredMessage'), t('sync.autoSync.restoredTitle'));
+        } else {
+          // User chose to keep the empty vault. Deliberately do NOT advance
+          // the anchor or base — the next sync must still treat remote as
+          // "unseen" so the empty-vault-push guard (`hasMeaningfulSyncData`)
+          // keeps protecting the cloud copy. startupConsistent stays false
+          // so hasCheckedRemoteRef is not latched and the next startup will
+          // re-prompt if the user still has not added anything.
+          notify.info(t('sync.autoSync.keptLocalMessage'), t('sync.autoSync.keptLocalTitle'));
+        }
+        return;
+      }
+
+      const { mergeSyncPayloads } = await import('../../domain/syncMerge');
+      const mergeResult = mergeSyncPayloads(base, localPayload, remotePayload);
+
+      // Apply merged payload to local state BEFORE committing. If the apply
+      // throws, the next startup will re-run the merge with fresh data.
+      await Promise.resolve(onApplyPayloadRef.current(mergeResult.payload));
+      // Base is the last-agreed remote snapshot; `commitRemoteInspection`
+      // stores remotePayload as the base so the next diff is computed
+      // against what the cloud actually has, not against the merged
+      // local-only state.
+      await manager.commitRemoteInspection(connectedProvider, remoteFile, remotePayload);
+      startupConsistent = true;
+      notify.success(t('sync.autoSync.syncedMessage'), t('sync.autoSync.syncedTitle'));
+
+      // If the three-way merge introduced any local-only additions that the
+      // remote does not yet have, we MUST round-trip those to the cloud.
+      // Previously this branch stopped after applying merge locally, so the
+      // merged-in additions lived only on the device that ran the merge
+      // until the user's next edit.
+      //
+      // We push the merged payload *directly* through the manager rather
+      // than going through the React-state-driven `syncNow`. syncNow
+      // rebuilds the payload from hooks state, which may not yet reflect
+      // the onApplyPayload we awaited above (React commit phase is async
+      // relative to the awaited promise resolution). Passing mergeResult
+      // in explicitly removes the race entirely and avoids a setTimeout(0)
+      // that only approximated the correct ordering.
+      if (mergeResult.payload) {
+        try {
+          const roundTripResults = await manager.syncAllProviders(mergeResult.payload);
+          const wasShrinkBlocked = Array.from(roundTripResults.values()).some(
+            (r) => r.shrinkBlocked === true,
+          );
+          if (wasShrinkBlocked) {
+            // The merged payload is already applied locally and is the source of truth
+            // for THIS device. The blocking only prevents pushing it to cloud, which
+            // is acceptable here — the next user-edit-triggered sync will re-check
+            // (and the user can also force-push from the Settings banner if they
+            // navigate there). Reset syncState so we don't leave the manager wedged
+            // in BLOCKED with no banner visible.
+            console.warn('[AutoSync] Post-merge round-trip was shrink-blocked; merged data applied locally, reset syncState to IDLE for next attempt.');
+            manager.clearShrinkBlockedState();
+          }
+          // Suppress the debounced follow-up tick that otherwise fires
+          // once React commits the applied state, since we've just
+          // already pushed that exact payload upstream.
+          skipNextSyncRef.current = true;
+        } catch (error) {
+          // Non-fatal: the next user edit will drive another sync cycle.
+          console.warn('[AutoSync] Post-merge round-trip push failed:', error);
+        }
       }
     } catch (error) {
       console.error('[AutoSync] Failed to check remote version:', error);
+      // Surface a degraded-sync hint to the user rather than silently
+      // opening the auto-sync gate. Auto-sync will still retry on next
+      // data change (see finally block), but without this toast the user
+      // has no visible signal that startup reconciliation failed.
+      notify.error(
+        t('sync.autoSync.inspectFailedMessage'),
+        t('sync.autoSync.inspectFailedTitle'),
+      );
+      // Leave hasCheckedRemoteRef=false so the next startup (or the next
+      // provider/unlock transition) can retry.
+    } finally {
+      if (startupConsistent) {
+        hasCheckedRemoteRef.current = true;
+        // Only open the auto-sync gate when the inspect actually
+        // validated the remote state. Leaving the gate closed on
+        // inspect failure is intentional: an edit made during a
+        // degraded startup must not race ahead and push a partially-
+        // hydrated vault over an intact remote. The retry effect
+        // below re-fires checkRemoteVersion on the next provider/
+        // unlock/startupReady transition, and a manual sync from
+        // Settings remains available as an escape hatch.
+        remoteCheckDoneRef.current = true;
+      }
+      checkRemoteInFlightRef.current = false;
     }
-  }, [sync, config, buildPayload, t]);
+    // Intentionally minimal deps: `buildPayload`, `config.onApplyPayload`,
+    // and `config.startupReady` are read through refs above so their
+    // identity flips (every vault edit produces a fresh `buildPayload`
+    // and a fresh AutoSyncConfig literal) cannot re-memoize this
+    // callback and restart the retry-timer's exponential backoff.
+  }, [t]);
   
   // Debounced auto-sync when data changes
   useEffect(() => {
@@ -255,7 +586,15 @@ export const useAutoSync = (config: AutoSyncConfig) => {
     if (!sync.hasAnyConnectedProvider || !sync.autoSyncEnabled || !sync.isUnlocked) {
       return;
     }
-    
+
+    // Don't auto-sync until the startup remote check has completed.
+    // Without this gate, an empty local vault can push to the cloud
+    // before checkRemoteVersion even runs, overwriting a non-empty
+    // remote vault — the exact bug described in #679.
+    if (!remoteCheckDoneRef.current) {
+      return;
+    }
+
     // Skip initial render
     if (!isInitializedRef.current) {
       isInitializedRef.current = true;
@@ -283,6 +622,23 @@ export const useAutoSync = (config: AutoSyncConfig) => {
     if (sync.isSyncing || isSyncRunningRef.current) {
       return;
     }
+
+    // Hold off on scheduling a new push while another window is applying
+    // a restore — the restore is about to land via localStorage and the
+    // debounce-fired syncNow would otherwise race it. The next data-
+    // change tick after the restore barrier clears will re-enter here.
+    if (isRestoreInProgress()) {
+      return;
+    }
+
+    // Don't even schedule a push while the apply-in-progress sentinel
+    // is held. The syncNow path re-checks and refuses too, but dropping
+    // the debounced schedule here avoids spinning a 3-second timer for
+    // every keystroke while the user is in the Restore UI working
+    // through recovery.
+    if (readInterruptedVaultApply()) {
+      return;
+    }
     
     // Clear existing timeout
     if (syncTimeoutRef.current) {
@@ -299,33 +655,123 @@ export const useAutoSync = (config: AutoSyncConfig) => {
         clearTimeout(syncTimeoutRef.current);
       }
     };
-  }, [sync.hasAnyConnectedProvider, sync.autoSyncEnabled, sync.isUnlocked, sync.isSyncing, getDataHash, syncNow, config.settingsVersion, bookmarksVersion]);
+  }, [
+    sync.hasAnyConnectedProvider,
+    sync.autoSyncEnabled,
+    sync.isUnlocked,
+    sync.isSyncing,
+    getDataHash,
+    syncNow,
+    config.settingsVersion,
+    bookmarksVersion,
+    syncableSettingsStorageVersion,
+  ]);
   
-  // Check remote version on startup/unlock
+  // Check remote version on startup/unlock, then retry with backoff
+  // while the inspect keeps failing. Without the timer-based retry,
+  // a failure that doesn't coincide with a dep change would wedge the
+  // auto-sync gate closed until the user restarts or manually triggers
+  // sync from Settings — the 30s/60s/90s cadence below lets a short
+  // outage (network blip, provider rate-limit) self-heal.
   useEffect(() => {
-    if (sync.hasAnyConnectedProvider && sync.isUnlocked && !hasCheckedRemoteRef.current) {
-      // Delay check to ensure everything is loaded
-      const timer = setTimeout(() => {
-        checkRemoteVersion();
-      }, 1000);
-      
-      return () => clearTimeout(timer);
+    if (
+      !sync.hasAnyConnectedProvider ||
+      !sync.isUnlocked ||
+      hasCheckedRemoteRef.current ||
+      config.startupReady === false
+    ) {
+      return;
     }
-  }, [sync.hasAnyConnectedProvider, sync.isUnlocked, checkRemoteVersion]);
+
+    let cancelled = false;
+    let attempt = 0;
+    let timerId: NodeJS.Timeout | null = null;
+
+    const tick = () => {
+      if (cancelled) return;
+      void (async () => {
+        await checkRemoteVersion();
+        if (cancelled || hasCheckedRemoteRef.current) return;
+        // Cap retries at ~5 minutes total (30s + 60s + 120s + 240s). A
+        // persistent failure beyond that is almost certainly a
+        // misconfiguration that needs user action rather than more
+        // auto-retries.
+        //
+        // When retries exhaust we deliberately leave the auto-sync gate
+        // CLOSED. Opening it here would allow a partially-lost local
+        // vault to silently clobber an unchanged remote: anchor still
+        // matches, `checkProviderConflict` sees no remote change,
+        // `hasMeaningfulSyncData` doesn't flag non-empty-but-partial
+        // local, and the empty-vault prompt never fires.
+        //
+        // Escape hatch: a successful manual sync from Settings opens
+        // the gate via `syncNow`'s success path. That path runs the
+        // same per-provider inspect we use here, so a successful
+        // manual sync is equivalent to a successful startup inspect
+        // from the gate's point of view — the user's explicit click
+        // authorizes both the push and the subsequent auto-sync
+        // resumption. Until then, auto-sync stays paused and the
+        // "sync paused" toast is the user's signal to act.
+        if (attempt >= 4) return;
+        const delayMs = Math.min(240_000, 30_000 * 2 ** attempt);
+        attempt += 1;
+        timerId = setTimeout(tick, delayMs);
+      })();
+    };
+
+    tick();
+
+    return () => {
+      cancelled = true;
+      if (timerId) clearTimeout(timerId);
+    };
+  }, [sync.hasAnyConnectedProvider, sync.isUnlocked, config.startupReady, checkRemoteVersion]);
   
-  // Reset check flag when provider disconnects
+  // Reset check flags when provider disconnects
   useEffect(() => {
     if (!sync.hasAnyConnectedProvider) {
       hasCheckedRemoteRef.current = false;
+      remoteCheckDoneRef.current = false;
     }
   }, [sync.hasAnyConnectedProvider]);
+
+  // On unmount, release any pending empty-vault confirmation. Without
+  // this, an unmount mid-dialog (window close, workspace switch) leaves
+  // the resolver promise dangling forever and the `checkRemoteVersion`
+  // finally block never sets remoteCheckDoneRef — in practice React
+  // tears down the hook first, but leaking the resolve callback and
+  // referenced remotePayload keeps them pinned by the awaiter until
+  // the next reload. Resolving with 'keep-empty' is the safe default:
+  // it mirrors the "don't touch remote" choice and leaves the version
+  // stamp untouched so the next mount re-prompts.
+  useEffect(() => {
+    return () => {
+      const resolve = emptyVaultResolveRef.current;
+      if (resolve) {
+        emptyVaultResolveRef.current = null;
+        resolve('keep-empty');
+      }
+    };
+  }, []);
   
+  const resolveEmptyVaultConflict = useCallback((action: 'restore' | 'keep-empty') => {
+    // Guard: resolve only once (prevents double-click from entering an
+    // inconsistent state). The ref is nulled immediately so subsequent
+    // calls are no-ops.
+    const resolve = emptyVaultResolveRef.current;
+    if (!resolve) return;
+    emptyVaultResolveRef.current = null;
+    resolve(action);
+  }, []);
+
   return {
     syncNow,
     buildPayload,
     isSyncing: sync.isSyncing,
     isConnected: sync.hasAnyConnectedProvider,
     autoSyncEnabled: sync.autoSyncEnabled,
+    emptyVaultConflict,
+    resolveEmptyVaultConflict,
   };
 };
 

application/state/useCloudSync.ts

@@ -26,7 +26,9 @@ import {
 import {
   getCloudSyncManager,
   type SyncManagerState,
+  type SyncEventCallback,
 } from '../../infrastructure/services/CloudSyncManager';
+import type { ShrinkFinding } from '../../domain/syncGuards';
 import { netcattyBridge } from '../../infrastructure/services/netcattyBridge';
 import type { DeviceFlowState } from '../../infrastructure/services/adapters/GitHubAdapter';
 
@@ -51,11 +53,12 @@ export interface CloudSyncHook {
   remoteVersion: number;
   remoteUpdatedAt: number;
   syncHistory: SyncHistoryEntry[];
+  pendingBrowserAuthProvider: 'google' | 'onedrive' | null;
   
   // Computed
   hasAnyConnectedProvider: boolean;
   connectedProviderCount: number;
-  overallSyncStatus: 'none' | 'synced' | 'syncing' | 'error' | 'conflict';
+  overallSyncStatus: 'none' | 'synced' | 'syncing' | 'error' | 'conflict' | 'blocked';
   
   // Master Key Actions
   setupMasterKey: (password: string, confirmPassword: string) => Promise<void>;
@@ -70,7 +73,9 @@ export interface CloudSyncHook {
     deviceCode: string,
     interval: number,
     expiresAt: number,
-    onPending?: () => void
+    onPending?: () => void,
+    signal?: AbortSignal,
+    authAttemptId?: number
   ) => Promise<void>;
   connectGoogle: () => Promise<string>;
   connectOneDrive: () => Promise<string>;
@@ -86,11 +91,25 @@ export interface CloudSyncHook {
   resetProviderStatus: (provider: CloudProvider) => void;
 
   // Sync Actions
-  syncNow: (payload: SyncPayload) => Promise<Map<CloudProvider, SyncResult>>;
-  syncToProvider: (provider: CloudProvider, payload: SyncPayload) => Promise<SyncResult>;
+  syncNow: (payload: SyncPayload, opts?: { overrideShrink?: boolean }) => Promise<Map<CloudProvider, SyncResult>>;
+  syncToProvider: (provider: CloudProvider, payload: SyncPayload, opts?: { overrideShrink?: boolean }) => Promise<SyncResult>;
   downloadFromProvider: (provider: CloudProvider) => Promise<SyncPayload | null>;
   resolveConflict: (resolution: ConflictResolution) => Promise<SyncPayload | null>;
-  
+
+  // Gist Revision History
+  getGistRevisionHistory: () => Promise<Array<{ version: string; date: Date }>>;
+  downloadGistRevision: (sha: string) => Promise<{
+    payload: SyncPayload;
+    meta: import('../../domain/sync').SyncFileMeta;
+    preview: {
+      hostCount: number;
+      keyCount: number;
+      snippetCount: number;
+      identityCount: number;
+      portForwardingRuleCount: number;
+    };
+  } | null>;
+
   // Settings
   setAutoSync: (enabled: boolean, intervalMinutes?: number) => void;
   setDeviceName: (name: string) => void;
@@ -102,8 +121,55 @@ export interface CloudSyncHook {
   formatLastSync: (timestamp?: number) => string;
   getProviderDotColor: (provider: CloudProvider) => string;
   refresh: () => void;
+
+  // Event subscription (for non-state events like SYNC_BLOCKED_SHRINK)
+  subscribeToEvents: (callback: SyncEventCallback) => () => void;
+
+  // Shrink-block state query (for banner hydration on mount)
+  getShrinkBlockedFinding: () => Extract<ShrinkFinding, { suspicious: true }> | null;
 }
 
+type PendingBrowserAuthState = {
+  provider: 'google' | 'onedrive';
+  sessionId: string;
+  authAttemptId?: number;
+} | null;
+
+let pendingBrowserAuthState: PendingBrowserAuthState = null;
+const pendingBrowserAuthListeners = new Set<() => void>();
+let activeOAuthBrowserHandoff:
+  | { sessionId: string; cancel: () => void }
+  | null = null;
+const cancelledOAuthSessionIds = new Set<string>();
+
+const getPendingBrowserAuthState = (): PendingBrowserAuthState => pendingBrowserAuthState;
+
+const subscribePendingBrowserAuthState = (callback: () => void) => {
+  pendingBrowserAuthListeners.add(callback);
+  return () => pendingBrowserAuthListeners.delete(callback);
+};
+
+const setPendingBrowserAuthState = (next: PendingBrowserAuthState) => {
+  pendingBrowserAuthState = next;
+  pendingBrowserAuthListeners.forEach((callback) => callback());
+};
+
+const clearPendingBrowserAuthState = (
+  match?: { provider: 'google' | 'onedrive'; sessionId: string; authAttemptId?: number }
+) => {
+  if (!match) {
+    setPendingBrowserAuthState(null);
+    return;
+  }
+  if (
+    pendingBrowserAuthState &&
+    pendingBrowserAuthState.provider === match.provider &&
+    pendingBrowserAuthState.sessionId === match.sessionId
+  ) {
+    setPendingBrowserAuthState(null);
+  }
+};
+
 // ============================================================================
 // Hook Implementation
 // ============================================================================
@@ -124,6 +190,15 @@ const getSnapshot = (): SyncManagerState => {
 export const useCloudSync = (): CloudSyncHook => {
   // Use useSyncExternalStore for real-time state sync across all components
   const state = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+  const pendingBrowserAuth = useSyncExternalStore(
+    subscribePendingBrowserAuthState,
+    getPendingBrowserAuthState,
+    getPendingBrowserAuthState
+  );
+  const activeOAuthSessionIdRef = useRef<string | null>(null);
+  const activeOAuthProviderRef = useRef<'google' | 'onedrive' | null>(null);
+  const activeGitHubAuthAbortRef = useRef<AbortController | null>(null);
+  const activeGitHubAuthAttemptIdRef = useRef<number | null>(null);
 
   // Auto-unlock: if a master key exists, retrieve the persisted password (Electron safeStorage)
   // and unlock silently so users don't have to manage a LOCKED state in the UI.
@@ -176,7 +251,8 @@ export const useCloudSync = (): CloudSyncHook => {
     ).length;
   }, [state.providers]);
   
-  const overallSyncStatus = useMemo((): 'none' | 'synced' | 'syncing' | 'error' | 'conflict' => {
+  const overallSyncStatus = useMemo((): 'none' | 'synced' | 'syncing' | 'error' | 'conflict' | 'blocked' => {
+    if (state.syncState === 'BLOCKED') return 'blocked';
     if (state.syncState === 'CONFLICT') return 'conflict';
     if (state.syncState === 'ERROR') return 'error';
     if (state.syncState === 'SYNCING') return 'syncing';
@@ -239,107 +315,277 @@ export const useCloudSync = (): CloudSyncHook => {
     if (result.type !== 'device_code') {
       throw new Error('Unexpected auth type');
     }
-    return result.data as DeviceFlowState;
+    activeGitHubAuthAttemptIdRef.current = result.data.authAttemptId ?? null;
+    return result.data;
   }, []);
   
   const completeGitHubAuth = useCallback(async (
     deviceCode: string,
     interval: number,
     expiresAt: number,
-    onPending?: () => void
+    onPending?: () => void,
+    signal?: AbortSignal,
+    authAttemptId?: number
   ): Promise<void> => {
-    await manager.completeGitHubAuth(deviceCode, interval, expiresAt, onPending);
-  }, []);
-  
-  const connectGoogle = useCallback(async (): Promise<string> => {
-    const result = await manager.startProviderAuth('google');
-    if (result.type !== 'url') {
-      throw new Error('Unexpected auth type');
+    const controller = new AbortController();
+    const abort = () => controller.abort();
+
+    if (signal?.aborted) {
+      abort();
+    } else if (signal) {
+      signal.addEventListener('abort', abort, { once: true });
     }
-    const data = result.data as { url: string; redirectUri: string };
 
-    // Start OAuth callback server in Electron and wait for authorization
-    const bridge = netcattyBridge.get();
-    const startCallback = bridge?.startOAuthCallback;
-    if (startCallback) {
-      // Get state from adapter for CSRF protection
-      const adapter = manager.getAdapter('google') as { getPKCEState?: () => string | null } | undefined;
-      const expectedState = adapter?.getPKCEState?.() || undefined;
+    activeGitHubAuthAbortRef.current = controller;
 
-      // Start callback server and open system browser
-      const callbackPromise = startCallback(expectedState);
-
-      // Use system browser to avoid white-screen issues in popup windows (#563)
-      // Race: if browser launch fails, surface the error immediately
-      let openTimer: ReturnType<typeof setTimeout> | null = null;
-      const browserPromise = new Promise<never>((_resolve, reject) => {
-        openTimer = setTimeout(async () => {
-          try {
-            await bridge?.openExternal(data.url);
-          } catch (err) {
-            bridge?.cancelOAuthCallback?.();
-            reject(err instanceof Error ? err : new Error('Failed to open browser for authentication'));
-          }
-        }, 100);
-      });
-
-      try {
-        const { code } = await Promise.race([callbackPromise, browserPromise]);
-
-        // Complete auth with the received code
-        await manager.completePKCEAuth('google', code, data.redirectUri);
-      } finally {
-        if (openTimer) clearTimeout(openTimer);
+    try {
+      await manager.completeGitHubAuth(
+        deviceCode,
+        interval,
+        expiresAt,
+        onPending,
+        controller.signal,
+        authAttemptId
+      );
+    } finally {
+      if (signal) {
+        signal.removeEventListener('abort', abort);
+      }
+      if (activeGitHubAuthAbortRef.current === controller) {
+        activeGitHubAuthAbortRef.current = null;
+      }
+      if (activeGitHubAuthAttemptIdRef.current === (authAttemptId ?? null)) {
+        activeGitHubAuthAttemptIdRef.current = null;
       }
     }
-
-    return data.url;
   }, []);
 
+  const cancelActivePKCEAuth = useCallback(async () => {
+    const pending = getPendingBrowserAuthState();
+    const sessionId = pending?.sessionId ?? activeOAuthSessionIdRef.current;
+    const provider = pending?.provider ?? activeOAuthProviderRef.current;
+    const authAttemptId = pending?.authAttemptId;
+    if (!sessionId || !provider) return;
+
+    cancelledOAuthSessionIds.add(sessionId);
+    if (activeOAuthBrowserHandoff?.sessionId === sessionId) {
+      activeOAuthBrowserHandoff.cancel();
+      activeOAuthBrowserHandoff = null;
+    }
+    manager.cancelProviderAuthAttempt(provider, authAttemptId);
+    activeOAuthSessionIdRef.current = null;
+    activeOAuthProviderRef.current = null;
+    clearPendingBrowserAuthState(
+      pending
+        ? {
+            provider: pending.provider,
+            sessionId: pending.sessionId,
+            authAttemptId: pending.authAttemptId,
+          }
+        : undefined
+    );
+
+    try {
+      await netcattyBridge.get()?.cancelOAuthCallback?.(sessionId);
+    } catch {
+      // Best-effort cleanup
+    }
+  }, []);
+  
+  const runPKCEAuth = useCallback(
+    async (provider: 'google' | 'onedrive'): Promise<string> => {
+      const bridge = netcattyBridge.get();
+      const prepare = bridge?.prepareOAuthCallback;
+      const awaitCallback = bridge?.awaitOAuthCallback;
+      const openExternal = bridge?.openExternal;
+      if (!prepare || !awaitCallback || !openExternal) {
+        throw new Error('OAuth bridge is unavailable');
+      }
+
+      // Only one loopback OAuth flow can be active at a time. If the user
+      // starts another provider while a previous browser hop is still pending,
+      // cancel the stale one first so the new attempt owns the callback port.
+      await cancelActivePKCEAuth();
+
+      // Bind the loopback callback server first so we know which port to put
+      // in the provider's redirect_uri (#823: 45678 may be in use).
+      const { redirectUri, sessionId } = await prepare();
+      activeOAuthSessionIdRef.current = sessionId;
+      activeOAuthProviderRef.current = provider;
+      setPendingBrowserAuthState({ provider, sessionId });
+
+      try {
+        const result = await manager.startProviderAuth(provider, redirectUri);
+        if (result.type !== 'url') {
+          throw new Error('Unexpected auth type');
+        }
+        const data = result.data;
+
+        if (cancelledOAuthSessionIds.has(sessionId)) {
+          throw new Error('OAuth flow cancelled');
+        }
+
+        const adapter = manager.getAdapter(provider) as
+          | { getPKCEState?: () => string | null }
+          | undefined;
+        const expectedState = adapter?.getPKCEState?.() || undefined;
+
+        const callbackPromise = awaitCallback(expectedState, sessionId);
+
+        // Use system browser to avoid white-screen issues in popup windows (#563).
+        // Once the browser has opened, let the rest of the PKCE handshake
+        // continue in the background so closing the browser later does not
+        // leave the whole settings page locked waiting on a timeout.
+        let openTimer: ReturnType<typeof setTimeout> | null = null;
+        let browserOpened = false;
+        let rejectBrowserPromise: ((error: Error) => void) | null = null;
+        const browserPromise = new Promise<void>((resolve, reject) => {
+          rejectBrowserPromise = reject;
+          openTimer = setTimeout(async () => {
+            try {
+              await openExternal(data.url);
+              browserOpened = true;
+              resolve();
+            } catch (err) {
+              bridge?.cancelOAuthCallback?.(sessionId);
+              reject(
+                err instanceof Error
+                  ? err
+                  : new Error('Failed to open browser for authentication')
+              );
+            }
+          }, 100);
+        });
+        activeOAuthBrowserHandoff = {
+          sessionId,
+          cancel: () => {
+          if (openTimer) {
+            clearTimeout(openTimer);
+            openTimer = null;
+          }
+          if (rejectBrowserPromise) {
+            rejectBrowserPromise(new Error('OAuth flow cancelled'));
+            rejectBrowserPromise = null;
+          }
+          },
+        };
+
+        try {
+          await Promise.race([
+            browserPromise,
+            callbackPromise.then(
+              () => {
+                throw new Error('OAuth callback completed before browser handoff');
+              },
+              (error) => {
+                if (browserOpened) {
+                  return new Promise<void>(() => {});
+                }
+                throw error;
+              }
+            ),
+          ]);
+        } finally {
+          if (openTimer) clearTimeout(openTimer);
+          if (activeOAuthBrowserHandoff?.sessionId === sessionId) {
+            activeOAuthBrowserHandoff = null;
+          }
+        }
+        setPendingBrowserAuthState({
+          provider,
+          sessionId,
+          authAttemptId: data.authAttemptId,
+        });
+
+        const completionPromise = (async () => {
+          try {
+            const { code } = await callbackPromise;
+            await manager.completePKCEAuth(provider, code, data.redirectUri, data.authAttemptId);
+          } catch (error) {
+            const ownsActiveSession =
+              activeOAuthSessionIdRef.current === sessionId &&
+              activeOAuthProviderRef.current === provider;
+            const message = error instanceof Error ? error.message : String(error);
+            const cancelledOrSuperseded =
+              message.includes('cancelled') || message.includes('auth superseded');
+            const timedOut = message.toLowerCase().includes('timeout');
+            if (ownsActiveSession && (cancelledOrSuperseded || timedOut)) {
+              activeOAuthSessionIdRef.current = null;
+              activeOAuthProviderRef.current = null;
+              cancelledOAuthSessionIds.delete(sessionId);
+              clearPendingBrowserAuthState({
+                provider,
+                sessionId,
+                authAttemptId: data.authAttemptId,
+              });
+              manager.resetProviderStatus(provider);
+            } else if (ownsActiveSession) {
+              activeOAuthSessionIdRef.current = null;
+              activeOAuthProviderRef.current = null;
+              cancelledOAuthSessionIds.delete(sessionId);
+              clearPendingBrowserAuthState({
+                provider,
+                sessionId,
+                authAttemptId: data.authAttemptId,
+              });
+              manager.setProviderError(provider, message);
+            }
+          } finally {
+            if (
+              activeOAuthSessionIdRef.current === sessionId &&
+              activeOAuthProviderRef.current === provider
+            ) {
+              activeOAuthSessionIdRef.current = null;
+              activeOAuthProviderRef.current = null;
+            }
+            cancelledOAuthSessionIds.delete(sessionId);
+            clearPendingBrowserAuthState({
+              provider,
+              sessionId,
+              authAttemptId: data.authAttemptId,
+            });
+          }
+        })();
+
+        // Release the transient "connecting" UI once the browser handoff has
+        // happened. The callback session remains active in the background and
+        // will mark the provider connected when the redirect completes.
+        // Do NOT use resetProviderStatus here — it would restore from the
+        // auth snapshot and delete the adapter we just created, making the
+        // eventual completePKCEAuth call fail with "adapter not initialized".
+        manager.clearConnectingStatus(provider);
+        manager.clearProviderError(provider);
+        void completionPromise;
+        return data.url;
+      } catch (err) {
+        const ownsActiveSession =
+          activeOAuthSessionIdRef.current === sessionId &&
+          activeOAuthProviderRef.current === provider;
+        try {
+          await bridge?.cancelOAuthCallback?.(sessionId);
+        } catch {
+          // Best-effort cleanup
+        }
+        if (ownsActiveSession) {
+          activeOAuthSessionIdRef.current = null;
+          activeOAuthProviderRef.current = null;
+          manager.cancelProviderAuthAttempt(provider);
+          manager.resetProviderStatus(provider);
+        }
+        throw err;
+      }
+    },
+    [cancelActivePKCEAuth]
+  );
+
+  const connectGoogle = useCallback(async (): Promise<string> => {
+    return runPKCEAuth('google');
+  }, [runPKCEAuth]);
+
   const connectOneDrive = useCallback(async (): Promise<string> => {
-    const result = await manager.startProviderAuth('onedrive');
-    if (result.type !== 'url') {
-      throw new Error('Unexpected auth type');
-    }
-    const data = result.data as { url: string; redirectUri: string };
+    return runPKCEAuth('onedrive');
+  }, [runPKCEAuth]);
 
-    // Start OAuth callback server in Electron and wait for authorization
-    const bridge = netcattyBridge.get();
-    const startCallback = bridge?.startOAuthCallback;
-    if (startCallback) {
-      // Get state from adapter for CSRF protection
-      const adapter = manager.getAdapter('onedrive') as { getPKCEState?: () => string | null } | undefined;
-      const expectedState = adapter?.getPKCEState?.() || undefined;
-
-      // Start callback server and open system browser
-      const callbackPromise = startCallback(expectedState);
-
-      // Use system browser to avoid white-screen issues in popup windows (#563)
-      let openTimer: ReturnType<typeof setTimeout> | null = null;
-      const browserPromise = new Promise<never>((_resolve, reject) => {
-        openTimer = setTimeout(async () => {
-          try {
-            await bridge?.openExternal(data.url);
-          } catch (err) {
-            bridge?.cancelOAuthCallback?.();
-            reject(err instanceof Error ? err : new Error('Failed to open browser for authentication'));
-          }
-        }, 100);
-      });
-
-      try {
-        const { code } = await Promise.race([callbackPromise, browserPromise]);
-
-        // Complete auth with the received code
-        await manager.completePKCEAuth('onedrive', code, data.redirectUri);
-      } finally {
-        if (openTimer) clearTimeout(openTimer);
-      }
-    }
-
-    return data.url;
-  }, []);
-  
   const completePKCEAuth = useCallback(async (
     provider: 'google' | 'onedrive',
     code: string,
@@ -365,9 +611,16 @@ export const useCloudSync = (): CloudSyncHook => {
   }, []);
   
   const cancelOAuthConnect = useCallback(() => {
-    const bridge = netcattyBridge.get();
-    bridge?.cancelOAuthCallback?.();
-  }, []);
+    const githubAbort = activeGitHubAuthAbortRef.current;
+    if (githubAbort) {
+      manager.cancelProviderAuthAttempt('github', activeGitHubAuthAttemptIdRef.current ?? undefined);
+      activeGitHubAuthAttemptIdRef.current = null;
+      githubAbort.abort();
+      return;
+    }
+
+    void cancelActivePKCEAuth();
+  }, [cancelActivePKCEAuth]);
 
   // ========== Settings ==========
   
@@ -408,14 +661,14 @@ export const useCloudSync = (): CloudSyncHook => {
     throw new Error('Vault is locked');
   }, []);
 
-  const syncNowWithUnlock = useCallback(async (payload: SyncPayload) => {
+  const syncNowWithUnlock = useCallback(async (payload: SyncPayload, opts?: { overrideShrink?: boolean }) => {
     await ensureUnlocked();
-    return await manager.syncAllProviders(payload);
+    return await manager.syncAllProviders(payload, opts);
   }, [ensureUnlocked]);
 
-  const syncToProviderWithUnlock = useCallback(async (provider: CloudProvider, payload: SyncPayload) => {
+  const syncToProviderWithUnlock = useCallback(async (provider: CloudProvider, payload: SyncPayload, opts?: { overrideShrink?: boolean }) => {
     await ensureUnlocked();
-    return await manager.syncToProvider(provider, payload);
+    return await manager.syncToProvider(provider, payload, opts);
   }, [ensureUnlocked]);
 
   const downloadFromProviderWithUnlock = useCallback(async (provider: CloudProvider) => {
@@ -423,6 +676,16 @@ export const useCloudSync = (): CloudSyncHook => {
     return await manager.downloadFromProvider(provider);
   }, [ensureUnlocked]);
 
+  const subscribeToEvents = useCallback(
+    (callback: SyncEventCallback) => manager.subscribe(callback),
+    [],
+  );
+
+  const getShrinkBlockedFinding = useCallback(
+    () => manager.getShrinkBlockedFinding(),
+    [],
+  );
+
   const resolveConflictWithUnlock = useCallback(async (resolution: ConflictResolution) => {
     await ensureUnlocked();
     return await manager.resolveConflict(resolution);
@@ -445,6 +708,7 @@ export const useCloudSync = (): CloudSyncHook => {
     remoteVersion: state.remoteVersion,
     remoteUpdatedAt: state.remoteUpdatedAt,
     syncHistory: state.syncHistory,
+    pendingBrowserAuthProvider: pendingBrowserAuth?.provider ?? null,
     
     // Computed
     hasAnyConnectedProvider,
@@ -475,6 +739,10 @@ export const useCloudSync = (): CloudSyncHook => {
     syncToProvider: syncToProviderWithUnlock,
     downloadFromProvider: downloadFromProviderWithUnlock,
     resolveConflict: resolveConflictWithUnlock,
+
+    // Gist Revision History (#679)
+    getGistRevisionHistory: manager.getGistRevisionHistory.bind(manager),
+    downloadGistRevision: manager.downloadGistRevision.bind(manager),
     
     // Settings
     setAutoSync,
@@ -487,6 +755,12 @@ export const useCloudSync = (): CloudSyncHook => {
     formatLastSync,
     getProviderDotColor,
     refresh,
+
+    // Event subscription
+    subscribeToEvents,
+
+    // Shrink-block state query
+    getShrinkBlockedFinding,
   };
 };
 

application/state/useFileUpload.ts

@@ -1,20 +1,13 @@
 /**
- * useFileUpload - Handle file paste/drop with base64 conversion
+ * File upload conversion helpers for AI draft attachments.
  *
  * Supports images, PDFs, and other document types.
  * Ported from 1code's use-agents-file-upload.ts
  */
-import { useCallback, useState } from 'react';
+import type { UploadedFile } from '../../infrastructure/ai/types';
 import { getPathForFile } from '../../lib/sftpFileUtils';
 
-export interface UploadedFile {
-  id: string;
-  filename: string;
-  dataUrl: string;      // data:...;base64,... for preview
-  base64Data: string;   // raw base64 for API
-  mediaType: string;    // MIME type e.g. "image/png", "application/pdf"
-  filePath?: string;    // original filesystem path (Electron only)
-}
+export type { UploadedFile } from '../../infrastructure/ai/types';
 
 /** Reject only known binary blobs that AI models can't process */
 const REJECTED_MIME_PREFIXES = ['video/', 'audio/'];
@@ -38,42 +31,32 @@ async function fileToDataUrl(file: File): Promise<{ dataUrl: string; base64: str
   });
 }
 
-export function useFileUpload() {
-  const [files, setFiles] = useState<UploadedFile[]>([]);
+export async function convertFilesToUploads(inputFiles: File[]): Promise<UploadedFile[]> {
+  const supported = inputFiles.filter(isSupportedFile);
+  if (supported.length === 0) return [];
 
-  const addFiles = useCallback(async (inputFiles: File[]) => {
-    const supported = inputFiles.filter(isSupportedFile);
-    if (supported.length === 0) return;
-
-    const newFiles: UploadedFile[] = await Promise.all(
-      supported.map(async (file) => {
-        const id = crypto.randomUUID();
-        const filename = file.name || `file-${Date.now()}`;
-        const mediaType = file.type || 'application/octet-stream';
-        let dataUrl = '';
-        let base64Data = '';
-        try {
-          const result = await fileToDataUrl(file);
-          dataUrl = result.dataUrl;
-          base64Data = result.base64;
-        } catch (err) {
-          console.error('[useFileUpload] Failed to convert:', err);
-        }
+  const uploads: Array<UploadedFile | null> = await Promise.all(
+    supported.map(async (file) => {
+      const id = crypto.randomUUID();
+      const filename = file.name || `file-${Date.now()}`;
+      const mediaType = file.type || 'application/octet-stream';
+      try {
+        const result = await fileToDataUrl(file);
         const filePath = getPathForFile(file);
-        return { id, filename, dataUrl, base64Data, mediaType, filePath };
-      }),
-    );
+        return {
+          id,
+          filename,
+          dataUrl: result.dataUrl,
+          base64Data: result.base64,
+          mediaType,
+          filePath,
+        };
+      } catch (err) {
+        console.error('[useFileUpload] Failed to convert:', err);
+        return null;
+      }
+    }),
+  );
 
-    setFiles((prev) => [...prev, ...newFiles]);
-  }, []);
-
-  const removeFile = useCallback((id: string) => {
-    setFiles((prev) => prev.filter((f) => f.id !== id));
-  }, []);
-
-  const clearFiles = useCallback(() => {
-    setFiles([]);
-  }, []);
-
-  return { files, addFiles, removeFile, clearFiles };
+  return uploads.filter((upload): upload is UploadedFile => upload !== null);
 }

application/state/useGlobalHotkeys.ts

@@ -1,39 +1,5 @@
-import { useCallback, useEffect, useRef } from 'react';
 import { KeyBinding, matchesKeyBinding } from '../../domain/models';
 
-interface HotkeyActions {
-  // Tab management
-  switchToTab: (tabIndex: number) => void;
-  nextTab: () => void;
-  prevTab: () => void;
-  closeTab: () => void;
-  newTab: () => void;
-  
-  // Navigation
-  openHosts: () => void;
-  openSftp: () => void;
-  quickSwitch: () => void;
-  commandPalette: () => void;
-  portForwarding: () => void;
-  snippets: () => void;
-  
-  // Terminal actions (handled per-terminal)
-  copy: () => void;
-  paste: () => void;
-  selectAll: () => void;
-  clearBuffer: () => void;
-  searchTerminal: () => void;
-  
-  // Workspace/split actions
-  splitHorizontal: () => void;
-  splitVertical: () => void;
-  moveFocus: (direction: 'up' | 'down' | 'left' | 'right') => void;
-  
-  // App features
-  broadcast: () => void;
-  openLocal: () => void;
-}
-
 // Check if keyboard event matches our app-level shortcuts
 // Returns the matched binding action or null
 export const checkAppShortcut = (
@@ -61,6 +27,7 @@ export const getAppLevelActions = (): Set<string> => {
     'openHosts',
     'openSftp',
     'quickSwitch',
+    'newWorkspace',
     'commandPalette',
     'portForwarding',
     'snippets',
@@ -69,6 +36,7 @@ export const getAppLevelActions = (): Set<string> => {
     'moveFocus',
     'broadcast',
     'openLocal',
+    'openSettings',
   ]);
 };
 
@@ -77,162 +45,9 @@ export const getTerminalPassthroughActions = (): Set<string> => {
   return new Set([
     'copy',
     'paste',
+    'pasteSelection',
     'selectAll',
     'clearBuffer',
     'searchTerminal',
   ]);
 };
-
-interface UseGlobalHotkeysOptions {
-  hotkeyScheme: 'disabled' | 'mac' | 'pc';
-  keyBindings: KeyBinding[];
-  actions: Partial<HotkeyActions>;
-  orderedTabs: string[];
-  sessions: { id: string }[];
-  workspaces: { id: string }[];
-  isSettingsOpen?: boolean;
-}
-
-export const useGlobalHotkeys = ({
-  hotkeyScheme,
-  keyBindings,
-  actions,
-  orderedTabs,
-  sessions,
-  workspaces,
-  isSettingsOpen = false,
-}: UseGlobalHotkeysOptions) => {
-  const actionsRef = useRef(actions);
-  actionsRef.current = actions;
-
-  const orderedTabsRef = useRef(orderedTabs);
-  orderedTabsRef.current = orderedTabs;
-
-  const sessionsRef = useRef(sessions);
-  sessionsRef.current = sessions;
-
-  const workspacesRef = useRef(workspaces);
-  workspacesRef.current = workspaces;
-
-  const handleGlobalKeyDown = useCallback((e: KeyboardEvent) => {
-    if (hotkeyScheme === 'disabled') return;
-    if (isSettingsOpen) return; // Don't handle hotkeys when settings is open
-
-    const isMac = hotkeyScheme === 'mac';
-    const appLevelActions = getAppLevelActions();
-
-    // Check if this is an app-level shortcut
-    const matched = checkAppShortcut(e, keyBindings, isMac);
-    if (!matched) return;
-
-    const { action, binding: _binding } = matched;
-
-    // Only handle app-level actions here
-    // Terminal-level actions are handled by the terminal itself
-    if (!appLevelActions.has(action)) return;
-
-    e.preventDefault();
-    e.stopPropagation();
-
-    const currentActions = actionsRef.current;
-    switch (action) {
-      case 'switchToTab': {
-        const num = parseInt(e.key, 10);
-        if (num >= 1 && num <= 9) {
-          currentActions.switchToTab?.(num);
-        }
-        break;
-      }
-      case 'nextTab':
-        currentActions.nextTab?.();
-        break;
-      case 'prevTab':
-        currentActions.prevTab?.();
-        break;
-      case 'closeTab':
-        currentActions.closeTab?.();
-        break;
-      case 'newTab':
-        currentActions.newTab?.();
-        break;
-      case 'openHosts':
-        currentActions.openHosts?.();
-        break;
-      case 'openSftp':
-        currentActions.openSftp?.();
-        break;
-      case 'openLocal':
-        currentActions.openLocal?.();
-        break;
-      case 'quickSwitch':
-        currentActions.quickSwitch?.();
-        break;
-      case 'commandPalette':
-        currentActions.commandPalette?.();
-        break;
-      case 'portForwarding':
-        currentActions.portForwarding?.();
-        break;
-      case 'snippets':
-        currentActions.snippets?.();
-        break;
-      case 'splitHorizontal':
-        currentActions.splitHorizontal?.();
-        break;
-      case 'splitVertical':
-        currentActions.splitVertical?.();
-        break;
-      case 'moveFocus': {
-        // Determine direction from arrow key
-        const key = e.key;
-        if (key === 'ArrowUp') currentActions.moveFocus?.('up');
-        else if (key === 'ArrowDown') currentActions.moveFocus?.('down');
-        else if (key === 'ArrowLeft') currentActions.moveFocus?.('left');
-        else if (key === 'ArrowRight') currentActions.moveFocus?.('right');
-        break;
-      }
-      case 'broadcast':
-        currentActions.broadcast?.();
-        break;
-    }
-  }, [hotkeyScheme, keyBindings, isSettingsOpen]);
-
-  useEffect(() => {
-    // Use capture phase to intercept before xterm
-    window.addEventListener('keydown', handleGlobalKeyDown, true);
-    return () => window.removeEventListener('keydown', handleGlobalKeyDown, true);
-  }, [handleGlobalKeyDown]);
-};
-
-// Helper to create key event handler for xterm's attachCustomKeyEventHandler
-// Returns false to let xterm handle the key, true to prevent xterm from handling
-export const createXtermKeyHandler = (
-  keyBindings: KeyBinding[],
-  isMac: boolean,
-  onTerminalAction?: (action: string, e: KeyboardEvent) => void
-) => {
-  const appLevelActions = getAppLevelActions();
-  const terminalActions = getTerminalPassthroughActions();
-
-  return (e: KeyboardEvent): boolean => {
-    const matched = checkAppShortcut(e, keyBindings, isMac);
-    if (!matched) return true; // Let xterm handle it
-
-    const { action } = matched;
-
-    // App-level actions: prevent xterm from handling, let global handler take over
-    if (appLevelActions.has(action)) {
-      return false; // Don't let xterm handle, will bubble to global handler
-    }
-
-    // Terminal-level actions: handle here and prevent default
-    if (terminalActions.has(action)) {
-      e.preventDefault();
-      e.stopPropagation();
-      onTerminalAction?.(action, e);
-      return false;
-    }
-
-    return true; // Let xterm handle other keys
-  };
-};

application/state/useImmersiveMode.ts

@@ -144,6 +144,7 @@ function applyImmersiveStyle(css: string, isDark: boolean, bg: string) {
 
 function removeImmersiveStyle() {
   document.getElementById(STYLE_ID)?.remove();
+  delete document.documentElement.dataset.immersiveTheme;
 }
 
 // ---------------------------------------------------------------------------
@@ -174,6 +175,7 @@ export function useImmersiveMode({
       overrideActiveRef.current = true;
       appliedFpRef.current = fp;
       applyImmersiveStyle(getImmersiveCss(activeTerminalTheme), activeTerminalTheme.type === 'dark', activeTerminalTheme.colors.background);
+      document.documentElement.dataset.immersiveTheme = fp;
     }
   }, [isTerminalTab, activeTerminalTheme]);
 

application/state/useLocalVaultBackups.ts

@@ -0,0 +1,95 @@
+import { useCallback, useEffect, useState } from 'react';
+import {
+  type LocalVaultBackupPreview,
+  getLocalVaultBackupCapabilities,
+  getLocalVaultBackupMaxCount,
+  listLocalVaultBackups,
+  openLocalVaultBackupDir,
+  readLocalVaultBackup,
+  setLocalVaultBackupMaxCount,
+  trimLocalVaultBackups,
+} from '../localVaultBackups';
+import { netcattyBridge } from '../../infrastructure/services/netcattyBridge';
+
+export function useLocalVaultBackups() {
+  const [backups, setBackups] = useState<LocalVaultBackupPreview[]>([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [maxBackups, setMaxBackupsState] = useState(() => getLocalVaultBackupMaxCount());
+  // `null` while we're still asking the main process. The UI should treat
+  // `null` as "unknown, don't render restore controls yet" so we never expose
+  // a destructive action that might later be disabled.
+  const [encryptionAvailable, setEncryptionAvailable] = useState<boolean | null>(null);
+
+  const refreshBackups = useCallback(async () => {
+    setIsLoading(true);
+    try {
+      const next = await listLocalVaultBackups();
+      setBackups(next);
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    let cancelled = false;
+    void (async () => {
+      try {
+        const caps = await getLocalVaultBackupCapabilities();
+        if (!cancelled) {
+          setEncryptionAvailable(caps.encryptionAvailable);
+        }
+      } catch {
+        if (!cancelled) {
+          setEncryptionAvailable(false);
+        }
+      }
+    })();
+    void refreshBackups();
+    return () => {
+      cancelled = true;
+    };
+  }, [refreshBackups]);
+
+  // Cross-window live refresh: the main process broadcasts when any
+  // renderer's createBackup or trimBackups actually mutated the on-disk
+  // set. Without this subscription, a protective backup written by the
+  // main window wouldn't show up in the Settings window's list until
+  // the user manually navigated away and back, silently under-reporting
+  // the most recent recovery points.
+  useEffect(() => {
+    const bridge = netcattyBridge.get();
+    const subscribe = bridge?.onVaultBackupsChanged;
+    if (typeof subscribe !== 'function') return undefined;
+    const unsubscribe = subscribe(() => {
+      void refreshBackups();
+    });
+    return () => {
+      try { unsubscribe?.(); } catch { /* ignore */ }
+    };
+  }, [refreshBackups]);
+
+  const updateMaxBackups = useCallback(async (value: number) => {
+    const sanitized = setLocalVaultBackupMaxCount(value);
+    setMaxBackupsState(sanitized);
+    await trimLocalVaultBackups(sanitized);
+    await refreshBackups();
+    return sanitized;
+  }, [refreshBackups]);
+
+  const openBackupDirectory = useCallback(async () => {
+    await openLocalVaultBackupDir();
+  }, []);
+
+  return {
+    backups,
+    isLoading,
+    maxBackups,
+    encryptionAvailable,
+    refreshBackups,
+    readBackup: readLocalVaultBackup,
+    setMaxBackups: updateMaxBackups,
+    openBackupDirectory,
+  };
+}
+
+export default useLocalVaultBackups;

application/state/usePortForwardingAutoStart.test.ts

@@ -0,0 +1,117 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import { getAutoStartRuleBlockReason, isAutoStartProxyReady } from "./usePortForwardingAutoStart.ts";
+import type { GroupConfig, Host, PortForwardingRule, ProxyProfile } from "../../domain/models.ts";
+
+const host = (overrides: Partial<Host> = {}): Host => ({
+  id: "host-1",
+  label: "Host",
+  hostname: "example.com",
+  username: "root",
+  tags: [],
+  os: "linux",
+  ...overrides,
+});
+
+const proxyProfile = (id: string): ProxyProfile => ({
+  id,
+  label: "Proxy",
+  config: { type: "http", host: "proxy.example.com", port: 3128 },
+  createdAt: 1,
+});
+
+const rule = (overrides: Partial<PortForwardingRule> = {}): PortForwardingRule => ({
+  id: "rule-1",
+  label: "Rule",
+  type: "local",
+  localPort: 8080,
+  bindAddress: "127.0.0.1",
+  remoteHost: "127.0.0.1",
+  remotePort: 80,
+  hostId: "host-1",
+  autoStart: true,
+  status: "inactive",
+  createdAt: 1,
+  ...overrides,
+});
+
+test("isAutoStartProxyReady waits when a host saved proxy is unresolved", () => {
+  assert.equal(
+    isAutoStartProxyReady(
+      host({ proxyProfileId: "missing-proxy" }),
+      [],
+      [],
+      [],
+    ),
+    false,
+  );
+});
+
+test("isAutoStartProxyReady waits when a missing host proxy has a group fallback", () => {
+  const groupConfigs: GroupConfig[] = [{ path: "prod", proxyProfileId: "group-proxy" }];
+  const currentHost = host({ group: "prod", proxyProfileId: "missing-proxy" });
+
+  assert.equal(
+    isAutoStartProxyReady(
+      currentHost,
+      [currentHost],
+      [proxyProfile("group-proxy")],
+      groupConfigs,
+    ),
+    false,
+  );
+});
+
+test("isAutoStartProxyReady waits when a group saved proxy is unresolved", () => {
+  const groupConfigs: GroupConfig[] = [{ path: "prod", proxyProfileId: "missing-proxy" }];
+  const currentHost = host({ group: "prod" });
+
+  assert.equal(
+    isAutoStartProxyReady(
+      currentHost,
+      [currentHost],
+      [],
+      groupConfigs,
+    ),
+    false,
+  );
+});
+
+test("isAutoStartProxyReady checks group-inherited jump hosts", () => {
+  const currentHost = host({ group: "prod" });
+  const jumpHost = host({ id: "jump-1", proxyProfileId: "missing-proxy" });
+
+  assert.equal(
+    isAutoStartProxyReady(
+      currentHost,
+      [currentHost, jumpHost],
+      [],
+      [{ path: "prod", hostChain: { hostIds: ["jump-1"] } }],
+    ),
+    false,
+  );
+});
+
+test("getAutoStartRuleBlockReason only blocks the affected rule", () => {
+  const goodHost = host();
+  const badHost = host({ id: "host-2", proxyProfileId: "missing-proxy" });
+  const hosts = [goodHost, badHost];
+  const isHostAuthReady = () => true;
+
+  assert.equal(
+    getAutoStartRuleBlockReason(rule({ id: "good", hostId: "host-1" }), hosts, [], [], isHostAuthReady),
+    undefined,
+  );
+  assert.equal(
+    getAutoStartRuleBlockReason(rule({ id: "bad", hostId: "host-2" }), hosts, [], [], isHostAuthReady),
+    "Proxy or jump host configuration is not ready",
+  );
+});
+
+test("getAutoStartRuleBlockReason marks rules without a host", () => {
+  assert.equal(
+    getAutoStartRuleBlockReason(rule({ hostId: undefined }), [], [], [], () => true),
+    "Rule host is not configured",
+  );
+});

application/state/usePortForwardingAutoStart.ts

@@ -4,8 +4,9 @@
  * when the application starts, not when the user navigates to the port forwarding page.
  */
 import { useCallback, useEffect, useRef } from "react";
-import { GroupConfig, Host, Identity, PortForwardingRule, SSHKey } from "../../domain/models";
+import { GroupConfig, Host, Identity, PortForwardingRule, ProxyProfile, SSHKey } from "../../domain/models";
 import { resolveGroupDefaults, applyGroupDefaults } from "../../domain/groupConfig";
+import { materializeHostProxyProfile } from "../../domain/proxyProfiles";
 import { STORAGE_KEY_PORT_FORWARDING } from "../../infrastructure/config/storageKeys";
 import { localStorageAdapter } from "../../infrastructure/persistence/localStorageAdapter";
 import {
@@ -17,27 +18,102 @@ import {
 import { logger } from "../../lib/logger";
 
 export interface UsePortForwardingAutoStartOptions {
+  isVaultInitialized: boolean;
   hosts: Host[];
   keys: SSHKey[];
   identities: Identity[];
+  proxyProfiles: ProxyProfile[];
   groupConfigs: GroupConfig[];
+  terminalSettings?: { keepaliveInterval: number; keepaliveCountMax: number };
 }
 
+const AUTO_START_PROXY_NOT_READY_ERROR = "Proxy or jump host configuration is not ready";
+const AUTO_START_AUTH_NOT_READY_ERROR = "Host authentication configuration is not ready";
+
+export const isAutoStartProxyReady = (
+  host: Host,
+  allHosts: Host[],
+  proxyProfiles: ProxyProfile[],
+  groupConfigs: GroupConfig[],
+  seen = new Set<string>(),
+): boolean => {
+  if (!host || seen.has(host.id)) return true;
+  seen.add(host.id);
+
+  const validProxyProfileIds: ReadonlySet<string> = new Set(proxyProfiles.map((profile) => profile.id));
+  const rawGroupDefaults = host.group
+    ? resolveGroupDefaults(host.group, groupConfigs)
+    : {};
+  const groupDefaults = host.group
+    ? resolveGroupDefaults(host.group, groupConfigs, { validProxyProfileIds })
+    : {};
+  const missingHostProxyProfile = Boolean(
+    host.proxyProfileId && !validProxyProfileIds.has(host.proxyProfileId),
+  );
+  const missingGroupProxyProfile = Boolean(
+    !host.proxyConfig &&
+    !host.proxyProfileId &&
+    rawGroupDefaults.proxyProfileId &&
+    !validProxyProfileIds.has(rawGroupDefaults.proxyProfileId),
+  );
+  const effectiveHost = applyGroupDefaults(host, groupDefaults, { validProxyProfileIds });
+  const hasProxyReplacement = Boolean(
+    effectiveHost.proxyConfig ||
+    (effectiveHost.proxyProfileId && validProxyProfileIds.has(effectiveHost.proxyProfileId)),
+  );
+
+  if ((missingHostProxyProfile || missingGroupProxyProfile) && !hasProxyReplacement) {
+    return false;
+  }
+
+  const chainIds = effectiveHost.hostChain?.hostIds || [];
+  for (const chainId of chainIds) {
+    const chainHost = allHosts.find((candidate) => candidate.id === chainId);
+    if (!chainHost) return false;
+    if (!isAutoStartProxyReady(chainHost, allHosts, proxyProfiles, groupConfigs, seen)) return false;
+  }
+
+  return true;
+};
+
+export const getAutoStartRuleBlockReason = (
+  rule: PortForwardingRule,
+  hosts: Host[],
+  proxyProfiles: ProxyProfile[],
+  groupConfigs: GroupConfig[],
+  isHostAuthReady: (host: Host) => boolean,
+): string | undefined => {
+  if (!rule.hostId) return "Rule host is not configured";
+  const host = hosts.find((candidate) => candidate.id === rule.hostId);
+  if (!host) return "Host not found";
+  if (!isHostAuthReady(host)) return AUTO_START_AUTH_NOT_READY_ERROR;
+  if (!isAutoStartProxyReady(host, hosts, proxyProfiles, groupConfigs)) {
+    return AUTO_START_PROXY_NOT_READY_ERROR;
+  }
+  return undefined;
+};
+
 /**
  * Auto-starts port forwarding rules that have autoStart enabled.
  * This hook should be called at the App level to run on app launch.
  */
 export const usePortForwardingAutoStart = ({
+  isVaultInitialized,
   hosts,
   keys,
   identities,
+  proxyProfiles,
   groupConfigs,
+  terminalSettings,
 }: UsePortForwardingAutoStartOptions): void => {
   const autoStartExecutedRef = useRef(false);
   const hostsRef = useRef<Host[]>(hosts);
   const keysRef = useRef<SSHKey[]>(keys);
   const identitiesRef = useRef<Identity[]>(identities);
+  const proxyProfilesRef = useRef<ProxyProfile[]>(proxyProfiles);
   const groupConfigsRef = useRef<GroupConfig[]>(groupConfigs);
+  const terminalSettingsRef = useRef(terminalSettings);
+  terminalSettingsRef.current = terminalSettings;
 
   const isHostAuthReady = useCallback((host: Host, seen = new Set<string>()): boolean => {
     if (!host || seen.has(host.id)) return true;
@@ -77,16 +153,53 @@ export const usePortForwardingAutoStart = ({
     identitiesRef.current = identities;
   }, [identities]);
 
+  useEffect(() => {
+    proxyProfilesRef.current = proxyProfiles;
+  }, [proxyProfiles]);
+
   useEffect(() => {
     groupConfigsRef.current = groupConfigs;
   }, [groupConfigs]);
 
   const resolveEffectiveHost = useCallback((host: Host): Host => {
-    if (!host.group) return host;
-    const defaults = resolveGroupDefaults(host.group, groupConfigsRef.current);
-    return applyGroupDefaults(host, defaults);
+    const validProxyProfileIds: ReadonlySet<string> = new Set(proxyProfilesRef.current.map((profile) => profile.id));
+    const withGroupDefaults = host.group
+      ? applyGroupDefaults(
+          host,
+          resolveGroupDefaults(host.group, groupConfigsRef.current, { validProxyProfileIds }),
+          { validProxyProfileIds },
+        )
+      : applyGroupDefaults(host, {}, { validProxyProfileIds });
+    return materializeHostProxyProfile(withGroupDefaults, proxyProfilesRef.current);
   }, []);
 
+  const resolveEffectiveHosts = useCallback(
+    (items: Host[]): Host[] => items.map((host) => resolveEffectiveHost(host)),
+    [resolveEffectiveHost],
+  );
+
+  const updateStoredRuleStatus = useCallback(
+    (ruleId: string, status: PortForwardingRule["status"], error?: string) => {
+      const currentRules = localStorageAdapter.read<PortForwardingRule[]>(
+        STORAGE_KEY_PORT_FORWARDING,
+      ) ?? [];
+
+      const updatedRules = currentRules.map((rule) =>
+        rule.id === ruleId
+          ? {
+              ...rule,
+              status,
+              error,
+              lastUsedAt: status === "active" ? Date.now() : rule.lastUsedAt,
+            }
+          : rule,
+      );
+
+      localStorageAdapter.write(STORAGE_KEY_PORT_FORWARDING, updatedRules);
+    },
+    [],
+  );
+
   // Set up the reconnect callback
   useEffect(() => {
     const handleReconnect = async (
@@ -99,40 +212,49 @@ export const usePortForwardingAutoStart = ({
       ) ?? [];
       
       const rule = rules.find((r) => r.id === ruleId);
-      if (!rule || !rule.hostId) {
-        return { success: false, error: "Rule or host not found" };
+      if (!rule) {
+        const error = "Rule not found";
+        onStatusChange("error", error);
+        return { success: false, error };
+      }
+      if (!rule.hostId) {
+        const error = "Rule host is not configured";
+        onStatusChange("error", error);
+        return { success: false, error };
       }
 
       const rawHost = hostsRef.current.find((h) => h.id === rule.hostId);
       if (!rawHost) {
-        return { success: false, error: "Host not found" };
+        const error = "Host not found";
+        onStatusChange("error", error);
+        return { success: false, error };
+      }
+      const blockReason = getAutoStartRuleBlockReason(
+        rule,
+        hostsRef.current,
+        proxyProfilesRef.current,
+        groupConfigsRef.current,
+        (host) => isHostAuthReady(host),
+      );
+      if (blockReason) {
+        onStatusChange("error", blockReason);
+        return { success: false, error: blockReason };
       }
 
       const host = resolveEffectiveHost(rawHost);
-      return startPortForward(rule, host, hostsRef.current, keysRef.current, identitiesRef.current, onStatusChange, true);
+      return startPortForward(rule, host, resolveEffectiveHosts(hostsRef.current), keysRef.current, identitiesRef.current, onStatusChange, true, terminalSettingsRef.current);
     };
 
     setReconnectCallback(handleReconnect);
     return () => {
       setReconnectCallback(null);
     };
-  }, [resolveEffectiveHost]);
+  }, [isHostAuthReady, resolveEffectiveHost, resolveEffectiveHosts]);
 
   // Auto-start rules on app launch
   useEffect(() => {
     if (autoStartExecutedRef.current) return;
-    if (hosts.length === 0) return;
-
-    const storedRules = localStorageAdapter.read<PortForwardingRule[]>(
-      STORAGE_KEY_PORT_FORWARDING,
-    ) ?? [];
-    const pendingAutoStartRules = storedRules.filter((rule) => rule.autoStart && rule.hostId);
-    if (pendingAutoStartRules.some((rule) => {
-      const host = hosts.find((candidate) => candidate.id === rule.hostId);
-      return !host || !isHostAuthReady(host);
-    })) {
-      return;
-    }
+    if (!isVaultInitialized) return;
 
     // Mark as executed immediately to prevent duplicate runs
     // (React StrictMode or dependency changes could cause re-runs)
@@ -149,7 +271,7 @@ export const usePortForwardingAutoStart = ({
 
       // Only start rules that are not already active
       const autoStartRules = rules.filter((r) => {
-        if (!r.autoStart || !r.hostId) return false;
+        if (!r.autoStart) return false;
         // Check if there's an active connection for this rule
         const conn = getActiveConnection(r.id);
         // Only start if not already connecting or active
@@ -162,39 +284,49 @@ export const usePortForwardingAutoStart = ({
       // Start each auto-start rule
       for (const rule of autoStartRules) {
         const rawHost = hosts.find((h) => h.id === rule.hostId);
-        if (rawHost) {
-          const host = resolveEffectiveHost(rawHost);
-          void startPortForward(
-            rule,
-            host,
-            hosts,
-            keys,
-            identities,
-            (status, error) => {
-              // Update the rule status in storage
-              const currentRules = localStorageAdapter.read<PortForwardingRule[]>(
-                STORAGE_KEY_PORT_FORWARDING,
-              ) ?? [];
-              
-              const updatedRules = currentRules.map((r) =>
-                r.id === rule.id
-                  ? {
-                      ...r,
-                      status,
-                      error,
-                      lastUsedAt: status === "active" ? Date.now() : r.lastUsedAt,
-                    }
-                  : r,
-              );
-              
-              localStorageAdapter.write(STORAGE_KEY_PORT_FORWARDING, updatedRules);
-            },
-            true, // Enable reconnect for auto-start rules
-          );
+        const blockReason = getAutoStartRuleBlockReason(
+          rule,
+          hosts,
+          proxyProfiles,
+          groupConfigs,
+          (host) => isHostAuthReady(host),
+        );
+        if (blockReason) {
+          updateStoredRuleStatus(rule.id, "error", blockReason);
+          continue;
         }
+
+        if (!rawHost) continue;
+        const host = resolveEffectiveHost(rawHost);
+        void startPortForward(
+          rule,
+          host,
+          resolveEffectiveHosts(hosts),
+          keys,
+          identities,
+          (status, error) => {
+            updateStoredRuleStatus(rule.id, status, error);
+          },
+          true, // Enable reconnect for auto-start rules
+          // Read via ref so adjusting global keepalive after launch doesn't
+          // re-trigger the auto-start effect (its dep array is intentionally
+          // stable to fire once on vault init).
+          terminalSettingsRef.current,
+        );
       }
     };
 
     void runAutoStart();
-  }, [hosts, identities, isHostAuthReady, keys, resolveEffectiveHost]);
+  }, [
+    groupConfigs,
+    hosts,
+    identities,
+    isHostAuthReady,
+    isVaultInitialized,
+    keys,
+    proxyProfiles,
+    resolveEffectiveHost,
+    resolveEffectiveHosts,
+    updateStoredRuleStatus,
+  ]);
 };

application/state/usePortForwardingState.ts

@@ -68,6 +68,7 @@ export interface UsePortForwardingStateResult {
     identities: Identity[],
     onStatusChange?: (status: PortForwardingRule["status"], error?: string) => void,
     enableReconnect?: boolean,
+    terminalSettings?: { keepaliveInterval: number; keepaliveCountMax: number },
   ) => Promise<{ success: boolean; error?: string }>;
   stopTunnel: (
     ruleId: string,
@@ -387,11 +388,12 @@ export const usePortForwardingState = (): UsePortForwardingStateResult => {
         error?: string,
       ) => void,
       enableReconnect = false,
+      terminalSettings?: { keepaliveInterval: number; keepaliveCountMax: number },
     ) => {
       return startPortForward(rule, host, hosts, keys, identities, (status, error) => {
         setRuleStatus(rule.id, status, error);
         onStatusChange?.(status, error ?? undefined);
-      }, enableReconnect);
+      }, enableReconnect, terminalSettings);
     },
     [setRuleStatus],
   );

application/state/useSessionState.ts

@@ -1,6 +1,7 @@
-import { MouseEvent,useCallback,useMemo,useState } from 'react';
+import { MouseEvent,useCallback,useMemo,useRef,useState } from 'react';
 import { ConnectionLog,Host,SerialConfig,Snippet,TerminalSession,Workspace,WorkspaceViewMode } from '../../domain/models';
 import {
+appendPaneToWorkspaceRoot,
 collectSessionIds,
 createWorkspaceFromSessions as createWorkspaceEntity,
 createWorkspaceFromSessionIds,
@@ -8,6 +9,7 @@ FocusDirection,
 getNextFocusSessionId,
 insertPaneIntoWorkspace,
 pruneWorkspaceNode,
+reorderWorkspaceFocusSessionOrder,
 SplitDirection,
 SplitHint,
 updateWorkspaceSplitSizes,
@@ -24,6 +26,12 @@ export interface LogView {
 export const useSessionState = () => {
   const [sessions, setSessions] = useState<TerminalSession[]>([]);
   const [workspaces, setWorkspaces] = useState<Workspace[]>([]);
+  // Latest workspaces snapshot for synchronous existence checks outside
+  // setWorkspaces updaters — React doesn't guarantee updaters run
+  // synchronously, so relying on a flag flipped inside them to decide
+  // whether to also call setSessions is racy and can leave orphan panes.
+  const workspacesRef = useRef(workspaces);
+  workspacesRef.current = workspaces;
   // activeTabId is now managed by external store - components subscribe directly
   const setActiveTabId = activeTabStore.setActiveTabId;
   const [draggingSessionId, setDraggingSessionId] = useState<string | null>(null);
@@ -141,19 +149,48 @@ export const useSessionState = () => {
     setSessions(prev => prev.map(s => s.id === sessionId ? { ...s, status } : s));
   }, []);
 
+  const closeWorkspace = useCallback((workspaceId: string) => {
+    setWorkspaces(prevWorkspaces => {
+      const remainingWorkspaces = prevWorkspaces.filter(w => w.id !== workspaceId);
+
+      setSessions(prevSessions => prevSessions.filter(s => s.workspaceId !== workspaceId));
+
+      const currentActiveTabId = activeTabStore.getActiveTabId();
+      if (currentActiveTabId === workspaceId) {
+        if (remainingWorkspaces.length > 0) {
+          setActiveTabId(remainingWorkspaces[remainingWorkspaces.length - 1].id);
+        } else {
+          setActiveTabId('vault');
+        }
+      }
+
+      return remainingWorkspaces;
+    });
+  }, [setActiveTabId]);
+
   const closeSession = useCallback((sessionId: string, e?: MouseEvent) => {
     e?.stopPropagation();
-    
+
+    // Pre-compute outside the setSessions updater so we don't depend on React
+    // having run the updater by the time we queue the microtask. React 18+ does
+    // not guarantee updater execution timing under concurrent scheduling.
+    const sessionBeingClosed = sessions.find(s => s.id === sessionId);
+    const workspaceIdToMaybeClose =
+      sessionBeingClosed?.workspaceId &&
+      sessions.every(s => s.id === sessionId || s.workspaceId !== sessionBeingClosed.workspaceId)
+        ? sessionBeingClosed.workspaceId
+        : undefined;
+
     setSessions(prevSessions => {
       const targetSession = prevSessions.find(s => s.id === sessionId);
       const wsId = targetSession?.workspaceId;
-      
+
       setWorkspaces(prevWorkspaces => {
         let removedWorkspaceId: string | null = null;
         let nextWorkspaces = prevWorkspaces;
         let dissolvedWorkspaceId: string | null = null;
         let lastRemainingSessionId: string | null = null;
-        
+
         if (wsId) {
           nextWorkspaces = prevWorkspaces
             .map(ws => {
@@ -163,7 +200,7 @@ export const useSessionState = () => {
                 removedWorkspaceId = ws.id;
                 return null;
               }
-              
+
               // Check if only 1 session remains - dissolve workspace
               const remainingSessionIds = collectSessionIds(pruned);
               if (remainingSessionIds.length === 1) {
@@ -171,12 +208,12 @@ export const useSessionState = () => {
                 lastRemainingSessionId = remainingSessionIds[0];
                 return null;
               }
-              
+
               return { ...ws, root: pruned };
             })
             .filter((ws): ws is Workspace => Boolean(ws));
         }
-        
+
         const remainingSessions = prevSessions.filter(s => s.id !== sessionId);
         const fallbackWorkspace = nextWorkspaces[nextWorkspaces.length - 1];
         const fallbackSolo = remainingSessions.filter(s => !s.workspaceId).slice(-1)[0];
@@ -198,10 +235,10 @@ export const useSessionState = () => {
         } else if (wsId && currentActiveTabId === wsId && !nextWorkspaces.find(w => w.id === wsId)) {
           setActiveTabId(getFallback());
         }
-        
+
         return nextWorkspaces;
       });
-      
+
       // Check if we need to dissolve a workspace (convert remaining session to orphan)
       if (targetSession?.workspaceId) {
         const ws = workspaces.find(w => w.id === targetSession.workspaceId);
@@ -218,29 +255,14 @@ export const useSessionState = () => {
           }
         }
       }
-	      
-	      return prevSessions.filter(s => s.id !== sessionId);
-	    });
-	  }, [workspaces, setActiveTabId]);
 
-  const closeWorkspace = useCallback((workspaceId: string) => {
-    setWorkspaces(prevWorkspaces => {
-      const remainingWorkspaces = prevWorkspaces.filter(w => w.id !== workspaceId);
-      
-      setSessions(prevSessions => prevSessions.filter(s => s.workspaceId !== workspaceId));
-      
-      const currentActiveTabId = activeTabStore.getActiveTabId();
-      if (currentActiveTabId === workspaceId) {
-        if (remainingWorkspaces.length > 0) {
-          setActiveTabId(remainingWorkspaces[remainingWorkspaces.length - 1].id);
-        } else {
-          setActiveTabId('vault');
-        }
-      }
-      
-	      return remainingWorkspaces;
-	    });
-	  }, [setActiveTabId]);
+      return prevSessions.filter(s => s.id !== sessionId);
+    });
+
+    if (workspaceIdToMaybeClose) {
+      queueMicrotask(() => closeWorkspace(workspaceIdToMaybeClose!));
+    }
+  }, [sessions, workspaces, setActiveTabId, closeWorkspace]);
 
   const startSessionRename = useCallback((sessionId: string) => {
     setSessions(prevSessions => {
@@ -369,6 +391,89 @@ export const useSessionState = () => {
     setActiveTabId(workspace.id);
   }, [setActiveTabId]);
 
+  // Like createWorkspaceWithHosts but supports mixed targets — each
+  // entry is either an SSH host or a local terminal. Used by the
+  // "New Workspace" flow in QuickSwitcher.
+  type WorkspaceTarget =
+    | { kind: 'local'; shellType?: TerminalSession['shellType']; shell?: string; shellArgs?: string[]; shellName?: string; shellIcon?: string }
+    | { kind: 'host'; host: Host };
+
+  const createWorkspaceFromTargets = useCallback((targets: WorkspaceTarget[], name: string = 'Workspace'): string | null => {
+    if (targets.length === 0) return null;
+
+    const newSessions: TerminalSession[] = targets.map((target) => {
+      if (target.kind === 'local') {
+        const sessionId = crypto.randomUUID();
+        return {
+          id: sessionId,
+          hostId: `local-${sessionId}`,
+          hostLabel: target.shellName || 'Local Terminal',
+          hostname: 'localhost',
+          username: 'local',
+          status: 'connecting',
+          protocol: 'local',
+          shellType: target.shellType,
+          localShell: target.shell,
+          localShellArgs: target.shellArgs,
+          localShellName: target.shellName,
+          localShellIcon: target.shellIcon,
+        };
+      }
+      const host = target.host;
+      if (host.protocol === 'serial') {
+        const serialConfig: SerialConfig = host.serialConfig || {
+          path: host.hostname,
+          baudRate: host.port || 115200,
+          dataBits: 8,
+          stopBits: 1,
+          parity: 'none',
+          flowControl: 'none',
+          localEcho: false,
+          lineMode: false,
+        };
+        const portName = serialConfig.path.split('/').pop() || serialConfig.path;
+        return {
+          id: crypto.randomUUID(),
+          hostId: host.id,
+          hostLabel: host.label || `Serial: ${portName}`,
+          hostname: serialConfig.path,
+          username: '',
+          status: 'connecting',
+          protocol: 'serial',
+          serialConfig,
+          charset: host.charset,
+        };
+      }
+      return {
+        id: crypto.randomUUID(),
+        hostId: host.id,
+        hostLabel: host.label,
+        hostname: host.hostname,
+        username: host.username,
+        status: 'connecting',
+        protocol: host.protocol,
+        port: host.port,
+        moshEnabled: host.moshEnabled,
+        charset: host.charset,
+      };
+    });
+
+    const sessionIds = newSessions.map((s) => s.id);
+    // Default to focus-mode (sidebar layout) regardless of target
+    // count — matches the intent behind the QuickSwitcher "New
+    // Workspace" flow, which the user expects to land in focus view.
+    const workspace = createWorkspaceFromSessionIds(sessionIds, {
+      title: name,
+      viewMode: 'focus',
+    });
+    const sessionsWithWorkspace = newSessions.map((s) => ({ ...s, workspaceId: workspace.id }));
+
+    setSessions((prev) => [...prev, ...sessionsWithWorkspace]);
+    setWorkspaces((prev) => [...prev, workspace]);
+    setActiveTabId(workspace.id);
+    return workspace.id;
+  }, [setActiveTabId]);
+
   const createWorkspaceFromSessions = useCallback((
     baseSessionId: string,
     joiningSessionId: string,
@@ -420,6 +525,118 @@ export const useSessionState = () => {
 	    });
 	  }, [setActiveTabId]);
 
+  // Add a host into an existing workspace by creating a new session for
+  // that host and appending it as the last pane at the workspace root.
+  // Sibling sizes are rebalanced equally by appendPaneToWorkspaceRoot.
+  // Unlike addSessionToWorkspace (which takes a pre-created orphan
+  // session and a SplitHint), this is atomic — the new session is born
+  // already bound to the target workspace and focused.
+  const appendHostToWorkspace = useCallback((
+    workspaceId: string,
+    host: Host,
+    direction: SplitDirection = 'vertical',
+  ): string | null => {
+    // Serial hosts use a different session constructor; they currently
+    // only enter workspaces via createSerialSession + drag, so reject
+    // them here to avoid a partially-constructed session.
+    if (host.protocol === 'serial') return null;
+
+    // Cheap early-exit using the ref when the workspace is clearly
+    // absent. The authoritative check lives inside the setWorkspaces
+    // updater below so we also cover the concurrent-close race.
+    if (!workspacesRef.current.some(w => w.id === workspaceId)) return null;
+
+    const newSessionId = crypto.randomUUID();
+    const newSession: TerminalSession = {
+      id: newSessionId,
+      hostId: host.id,
+      hostLabel: host.label,
+      hostname: host.hostname,
+      username: host.username,
+      status: 'connecting',
+      protocol: host.protocol,
+      port: host.port,
+      moshEnabled: host.moshEnabled,
+      charset: host.charset,
+      workspaceId,
+    };
+
+    // Nest setSessions + setActiveTabId inside the setWorkspaces updater
+    // so we only commit the session when the workspace update actually
+    // matched — otherwise a concurrent closeWorkspace between the ref
+    // check and the updater firing would leave an orphan session with a
+    // workspaceId pointing at nothing, and active tab would jump to a
+    // closed id. The inner setSessions is idempotent (id dedupe) so
+    // StrictMode's dev-time double-invoke does not duplicate the row.
+    setWorkspaces(prev => {
+      const target = prev.find(w => w.id === workspaceId);
+      if (!target) return prev;
+      setSessions(s => s.some(x => x.id === newSessionId) ? s : [...s, newSession]);
+      setActiveTabId(workspaceId);
+      return prev.map(ws => {
+        if (ws.id !== workspaceId) return ws;
+        return {
+          ...ws,
+          root: appendPaneToWorkspaceRoot(ws.root, newSessionId, direction),
+          focusedSessionId: newSessionId,
+        };
+      });
+    });
+    return newSessionId;
+  }, [setActiveTabId]);
+
+  // Atomic "append a local terminal pane" — mirror of appendHostToWorkspace
+  // but constructs a local-protocol session instead of an SSH one.
+  const appendLocalTerminalToWorkspace = useCallback((
+    workspaceId: string,
+    options?: {
+      shellType?: TerminalSession['shellType'];
+      shell?: string;
+      shellArgs?: string[];
+      shellName?: string;
+      shellIcon?: string;
+    },
+    direction: SplitDirection = 'vertical',
+  ): string | null => {
+    // Same pattern as appendHostToWorkspace — ref guard + authoritative
+    // inside-updater match to cover concurrent closeWorkspace.
+    if (!workspacesRef.current.some(w => w.id === workspaceId)) return null;
+
+    const newSessionId = crypto.randomUUID();
+    const localHostId = `local-${newSessionId}`;
+    const newSession: TerminalSession = {
+      id: newSessionId,
+      hostId: localHostId,
+      hostLabel: options?.shellName || 'Local Terminal',
+      hostname: 'localhost',
+      username: 'local',
+      status: 'connecting',
+      protocol: 'local',
+      shellType: options?.shellType,
+      localShell: options?.shell,
+      localShellArgs: options?.shellArgs,
+      localShellName: options?.shellName,
+      localShellIcon: options?.shellIcon,
+      workspaceId,
+    };
+
+    setWorkspaces(prev => {
+      const target = prev.find(w => w.id === workspaceId);
+      if (!target) return prev;
+      setSessions(s => s.some(x => x.id === newSessionId) ? s : [...s, newSession]);
+      setActiveTabId(workspaceId);
+      return prev.map(ws => {
+        if (ws.id !== workspaceId) return ws;
+        return {
+          ...ws,
+          root: appendPaneToWorkspaceRoot(ws.root, newSessionId, direction),
+          focusedSessionId: newSessionId,
+        };
+      });
+    });
+    return newSessionId;
+  }, [setActiveTabId]);
+
   const updateSplitSizes = useCallback((workspaceId: string, splitId: string, sizes: number[]) => {
     setWorkspaces(prev => prev.map(ws => {
       if (ws.id !== workspaceId) return ws;
@@ -543,6 +760,27 @@ export const useSessionState = () => {
     }));
   }, []);
 
+  const reorderWorkspaceSessions = useCallback((
+    workspaceId: string,
+    draggedSessionId: string,
+    targetSessionId: string,
+    position: 'before' | 'after' = 'before',
+  ) => {
+    setWorkspaces(prev => prev.map(ws => {
+      if (ws.id !== workspaceId) return ws;
+      return {
+        ...ws,
+        focusSessionOrder: reorderWorkspaceFocusSessionOrder(
+          ws.root,
+          ws.focusSessionOrder,
+          draggedSessionId,
+          targetSessionId,
+          position,
+        ),
+      };
+    }));
+  }, []);
+
   // Move focus between panes in a workspace
   const moveFocusInWorkspace = useCallback((workspaceId: string, direction: FocusDirection): boolean => {
     const workspace = workspaces.find(w => w.id === workspaceId);
@@ -654,16 +892,22 @@ export const useSessionState = () => {
   const copySession = useCallback((sessionId: string, options?: {
     localShellType?: TerminalSession['shellType'];
   }) => {
+    // Pre-allocate the new id outside the updater so StrictMode's
+    // double-invocation of the functional updater doesn't mint two ids.
+    const newSessionId = crypto.randomUUID();
+
     setSessions(prevSessions => {
       const session = prevSessions.find(s => s.id === sessionId);
+      // Source may have been closed between the user's action and this
+      // update running; in that case skip entirely — do NOT switch the
+      // active tab or insert into tabOrder, which would leave dangling ids.
       if (!session) return prevSessions;
       const nextShellType = session.protocol === 'local'
         ? options?.localShellType
         : session.shellType;
 
-      // Create a new session with the same connection info
       const newSession: TerminalSession = {
-        id: crypto.randomUUID(),
+        id: newSessionId,
         hostId: session.hostId,
         hostLabel: session.hostLabel,
         hostname: session.hostname,
@@ -681,10 +925,40 @@ export const useSessionState = () => {
         localShellIcon: session.localShellIcon,
       };
 
-      setActiveTabId(newSession.id);
+      // Schedule the activeTab + tabOrder updates only when creation
+      // actually happens. These nested setStates are idempotent, so
+      // StrictMode's double-invocation is harmless.
+      setActiveTabId(newSessionId);
+      setTabOrder(prevTabOrder => {
+        // Fast path: source is already tracked in tabOrder — splice directly.
+        const directIdx = prevTabOrder.indexOf(sessionId);
+        if (directIdx !== -1) {
+          const next = [...prevTabOrder];
+          next.splice(directIdx + 1, 0, newSessionId);
+          return next;
+        }
+        // Fallback: source is only in the derived tab collections. Rebuild the
+        // effective order (same pattern as reorderTabs) to locate its position.
+        const allTabIds = [
+          ...orphanSessions.map(s => s.id),
+          ...workspaces.map(w => w.id),
+          ...logViews.map(lv => lv.id),
+        ];
+        const allTabIdSet = new Set(allTabIds);
+        const orderedIds = prevTabOrder.filter(id => allTabIdSet.has(id));
+        const orderedIdSet = new Set(orderedIds);
+        const newIds = allTabIds.filter(id => !orderedIdSet.has(id));
+        const currentOrder = [...orderedIds, ...newIds];
+        const sourceIdx = currentOrder.indexOf(sessionId);
+        if (sourceIdx === -1) return [...prevTabOrder, newSessionId];
+        const next = [...currentOrder];
+        next.splice(sourceIdx + 1, 0, newSessionId);
+        return next;
+      });
+
       return [...prevSessions, newSession];
     });
-  }, [setActiveTabId]);
+  }, [orphanSessions, workspaces, logViews, setActiveTabId]);
 
   // Toggle broadcast mode for a workspace
   const toggleBroadcast = useCallback((workspaceId: string) => {
@@ -788,12 +1062,16 @@ export const useSessionState = () => {
     closeWorkspace,
     updateSessionStatus,
     createWorkspaceWithHosts,
+    createWorkspaceFromTargets,
     createWorkspaceFromSessions,
     addSessionToWorkspace,
+    appendHostToWorkspace,
+    appendLocalTerminalToWorkspace,
     updateSplitSizes,
     splitSession,
     toggleWorkspaceViewMode,
     setWorkspaceFocusedSession,
+    reorderWorkspaceSessions,
     moveFocusInWorkspace,
     runSnippet,
     orphanSessions,

application/state/useSettingsState.ts

@@ -1,9 +1,10 @@
 import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, type SetStateAction } from 'react';
-import { SyncConfig, TerminalSettings, HotkeyScheme, CustomKeyBindings, DEFAULT_KEY_BINDINGS, KeyBinding, UILanguage, SessionLogFormat, normalizeTerminalSettings } from '../../domain/models';
+import { SyncConfig, TerminalTheme, TerminalSettings, HotkeyScheme, CustomKeyBindings, DEFAULT_KEY_BINDINGS, KeyBinding, UILanguage, SessionLogFormat, normalizeTerminalSettings } from '../../domain/models';
 import {
   STORAGE_KEY_COLOR,
   STORAGE_KEY_SYNC,
   STORAGE_KEY_TERM_THEME,
+  STORAGE_KEY_TERM_FOLLOW_APP_THEME,
   STORAGE_KEY_THEME,
   STORAGE_KEY_TERM_FONT_FAMILY,
   STORAGE_KEY_TERM_FONT_SIZE,
@@ -33,12 +34,24 @@ import {
   STORAGE_KEY_GLOBAL_HOTKEY_ENABLED,
   STORAGE_KEY_AUTO_UPDATE_ENABLED,
   STORAGE_KEY_WORKSPACE_FOCUS_STYLE,
-
+  STORAGE_KEY_SHOW_RECENT_HOSTS,
+  STORAGE_KEY_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT,
+  STORAGE_KEY_SHOW_SFTP_TAB,
 } from '../../infrastructure/config/storageKeys';
 import { DEFAULT_UI_LOCALE, resolveSupportedLocale } from '../../infrastructure/config/i18n';
 import { TERMINAL_THEMES } from '../../infrastructure/config/terminalThemes';
+import {
+  areCustomKeyBindingsEqual,
+  nextCustomKeyBindingsSyncVersion,
+  parseCustomKeyBindingsStorageRecord,
+  resetCustomKeyBinding,
+  serializeCustomKeyBindingsStorageRecord,
+  shouldApplyIncomingCustomKeyBindingsRecord,
+  updateCustomKeyBinding as updateCustomKeyBindingRecord,
+} from '../../domain/customKeyBindings';
+import { applyCustomAccentToTerminalTheme, getTerminalThemeForUiTheme } from '../../domain/terminalAppearance';
 import { customThemeStore, useCustomThemes } from '../state/customThemeStore';
-import { DEFAULT_FONT_SIZE } from '../../infrastructure/config/fonts';
+import { DEFAULT_FONT_SIZE, isDeprecatedPrimaryFontId } from '../../infrastructure/config/fonts';
 import { DARK_UI_THEMES, LIGHT_UI_THEMES, UiThemeTokens, getUiThemeById } from '../../infrastructure/config/uiThemes';
 import { UI_FONTS, DEFAULT_UI_FONT_ID } from '../../infrastructure/config/uiFonts';
 import { uiFontStore, useUIFontsLoaded } from './uiFontStore';
@@ -58,6 +71,28 @@ const DEFAULT_ACCENT_MODE: 'theme' | 'custom' = 'theme';
 const DEFAULT_CUSTOM_ACCENT = '221.2 83.2% 53.3%';
 const DEFAULT_TERMINAL_THEME = 'netcatty-dark';
 const DEFAULT_FONT_FAMILY = 'menlo';
+
+/**
+ * Migrate any terminal font id arriving from storage / IPC / sync to a
+ * safe value. If `raw` is a deprecated proportional id (pingfang-sc,
+ * microsoft-yahei, comic-sans-ms), persist the rewrite back to
+ * localStorage so subsequent ingest paths and cloud-sync uploads stop
+ * carrying it. Used by every place that reads STORAGE_KEY_TERM_FONT_FAMILY
+ * — initial useState init, rehydrateAllFromStorage, IPC notifySettings
+ * change listener, and cross-window storage event listener — so a
+ * single point of truth keeps deprecated ids from re-entering state.
+ *
+ * Returns null when there's nothing to apply (raw is empty); callers
+ * fall back to DEFAULT_FONT_FAMILY in that case.
+ */
+function migrateIncomingTerminalFontId(raw: string | null | undefined): string | null {
+  if (!raw) return null;
+  if (isDeprecatedPrimaryFontId(raw)) {
+    localStorageAdapter.writeString(STORAGE_KEY_TERM_FONT_FAMILY, DEFAULT_FONT_FAMILY);
+    return DEFAULT_FONT_FAMILY;
+  }
+  return raw;
+}
 // Auto-detect default hotkey scheme based on platform
 const DEFAULT_HOTKEY_SCHEME: HotkeyScheme =
   typeof navigator !== 'undefined' && /Mac|iPhone|iPad|iPod/i.test(navigator.platform)
@@ -69,6 +104,9 @@ const DEFAULT_SFTP_SHOW_HIDDEN_FILES = false;
 const DEFAULT_SFTP_USE_COMPRESSED_UPLOAD = true;
 const DEFAULT_SFTP_AUTO_OPEN_SIDEBAR = false;
 const DEFAULT_SFTP_DEFAULT_VIEW_MODE: 'list' | 'tree' = 'list';
+const DEFAULT_SHOW_RECENT_HOSTS = true;
+const DEFAULT_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT = false;
+const DEFAULT_SHOW_SFTP_TAB = true;
 
 // Editor defaults
 const DEFAULT_EDITOR_WORD_WRAP = false;
@@ -117,6 +155,14 @@ const serializeTerminalSettings = (settings: TerminalSettings): string =>
 const areTerminalSettingsEqual = (a: TerminalSettings, b: TerminalSettings): boolean =>
   serializeTerminalSettings(a) === serializeTerminalSettings(b);
 
+const createCustomKeyBindingsSyncOrigin = (): string => {
+  if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
+    return crypto.randomUUID();
+  }
+
+  return `${Date.now()}-${Math.random().toString(36).slice(2)}`;
+};
+
 const applyThemeTokens = (
   themeSource: 'light' | 'dark' | 'system',
   resolvedTheme: 'light' | 'dark',
@@ -162,6 +208,8 @@ const applyThemeTokens = (
 };
 
 export const useSettingsState = () => {
+  const initialCustomKeyBindingsRecord =
+    parseCustomKeyBindingsStorageRecord(localStorageAdapter.readString(STORAGE_KEY_CUSTOM_KEY_BINDINGS));
   const uiFontsLoaded = useUIFontsLoaded();
   const [theme, setTheme] = useState<'dark' | 'light' | 'system'>(() => {
     const stored = readStoredString(STORAGE_KEY_THEME);
@@ -195,7 +243,21 @@ export const useSettingsState = () => {
   });
   const [syncConfig, setSyncConfig] = useState<SyncConfig | null>(() => localStorageAdapter.read<SyncConfig>(STORAGE_KEY_SYNC));
   const [terminalThemeId, setTerminalThemeId] = useState<string>(() => localStorageAdapter.readString(STORAGE_KEY_TERM_THEME) || DEFAULT_TERMINAL_THEME);
-  const [terminalFontFamilyId, setTerminalFontFamilyId] = useState<string>(() => localStorageAdapter.readString(STORAGE_KEY_TERM_FONT_FAMILY) || DEFAULT_FONT_FAMILY);
+  const [followAppTerminalTheme, setFollowAppTerminalThemeState] = useState<boolean>(() => {
+    const stored = localStorageAdapter.readString(STORAGE_KEY_TERM_FOLLOW_APP_THEME);
+    if (stored !== null) return stored === 'true';
+    // First time seeing this key. For genuinely fresh installs (no existing
+    // terminal theme in storage) default ON so the terminal matches the app
+    // theme out of the box. For upgrades from an older version (existing
+    // terminal theme present) default OFF to avoid silently overriding the
+    // user's manual choice.
+    const isUpgrade = !!localStorageAdapter.readString(STORAGE_KEY_TERM_THEME);
+    return !isUpgrade;
+  });
+  const [terminalFontFamilyId, setTerminalFontFamilyId] = useState<string>(() => {
+    const stored = localStorageAdapter.readString(STORAGE_KEY_TERM_FONT_FAMILY);
+    return migrateIncomingTerminalFontId(stored) ?? DEFAULT_FONT_FAMILY;
+  });
   const [terminalFontSize, setTerminalFontSize] = useState<number>(() => localStorageAdapter.readNumber(STORAGE_KEY_TERM_FONT_SIZE) || DEFAULT_FONT_SIZE);
   const [uiLanguage, setUiLanguage] = useState<UILanguage>(() => {
     const stored = readStoredString(STORAGE_KEY_UI_LANGUAGE);
@@ -213,8 +275,8 @@ export const useSettingsState = () => {
     }
     return DEFAULT_HOTKEY_SCHEME;
   });
-  const [customKeyBindings, setCustomKeyBindings] = useState<CustomKeyBindings>(() =>
-    localStorageAdapter.read<CustomKeyBindings>(STORAGE_KEY_CUSTOM_KEY_BINDINGS) || {}
+  const [customKeyBindings, setCustomKeyBindingsState] = useState<CustomKeyBindings>(() =>
+    initialCustomKeyBindingsRecord?.bindings || {}
   );
   const [isHotkeyRecording, setIsHotkeyRecordingState] = useState(false);
   const [customCSS, setCustomCSS] = useState<string>(() =>
@@ -247,6 +309,18 @@ export const useSettingsState = () => {
     const stored = readStoredString(STORAGE_KEY_SFTP_DEFAULT_VIEW_MODE);
     return (stored === 'list' || stored === 'tree') ? stored : DEFAULT_SFTP_DEFAULT_VIEW_MODE;
   });
+  const [showRecentHosts, setShowRecentHostsState] = useState<boolean>(() => {
+    const stored = localStorageAdapter.readBoolean(STORAGE_KEY_SHOW_RECENT_HOSTS);
+    return stored ?? DEFAULT_SHOW_RECENT_HOSTS;
+  });
+  const [showOnlyUngroupedHostsInRoot, setShowOnlyUngroupedHostsInRootState] = useState<boolean>(() => {
+    const stored = localStorageAdapter.readBoolean(STORAGE_KEY_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT);
+    return stored ?? DEFAULT_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT;
+  });
+  const [showSftpTab, setShowSftpTabState] = useState<boolean>(() => {
+    const stored = localStorageAdapter.readBoolean(STORAGE_KEY_SHOW_SFTP_TAB);
+    return stored ?? DEFAULT_SHOW_SFTP_TAB;
+  });
   const [sftpTransferConcurrency, setSftpTransferConcurrencyState] = useState<number>(() => {
     const stored = localStorageAdapter.readNumber(STORAGE_KEY_SFTP_TRANSFER_CONCURRENCY);
     return stored != null && stored >= 1 && stored <= 16 ? stored : 4;
@@ -300,6 +374,10 @@ export const useSettingsState = () => {
   const incomingTerminalSettingsSignatureRef = useRef<string | null>(null);
   const localTerminalSettingsVersionRef = useRef(0);
   const broadcastedLocalTerminalSettingsVersionRef = useRef(0);
+  const customKeyBindingsVersionRef = useRef(initialCustomKeyBindingsRecord?.version || 0);
+  const customKeyBindingsOriginRef = useRef(initialCustomKeyBindingsRecord?.origin || 'legacy');
+  const customKeyBindingsLocalOriginRef = useRef(createCustomKeyBindingsSyncOrigin());
+  const customKeyBindingsMutationSourceRef = useRef<'local' | 'incoming'>('local');
 
   // Fix 1: Mount guard — skip redundant IPC broadcasts & localStorage writes on initial mount.
   // Set to true by the LAST useEffect declaration; all persist effects see false on first render.
@@ -331,6 +409,51 @@ export const useSettingsState = () => {
     });
   }, []);
 
+  const setCustomKeyBindings = useCallback((nextValue: SetStateAction<CustomKeyBindings>) => {
+    setCustomKeyBindingsState((prev) => {
+      const candidate = typeof nextValue === 'function'
+        ? (nextValue as (prevState: CustomKeyBindings) => CustomKeyBindings)(prev)
+        : nextValue;
+      if (areCustomKeyBindingsEqual(prev, candidate)) {
+        return prev;
+      }
+      customKeyBindingsVersionRef.current = nextCustomKeyBindingsSyncVersion(
+        customKeyBindingsVersionRef.current,
+      );
+      customKeyBindingsOriginRef.current = customKeyBindingsLocalOriginRef.current;
+      customKeyBindingsMutationSourceRef.current = 'local';
+      return candidate;
+    });
+  }, []);
+
+  const applyIncomingCustomKeyBindings = useCallback((incoming: {
+    bindings: CustomKeyBindings;
+    version: number;
+    origin: string;
+  }) => {
+    setCustomKeyBindingsState((prev) => {
+      if (!shouldApplyIncomingCustomKeyBindingsRecord(
+        {
+          version: customKeyBindingsVersionRef.current,
+          origin: customKeyBindingsOriginRef.current,
+        },
+        {
+          version: incoming.version,
+          origin: incoming.origin,
+        },
+      )) {
+        return prev;
+      }
+      customKeyBindingsVersionRef.current = incoming.version;
+      customKeyBindingsOriginRef.current = incoming.origin;
+      customKeyBindingsMutationSourceRef.current = 'incoming';
+      if (areCustomKeyBindingsEqual(prev, incoming.bindings)) {
+        return prev;
+      }
+      return incoming.bindings;
+    });
+  }, []);
+
   // Helper to notify other windows about settings changes via IPC
   const notifySettingsChanged = useCallback((key: string, value: unknown) => {
     try {
@@ -414,7 +537,8 @@ export const useSettingsState = () => {
     const storedTermTheme = readStoredString(STORAGE_KEY_TERM_THEME);
     if (storedTermTheme) setTerminalThemeId(storedTermTheme);
     const storedTermFont = readStoredString(STORAGE_KEY_TERM_FONT_FAMILY);
-    if (storedTermFont) setTerminalFontFamilyId(storedTermFont);
+    const migratedTermFont = migrateIncomingTerminalFontId(storedTermFont);
+    if (migratedTermFont) setTerminalFontFamilyId(migratedTermFont);
     const storedTermSize = localStorageAdapter.readNumber(STORAGE_KEY_TERM_FONT_SIZE);
     if (storedTermSize != null) setTerminalFontSize(storedTermSize);
     const storedTermSettings = readStoredString(STORAGE_KEY_TERM_SETTINGS);
@@ -426,11 +550,11 @@ export const useSettingsState = () => {
     }
 
     // Keyboard
-    const storedKb = readStoredString(STORAGE_KEY_CUSTOM_KEY_BINDINGS);
+    const storedKb = parseCustomKeyBindingsStorageRecord(
+      localStorageAdapter.readString(STORAGE_KEY_CUSTOM_KEY_BINDINGS),
+    );
     if (storedKb) {
-      try {
-        setCustomKeyBindings(JSON.parse(storedKb));
-      } catch { /* ignore */ }
+      applyIncomingCustomKeyBindings(storedKb);
     }
 
     // Editor
@@ -450,6 +574,12 @@ export const useSettingsState = () => {
     if (storedAutoOpenSidebar === 'true' || storedAutoOpenSidebar === 'false') setSftpAutoOpenSidebar(storedAutoOpenSidebar === 'true');
     const storedDefaultViewMode = readStoredString(STORAGE_KEY_SFTP_DEFAULT_VIEW_MODE);
     if (storedDefaultViewMode === 'list' || storedDefaultViewMode === 'tree') setSftpDefaultViewMode(storedDefaultViewMode);
+    const storedShowRecentHosts = localStorageAdapter.readBoolean(STORAGE_KEY_SHOW_RECENT_HOSTS);
+    setShowRecentHostsState(storedShowRecentHosts ?? DEFAULT_SHOW_RECENT_HOSTS);
+    const storedShowOnlyUngroupedHostsInRoot = localStorageAdapter.readBoolean(STORAGE_KEY_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT);
+    setShowOnlyUngroupedHostsInRootState(storedShowOnlyUngroupedHostsInRoot ?? DEFAULT_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT);
+    const storedShowSftpTab = localStorageAdapter.readBoolean(STORAGE_KEY_SHOW_SFTP_TAB);
+    setShowSftpTabState(storedShowSftpTab ?? DEFAULT_SHOW_SFTP_TAB);
 
     // Workspace focus style
     const storedFocusStyle = readStoredString(STORAGE_KEY_WORKSPACE_FOCUS_STYLE);
@@ -457,7 +587,7 @@ export const useSettingsState = () => {
 
     // Custom terminal themes
     customThemeStore.loadFromStorage();
-  }, [syncAppearanceFromStorage, syncCustomCssFromStorage, setTerminalSettings]);
+  }, [applyIncomingCustomKeyBindings, syncAppearanceFromStorage, syncCustomCssFromStorage, setTerminalSettings]);
 
   useLayoutEffect(() => {
     const tokens = getUiThemeById(resolvedTheme, resolvedTheme === 'dark' ? darkUiThemeId : lightUiThemeId).tokens;
@@ -539,8 +669,13 @@ export const useSettingsState = () => {
       if (key === STORAGE_KEY_TERM_THEME && typeof value === 'string') {
         setTerminalThemeId(value);
       }
+      if (key === STORAGE_KEY_TERM_FOLLOW_APP_THEME) {
+        const next = value === true || value === 'true';
+        setFollowAppTerminalThemeState((prev) => (prev === next ? prev : next));
+      }
       if (key === STORAGE_KEY_TERM_FONT_FAMILY && typeof value === 'string') {
-        setTerminalFontFamilyId(value);
+        const migrated = migrateIncomingTerminalFontId(value);
+        if (migrated) setTerminalFontFamilyId(migrated);
       }
       if (key === STORAGE_KEY_TERM_FONT_SIZE && typeof value === 'number') {
         setTerminalFontSize(value);
@@ -576,14 +711,9 @@ export const useSettingsState = () => {
         setHotkeyScheme(value);
       }
       if (key === STORAGE_KEY_CUSTOM_KEY_BINDINGS) {
-        if (typeof value === 'string') {
-          try {
-            setCustomKeyBindings(JSON.parse(value) as CustomKeyBindings);
-          } catch {
-            // ignore parse errors
-          }
-        } else if (value && typeof value === 'object') {
-          setCustomKeyBindings(value as CustomKeyBindings);
+        const parsed = parseCustomKeyBindingsStorageRecord(value);
+        if (parsed) {
+          applyIncomingCustomKeyBindings(parsed);
         }
       }
       if (key === STORAGE_KEY_HOTKEY_RECORDING && typeof value === 'boolean') {
@@ -617,7 +747,7 @@ export const useSettingsState = () => {
         // ignore
       }
     };
-  }, [mergeIncomingTerminalSettings, syncAppearanceFromStorage, syncCustomCssFromStorage]);
+  }, [applyIncomingCustomKeyBindings, mergeIncomingTerminalSettings, syncAppearanceFromStorage, syncCustomCssFromStorage]);
 
   useEffect(() => {
     const bridge = netcattyBridge.get();
@@ -642,18 +772,20 @@ export const useSettingsState = () => {
   const settingsSnapshotRef = useRef({
     theme, lightUiThemeId, darkUiThemeId, accentMode, customAccent,
     customCSS, uiFontFamilyId, hotkeyScheme, uiLanguage,
-    terminalThemeId, terminalFontFamilyId, terminalFontSize,
+    terminalThemeId, followAppTerminalTheme, terminalFontFamilyId, terminalFontSize,
     sftpDoubleClickBehavior, sftpAutoSync, sftpShowHiddenFiles,
     sftpUseCompressedUpload, sftpAutoOpenSidebar, sftpDefaultViewMode,
+    showRecentHosts, showOnlyUngroupedHostsInRoot, showSftpTab,
     editorWordWrap, sessionLogsEnabled, sessionLogsDir, sessionLogsFormat,
     globalHotkeyEnabled, autoUpdateEnabled,
   });
   settingsSnapshotRef.current = {
     theme, lightUiThemeId, darkUiThemeId, accentMode, customAccent,
     customCSS, uiFontFamilyId, hotkeyScheme, uiLanguage,
-    terminalThemeId, terminalFontFamilyId, terminalFontSize,
+    terminalThemeId, followAppTerminalTheme, terminalFontFamilyId, terminalFontSize,
     sftpDoubleClickBehavior, sftpAutoSync, sftpShowHiddenFiles,
     sftpUseCompressedUpload, sftpAutoOpenSidebar, sftpDefaultViewMode,
+    showRecentHosts, showOnlyUngroupedHostsInRoot, showSftpTab,
     editorWordWrap, sessionLogsEnabled, sessionLogsDir, sessionLogsFormat,
     globalHotkeyEnabled, autoUpdateEnabled,
   };
@@ -710,11 +842,9 @@ export const useSettingsState = () => {
         }
       }
       if (e.key === STORAGE_KEY_CUSTOM_KEY_BINDINGS && e.newValue) {
-        try {
-          const newBindings = JSON.parse(e.newValue) as CustomKeyBindings;
-          setCustomKeyBindings(newBindings);
-        } catch {
-          // ignore parse errors
+        const parsed = parseCustomKeyBindingsStorageRecord(e.newValue);
+        if (parsed) {
+          applyIncomingCustomKeyBindings(parsed);
         }
       }
       // Sync terminal settings from other windows
@@ -732,10 +862,18 @@ export const useSettingsState = () => {
           setTerminalThemeId(e.newValue);
         }
       }
+      // Sync follow-app-theme toggle from other windows
+      if (e.key === STORAGE_KEY_TERM_FOLLOW_APP_THEME && e.newValue) {
+        const next = e.newValue === 'true';
+        if (next !== s.followAppTerminalTheme) {
+          setFollowAppTerminalThemeState(next);
+        }
+      }
       // Sync terminal font family from other windows
       if (e.key === STORAGE_KEY_TERM_FONT_FAMILY && e.newValue) {
-        if (e.newValue !== s.terminalFontFamilyId) {
-          setTerminalFontFamilyId(e.newValue);
+        const migrated = migrateIncomingTerminalFontId(e.newValue);
+        if (migrated && migrated !== s.terminalFontFamilyId) {
+          setTerminalFontFamilyId(migrated);
         }
       }
       // Sync terminal font size from other windows
@@ -810,6 +948,24 @@ export const useSettingsState = () => {
           setSftpDefaultViewMode(e.newValue);
         }
       }
+      if (e.key === STORAGE_KEY_SHOW_RECENT_HOSTS && e.newValue !== null) {
+        const newValue = e.newValue === 'true';
+        if (newValue !== s.showRecentHosts) {
+          setShowRecentHostsState(newValue);
+        }
+      }
+      if (e.key === STORAGE_KEY_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT && e.newValue !== null) {
+        const newValue = e.newValue === 'true';
+        if (newValue !== s.showOnlyUngroupedHostsInRoot) {
+          setShowOnlyUngroupedHostsInRootState(newValue);
+        }
+      }
+      if (e.key === STORAGE_KEY_SHOW_SFTP_TAB && e.newValue !== null) {
+        const newValue = e.newValue === 'true';
+        if (newValue !== s.showSftpTab) {
+          setShowSftpTabState(newValue);
+        }
+      }
       // Sync global hotkey enabled setting from other windows
       if (e.key === STORAGE_KEY_GLOBAL_HOTKEY_ENABLED && e.newValue !== null) {
         const newValue = e.newValue === 'true';
@@ -841,7 +997,7 @@ export const useSettingsState = () => {
 
     window.addEventListener('storage', handleStorageChange);
     return () => window.removeEventListener('storage', handleStorageChange);
-  }, [mergeIncomingTerminalSettings]); // Fix 4: stable deps only — state comparisons use settingsSnapshotRef
+  }, [applyIncomingCustomKeyBindings, mergeIncomingTerminalSettings]); // Fix 4: stable deps only — state comparisons use settingsSnapshotRef
 
   useEffect(() => {
     localStorageAdapter.writeString(STORAGE_KEY_TERM_THEME, terminalThemeId);
@@ -849,6 +1005,12 @@ export const useSettingsState = () => {
     notifySettingsChanged(STORAGE_KEY_TERM_THEME, terminalThemeId);
   }, [terminalThemeId, notifySettingsChanged]);
 
+  useEffect(() => {
+    localStorageAdapter.writeString(STORAGE_KEY_TERM_FOLLOW_APP_THEME, String(followAppTerminalTheme));
+    if (!persistMountedRef.current) return;
+    notifySettingsChanged(STORAGE_KEY_TERM_FOLLOW_APP_THEME, String(followAppTerminalTheme));
+  }, [followAppTerminalTheme, notifySettingsChanged]);
+
   useEffect(() => {
     localStorageAdapter.writeString(STORAGE_KEY_TERM_FONT_FAMILY, terminalFontFamilyId);
     if (!persistMountedRef.current) return;
@@ -883,9 +1045,21 @@ export const useSettingsState = () => {
   }, [hotkeyScheme, notifySettingsChanged]);
 
   useEffect(() => {
-    localStorageAdapter.write(STORAGE_KEY_CUSTOM_KEY_BINDINGS, customKeyBindings);
+    const payload = serializeCustomKeyBindingsStorageRecord({
+      version: customKeyBindingsVersionRef.current,
+      origin: customKeyBindingsOriginRef.current,
+      bindings: customKeyBindings,
+    });
+    if (localStorageAdapter.readString(STORAGE_KEY_CUSTOM_KEY_BINDINGS) !== payload) {
+      localStorageAdapter.writeString(STORAGE_KEY_CUSTOM_KEY_BINDINGS, payload);
+    }
     if (!persistMountedRef.current) return;
-    notifySettingsChanged(STORAGE_KEY_CUSTOM_KEY_BINDINGS, customKeyBindings);
+    if (customKeyBindingsMutationSourceRef.current === 'incoming') return;
+    notifySettingsChanged(STORAGE_KEY_CUSTOM_KEY_BINDINGS, {
+      version: customKeyBindingsVersionRef.current,
+      origin: customKeyBindingsOriginRef.current,
+      bindings: customKeyBindings,
+    });
   }, [customKeyBindings, notifySettingsChanged]);
 
   const setIsHotkeyRecording = useCallback((isRecording: boolean) => {
@@ -893,6 +1067,27 @@ export const useSettingsState = () => {
     notifySettingsChanged(STORAGE_KEY_HOTKEY_RECORDING, isRecording);
   }, [notifySettingsChanged]);
 
+  const setShowRecentHosts = useCallback((enabled: boolean) => {
+    setShowRecentHostsState(enabled);
+    localStorageAdapter.writeBoolean(STORAGE_KEY_SHOW_RECENT_HOSTS, enabled);
+    if (!persistMountedRef.current) return;
+    notifySettingsChanged(STORAGE_KEY_SHOW_RECENT_HOSTS, enabled);
+  }, [notifySettingsChanged]);
+
+  const setShowOnlyUngroupedHostsInRoot = useCallback((enabled: boolean) => {
+    setShowOnlyUngroupedHostsInRootState(enabled);
+    localStorageAdapter.writeBoolean(STORAGE_KEY_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT, enabled);
+    if (!persistMountedRef.current) return;
+    notifySettingsChanged(STORAGE_KEY_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT, enabled);
+  }, [notifySettingsChanged]);
+
+  const setShowSftpTab = useCallback((enabled: boolean) => {
+    setShowSftpTabState(enabled);
+    localStorageAdapter.writeBoolean(STORAGE_KEY_SHOW_SFTP_TAB, enabled);
+    if (!persistMountedRef.current) return;
+    notifySettingsChanged(STORAGE_KEY_SHOW_SFTP_TAB, enabled);
+  }, [notifySettingsChanged]);
+
   // Apply and persist custom CSS
   useEffect(() => {
     // Always apply CSS to document (needed on mount)
@@ -1076,37 +1271,18 @@ export const useSettingsState = () => {
 
   // Update a single key binding
   const updateKeyBinding = useCallback((bindingId: string, scheme: 'mac' | 'pc', newKey: string) => {
-    setCustomKeyBindings(prev => ({
-      ...prev,
-      [bindingId]: {
-        ...prev[bindingId],
-        [scheme]: newKey,
-      },
-    }));
-  }, []);
+    setCustomKeyBindings(prev => updateCustomKeyBindingRecord(prev, bindingId, scheme, newKey));
+  }, [setCustomKeyBindings]);
 
   // Reset a key binding to default
   const resetKeyBinding = useCallback((bindingId: string, scheme?: 'mac' | 'pc') => {
-    setCustomKeyBindings(prev => {
-      const next = { ...prev };
-      if (scheme) {
-        if (next[bindingId]) {
-          delete next[bindingId][scheme];
-          if (Object.keys(next[bindingId]).length === 0) {
-            delete next[bindingId];
-          }
-        }
-      } else {
-        delete next[bindingId];
-      }
-      return next;
-    });
-  }, []);
+    setCustomKeyBindings(prev => resetCustomKeyBinding(prev, bindingId, scheme));
+  }, [setCustomKeyBindings]);
 
   // Reset all key bindings to defaults
   const resetAllKeyBindings = useCallback(() => {
     setCustomKeyBindings({});
-  }, []);
+  }, [setCustomKeyBindings]);
 
   const updateSyncConfig = useCallback((config: SyncConfig | null) => {
     setSyncConfig(config);
@@ -1116,12 +1292,26 @@ export const useSettingsState = () => {
   // Subscribe to custom theme changes so editing in-place triggers re-render
   const customThemes = useCustomThemes();
 
-  const currentTerminalTheme = useMemo(
-    () => TERMINAL_THEMES.find(t => t.id === terminalThemeId)
+  const currentTerminalTheme = useMemo(() => {
+    let baseTheme: TerminalTheme;
+    // When "Follow Application Theme" is enabled, pick the terminal theme
+    // whose background matches the active UI theme preset.
+    if (followAppTerminalTheme) {
+      const activeUiThemeId = resolvedTheme === 'dark' ? darkUiThemeId : lightUiThemeId;
+      const mapped = getTerminalThemeForUiTheme(activeUiThemeId);
+      if (mapped) {
+        const found = TERMINAL_THEMES.find(t => t.id === mapped);
+        if (found) {
+          baseTheme = found;
+          return applyCustomAccentToTerminalTheme(baseTheme, accentMode, customAccent);
+        }
+      }
+    }
+    baseTheme = TERMINAL_THEMES.find(t => t.id === terminalThemeId)
       || customThemes.find(t => t.id === terminalThemeId)
-      || TERMINAL_THEMES[0],
-    [terminalThemeId, customThemes]
-  );
+      || TERMINAL_THEMES[0];
+    return applyCustomAccentToTerminalTheme(baseTheme, accentMode, customAccent);
+  }, [terminalThemeId, customThemes, followAppTerminalTheme, resolvedTheme, lightUiThemeId, darkUiThemeId, accentMode, customAccent]);
 
   const updateTerminalSetting = useCallback(<K extends keyof TerminalSettings>(
     key: K,
@@ -1156,6 +1346,8 @@ export const useSettingsState = () => {
     setUiLanguage,
     terminalThemeId,
     setTerminalThemeId,
+    followAppTerminalTheme,
+    setFollowAppTerminalTheme: setFollowAppTerminalThemeState,
     currentTerminalTheme,
     terminalFontFamilyId,
     setTerminalFontFamilyId,
@@ -1187,6 +1379,12 @@ export const useSettingsState = () => {
     setSftpAutoOpenSidebar,
     sftpDefaultViewMode,
     setSftpDefaultViewMode,
+    showRecentHosts,
+    setShowRecentHosts,
+    showOnlyUngroupedHostsInRoot,
+    setShowOnlyUngroupedHostsInRoot,
+    showSftpTab,
+    setShowSftpTab,
     sftpTransferConcurrency,
     setSftpTransferConcurrency,
     // Editor Settings
@@ -1225,6 +1423,7 @@ export const useSettingsState = () => {
       terminalThemeId, terminalFontFamilyId, terminalFontSize, terminalSettings,
       customKeyBindings, editorWordWrap,
       sftpDoubleClickBehavior, sftpAutoSync, sftpShowHiddenFiles, sftpUseCompressedUpload, sftpAutoOpenSidebar, sftpDefaultViewMode,
+      showRecentHosts, showOnlyUngroupedHostsInRoot, showSftpTab,
       customThemes, workspaceFocusStyle,
     ]),
   };

application/state/useSftpBackend.ts

@@ -150,6 +150,16 @@ export const useSftpBackend = () => {
     return bridge.getHomeDir();
   }, []);
 
+  const listDrives = useCallback(async () => {
+    return await netcattyBridge.get()?.listDrives?.() ?? [];
+  }, []);
+
+  const openPath = useCallback(async (path: string) => {
+    const bridge = netcattyBridge.get();
+    if (!bridge?.openPath) throw new Error("openPath unavailable");
+    return bridge.openPath(path);
+  }, []);
+
   const startStreamTransfer = useCallback(
     async (
       options: Parameters<NonNullable<NetcattyBridge["startStreamTransfer"]>>[0],
@@ -268,6 +278,8 @@ export const useSftpBackend = () => {
     mkdirLocal,
     statLocal,
     getHomeDir,
+    listDrives,
+    openPath,
 
     startStreamTransfer,
     cancelTransfer,

application/state/useSftpState.ts

@@ -174,6 +174,7 @@ export const useSftpState = (
     hosts,
     keys,
     identities,
+    terminalSettings: options?.terminalSettings,
     leftTabsRef,
     rightTabsRef,
     leftTabs,
@@ -271,7 +272,7 @@ export const useSftpState = (
 
   const {
     transfers,
-    conflicts,
+    conflicts: transferConflicts,
     activeTransfersCount,
     startTransfer,
     downloadToLocal,
@@ -282,7 +283,7 @@ export const useSftpState = (
     retryTransfer,
     clearCompletedTransfers,
     dismissTransfer,
-    resolveConflict,
+    resolveConflict: resolveTransferConflict,
   } = useSftpTransfers({
     getActivePane,
     getPaneByConnectionId,
@@ -301,14 +302,20 @@ export const useSftpState = (
     readTextFile,
     readBinaryFile,
     writeTextFile,
+    writeTextFileByConnection,
     downloadToTempAndOpen,
     uploadExternalFiles,
+    uploadExternalFileList,
+    uploadExternalFolderPath,
     uploadExternalEntries,
     cancelExternalUpload,
     selectApplication,
     activeFileWatchCountRef,
+    uploadConflicts,
+    resolveUploadConflict,
   } = useSftpExternalOperations({
     getActivePane,
+    getPaneByConnectionId,
     refresh,
     sftpSessionsRef,
     connectionCacheKeyMapRef,
@@ -320,6 +327,21 @@ export const useSftpState = (
     dismissExternalUpload: dismissTransfer,
   });
 
+  const conflicts = useMemo(
+    () => [...transferConflicts, ...uploadConflicts],
+    [transferConflicts, uploadConflicts],
+  );
+  const resolveAnyConflict = useCallback(
+    (...args: Parameters<typeof resolveTransferConflict>) => {
+      const [conflictId] = args;
+      if (uploadConflicts.some((conflict) => conflict.transferId === conflictId)) {
+        return resolveUploadConflict(...args);
+      }
+      return resolveTransferConflict(...args);
+    },
+    [resolveTransferConflict, resolveUploadConflict, uploadConflicts],
+  );
+
   // Store methods in a ref to create stable wrapper functions
   // This prevents callback reference changes from causing re-renders in consumers
   const methodsRef = useRef({
@@ -359,8 +381,11 @@ export const useSftpState = (
     readTextFile,
     readBinaryFile,
     writeTextFile,
+    writeTextFileByConnection,
     downloadToTempAndOpen,
     uploadExternalFiles,
+    uploadExternalFileList,
+    uploadExternalFolderPath,
     uploadExternalEntries,
     cancelExternalUpload,
     selectApplication,
@@ -372,7 +397,7 @@ export const useSftpState = (
     retryTransfer,
     clearCompletedTransfers,
     dismissTransfer,
-    resolveConflict,
+    resolveConflict: resolveAnyConflict,
     getSftpIdForConnection,
     reportSessionError: handleSessionError,
   });
@@ -413,8 +438,11 @@ export const useSftpState = (
     readTextFile,
     readBinaryFile,
     writeTextFile,
+    writeTextFileByConnection,
     downloadToTempAndOpen,
     uploadExternalFiles,
+    uploadExternalFileList,
+    uploadExternalFolderPath,
     uploadExternalEntries,
     cancelExternalUpload,
     selectApplication,
@@ -426,7 +454,7 @@ export const useSftpState = (
     retryTransfer,
     clearCompletedTransfers,
     dismissTransfer,
-    resolveConflict,
+    resolveConflict: resolveAnyConflict,
     getSftpIdForConnection,
     reportSessionError: handleSessionError,
   };
@@ -476,8 +504,14 @@ export const useSftpState = (
     readTextFile: (...args: Parameters<typeof readTextFile>) => methodsRef.current.readTextFile(...args),
     readBinaryFile: (...args: Parameters<typeof readBinaryFile>) => methodsRef.current.readBinaryFile(...args),
     writeTextFile: (...args: Parameters<typeof writeTextFile>) => methodsRef.current.writeTextFile(...args),
+    writeTextFileByConnection: (...args: Parameters<typeof writeTextFileByConnection>) =>
+      methodsRef.current.writeTextFileByConnection(...args),
     downloadToTempAndOpen: (...args: Parameters<typeof downloadToTempAndOpen>) => methodsRef.current.downloadToTempAndOpen(...args),
     uploadExternalFiles: (...args: Parameters<typeof uploadExternalFiles>) => methodsRef.current.uploadExternalFiles(...args),
+    uploadExternalFileList: (...args: Parameters<typeof uploadExternalFileList>) =>
+      methodsRef.current.uploadExternalFileList(...args),
+    uploadExternalFolderPath: (...args: Parameters<typeof uploadExternalFolderPath>) =>
+      methodsRef.current.uploadExternalFolderPath(...args),
     uploadExternalEntries: (...args: Parameters<typeof uploadExternalEntries>) =>
       methodsRef.current.uploadExternalEntries(...args),
     cancelExternalUpload: () => methodsRef.current.cancelExternalUpload(),
@@ -490,7 +524,7 @@ export const useSftpState = (
     retryTransfer: (...args: Parameters<typeof retryTransfer>) => methodsRef.current.retryTransfer(...args),
     clearCompletedTransfers: () => methodsRef.current.clearCompletedTransfers(),
     dismissTransfer: (...args: Parameters<typeof dismissTransfer>) => methodsRef.current.dismissTransfer(...args),
-    resolveConflict: (...args: Parameters<typeof resolveConflict>) => methodsRef.current.resolveConflict(...args),
+    resolveConflict: (...args: Parameters<typeof resolveAnyConflict>) => methodsRef.current.resolveConflict(...args),
     getSftpIdForConnection: (...args: Parameters<typeof getSftpIdForConnection>) => methodsRef.current.getSftpIdForConnection(...args),
     reportSessionError: (...args: Parameters<typeof handleSessionError>) => methodsRef.current.reportSessionError(...args),
     activeFileWatchCountRef,

application/state/useTerminalBackend.ts

@@ -1,4 +1,4 @@
-import { useCallback } from "react";
+import { useCallback, useMemo } from "react";
 import { netcattyBridge } from "../../infrastructure/services/netcattyBridge";
 
 export const useTerminalBackend = () => {
@@ -63,9 +63,9 @@ export const useTerminalBackend = () => {
     return bridge.execCommand(options);
   }, []);
 
-  const writeToSession = useCallback((sessionId: string, data: string) => {
+  const writeToSession = useCallback((sessionId: string, data: string, options?: { automated?: boolean }) => {
     const bridge = netcattyBridge.get();
-    bridge?.writeToSession?.(sessionId, data);
+    bridge?.writeToSession?.(sessionId, data, options);
   }, []);
 
   const resizeSession = useCallback((sessionId: string, cols: number, rows: number) => {
@@ -96,11 +96,38 @@ export const useTerminalBackend = () => {
     return bridge.onSessionExit(sessionId, cb);
   }, []);
 
+  const onTelnetAutoLoginComplete = useCallback((sessionId: string, cb: (evt: { sessionId: string }) => void) => {
+    const bridge = netcattyBridge.get();
+    return bridge?.onTelnetAutoLoginComplete?.(sessionId, cb);
+  }, []);
+
+  const onTelnetAutoLoginCancelled = useCallback((sessionId: string, cb: (evt: { sessionId: string }) => void) => {
+    const bridge = netcattyBridge.get();
+    return bridge?.onTelnetAutoLoginCancelled?.(sessionId, cb);
+  }, []);
+
   const onChainProgress = useCallback((cb: (sessionId: string, hop: number, total: number, label: string, status: string, error?: string) => void) => {
     const bridge = netcattyBridge.get();
     return bridge?.onChainProgress?.(cb);
   }, []);
 
+  const onHostKeyVerification = useCallback((cb: Parameters<NonNullable<NetcattyBridge["onHostKeyVerification"]>>[0]) => {
+    const bridge = netcattyBridge.get();
+    return bridge?.onHostKeyVerification?.(cb);
+  }, []);
+
+  const respondHostKeyVerification = useCallback(async (
+    requestId: string,
+    accept: boolean,
+    addToKnownHosts?: boolean,
+  ) => {
+    const bridge = netcattyBridge.get();
+    if (!bridge?.respondHostKeyVerification) {
+      return { success: false, error: "respondHostKeyVerification unavailable" };
+    }
+    return bridge.respondHostKeyVerification(requestId, accept, addToKnownHosts);
+  }, []);
+
   const openExternal = useCallback(async (url: string) => {
     const bridge = netcattyBridge.get();
     await bridge?.openExternal?.(url);
@@ -128,36 +155,101 @@ export const useTerminalBackend = () => {
     return bridge.getSessionPwd(sessionId);
   }, []);
 
+  const getSessionRemoteInfo = useCallback(async (sessionId: string) => {
+    const bridge = netcattyBridge.get();
+    if (!bridge?.getSessionRemoteInfo) {
+      return { success: false, error: 'getSessionRemoteInfo unavailable' };
+    }
+    return bridge.getSessionRemoteInfo(sessionId);
+  }, []);
+
+  const getSessionDistroInfo = useCallback(async (sessionId: string) => {
+    const bridge = netcattyBridge.get();
+    if (!bridge?.getSessionDistroInfo) {
+      return { success: false, error: 'getSessionDistroInfo unavailable' };
+    }
+    return bridge.getSessionDistroInfo(sessionId);
+  }, []);
+
   const getServerStats = useCallback(async (sessionId: string) => {
     const bridge = netcattyBridge.get();
     if (!bridge?.getServerStats) return { success: false, error: 'getServerStats unavailable' };
     return bridge.getServerStats(sessionId);
   }, []);
 
-  return {
-    backendAvailable,
-    telnetAvailable,
-    moshAvailable,
-    localAvailable,
-    serialAvailable,
-    execAvailable,
-    openExternalAvailable,
-    startSSHSession,
-    startTelnetSession,
-    startMoshSession,
-    startLocalSession,
-    startSerialSession,
-    listSerialPorts,
-    execCommand,
-    getSessionPwd,
-    getServerStats,
-    writeToSession,
-    resizeSession,
-    closeSession,
-    setSessionEncoding,
-    onSessionData,
-    onSessionExit,
-    onChainProgress,
-    openExternal,
-  };
+  // Memoize the returned object so its identity is stable across the
+  // hook's lifetime. Each method above is already useCallback([])-stable,
+  // so listing them as deps means useMemo recomputes once and then
+  // caches forever. Without this, every render produced a fresh object
+  // literal — making `terminalBackend` an unstable reference that
+  // forced consumers' useEffects (`}, [..., terminalBackend])`) to
+  // rerun on every parent render and forced lint to flag any deeper
+  // property dep (`}, [terminalBackend.onHostKeyVerification])`) it
+  // couldn't statically prove safe.
+  return useMemo(
+    () => ({
+      backendAvailable,
+      telnetAvailable,
+      moshAvailable,
+      localAvailable,
+      serialAvailable,
+      execAvailable,
+      openExternalAvailable,
+      startSSHSession,
+      startTelnetSession,
+      startMoshSession,
+      startLocalSession,
+      startSerialSession,
+      listSerialPorts,
+      execCommand,
+      getSessionPwd,
+      getSessionRemoteInfo,
+      getSessionDistroInfo,
+      getServerStats,
+      writeToSession,
+      resizeSession,
+      closeSession,
+      setSessionEncoding,
+      onSessionData,
+      onSessionExit,
+      onTelnetAutoLoginComplete,
+      onTelnetAutoLoginCancelled,
+      onChainProgress,
+      onHostKeyVerification,
+      respondHostKeyVerification,
+      openExternal,
+    }),
+    [
+      backendAvailable,
+      telnetAvailable,
+      moshAvailable,
+      localAvailable,
+      serialAvailable,
+      execAvailable,
+      openExternalAvailable,
+      startSSHSession,
+      startTelnetSession,
+      startMoshSession,
+      startLocalSession,
+      startSerialSession,
+      listSerialPorts,
+      execCommand,
+      getSessionPwd,
+      getSessionRemoteInfo,
+      getSessionDistroInfo,
+      getServerStats,
+      writeToSession,
+      resizeSession,
+      closeSession,
+      setSessionEncoding,
+      onSessionData,
+      onSessionExit,
+      onTelnetAutoLoginComplete,
+      onTelnetAutoLoginCancelled,
+      onChainProgress,
+      onHostKeyVerification,
+      respondHostKeyVerification,
+      openExternal,
+    ],
+  );
 };

application/state/useVaultState.ts

@@ -1,5 +1,7 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 import { normalizeDistroId, sanitizeHost } from "../../domain/host";
+import { sanitizeGroupConfig } from "../../domain/groupConfig";
+import { normalizeKnownHosts } from "../../domain/knownHosts";
 import {
   ConnectionLog,
   GroupConfig,
@@ -8,6 +10,7 @@ import {
   KeyCategory,
   KnownHost,
   ManagedSource,
+  ProxyProfile,
   ShellHistoryEntry,
   Snippet,
   SSHKey,
@@ -26,6 +29,7 @@ import {
   STORAGE_KEY_KNOWN_HOSTS,
   STORAGE_KEY_LEGACY_KEYS,
   STORAGE_KEY_MANAGED_SOURCES,
+  STORAGE_KEY_PROXY_PROFILES,
   STORAGE_KEY_SHELL_HISTORY,
   STORAGE_KEY_SNIPPET_PACKAGES,
   STORAGE_KEY_SNIPPETS,
@@ -36,16 +40,19 @@ import {
   decryptHosts,
   decryptIdentities,
   decryptKeys,
+  decryptProxyProfiles,
   encryptGroupConfigs,
   encryptHosts,
   encryptIdentities,
   encryptKeys,
+  encryptProxyProfiles,
 } from "../../infrastructure/persistence/secureFieldAdapter";
 
 type ExportableVaultData = {
   hosts: Host[];
   keys: SSHKey[];
   identities?: Identity[];
+  proxyProfiles?: ProxyProfile[];
   snippets: Snippet[];
   customGroups: string[];
   snippetPackages?: string[];
@@ -61,7 +68,7 @@ const migrateKey = (key: Partial<SSHKey>): SSHKey => {
   const label = key.label ?? `Key ${id.slice(0, 8)}`;
 
   const source =
-    key.source === "generated" || key.source === "imported"
+    key.source === "generated" || key.source === "imported" || key.source === "reference"
       ? key.source
       : key.privateKey
         ? "imported"
@@ -81,6 +88,7 @@ const migrateKey = (key: Partial<SSHKey>): SSHKey => {
       key.category ||
       ((key.certificate ? "certificate" : "key") as KeyCategory),
     created: key.created || Date.now(),
+    filePath: key.filePath,
   };
 };
 
@@ -102,9 +110,11 @@ const safeParse = <T,>(value: string | null): T | null => {
 };
 
 export const useVaultState = () => {
+  const [isInitialized, setIsInitialized] = useState(false);
   const [hosts, setHosts] = useState<Host[]>([]);
   const [keys, setKeys] = useState<SSHKey[]>([]);
   const [identities, setIdentities] = useState<Identity[]>([]);
+  const [proxyProfiles, setProxyProfiles] = useState<ProxyProfile[]>([]);
   const [snippets, setSnippets] = useState<Snippet[]>([]);
   const [customGroups, setCustomGroups] = useState<string[]>([]);
   const [snippetPackages, setSnippetPackages] = useState<string[]>([]);
@@ -120,6 +130,7 @@ export const useVaultState = () => {
   const hostsWriteVersion = useRef(0);
   const keysWriteVersion = useRef(0);
   const identitiesWriteVersion = useRef(0);
+  const proxyProfilesWriteVersion = useRef(0);
   const groupConfigsWriteVersion = useRef(0);
 
   // Read-sequence counters for cross-window storage events.  Each incoming
@@ -129,13 +140,14 @@ export const useVaultState = () => {
   const hostsReadSeq = useRef(0);
   const keysReadSeq = useRef(0);
   const identitiesReadSeq = useRef(0);
+  const proxyProfilesReadSeq = useRef(0);
   const groupConfigsReadSeq = useRef(0);
 
   const updateHosts = useCallback((data: Host[]) => {
     const cleaned = data.map(sanitizeHost);
     setHosts(cleaned);
     const ver = ++hostsWriteVersion.current;
-    encryptHosts(cleaned).then((enc) => {
+    return encryptHosts(cleaned).then((enc) => {
       if (ver === hostsWriteVersion.current)
         localStorageAdapter.write(STORAGE_KEY_HOSTS, enc);
     });
@@ -144,21 +156,66 @@ export const useVaultState = () => {
   const updateKeys = useCallback((data: SSHKey[]) => {
     setKeys(data);
     const ver = ++keysWriteVersion.current;
-    encryptKeys(data).then((enc) => {
+    return encryptKeys(data).then((enc) => {
       if (ver === keysWriteVersion.current)
         localStorageAdapter.write(STORAGE_KEY_KEYS, enc);
     });
   }, []);
 
+  const importOrReuseKey = useCallback((draft: Partial<SSHKey>): SSHKey => {
+    const existing = keys.find((k) => {
+      if (draft.source === 'reference' && draft.filePath) {
+        return k.source === 'reference' && k.filePath === draft.filePath;
+      }
+      if (draft.privateKey) {
+        return k.privateKey === draft.privateKey;
+      }
+      return false;
+    });
+    if (existing) return existing;
+
+    const newKey: SSHKey = {
+      id: crypto.randomUUID(),
+      label: draft.label || 'Imported Key',
+      type: draft.type || 'ED25519',
+      privateKey: draft.privateKey || '',
+      publicKey: draft.publicKey,
+      certificate: draft.certificate,
+      passphrase: draft.passphrase,
+      savePassphrase: draft.savePassphrase,
+      source: draft.source || 'imported',
+      category: (draft.category || 'key') as KeyCategory,
+      created: Date.now(),
+      filePath: draft.filePath,
+    };
+    const updated = [...keys, newKey];
+    setKeys(updated);
+    const ver = ++keysWriteVersion.current;
+    void encryptKeys(updated).then((enc) => {
+      if (ver === keysWriteVersion.current)
+        localStorageAdapter.write(STORAGE_KEY_KEYS, enc);
+    });
+    return newKey;
+  }, [keys]);
+
   const updateIdentities = useCallback((data: Identity[]) => {
     setIdentities(data);
     const ver = ++identitiesWriteVersion.current;
-    encryptIdentities(data).then((enc) => {
+    return encryptIdentities(data).then((enc) => {
       if (ver === identitiesWriteVersion.current)
         localStorageAdapter.write(STORAGE_KEY_IDENTITIES, enc);
     });
   }, []);
 
+  const updateProxyProfiles = useCallback((data: ProxyProfile[]) => {
+    setProxyProfiles(data);
+    const ver = ++proxyProfilesWriteVersion.current;
+    return encryptProxyProfiles(data).then((enc) => {
+      if (ver === proxyProfilesWriteVersion.current)
+        localStorageAdapter.write(STORAGE_KEY_PROXY_PROFILES, enc);
+    });
+  }, []);
+
   const updateSnippets = useCallback((data: Snippet[]) => {
     setSnippets(data);
     localStorageAdapter.write(STORAGE_KEY_SNIPPETS, data);
@@ -185,9 +242,15 @@ export const useVaultState = () => {
   }, []);
 
   const updateGroupConfigs = useCallback((data: GroupConfig[]) => {
-    setGroupConfigs(data);
+    // Sanitize on the write path too — applySyncPayload / importVaultData
+    // route legacy payloads through here, and without this step a saved
+    // pingfang-sc / comic-sans-ms override from an older client would
+    // sit in memory and re-persist with `fontFamilyOverride: true` until
+    // the next reload. Mirrors updateHosts → sanitizeHost.
+    const cleaned = data.map(sanitizeGroupConfig);
+    setGroupConfigs(cleaned);
     const ver = ++groupConfigsWriteVersion.current;
-    encryptGroupConfigs(data).then((enc) => {
+    return encryptGroupConfigs(cleaned).then((enc) => {
       if (ver === groupConfigsWriteVersion.current)
         localStorageAdapter.write(STORAGE_KEY_GROUP_CONFIGS, enc);
     });
@@ -197,6 +260,7 @@ export const useVaultState = () => {
     updateHosts([]);
     updateKeys([]);
     updateIdentities([]);
+    updateProxyProfiles([]);
     updateSnippets([]);
     updateSnippetPackages([]);
     updateCustomGroups([]);
@@ -208,6 +272,7 @@ export const useVaultState = () => {
     updateHosts,
     updateKeys,
     updateIdentities,
+    updateProxyProfiles,
     updateSnippets,
     updateSnippetPackages,
     updateCustomGroups,
@@ -339,129 +404,159 @@ export const useVaultState = () => {
 
   useEffect(() => {
     const init = async () => {
-      const savedHosts = localStorageAdapter.read<Host[]>(STORAGE_KEY_HOSTS);
+      try {
+        const savedHosts = localStorageAdapter.read<Host[]>(STORAGE_KEY_HOSTS);
 
-      if (savedHosts) {
-        // Capture version before the async gap so that any write occurring
-        // during decryption (storage event, user edit) advances the counter
-        // and causes this stale result to be discarded.
-        const ver = ++hostsWriteVersion.current;
-        const decrypted = await decryptHosts(savedHosts);
-        if (ver === hostsWriteVersion.current) {
-          const sanitized = decrypted.map(sanitizeHost);
-          setHosts(sanitized);
-          encryptHosts(sanitized).then((enc) => {
-            if (ver === hostsWriteVersion.current)
-              localStorageAdapter.write(STORAGE_KEY_HOSTS, enc);
-          });
+        if (savedHosts) {
+          // Capture version before the async gap so that any write occurring
+          // during decryption (storage event, user edit) advances the counter
+          // and causes this stale result to be discarded.
+          const ver = ++hostsWriteVersion.current;
+          const decrypted = await decryptHosts(savedHosts);
+          if (ver === hostsWriteVersion.current) {
+            const sanitized = decrypted.map(sanitizeHost);
+            setHosts(sanitized);
+            encryptHosts(sanitized).then((enc) => {
+              if (ver === hostsWriteVersion.current)
+                localStorageAdapter.write(STORAGE_KEY_HOSTS, enc);
+            });
+          }
+        } else {
+          updateHosts(INITIAL_HOSTS);
         }
-      } else {
-        updateHosts(INITIAL_HOSTS);
-      }
 
-      // Read keys fresh here (not before the hosts await) so we don't apply
-      // a stale snapshot if keys were updated during host decryption.
-      const savedKeysRaw = localStorageAdapter.read<unknown[]>(STORAGE_KEY_KEYS);
+        // Read keys fresh here (not before the hosts await) so we don't apply
+        // a stale snapshot if keys were updated during host decryption.
+        const savedKeysRaw = localStorageAdapter.read<unknown[]>(STORAGE_KEY_KEYS);
 
-      // Migrate old keys to new format with source/category fields
-      if (savedKeysRaw?.length) {
-        const migratedKeys: SSHKey[] = [];
-        const legacyKeys: LegacyKeyRecord[] = [];
+        // Migrate old keys to new format with source/category fields
+        if (savedKeysRaw?.length) {
+          const migratedKeys: SSHKey[] = [];
+          const legacyKeys: LegacyKeyRecord[] = [];
 
-        for (const entry of savedKeysRaw) {
-          const record =
-            entry && typeof entry === "object" ? (entry as LegacyKeyRecord) : null;
-          if (!record) continue;
+          for (const entry of savedKeysRaw) {
+            const record =
+              entry && typeof entry === "object" ? (entry as LegacyKeyRecord) : null;
+            if (!record) continue;
 
-          if (isLegacyUnsupportedKey(record)) {
-            legacyKeys.push(record);
-            continue;
+            if (isLegacyUnsupportedKey(record)) {
+              legacyKeys.push(record);
+              continue;
+            }
+
+            migratedKeys.push(migrateKey(record as Partial<SSHKey>));
           }
 
-          migratedKeys.push(migrateKey(record as Partial<SSHKey>));
+          // Decrypt sensitive fields (passphrase, privateKey)
+          const keyVer = ++keysWriteVersion.current;
+          const decryptedKeys = await decryptKeys(migratedKeys);
+          if (keyVer === keysWriteVersion.current) {
+            setKeys(decryptedKeys);
+            encryptKeys(decryptedKeys).then((enc) => {
+              if (keyVer === keysWriteVersion.current)
+                localStorageAdapter.write(STORAGE_KEY_KEYS, enc);
+            });
+          }
+          if (legacyKeys.length) {
+            localStorageAdapter.write(STORAGE_KEY_LEGACY_KEYS, legacyKeys);
+          }
         }
 
-        // Decrypt sensitive fields (passphrase, privateKey)
-        const keyVer = ++keysWriteVersion.current;
-        const decryptedKeys = await decryptKeys(migratedKeys);
-        if (keyVer === keysWriteVersion.current) {
-          setKeys(decryptedKeys);
-          encryptKeys(decryptedKeys).then((enc) => {
-            if (keyVer === keysWriteVersion.current)
-              localStorageAdapter.write(STORAGE_KEY_KEYS, enc);
-          });
+        // Read identities fresh here (not before the hosts/keys awaits) so we
+        // don't apply a stale snapshot if identities were updated during prior decryption.
+        const savedIdentities =
+          localStorageAdapter.read<Identity[]>(STORAGE_KEY_IDENTITIES);
+        if (savedIdentities) {
+          const idVer = ++identitiesWriteVersion.current;
+          const decryptedIds = await decryptIdentities(savedIdentities);
+          if (idVer === identitiesWriteVersion.current) {
+            setIdentities(decryptedIds);
+            encryptIdentities(decryptedIds).then((enc) => {
+              if (idVer === identitiesWriteVersion.current)
+                localStorageAdapter.write(STORAGE_KEY_IDENTITIES, enc);
+            });
+          }
         }
-        if (legacyKeys.length) {
-          localStorageAdapter.write(STORAGE_KEY_LEGACY_KEYS, legacyKeys);
+
+        const savedProxyProfiles =
+          localStorageAdapter.read<ProxyProfile[]>(STORAGE_KEY_PROXY_PROFILES);
+        if (savedProxyProfiles) {
+          const proxyVer = ++proxyProfilesWriteVersion.current;
+          const decryptedProfiles = await decryptProxyProfiles(savedProxyProfiles);
+          if (proxyVer === proxyProfilesWriteVersion.current) {
+            setProxyProfiles(decryptedProfiles);
+            encryptProxyProfiles(decryptedProfiles).then((enc) => {
+              if (proxyVer === proxyProfilesWriteVersion.current)
+                localStorageAdapter.write(STORAGE_KEY_PROXY_PROFILES, enc);
+            });
+          }
         }
-      }
 
-      // Read identities fresh here (not before the hosts/keys awaits) so we
-      // don't apply a stale snapshot if identities were updated during prior decryption.
-      const savedIdentities =
-        localStorageAdapter.read<Identity[]>(STORAGE_KEY_IDENTITIES);
-      if (savedIdentities) {
-        const idVer = ++identitiesWriteVersion.current;
-        const decryptedIds = await decryptIdentities(savedIdentities);
-        if (idVer === identitiesWriteVersion.current) {
-          setIdentities(decryptedIds);
-          encryptIdentities(decryptedIds).then((enc) => {
-            if (idVer === identitiesWriteVersion.current)
-              localStorageAdapter.write(STORAGE_KEY_IDENTITIES, enc);
-          });
+        // Read remaining non-encrypted data fresh after all async gaps above
+        const savedGroups = localStorageAdapter.read<string[]>(STORAGE_KEY_GROUPS);
+        const savedSnippets =
+          localStorageAdapter.read<Snippet[]>(STORAGE_KEY_SNIPPETS);
+        const savedSnippetPackages = localStorageAdapter.read<string[]>(
+          STORAGE_KEY_SNIPPET_PACKAGES,
+        );
+
+        if (savedSnippets) setSnippets(savedSnippets);
+        else updateSnippets(INITIAL_SNIPPETS);
+
+        if (savedGroups) setCustomGroups(savedGroups);
+        if (savedSnippetPackages) setSnippetPackages(savedSnippetPackages);
+
+        // Load known hosts. Records imported from `~/.ssh/known_hosts` and
+        // records saved by older builds may be missing the `fingerprint` /
+        // `keyType` fields the verifier compares against; backfill them now
+        // so the next SSH connect can match without falling into the brittle
+        // re-derivation path that caused the repeated "fingerprint changed"
+        // warnings in #972.
+        const savedKnownHosts = localStorageAdapter.read<KnownHost[]>(
+          STORAGE_KEY_KNOWN_HOSTS,
+        );
+        if (savedKnownHosts) {
+          const normalized = normalizeKnownHosts(savedKnownHosts);
+          setKnownHosts(normalized);
+          if (normalized !== savedKnownHosts) {
+            localStorageAdapter.write(STORAGE_KEY_KNOWN_HOSTS, normalized);
+          }
         }
-      }
 
-      // Read remaining non-encrypted data fresh after all async gaps above
-      const savedGroups = localStorageAdapter.read<string[]>(STORAGE_KEY_GROUPS);
-      const savedSnippets =
-        localStorageAdapter.read<Snippet[]>(STORAGE_KEY_SNIPPETS);
-      const savedSnippetPackages = localStorageAdapter.read<string[]>(
-        STORAGE_KEY_SNIPPET_PACKAGES,
-      );
+        // Load shell history
+        const savedShellHistory = localStorageAdapter.read<ShellHistoryEntry[]>(
+          STORAGE_KEY_SHELL_HISTORY,
+        );
+        if (savedShellHistory) setShellHistory(savedShellHistory);
 
-      if (savedSnippets) setSnippets(savedSnippets);
-      else updateSnippets(INITIAL_SNIPPETS);
+        // Load connection logs
+        const savedConnectionLogs = localStorageAdapter.read<ConnectionLog[]>(
+          STORAGE_KEY_CONNECTION_LOGS,
+        );
+        if (savedConnectionLogs) setConnectionLogs(savedConnectionLogs);
 
-      if (savedGroups) setCustomGroups(savedGroups);
-      if (savedSnippetPackages) setSnippetPackages(savedSnippetPackages);
+        // Load managed sources
+        const savedManagedSources = localStorageAdapter.read<ManagedSource[]>(
+          STORAGE_KEY_MANAGED_SOURCES,
+        );
+        if (savedManagedSources) setManagedSources(savedManagedSources);
 
-      // Load known hosts
-      const savedKnownHosts = localStorageAdapter.read<KnownHost[]>(
-        STORAGE_KEY_KNOWN_HOSTS,
-      );
-      if (savedKnownHosts) setKnownHosts(savedKnownHosts);
-
-      // Load shell history
-      const savedShellHistory = localStorageAdapter.read<ShellHistoryEntry[]>(
-        STORAGE_KEY_SHELL_HISTORY,
-      );
-      if (savedShellHistory) setShellHistory(savedShellHistory);
-
-      // Load connection logs
-      const savedConnectionLogs = localStorageAdapter.read<ConnectionLog[]>(
-        STORAGE_KEY_CONNECTION_LOGS,
-      );
-      if (savedConnectionLogs) setConnectionLogs(savedConnectionLogs);
-
-      // Load managed sources
-      const savedManagedSources = localStorageAdapter.read<ManagedSource[]>(
-        STORAGE_KEY_MANAGED_SOURCES,
-      );
-      if (savedManagedSources) setManagedSources(savedManagedSources);
-
-      // Load group configs
-      const savedGroupConfigs = localStorageAdapter.read<GroupConfig[]>(STORAGE_KEY_GROUP_CONFIGS);
-      if (savedGroupConfigs) {
-        const gcVer = ++groupConfigsWriteVersion.current;
-        const decryptedGC = await decryptGroupConfigs(savedGroupConfigs);
-        if (gcVer === groupConfigsWriteVersion.current) {
-          setGroupConfigs(decryptedGC);
-          encryptGroupConfigs(decryptedGC).then((enc) => {
-            if (gcVer === groupConfigsWriteVersion.current)
-              localStorageAdapter.write(STORAGE_KEY_GROUP_CONFIGS, enc);
-          });
+        // Load group configs
+        const savedGroupConfigs = localStorageAdapter.read<GroupConfig[]>(STORAGE_KEY_GROUP_CONFIGS);
+        if (savedGroupConfigs) {
+          const gcVer = ++groupConfigsWriteVersion.current;
+          const decryptedGC = await decryptGroupConfigs(savedGroupConfigs);
+          if (gcVer === groupConfigsWriteVersion.current) {
+            const sanitizedGC = decryptedGC.map(sanitizeGroupConfig);
+            setGroupConfigs(sanitizedGC);
+            encryptGroupConfigs(sanitizedGC).then((enc) => {
+              if (gcVer === groupConfigsWriteVersion.current)
+                localStorageAdapter.write(STORAGE_KEY_GROUP_CONFIGS, enc);
+            });
+          }
         }
+      } finally {
+        setIsInitialized(true);
       }
     };
 
@@ -523,6 +618,18 @@ export const useVaultState = () => {
         return;
       }
 
+      if (key === STORAGE_KEY_PROXY_PROFILES) {
+        const next = safeParse<ProxyProfile[]>(event.newValue) ?? [];
+        ++proxyProfilesWriteVersion.current;
+        const seq = ++proxyProfilesReadSeq.current;
+        const writeAtStart = proxyProfilesWriteVersion.current;
+        decryptProxyProfiles(next).then((dec) => {
+          if (seq === proxyProfilesReadSeq.current && writeAtStart === proxyProfilesWriteVersion.current)
+            setProxyProfiles(dec);
+        });
+        return;
+      }
+
       if (key === STORAGE_KEY_SNIPPETS) {
         const next = safeParse<Snippet[]>(event.newValue) ?? [];
         setSnippets(next);
@@ -543,7 +650,7 @@ export const useVaultState = () => {
 
       if (key === STORAGE_KEY_KNOWN_HOSTS) {
         const next = safeParse<KnownHost[]>(event.newValue) ?? [];
-        setKnownHosts(next);
+        setKnownHosts(normalizeKnownHosts(next));
         return;
       }
 
@@ -572,7 +679,7 @@ export const useVaultState = () => {
         const writeAtStart = groupConfigsWriteVersion.current;
         decryptGroupConfigs(next).then((dec) => {
           if (seq === groupConfigsReadSeq.current && writeAtStart === groupConfigsWriteVersion.current)
-            setGroupConfigs(dec);
+            setGroupConfigs(dec.map(sanitizeGroupConfig));
         });
         return;
       }
@@ -616,30 +723,35 @@ export const useVaultState = () => {
       hosts,
       keys,
       identities,
+      proxyProfiles,
       snippets,
       customGroups,
       snippetPackages,
       knownHosts,
       groupConfigs,
     }),
-    [hosts, keys, identities, snippets, customGroups, snippetPackages, knownHosts, groupConfigs],
+    [hosts, keys, identities, proxyProfiles, snippets, customGroups, snippetPackages, knownHosts, groupConfigs],
   );
 
   const importData = useCallback(
-    (payload: Partial<ExportableVaultData>) => {
-      if (payload.hosts) updateHosts(payload.hosts);
-      if (payload.keys) updateKeys(payload.keys);
-      if (payload.identities) updateIdentities(payload.identities);
+    (payload: Partial<ExportableVaultData>): Promise<void> => {
+      const encryptedWrites: Promise<void>[] = [];
+      if (payload.hosts) encryptedWrites.push(updateHosts(payload.hosts));
+      if (payload.keys) encryptedWrites.push(updateKeys(payload.keys));
+      if (payload.identities) encryptedWrites.push(updateIdentities(payload.identities));
+      if (Array.isArray(payload.proxyProfiles)) encryptedWrites.push(updateProxyProfiles(payload.proxyProfiles));
       if (payload.snippets) updateSnippets(payload.snippets);
       if (payload.customGroups) updateCustomGroups(payload.customGroups);
       if (payload.snippetPackages) updateSnippetPackages(payload.snippetPackages);
       if (payload.knownHosts) updateKnownHosts(payload.knownHosts);
-      if (Array.isArray(payload.groupConfigs)) updateGroupConfigs(payload.groupConfigs);
+      if (Array.isArray(payload.groupConfigs)) encryptedWrites.push(updateGroupConfigs(payload.groupConfigs));
+      return Promise.all(encryptedWrites).then(() => undefined);
     },
     [
       updateHosts,
       updateKeys,
       updateIdentities,
+      updateProxyProfiles,
       updateSnippets,
       updateCustomGroups,
       updateSnippetPackages,
@@ -649,17 +761,19 @@ export const useVaultState = () => {
   );
 
   const importDataFromString = useCallback(
-    (jsonString: string) => {
+    (jsonString: string): Promise<void> => {
       const data = JSON.parse(jsonString);
-      importData(data);
+      return importData(data);
     },
     [importData],
   );
 
   return {
+    isInitialized,
     hosts,
     keys,
     identities,
+    proxyProfiles,
     snippets,
     customGroups,
     snippetPackages,
@@ -670,7 +784,9 @@ export const useVaultState = () => {
     groupConfigs,
     updateHosts,
     updateKeys,
+    importOrReuseKey,
     updateIdentities,
+    updateProxyProfiles,
     updateSnippets,
     updateSnippetPackages,
     updateCustomGroups,

application/state/windowInputFocus.ts

@@ -0,0 +1,25 @@
+import { netcattyBridge } from "../../infrastructure/services/netcattyBridge";
+
+export const requestWindowInputFocus = (): void => {
+  try {
+    const result = netcattyBridge.get()?.windowFocus?.();
+    void result?.catch?.(() => undefined);
+  } catch {
+    // Browser preview or a disposed Electron bridge.
+  }
+};
+
+export const scheduleWindowInputFocus = (): void => {
+  const scheduleFrame: (callback: () => void) => unknown =
+    typeof requestAnimationFrame === "function"
+      ? requestAnimationFrame
+      : (callback) => {
+        callback();
+        return undefined;
+      };
+
+  scheduleFrame(() => {
+    requestWindowInputFocus();
+    setTimeout(requestWindowInputFocus, 50);
+  });
+};

application/syncPayload.test.ts

@@ -0,0 +1,653 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import type { SyncPayload } from "../domain/sync.ts";
+import type { KnownHost } from "../domain/models.ts";
+import type { SyncableVaultData } from "./syncPayload.ts";
+
+type LocalStorageMock = {
+  clear(): void;
+  getItem(key: string): string | null;
+  setItem(key: string, value: string): void;
+  removeItem(key: string): void;
+};
+
+function installLocalStorage(): LocalStorageMock {
+  const store = new Map<string, string>();
+  const localStorage: LocalStorageMock = {
+    clear() {
+      store.clear();
+    },
+    getItem(key: string) {
+      return store.has(key) ? store.get(key)! : null;
+    },
+    setItem(key: string, value: string) {
+      store.set(key, String(value));
+    },
+    removeItem(key: string) {
+      store.delete(key);
+    },
+  };
+  Object.defineProperty(globalThis, "localStorage", {
+    value: localStorage,
+    configurable: true,
+  });
+  return localStorage;
+}
+
+const localStorage = installLocalStorage();
+const {
+  applyLocalVaultPayload,
+  applySyncPayload,
+  buildLocalVaultPayload,
+  buildSyncPayload,
+  hasMeaningfulCloudSyncData,
+} = await import("./syncPayload.ts");
+const storageKeys = await import("../infrastructure/config/storageKeys.ts");
+
+const knownHost = (id = "kh-1"): KnownHost => ({
+  id,
+  hostname: `${id}.example.com`,
+  port: 22,
+  keyType: "ssh-ed25519",
+  publicKey: `SHA256:${id}`,
+  discoveredAt: 1,
+});
+
+const vault = (knownHosts: KnownHost[] = [knownHost()]): SyncableVaultData => ({
+  hosts: [],
+  keys: [],
+  identities: [],
+  snippets: [],
+  customGroups: [],
+  snippetPackages: [],
+  knownHosts,
+  groupConfigs: [],
+});
+
+test.beforeEach(() => {
+  localStorage.clear();
+});
+
+test("buildSyncPayload treats known hosts as local-only data", () => {
+  const payload = buildSyncPayload(vault([knownHost("kh-cloud")]));
+
+  assert.equal("knownHosts" in payload, false);
+});
+
+test("buildSyncPayload includes reusable proxy profiles", () => {
+  const proxyProfiles = [
+    {
+      id: "proxy-1",
+      label: "Office Proxy",
+      config: { type: "socks5", host: "proxy.example.com", port: 1080 },
+      createdAt: 1,
+      updatedAt: 1,
+    },
+  ];
+
+  const payload = buildSyncPayload({
+    ...vault(),
+    proxyProfiles,
+  } as SyncableVaultData & { proxyProfiles: typeof proxyProfiles });
+
+  assert.deepEqual(payload.proxyProfiles, proxyProfiles);
+});
+
+test("buildSyncPayload includes AI configuration settings", () => {
+  const providers = [{
+    id: "openai-main",
+    providerId: "openai",
+    name: "OpenAI",
+    apiKey: "enc:v1:test",
+    defaultModel: "gpt-test",
+    enabled: true,
+  }];
+  const webSearch = {
+    providerId: "tavily",
+    apiKey: "enc:v1:web",
+    enabled: true,
+    maxResults: 7,
+  };
+
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_PROVIDERS, JSON.stringify(providers));
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_ACTIVE_PROVIDER, "openai-main");
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_ACTIVE_MODEL, "gpt-test");
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_PERMISSION_MODE, "autonomous");
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_TOOL_INTEGRATION_MODE, "skills");
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_DEFAULT_AGENT, "codex");
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_COMMAND_BLOCKLIST, JSON.stringify(["rm -rf"]));
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_COMMAND_TIMEOUT, "120");
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_MAX_ITERATIONS, "10");
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_AGENT_MODEL_MAP, JSON.stringify({ codex: "gpt-test" }));
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_WEB_SEARCH, JSON.stringify(webSearch));
+
+  const payload = buildSyncPayload(vault([]));
+
+  assert.deepEqual(payload.settings?.ai, {
+    providers,
+    activeProviderId: "openai-main",
+    activeModelId: "gpt-test",
+    globalPermissionMode: "autonomous",
+    toolIntegrationMode: "skills",
+    defaultAgentId: "codex",
+    commandBlocklist: ["rm -rf"],
+    commandTimeout: 120,
+    maxIterations: 10,
+    agentModelMap: { codex: "gpt-test" },
+    webSearchConfig: webSearch,
+  });
+});
+
+test("buildSyncPayload excludes externalAgents (device-local OS-bound config)", () => {
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_EXTERNAL_AGENTS, JSON.stringify([
+    { id: "codex", name: "Codex", command: "/opt/homebrew/bin/codex", enabled: true },
+  ]));
+
+  const payload = buildSyncPayload(vault([]));
+
+  assert.equal("ai" in (payload.settings ?? {}), false);
+});
+
+test("buildSyncPayload omits device-bound encrypted AI API keys", () => {
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_PROVIDERS, JSON.stringify([{
+    id: "openai-main",
+    providerId: "openai",
+    name: "OpenAI",
+    apiKey: "enc:v1:djEwAAAA",
+    enabled: true,
+  }]));
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_WEB_SEARCH, JSON.stringify({
+    providerId: "tavily",
+    apiKey: "enc:v1:djEwAAAA",
+    enabled: true,
+  }));
+
+  const payload = buildSyncPayload(vault([]));
+
+  assert.equal("apiKey" in (payload.settings?.ai?.providers?.[0] ?? {}), false);
+  assert.equal("apiKey" in (payload.settings?.ai?.webSearchConfig ?? {}), false);
+});
+
+test("applySyncPayload restores AI configuration settings", async () => {
+  const providers = [{
+    id: "anthropic-main",
+    providerId: "anthropic",
+    name: "Anthropic",
+    apiKey: "enc:v1:test",
+    enabled: true,
+  }];
+  const webSearch = {
+    providerId: "exa",
+    apiKey: "enc:v1:web",
+    enabled: true,
+  };
+
+  const payload: SyncPayload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    settings: {
+      ai: {
+        providers,
+        activeProviderId: "anthropic-main",
+        activeModelId: "claude-test",
+        globalPermissionMode: "observer",
+        toolIntegrationMode: "mcp",
+        defaultAgentId: "claude",
+        commandBlocklist: ["shutdown"],
+        commandTimeout: 30,
+        maxIterations: 5,
+        agentModelMap: { claude: "claude-test" },
+        webSearchConfig: webSearch,
+      },
+    },
+    syncedAt: 1,
+  } as SyncPayload;
+
+  await applySyncPayload(payload, { importVaultData: () => {} });
+
+  assert.deepEqual(JSON.parse(localStorage.getItem(storageKeys.STORAGE_KEY_AI_PROVIDERS)!), providers);
+  assert.equal(localStorage.getItem(storageKeys.STORAGE_KEY_AI_ACTIVE_PROVIDER), "anthropic-main");
+  assert.equal(localStorage.getItem(storageKeys.STORAGE_KEY_AI_ACTIVE_MODEL), "claude-test");
+  assert.equal(localStorage.getItem(storageKeys.STORAGE_KEY_AI_PERMISSION_MODE), "observer");
+  assert.equal(localStorage.getItem(storageKeys.STORAGE_KEY_AI_TOOL_INTEGRATION_MODE), "mcp");
+  assert.equal(localStorage.getItem(storageKeys.STORAGE_KEY_AI_DEFAULT_AGENT), "claude");
+  assert.deepEqual(JSON.parse(localStorage.getItem(storageKeys.STORAGE_KEY_AI_COMMAND_BLOCKLIST)!), ["shutdown"]);
+  assert.equal(localStorage.getItem(storageKeys.STORAGE_KEY_AI_COMMAND_TIMEOUT), "30");
+  assert.equal(localStorage.getItem(storageKeys.STORAGE_KEY_AI_MAX_ITERATIONS), "5");
+  assert.deepEqual(JSON.parse(localStorage.getItem(storageKeys.STORAGE_KEY_AI_AGENT_MODEL_MAP)!), { claude: "claude-test" });
+  assert.deepEqual(JSON.parse(localStorage.getItem(storageKeys.STORAGE_KEY_AI_WEB_SEARCH)!), webSearch);
+});
+
+test("applySyncPayload preserves local externalAgents and ignores legacy payload field", async () => {
+  const localAgents = [
+    { id: "codex", name: "Codex", command: "/usr/local/bin/codex", enabled: true },
+  ];
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_EXTERNAL_AGENTS, JSON.stringify(localAgents));
+
+  const payload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    settings: {
+      ai: {
+        // Legacy snapshot still carries externalAgents; current code must ignore it.
+        externalAgents: [
+          { id: "claude", name: "Claude", command: "C:\\Tools\\claude.exe", enabled: true },
+        ],
+      },
+    },
+    syncedAt: 1,
+  } as unknown as SyncPayload;
+
+  await applySyncPayload(payload, { importVaultData: () => {} });
+
+  assert.deepEqual(
+    JSON.parse(localStorage.getItem(storageKeys.STORAGE_KEY_AI_EXTERNAL_AGENTS)!),
+    localAgents,
+  );
+});
+
+test("applySyncPayload preserves local AI provider apiKeys when synced payload omits them", async () => {
+  const localProviders = [
+    {
+      id: "openai-main",
+      providerId: "openai",
+      name: "OpenAI",
+      apiKey: "enc:v1:djEwLOCAL",
+      enabled: true,
+    },
+    {
+      id: "anthropic-main",
+      providerId: "anthropic",
+      name: "Anthropic",
+      apiKey: "enc:v1:djEwANTHROPIC",
+      enabled: true,
+    },
+  ];
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_PROVIDERS, JSON.stringify(localProviders));
+
+  // Synced payload mirrors what `collectSyncableSettings` produces on another device:
+  // metadata is preserved but encrypted device-bound apiKeys are stripped.
+  const syncedProviders = [
+    { id: "openai-main", providerId: "openai", name: "OpenAI (renamed)", enabled: true },
+    { id: "anthropic-main", providerId: "anthropic", name: "Anthropic", enabled: false },
+  ];
+
+  const payload: SyncPayload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    settings: { ai: { providers: syncedProviders } },
+    syncedAt: 1,
+  } as SyncPayload;
+
+  await applySyncPayload(payload, { importVaultData: () => {} });
+
+  const stored = JSON.parse(localStorage.getItem(storageKeys.STORAGE_KEY_AI_PROVIDERS)!);
+  assert.deepEqual(stored, [
+    {
+      id: "openai-main",
+      providerId: "openai",
+      name: "OpenAI (renamed)",
+      apiKey: "enc:v1:djEwLOCAL",
+      enabled: true,
+    },
+    {
+      id: "anthropic-main",
+      providerId: "anthropic",
+      name: "Anthropic",
+      apiKey: "enc:v1:djEwANTHROPIC",
+      enabled: false,
+    },
+  ]);
+});
+
+test("applySyncPayload prefers explicit synced apiKey over local apiKey", async () => {
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_PROVIDERS, JSON.stringify([
+    { id: "openai-main", providerId: "openai", name: "OpenAI", apiKey: "enc:v1:djEwLOCAL", enabled: true },
+  ]));
+
+  const payload: SyncPayload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    settings: {
+      ai: {
+        providers: [
+          { id: "openai-main", providerId: "openai", name: "OpenAI", apiKey: "plaintext-from-other-device", enabled: true },
+        ],
+      },
+    },
+    syncedAt: 1,
+  } as SyncPayload;
+
+  await applySyncPayload(payload, { importVaultData: () => {} });
+
+  const stored = JSON.parse(localStorage.getItem(storageKeys.STORAGE_KEY_AI_PROVIDERS)!);
+  assert.equal(stored[0].apiKey, "plaintext-from-other-device");
+});
+
+test("applySyncPayload preserves local web-search apiKey when synced config omits it", async () => {
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_WEB_SEARCH, JSON.stringify({
+    providerId: "tavily",
+    apiKey: "enc:v1:djEwWEB",
+    enabled: true,
+    maxResults: 7,
+  }));
+
+  const payload: SyncPayload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    settings: {
+      ai: {
+        webSearchConfig: { providerId: "tavily", enabled: false, maxResults: 12 },
+      },
+    },
+    syncedAt: 1,
+  } as SyncPayload;
+
+  await applySyncPayload(payload, { importVaultData: () => {} });
+
+  const stored = JSON.parse(localStorage.getItem(storageKeys.STORAGE_KEY_AI_WEB_SEARCH)!);
+  assert.deepEqual(stored, {
+    providerId: "tavily",
+    apiKey: "enc:v1:djEwWEB",
+    enabled: false,
+    maxResults: 12,
+  });
+});
+
+test("applySyncPayload drops local web-search apiKey when synced config switches provider", async () => {
+  localStorage.setItem(storageKeys.STORAGE_KEY_AI_WEB_SEARCH, JSON.stringify({
+    providerId: "tavily",
+    apiKey: "enc:v1:djEwWEB",
+    enabled: true,
+  }));
+
+  const payload: SyncPayload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    settings: {
+      ai: {
+        webSearchConfig: { providerId: "exa", enabled: true },
+      },
+    },
+    syncedAt: 1,
+  } as SyncPayload;
+
+  await applySyncPayload(payload, { importVaultData: () => {} });
+
+  const stored = JSON.parse(localStorage.getItem(storageKeys.STORAGE_KEY_AI_WEB_SEARCH)!);
+  assert.equal("apiKey" in stored, false);
+  assert.equal(stored.providerId, "exa");
+});
+
+test("buildSyncPayload includes syncable terminal options from settings", () => {
+  localStorage.setItem(storageKeys.STORAGE_KEY_TERM_FOLLOW_APP_THEME, "true");
+  localStorage.setItem(storageKeys.STORAGE_KEY_TERM_SETTINGS, JSON.stringify({
+    terminalEmulationType: "vt100",
+    altAsMeta: true,
+    showServerStats: false,
+    serverStatsRefreshInterval: 12,
+    rendererType: "dom",
+    localShell: "/bin/zsh",
+  }));
+
+  const payload = buildSyncPayload(vault([]));
+
+  assert.equal(payload.settings?.followAppTerminalTheme, true);
+  assert.deepEqual(payload.settings?.terminalSettings, {
+    terminalEmulationType: "vt100",
+    altAsMeta: true,
+    showServerStats: false,
+    serverStatsRefreshInterval: 12,
+    rendererType: "dom",
+  });
+});
+
+test("hasMeaningfulCloudSyncData ignores legacy cloud known hosts", () => {
+  assert.equal(
+    hasMeaningfulCloudSyncData({
+      hosts: [],
+      keys: [],
+      identities: [],
+      snippets: [],
+      customGroups: [],
+      knownHosts: [knownHost("kh-only")],
+      syncedAt: 1,
+    }),
+    false,
+  );
+});
+
+test("buildLocalVaultPayload preserves known hosts for local backups", () => {
+  const payload = buildLocalVaultPayload(vault([knownHost("kh-local")]));
+
+  assert.deepEqual(payload.knownHosts, [knownHost("kh-local")]);
+});
+
+test("applySyncPayload ignores legacy cloud known hosts", async () => {
+  let imported: Record<string, unknown> | null = null;
+  const proxyProfiles = [
+    {
+      id: "proxy-1",
+      label: "Office Proxy",
+      config: { type: "socks5", host: "proxy.example.com", port: 1080 },
+      createdAt: 1,
+      updatedAt: 1,
+    },
+  ];
+  const payload: SyncPayload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    knownHosts: [knownHost("kh-legacy")],
+    proxyProfiles,
+    syncedAt: 1,
+  } as SyncPayload & { proxyProfiles: typeof proxyProfiles };
+
+  await applySyncPayload(payload, {
+    importVaultData: (json) => {
+      imported = JSON.parse(json);
+    },
+  });
+
+  assert.ok(imported);
+  assert.equal("knownHosts" in imported, false);
+  assert.deepEqual(imported.proxyProfiles, proxyProfiles);
+});
+
+test("applySyncPayload keeps missing proxy references visible to connection guards", async () => {
+  let imported: Record<string, unknown> | null = null;
+  const payload: SyncPayload = {
+    hosts: [{
+      id: "host-1",
+      label: "Host",
+      hostname: "example.com",
+      username: "root",
+      tags: [],
+      os: "linux",
+      proxyProfileId: "missing-proxy",
+    }],
+    keys: [],
+    identities: [],
+    proxyProfiles: [],
+    snippets: [],
+    customGroups: [],
+    groupConfigs: [{ path: "prod", proxyProfileId: "missing-proxy" }],
+    syncedAt: 1,
+  };
+
+  await applySyncPayload(payload, {
+    importVaultData: (json) => {
+      imported = JSON.parse(json);
+    },
+  });
+
+  assert.ok(imported);
+  assert.equal((imported.hosts as SyncPayload["hosts"])[0]?.proxyProfileId, "missing-proxy");
+  assert.equal((imported.groupConfigs as SyncPayload["groupConfigs"])?.[0]?.proxyProfileId, "missing-proxy");
+});
+
+test("applySyncPayload preserves host proxy references when group configs are absent", async () => {
+  let imported: Record<string, unknown> | null = null;
+  const payload: SyncPayload = {
+    hosts: [{
+      id: "host-1",
+      label: "Host",
+      hostname: "example.com",
+      username: "root",
+      tags: [],
+      os: "linux",
+      proxyProfileId: "missing-proxy",
+    }],
+    keys: [],
+    identities: [],
+    proxyProfiles: [],
+    snippets: [],
+    customGroups: [],
+    syncedAt: 1,
+  };
+
+  await applySyncPayload(payload, {
+    importVaultData: (json) => {
+      imported = JSON.parse(json);
+    },
+  });
+
+  assert.ok(imported);
+  assert.equal((imported.hosts as SyncPayload["hosts"])[0]?.proxyProfileId, "missing-proxy");
+  assert.equal("groupConfigs" in imported, false);
+});
+
+test("applySyncPayload waits for async vault imports", async () => {
+  let finished = false;
+  const payload: SyncPayload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    syncedAt: 1,
+  };
+
+  const promise = applySyncPayload(payload, {
+    importVaultData: async () => {
+      await new Promise((resolve) => setTimeout(resolve, 1));
+      finished = true;
+    },
+  });
+
+  assert.equal(finished, false);
+  await promise;
+  assert.equal(finished, true);
+});
+
+test("buildSyncPayload includes fallbackFont when present in TERM_SETTINGS", () => {
+  localStorage.setItem(
+    storageKeys.STORAGE_KEY_TERM_SETTINGS,
+    JSON.stringify({ scrollback: 5000, fallbackFont: "PingFang SC", fontLigatures: true }),
+  );
+
+  const payload = buildSyncPayload(vault());
+  const termSettings = (payload.settings?.terminalSettings ?? {}) as Record<string, unknown>;
+  assert.equal(termSettings.fallbackFont, "PingFang SC");
+});
+
+test("buildSyncPayload omits fallbackFont when TERM_SETTINGS does not set it", () => {
+  localStorage.setItem(
+    storageKeys.STORAGE_KEY_TERM_SETTINGS,
+    JSON.stringify({ scrollback: 5000, fontLigatures: true }),
+  );
+
+  const payload = buildSyncPayload(vault());
+  const termSettings = (payload.settings?.terminalSettings ?? {}) as Record<string, unknown>;
+  assert.equal("fallbackFont" in termSettings, false);
+});
+
+test("applySyncPayload writes incoming fallbackFont into local TERM_SETTINGS", async () => {
+  const payload: SyncPayload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    syncedAt: 1,
+    settings: { terminalSettings: { fallbackFont: "Sarasa Mono SC" } },
+  };
+
+  await applySyncPayload(payload, {
+    importVaultData: () => {},
+  });
+
+  const raw = localStorage.getItem(storageKeys.STORAGE_KEY_TERM_SETTINGS);
+  assert.ok(raw, "TERM_SETTINGS should be written");
+  const parsed = JSON.parse(raw!);
+  assert.equal(parsed.fallbackFont, "Sarasa Mono SC");
+});
+
+test("applySyncPayload from legacy client (no fallbackFont) preserves local value", async () => {
+  localStorage.setItem(
+    storageKeys.STORAGE_KEY_TERM_SETTINGS,
+    JSON.stringify({ scrollback: 5000, fallbackFont: "Microsoft YaHei UI" }),
+  );
+
+  const payload: SyncPayload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    syncedAt: 1,
+    settings: { terminalSettings: { scrollback: 9999 } },
+  };
+
+  await applySyncPayload(payload, {
+    importVaultData: () => {},
+  });
+
+  const raw = localStorage.getItem(storageKeys.STORAGE_KEY_TERM_SETTINGS);
+  const parsed = JSON.parse(raw!);
+  assert.equal(parsed.fallbackFont, "Microsoft YaHei UI", "legacy payload must not wipe local fallbackFont");
+  assert.equal(parsed.scrollback, 9999);
+});
+
+test("applyLocalVaultPayload restores known hosts from local backups", async () => {
+  let imported: Record<string, unknown> | null = null;
+  const payload: SyncPayload = {
+    hosts: [],
+    keys: [],
+    identities: [],
+    snippets: [],
+    customGroups: [],
+    knownHosts: [knownHost("kh-backup")],
+    syncedAt: 1,
+  };
+
+  await applyLocalVaultPayload(payload, {
+    importVaultData: (json) => {
+      imported = JSON.parse(json);
+    },
+  });
+
+  assert.ok(imported);
+  assert.deepEqual(imported.knownHosts, [knownHost("kh-backup")]);
+});

application/syncPayload.ts

@@ -13,13 +13,25 @@ import type {
   Identity,
   KnownHost,
   PortForwardingRule,
+  ProxyProfile,
   SftpBookmark,
   Snippet,
   SSHKey,
 } from '../domain/models';
-import type { SyncPayload } from '../domain/sync';
+import {
+  CLOUD_SYNC_PAYLOAD_ENTITY_KEYS,
+  SYNC_PAYLOAD_ENTITY_KEYS,
+  hasSyncPayloadEntityData,
+  type SyncPayload,
+} from '../domain/sync';
+import {
+  nextCustomKeyBindingsSyncVersion,
+  parseCustomKeyBindingsStorageRecord,
+  serializeCustomKeyBindingsStorageRecord,
+} from '../domain/customKeyBindings';
+import { isEncryptedCredentialPlaceholder } from '../domain/credentials';
 import { localStorageAdapter } from '../infrastructure/persistence/localStorageAdapter';
-import { rehydrateGlobalBookmarks } from '../components/sftp/hooks/useGlobalSftpBookmarks';
+import { rehydrateGlobalSftpBookmarks } from './state/sftp/globalSftpBookmarks';
 import {
   STORAGE_KEY_THEME,
   STORAGE_KEY_UI_THEME_LIGHT,
@@ -30,6 +42,7 @@ import {
   STORAGE_KEY_UI_LANGUAGE,
   STORAGE_KEY_CUSTOM_CSS,
   STORAGE_KEY_TERM_THEME,
+  STORAGE_KEY_TERM_FOLLOW_APP_THEME,
   STORAGE_KEY_TERM_FONT_FAMILY,
   STORAGE_KEY_TERM_FONT_SIZE,
   STORAGE_KEY_TERM_SETTINGS,
@@ -40,31 +53,102 @@ import {
   STORAGE_KEY_SFTP_SHOW_HIDDEN_FILES,
   STORAGE_KEY_SFTP_USE_COMPRESSED_UPLOAD,
   STORAGE_KEY_SFTP_AUTO_OPEN_SIDEBAR,
+  STORAGE_KEY_SFTP_DEFAULT_VIEW_MODE,
   STORAGE_KEY_SFTP_GLOBAL_BOOKMARKS,
   STORAGE_KEY_CUSTOM_THEMES,
   STORAGE_KEY_SHOW_RECENT_HOSTS,
+  STORAGE_KEY_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT,
+  STORAGE_KEY_SHOW_SFTP_TAB,
+  STORAGE_KEY_WORKSPACE_FOCUS_STYLE,
+  STORAGE_KEY_AI_PROVIDERS,
+  STORAGE_KEY_AI_ACTIVE_PROVIDER,
+  STORAGE_KEY_AI_ACTIVE_MODEL,
+  STORAGE_KEY_AI_PERMISSION_MODE,
+  STORAGE_KEY_AI_TOOL_INTEGRATION_MODE,
+  STORAGE_KEY_AI_HOST_PERMISSIONS,
+  STORAGE_KEY_AI_DEFAULT_AGENT,
+  STORAGE_KEY_AI_COMMAND_BLOCKLIST,
+  STORAGE_KEY_AI_COMMAND_TIMEOUT,
+  STORAGE_KEY_AI_MAX_ITERATIONS,
+  STORAGE_KEY_AI_AGENT_MODEL_MAP,
+  STORAGE_KEY_AI_WEB_SEARCH,
+  STORAGE_KEY_PORT_FORWARDING,
 } from '../infrastructure/config/storageKeys';
 
 // ---------------------------------------------------------------------------
 // Input types
 // ---------------------------------------------------------------------------
 
-/** All vault-owned data that participates in cloud sync. */
+const CUSTOM_KEY_BINDINGS_SYNC_PAYLOAD_ORIGIN = 'sync-payload';
+
+/** Vault-owned data. Some fields are local-only and excluded from cloud sync. */
 export interface SyncableVaultData {
   hosts: Host[];
   keys: SSHKey[];
   identities: Identity[];
+  proxyProfiles?: ProxyProfile[];
   snippets: Snippet[];
   customGroups: string[];
   snippetPackages?: string[];
+  /** Local trust records. Kept in local backups, excluded from cloud sync. */
   knownHosts: KnownHost[];
   groupConfigs?: GroupConfig[];
 }
 
+/**
+ * Returns true when the payload contains any meaningful user data worth
+ * protecting or syncing.
+ */
+export function hasMeaningfulSyncData(payload: SyncPayload): boolean {
+  if (hasSyncPayloadEntityData(payload, SYNC_PAYLOAD_ENTITY_KEYS)) return true;
+
+  return Boolean(
+    payload.settings && Object.values(payload.settings).some((value) => value !== undefined),
+  );
+}
+
+/**
+ * Returns true when a payload contains cloud-sync data.
+ * Local-only trust records are intentionally ignored.
+ */
+export function hasMeaningfulCloudSyncData(payload: SyncPayload): boolean {
+  if (hasSyncPayloadEntityData(payload, CLOUD_SYNC_PAYLOAD_ENTITY_KEYS)) return true;
+
+  return Boolean(
+    payload.settings && Object.values(payload.settings).some((value) => value !== undefined),
+  );
+}
+
+export function sanitizePortForwardingRulesForSync(
+  rules: PortForwardingRule[] | undefined,
+): PortForwardingRule[] | undefined {
+  if (!rules) return rules;
+  return rules.map((rule) => ({
+    ...rule,
+    status: 'inactive' as const,
+    error: undefined,
+    lastUsedAt: undefined,
+  }));
+}
+
+export function getEffectivePortForwardingRulesForSync(
+  rules: PortForwardingRule[] | undefined,
+): PortForwardingRule[] | undefined {
+  let effectiveRules = rules;
+  if (!effectiveRules || effectiveRules.length === 0) {
+    const stored = localStorageAdapter.read<PortForwardingRule[]>(STORAGE_KEY_PORT_FORWARDING);
+    if (Array.isArray(stored) && stored.length > 0) {
+      effectiveRules = stored;
+    }
+  }
+
+  return sanitizePortForwardingRulesForSync(effectiveRules);
+}
+
 /** Callbacks used by `applySyncPayload` to import data into local state. */
 interface SyncPayloadImporters {
-  /** Import vault data (hosts, keys, identities, snippets, customGroups, snippetPackages, knownHosts). */
-  importVaultData: (jsonString: string) => void;
+  /** Import vault data. Cloud sync excludes local-only known hosts by default. */
+  importVaultData: (jsonString: string) => void | Promise<void>;
   /** Import port-forwarding rules (lives outside the vault hook). */
   importPortForwardingRules?: (rules: PortForwardingRule[]) => void;
   /** Called after synced settings have been written to localStorage. */
@@ -77,17 +161,123 @@ interface SyncPayloadImporters {
 
 /** Terminal settings keys that are safe to sync (platform-agnostic). */
 const SYNCABLE_TERMINAL_KEYS = [
-  'scrollback', 'drawBoldInBrightColors', 'fontLigatures', 'fontWeight', 'fontWeightBold',
+  'scrollback', 'drawBoldInBrightColors', 'terminalEmulationType',
+  'fontLigatures', 'fontWeight', 'fontWeightBold', 'fallbackFont',
   'linePadding', 'cursorShape', 'cursorBlink', 'minimumContrastRatio',
-  'scrollOnInput', 'scrollOnOutput', 'scrollOnKeyPress', 'scrollOnPaste',
+  'altAsMeta', 'scrollOnInput', 'scrollOnOutput', 'scrollOnKeyPress', 'scrollOnPaste',
   'smoothScrolling',
   'rightClickBehavior', 'copyOnSelect', 'middleClickPaste', 'wordSeparators',
   'linkModifier', 'keywordHighlightEnabled', 'keywordHighlightRules',
-  'keepaliveInterval', 'disableBracketedPaste', 'osc52Clipboard',
+  'keepaliveInterval', 'keepaliveCountMax', 'disableBracketedPaste', 'clearWipesScrollback',
+  'preserveSelectionOnInput', 'forcePromptNewLine', 'osc52Clipboard', 'showServerStats',
+  'serverStatsRefreshInterval', 'rendererType',
   'autocompleteEnabled', 'autocompleteGhostText', 'autocompletePopupMenu',
   'autocompleteDebounceMs', 'autocompleteMinChars', 'autocompleteMaxSuggestions',
 ] as const;
 
+export const SYNCABLE_SETTING_STORAGE_KEYS = [
+  STORAGE_KEY_THEME,
+  STORAGE_KEY_UI_THEME_LIGHT,
+  STORAGE_KEY_UI_THEME_DARK,
+  STORAGE_KEY_ACCENT_MODE,
+  STORAGE_KEY_COLOR,
+  STORAGE_KEY_UI_FONT_FAMILY,
+  STORAGE_KEY_UI_LANGUAGE,
+  STORAGE_KEY_CUSTOM_CSS,
+  STORAGE_KEY_TERM_THEME,
+  STORAGE_KEY_TERM_FOLLOW_APP_THEME,
+  STORAGE_KEY_TERM_FONT_FAMILY,
+  STORAGE_KEY_TERM_FONT_SIZE,
+  STORAGE_KEY_TERM_SETTINGS,
+  STORAGE_KEY_CUSTOM_THEMES,
+  STORAGE_KEY_CUSTOM_KEY_BINDINGS,
+  STORAGE_KEY_EDITOR_WORD_WRAP,
+  STORAGE_KEY_SFTP_DOUBLE_CLICK_BEHAVIOR,
+  STORAGE_KEY_SFTP_AUTO_SYNC,
+  STORAGE_KEY_SFTP_SHOW_HIDDEN_FILES,
+  STORAGE_KEY_SFTP_USE_COMPRESSED_UPLOAD,
+  STORAGE_KEY_SFTP_AUTO_OPEN_SIDEBAR,
+  STORAGE_KEY_SFTP_DEFAULT_VIEW_MODE,
+  STORAGE_KEY_SFTP_GLOBAL_BOOKMARKS,
+  STORAGE_KEY_SHOW_RECENT_HOSTS,
+  STORAGE_KEY_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT,
+  STORAGE_KEY_SHOW_SFTP_TAB,
+  STORAGE_KEY_WORKSPACE_FOCUS_STYLE,
+  STORAGE_KEY_AI_PROVIDERS,
+  STORAGE_KEY_AI_ACTIVE_PROVIDER,
+  STORAGE_KEY_AI_ACTIVE_MODEL,
+  STORAGE_KEY_AI_PERMISSION_MODE,
+  STORAGE_KEY_AI_TOOL_INTEGRATION_MODE,
+  STORAGE_KEY_AI_HOST_PERMISSIONS,
+  STORAGE_KEY_AI_DEFAULT_AGENT,
+  STORAGE_KEY_AI_COMMAND_BLOCKLIST,
+  STORAGE_KEY_AI_COMMAND_TIMEOUT,
+  STORAGE_KEY_AI_MAX_ITERATIONS,
+  STORAGE_KEY_AI_AGENT_MODEL_MAP,
+  STORAGE_KEY_AI_WEB_SEARCH,
+] as const;
+
+const isRecord = (value: unknown): value is Record<string, unknown> =>
+  Boolean(value) && typeof value === 'object' && !Array.isArray(value);
+
+const readArraySetting = <T = Record<string, unknown>>(key: string): T[] | null => {
+  const value = localStorageAdapter.read<T[]>(key);
+  return Array.isArray(value) ? value : null;
+};
+
+const readRecordSetting = <T extends Record<string, unknown> = Record<string, unknown>>(key: string): T | null => {
+  const value = localStorageAdapter.read<T>(key);
+  return isRecord(value) ? value as T : null;
+};
+
+const stripDeviceBoundApiKey = <T extends Record<string, unknown>>(value: T): T => {
+  if (!isEncryptedCredentialPlaceholder(value.apiKey as string | undefined)) return value;
+  const next = { ...value };
+  delete next.apiKey;
+  return next;
+};
+
+/**
+ * `collectSyncableSettings` strips device-bound encrypted apiKeys before upload,
+ * so an incoming providers array typically has no apiKey for providers that
+ * already exist locally. Re-attach the local apiKey by id; without this merge,
+ * applying any synced settings change would silently wipe credentials on the
+ * receiving device.
+ */
+const mergeAiProvidersPreservingLocalApiKeys = (
+  incoming: Array<Record<string, unknown>>,
+): Array<Record<string, unknown>> => {
+  const local = readArraySetting(STORAGE_KEY_AI_PROVIDERS) ?? [];
+  const localById = new Map<string, Record<string, unknown>>();
+  for (const provider of local) {
+    if (typeof provider?.id === 'string') localById.set(provider.id, provider);
+  }
+  return incoming.map((provider) => {
+    if (provider.apiKey != null) return provider;
+    const id = typeof provider.id === 'string' ? provider.id : undefined;
+    const localProvider = id != null ? localById.get(id) : undefined;
+    if (localProvider && typeof localProvider.apiKey === 'string') {
+      return { ...provider, apiKey: localProvider.apiKey };
+    }
+    return provider;
+  });
+};
+
+/**
+ * Same rationale as `mergeAiProvidersPreservingLocalApiKeys`. Only restores the
+ * local apiKey when the incoming config still points at the same providerId —
+ * switching providers must not silently leak a key meant for a different one.
+ */
+const mergeWebSearchConfigPreservingLocalApiKey = (
+  incoming: Record<string, unknown>,
+): Record<string, unknown> => {
+  if (incoming.apiKey != null) return incoming;
+  const local = readRecordSetting(STORAGE_KEY_AI_WEB_SEARCH);
+  if (!local || typeof local.apiKey !== 'string') return incoming;
+  if (local.providerId !== incoming.providerId) return incoming;
+  return { ...incoming, apiKey: local.apiKey };
+};
+
 /**
  * Collect all syncable settings from localStorage.
  */
@@ -115,6 +305,10 @@ export function collectSyncableSettings(): SyncPayload['settings'] {
   // Terminal
   const termTheme = localStorageAdapter.readString(STORAGE_KEY_TERM_THEME);
   if (termTheme) settings.terminalTheme = termTheme;
+  const followAppTermTheme = localStorageAdapter.readString(STORAGE_KEY_TERM_FOLLOW_APP_THEME);
+  if (followAppTermTheme === 'true' || followAppTermTheme === 'false') {
+    settings.followAppTerminalTheme = followAppTermTheme === 'true';
+  }
   const termFont = localStorageAdapter.readString(STORAGE_KEY_TERM_FONT_FAMILY);
   if (termFont) settings.terminalFontFamily = termFont;
   const termSize = localStorageAdapter.readNumber(STORAGE_KEY_TERM_FONT_SIZE);
@@ -145,9 +339,8 @@ export function collectSyncableSettings(): SyncPayload['settings'] {
   // Keyboard
   const kb = localStorageAdapter.readString(STORAGE_KEY_CUSTOM_KEY_BINDINGS);
   if (kb) {
-    try {
-      settings.customKeyBindings = JSON.parse(kb);
-    } catch { /* ignore */ }
+    const parsed = parseCustomKeyBindingsStorageRecord(kb);
+    if (parsed) settings.customKeyBindings = parsed.bindings;
   }
 
   // Editor
@@ -165,6 +358,8 @@ export function collectSyncableSettings(): SyncPayload['settings'] {
   if (compress === 'true' || compress === 'false') settings.sftpUseCompressedUpload = compress === 'true';
   const autoOpenSidebar = localStorageAdapter.readString(STORAGE_KEY_SFTP_AUTO_OPEN_SIDEBAR);
   if (autoOpenSidebar === 'true' || autoOpenSidebar === 'false') settings.sftpAutoOpenSidebar = autoOpenSidebar === 'true';
+  const defaultViewMode = localStorageAdapter.readString(STORAGE_KEY_SFTP_DEFAULT_VIEW_MODE);
+  if (defaultViewMode === 'list' || defaultViewMode === 'tree') settings.sftpDefaultViewMode = defaultViewMode;
 
   // SFTP Bookmarks (global only — local bookmarks are device-specific)
   const globalBookmarks = localStorageAdapter.read<SftpBookmark[]>(STORAGE_KEY_SFTP_GLOBAL_BOOKMARKS);
@@ -173,6 +368,46 @@ export function collectSyncableSettings(): SyncPayload['settings'] {
 
   const showRecent = localStorageAdapter.readBoolean(STORAGE_KEY_SHOW_RECENT_HOSTS);
   if (showRecent != null) settings.showRecentHosts = showRecent;
+  const showOnlyUngroupedHostsInRoot = localStorageAdapter.readBoolean(STORAGE_KEY_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT);
+  if (showOnlyUngroupedHostsInRoot != null) settings.showOnlyUngroupedHostsInRoot = showOnlyUngroupedHostsInRoot;
+  const showSftpTab = localStorageAdapter.readBoolean(STORAGE_KEY_SHOW_SFTP_TAB);
+  if (showSftpTab != null) settings.showSftpTab = showSftpTab;
+  const workspaceFocusStyle = localStorageAdapter.readString(STORAGE_KEY_WORKSPACE_FOCUS_STYLE);
+  if (workspaceFocusStyle === 'dim' || workspaceFocusStyle === 'border') {
+    settings.workspaceFocusStyle = workspaceFocusStyle;
+  }
+
+  const ai: NonNullable<SyncPayload['settings']>['ai'] = {};
+  const providers = readArraySetting(STORAGE_KEY_AI_PROVIDERS);
+  if (providers) ai.providers = providers.map(stripDeviceBoundApiKey);
+  const activeProviderId = localStorageAdapter.readString(STORAGE_KEY_AI_ACTIVE_PROVIDER);
+  if (activeProviderId != null) ai.activeProviderId = activeProviderId;
+  const activeModelId = localStorageAdapter.readString(STORAGE_KEY_AI_ACTIVE_MODEL);
+  if (activeModelId != null) ai.activeModelId = activeModelId;
+  const permissionMode = localStorageAdapter.readString(STORAGE_KEY_AI_PERMISSION_MODE);
+  if (permissionMode === 'observer' || permissionMode === 'confirm' || permissionMode === 'autonomous') {
+    ai.globalPermissionMode = permissionMode;
+  }
+  const toolIntegrationMode = localStorageAdapter.readString(STORAGE_KEY_AI_TOOL_INTEGRATION_MODE);
+  if (toolIntegrationMode === 'mcp' || toolIntegrationMode === 'skills') {
+    ai.toolIntegrationMode = toolIntegrationMode;
+  }
+  const hostPermissions = readArraySetting(STORAGE_KEY_AI_HOST_PERMISSIONS);
+  if (hostPermissions) ai.hostPermissions = hostPermissions;
+  // externalAgents intentionally not collected: command/args/env are device-local.
+  const defaultAgentId = localStorageAdapter.readString(STORAGE_KEY_AI_DEFAULT_AGENT);
+  if (defaultAgentId != null) ai.defaultAgentId = defaultAgentId;
+  const commandBlocklist = localStorageAdapter.read<string[]>(STORAGE_KEY_AI_COMMAND_BLOCKLIST);
+  if (Array.isArray(commandBlocklist)) ai.commandBlocklist = commandBlocklist;
+  const commandTimeout = localStorageAdapter.readNumber(STORAGE_KEY_AI_COMMAND_TIMEOUT);
+  if (commandTimeout != null && Number.isFinite(commandTimeout)) ai.commandTimeout = commandTimeout;
+  const maxIterations = localStorageAdapter.readNumber(STORAGE_KEY_AI_MAX_ITERATIONS);
+  if (maxIterations != null && Number.isFinite(maxIterations)) ai.maxIterations = maxIterations;
+  const agentModelMap = readRecordSetting<Record<string, string>>(STORAGE_KEY_AI_AGENT_MODEL_MAP);
+  if (agentModelMap) ai.agentModelMap = agentModelMap;
+  const webSearchConfig = readRecordSetting(STORAGE_KEY_AI_WEB_SEARCH);
+  if (webSearchConfig) ai.webSearchConfig = stripDeviceBoundApiKey(webSearchConfig);
+  if (Object.keys(ai).length > 0) settings.ai = ai;
 
   return Object.keys(settings).length > 0 ? settings : undefined;
 }
@@ -194,6 +429,9 @@ function applySyncableSettings(settings: NonNullable<SyncPayload['settings']>):
 
   // Terminal
   if (settings.terminalTheme != null) localStorageAdapter.writeString(STORAGE_KEY_TERM_THEME, settings.terminalTheme);
+  if (settings.followAppTerminalTheme != null) {
+    localStorageAdapter.writeString(STORAGE_KEY_TERM_FOLLOW_APP_THEME, String(settings.followAppTerminalTheme));
+  }
   if (settings.terminalFontFamily != null) localStorageAdapter.writeString(STORAGE_KEY_TERM_FONT_FAMILY, settings.terminalFontFamily);
   if (settings.terminalFontSize != null) localStorageAdapter.writeString(STORAGE_KEY_TERM_FONT_SIZE, String(settings.terminalFontSize));
 
@@ -220,7 +458,17 @@ function applySyncableSettings(settings: NonNullable<SyncPayload['settings']>):
 
   // Keyboard
   if (settings.customKeyBindings != null) {
-    localStorageAdapter.writeString(STORAGE_KEY_CUSTOM_KEY_BINDINGS, JSON.stringify(settings.customKeyBindings));
+    const previous = parseCustomKeyBindingsStorageRecord(
+      localStorageAdapter.readString(STORAGE_KEY_CUSTOM_KEY_BINDINGS),
+    );
+    localStorageAdapter.writeString(
+      STORAGE_KEY_CUSTOM_KEY_BINDINGS,
+      serializeCustomKeyBindingsStorageRecord({
+        version: nextCustomKeyBindingsSyncVersion(previous?.version || 0),
+        origin: CUSTOM_KEY_BINDINGS_SYNC_PAYLOAD_ORIGIN,
+        bindings: settings.customKeyBindings,
+      }),
+    );
   }
 
   // Editor
@@ -232,12 +480,59 @@ function applySyncableSettings(settings: NonNullable<SyncPayload['settings']>):
   if (settings.sftpShowHiddenFiles != null) localStorageAdapter.writeString(STORAGE_KEY_SFTP_SHOW_HIDDEN_FILES, String(settings.sftpShowHiddenFiles));
   if (settings.sftpUseCompressedUpload != null) localStorageAdapter.writeString(STORAGE_KEY_SFTP_USE_COMPRESSED_UPLOAD, String(settings.sftpUseCompressedUpload));
   if (settings.sftpAutoOpenSidebar != null) localStorageAdapter.writeString(STORAGE_KEY_SFTP_AUTO_OPEN_SIDEBAR, String(settings.sftpAutoOpenSidebar));
+  if (settings.sftpDefaultViewMode != null) {
+    localStorageAdapter.writeString(STORAGE_KEY_SFTP_DEFAULT_VIEW_MODE, settings.sftpDefaultViewMode);
+  }
 
   // SFTP Bookmarks (global only)
   if (settings.sftpGlobalBookmarks != null) localStorageAdapter.write(STORAGE_KEY_SFTP_GLOBAL_BOOKMARKS, settings.sftpGlobalBookmarks);
 
   // Immersive mode (legacy — always enabled, ignore incoming value)
   if (settings.showRecentHosts != null) localStorageAdapter.writeBoolean(STORAGE_KEY_SHOW_RECENT_HOSTS, settings.showRecentHosts);
+  if (settings.showOnlyUngroupedHostsInRoot != null) {
+    localStorageAdapter.writeBoolean(
+      STORAGE_KEY_SHOW_ONLY_UNGROUPED_HOSTS_IN_ROOT,
+      settings.showOnlyUngroupedHostsInRoot,
+    );
+  }
+  if (settings.showSftpTab != null) {
+    localStorageAdapter.writeBoolean(STORAGE_KEY_SHOW_SFTP_TAB, settings.showSftpTab);
+  }
+  if (settings.workspaceFocusStyle != null) {
+    localStorageAdapter.writeString(STORAGE_KEY_WORKSPACE_FOCUS_STYLE, settings.workspaceFocusStyle);
+  }
+
+  const ai = settings.ai;
+  if (ai) {
+    if (ai.providers != null) {
+      localStorageAdapter.write(
+        STORAGE_KEY_AI_PROVIDERS,
+        mergeAiProvidersPreservingLocalApiKeys(ai.providers),
+      );
+    }
+    if (ai.activeProviderId != null) localStorageAdapter.writeString(STORAGE_KEY_AI_ACTIVE_PROVIDER, ai.activeProviderId);
+    if (ai.activeModelId != null) localStorageAdapter.writeString(STORAGE_KEY_AI_ACTIVE_MODEL, ai.activeModelId);
+    if (ai.globalPermissionMode != null) localStorageAdapter.writeString(STORAGE_KEY_AI_PERMISSION_MODE, ai.globalPermissionMode);
+    if (ai.toolIntegrationMode != null) localStorageAdapter.writeString(STORAGE_KEY_AI_TOOL_INTEGRATION_MODE, ai.toolIntegrationMode);
+    if (ai.hostPermissions != null) localStorageAdapter.write(STORAGE_KEY_AI_HOST_PERMISSIONS, ai.hostPermissions);
+    // externalAgents intentionally not applied: device-local. Legacy snapshots
+    // that still carry an `externalAgents` field are silently ignored.
+    if (ai.defaultAgentId != null) localStorageAdapter.writeString(STORAGE_KEY_AI_DEFAULT_AGENT, ai.defaultAgentId);
+    if (ai.commandBlocklist != null) localStorageAdapter.write(STORAGE_KEY_AI_COMMAND_BLOCKLIST, ai.commandBlocklist);
+    if (ai.commandTimeout != null) localStorageAdapter.writeNumber(STORAGE_KEY_AI_COMMAND_TIMEOUT, ai.commandTimeout);
+    if (ai.maxIterations != null) localStorageAdapter.writeNumber(STORAGE_KEY_AI_MAX_ITERATIONS, ai.maxIterations);
+    if (ai.agentModelMap != null) localStorageAdapter.write(STORAGE_KEY_AI_AGENT_MODEL_MAP, ai.agentModelMap);
+    if (ai.webSearchConfig !== undefined) {
+      if (ai.webSearchConfig === null) {
+        localStorageAdapter.remove(STORAGE_KEY_AI_WEB_SEARCH);
+      } else {
+        localStorageAdapter.write(
+          STORAGE_KEY_AI_WEB_SEARCH,
+          mergeWebSearchConfigPreservingLocalApiKey(ai.webSearchConfig),
+        );
+      }
+    }
+  }
 }
 
 // ---------------------------------------------------------------------------
@@ -259,63 +554,88 @@ export function buildSyncPayload(
     hosts: vault.hosts,
     keys: vault.keys,
     identities: vault.identities,
+    proxyProfiles: vault.proxyProfiles,
     snippets: vault.snippets,
     customGroups: vault.customGroups,
     snippetPackages: vault.snippetPackages,
-    knownHosts: vault.knownHosts,
     groupConfigs: vault.groupConfigs,
-    portForwardingRules,
+    portForwardingRules: sanitizePortForwardingRulesForSync(portForwardingRules),
     settings: collectSyncableSettings(),
     syncedAt: Date.now(),
   };
 }
 
+/** Build a local backup/restore payload, including local-only trust records. */
+export function buildLocalVaultPayload(
+  vault: SyncableVaultData,
+  portForwardingRules?: PortForwardingRule[],
+): SyncPayload {
+  return {
+    ...buildSyncPayload(vault, portForwardingRules),
+    knownHosts: vault.knownHosts,
+  };
+}
+
 /**
  * Apply a downloaded `SyncPayload` to local state via the provided importers.
  *
  * This ensures both vault data and port-forwarding rules are imported
  * consistently across windows.
  */
-export function applySyncPayload(
+function applyPayload(
   payload: SyncPayload,
   importers: SyncPayloadImporters,
-): void {
-  // Build the vault import object.  knownHosts is only included when the
-  // payload explicitly carries the field (even if it's []).  Legacy cloud
-  // snapshots may omit it entirely — in that case we leave the local
-  // known-hosts list untouched rather than destructively wiping it.
+  options: { includeLocalOnlyData: boolean },
+): Promise<void> {
+  // Build the vault import object. Cloud sync intentionally ignores
+  // local-only trust records even if legacy cloud snapshots still carry them.
   const vaultImport: Record<string, unknown> = {
     hosts: payload.hosts,
     keys: payload.keys,
     identities: payload.identities,
+    proxyProfiles: payload.proxyProfiles,
     snippets: payload.snippets,
     customGroups: payload.customGroups,
   };
   if (payload.snippetPackages !== undefined) {
     vaultImport.snippetPackages = payload.snippetPackages;
   }
-  if (payload.knownHosts !== undefined) {
+  if (options.includeLocalOnlyData && payload.knownHosts !== undefined) {
     vaultImport.knownHosts = payload.knownHosts;
   }
   if (Array.isArray(payload.groupConfigs)) {
     vaultImport.groupConfigs = payload.groupConfigs;
   }
 
-  importers.importVaultData(JSON.stringify(vaultImport));
+  return Promise.resolve(importers.importVaultData(JSON.stringify(vaultImport))).then(() => {
+    // Only import port-forwarding rules when the payload explicitly carries
+    // them.  Absent field = "payload was created before this feature existed",
+    // so local rules are preserved.  Explicitly present [] = "remote has no
+    // rules, clear local state".
+    if (payload.portForwardingRules !== undefined && importers.importPortForwardingRules) {
+      importers.importPortForwardingRules(payload.portForwardingRules);
+    }
 
-  // Only import port-forwarding rules when the payload explicitly carries
-  // them.  Absent field = "payload was created before this feature existed",
-  // so local rules are preserved.  Explicitly present [] = "remote has no
-  // rules, clear local state".
-  if (payload.portForwardingRules !== undefined && importers.importPortForwardingRules) {
-    importers.importPortForwardingRules(payload.portForwardingRules);
-  }
-
-  // Apply synced settings
-  if (payload.settings) {
-    applySyncableSettings(payload.settings);
-    // Rehydrate in-memory bookmark snapshot after localStorage was updated
-    if (payload.settings.sftpGlobalBookmarks != null) rehydrateGlobalBookmarks();
-    importers.onSettingsApplied?.();
-  }
+    // Apply synced settings
+    if (payload.settings) {
+      applySyncableSettings(payload.settings);
+      // Rehydrate in-memory bookmark snapshot after localStorage was updated
+      if (payload.settings.sftpGlobalBookmarks != null) rehydrateGlobalSftpBookmarks();
+      importers.onSettingsApplied?.();
+    }
+  });
+}
+
+export function applySyncPayload(
+  payload: SyncPayload,
+  importers: SyncPayloadImporters,
+): Promise<void> {
+  return applyPayload(payload, importers, { includeLocalOnlyData: false });
+}
+
+export function applyLocalVaultPayload(
+  payload: SyncPayload,
+  importers: SyncPayloadImporters,
+): Promise<void> {
+  return applyPayload(payload, importers, { includeLocalOnlyData: true });
 }

components/AppLogo.tsx

@@ -1,38 +1,58 @@
 import React from 'react';
 
 interface AppLogoProps {
-    className?: string;
+  className?: string;
 }
 
-/**
- * App logo component that dynamically uses the accent color (--primary CSS variable).
- * The original logo.svg file remains unchanged; this component renders an inline SVG
- * with colors bound to the current theme's accent color.
- */
 export const AppLogo: React.FC<AppLogoProps> = ({ className }) => (
-    <svg viewBox="0 0 64 64" className={className}>
-        {/* Main background - uses accent color */}
-        <rect x="4" y="4" width="56" height="56" rx="12" fill="hsl(var(--primary))" />
-        {/* Terminal window */}
-        <rect x="14" y="17" width="36" height="24" rx="4" fill="white" />
-        {/* Title bar - light accent tint */}
-        <rect x="14" y="17" width="36" height="5" rx="4" fill="hsl(var(--primary) / 0.15)" />
-        {/* Window buttons */}
-        <circle cx="18" cy="19.5" r="1" fill="hsl(var(--primary))" />
-        <circle cx="22" cy="19.5" r="1" fill="hsl(var(--primary))" opacity="0.7" />
-        <circle cx="26" cy="19.5" r="1" fill="hsl(var(--primary))" opacity="0.5" />
-        {/* Terminal prompt arrow */}
-        <path d="M20 32 L24 30 L20 28" stroke="hsl(var(--primary))" fill="none" strokeWidth="1.6" />
-        {/* Cursor line */}
-        <path d="M28 34 H34" stroke="hsl(var(--primary))" strokeWidth="1.6" />
-        {/* Cat ears */}
-        <path d="M24 17 L26 12 L28 17Z" fill="white" />
-        <path d="M36 17 L38 12 L40 17Z" fill="white" />
-        {/* Cat tail */}
-        <path d="M40 37 C44 40,46 42,46 46 C46 49,44 51,41 51" stroke="white" fill="none" strokeWidth="3.2" />
-        {/* Connector/plug */}
-        <rect x="38" y="48" width="6" height="5" rx="1" fill="white" stroke="hsl(var(--primary))" />
-    </svg>
+  <svg
+    viewBox="0 0 1024 1024"
+    xmlns="http://www.w3.org/2000/svg"
+    className={className}
+  >
+    <rect
+      x="0"
+      y="0"
+      width="1024"
+      height="1024"
+      rx="192"
+      ry="192"
+      fill="hsl(var(--primary))"
+    />
+    <g transform="translate(85.64 85.64) scale(0.68)">
+      <g><path style={{opacity:1}} fill="#f9f9f9" d="M 618.5,240.5 C 647.925,240.677 677.258,242.344 706.5,245.5C 753.323,252.113 798.49,265.113 842,284.5C 870.064,257.538 902.23,236.704 938.5,222C 966.969,211.263 988.469,219.096 1003,245.5C 1011.08,263.079 1016.75,281.412 1020,300.5C 1022.13,320.204 1024.29,339.871 1026.5,359.5C 1026.17,379.674 1026.5,399.674 1027.5,419.5C 1072.74,473.648 1102.74,535.314 1117.5,604.5C 1117.29,607.495 1117.96,610.162 1119.5,612.5C 1126.08,656.83 1126.08,701.163 1119.5,745.5C 1118.23,747.905 1117.57,750.572 1117.5,753.5C 1107.38,802.706 1088.05,847.872 1059.5,889C 1053.04,888.572 1046.71,887.405 1040.5,885.5C 1036.79,883.864 1032.79,883.198 1028.5,883.5C 1011.79,881.938 995.122,882.271 978.5,884.5C 975.572,884.565 972.905,885.232 970.5,886.5C 928.686,895.489 896.519,918.156 874,954.5C 864.791,970.962 859.958,988.628 859.5,1007.5C 793.269,1029.39 725.269,1041.72 655.5,1044.5C 633.833,1044.5 612.167,1044.5 590.5,1044.5C 524.821,1041.8 460.821,1029.63 398.5,1008C 396.254,996.177 393.421,984.344 390,972.5C 387.524,964.881 384.024,957.881 379.5,951.5C 363.815,925.334 341.815,906.667 313.5,895.5C 297.343,888.573 280.343,884.406 262.5,883C 248.055,882.038 233.722,882.538 219.5,884.5C 216.572,884.565 213.905,885.232 211.5,886.5C 211.167,886.5 210.833,886.5 210.5,886.5C 207.848,886.41 205.515,887.076 203.5,888.5C 200.823,889.614 198.156,889.614 195.5,888.5C 149.432,819.968 128.098,744.301 131.5,661.5C 131.502,654.48 131.835,647.48 132.5,640.5C 133.461,638.735 133.795,636.735 133.5,634.5C 135.136,630.79 135.802,626.79 135.5,622.5C 137.764,609.333 140.431,596.333 143.5,583.5C 144.924,581.485 145.59,579.152 145.5,576.5C 156.228,537.714 172.395,501.381 194,467.5C 204.685,451.452 215.852,435.786 227.5,420.5C 228.042,388.62 229.375,356.62 231.5,324.5C 234.549,300.253 240.382,276.586 249,253.5C 253.868,241.906 261.035,232.073 270.5,224C 279.336,218.042 289.002,216.042 299.5,218C 314.655,220.607 328.988,225.607 342.5,233C 368.29,247.23 391.957,264.396 413.5,284.5C 478.68,255.797 547.014,241.13 618.5,240.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#1f2657" d="M 706.5,245.5 C 677.258,242.344 647.925,240.677 618.5,240.5C 649.662,238.284 680.995,239.784 712.5,245C 710.527,245.495 708.527,245.662 706.5,245.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#18214c" d="M 231.5,324.5 C 229.375,356.62 228.042,388.62 227.5,420.5C 226.104,392.965 226.604,365.298 229,337.5C 229.17,331.677 230.003,327.344 231.5,324.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#0c1943" d="M 1026.5,359.5 C 1027.92,371.971 1028.59,384.637 1028.5,397.5C 1028.5,405.008 1028.17,412.341 1027.5,419.5C 1026.5,399.674 1026.17,379.674 1026.5,359.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#505c83" d="M 817.5,544.5 C 815.162,546.04 812.495,546.706 809.5,546.5C 811.905,545.232 814.572,544.565 817.5,544.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#919ab0" d="M 445.5,545.5 C 448.152,545.41 450.485,546.076 452.5,547.5C 449.848,547.59 447.515,546.924 445.5,545.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#022551" d="M 445.5,545.5 C 447.515,546.924 449.848,547.59 452.5,547.5C 479.103,555.885 499.269,572.218 513,596.5C 515.435,607.525 511.268,614.191 500.5,616.5C 497.302,616.378 494.302,615.545 491.5,614C 485.302,604.13 477.969,595.13 469.5,587C 459.207,579.735 447.873,574.902 435.5,572.5C 415.88,568.656 398.213,573.156 382.5,586C 380.905,585.383 379.572,585.716 378.5,587C 378.957,587.414 379.291,587.914 379.5,588.5C 376.839,591.423 374.005,593.423 371,594.5C 369.606,600.126 366.772,603.96 362.5,606C 363.517,607.049 363.684,608.216 363,609.5C 355.276,616.472 347.943,616.139 341,608.5C 339.805,603.4 340.638,598.733 343.5,594.5C 344.086,594.709 344.586,595.043 345,595.5C 344.718,590.888 346.551,587.055 350.5,584C 351.515,582.627 351.515,581.46 350.5,580.5C 375.329,550.884 406.995,539.218 445.5,545.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#032551" d="M 817.5,544.5 C 862.791,541.392 895.958,559.726 917,599.5C 917.138,612.028 910.971,617.528 898.5,616C 897.167,615.333 895.833,614.667 894.5,614C 884.255,595.245 869.255,582.078 849.5,574.5C 843.812,571.54 837.645,570.207 831,570.5C 822.066,570.919 813.233,572.086 804.5,574C 798.217,577.721 792.05,581.554 786,585.5C 785.667,585.167 785.333,584.833 785,584.5C 782.92,587.065 781.087,589.732 779.5,592.5C 774.384,597.792 770.218,603.792 767,610.5C 759.55,618.016 751.883,618.349 744,611.5C 742.878,609.593 742.045,607.593 741.5,605.5C 741.508,602.455 741.841,599.455 742.5,596.5C 757.037,569.397 779.371,552.73 809.5,546.5C 812.495,546.706 815.162,546.04 817.5,544.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#0c1a4d" d="M 849.5,574.5 C 822.908,568.314 799.574,574.314 779.5,592.5C 781.087,589.732 782.92,587.065 785,584.5C 785.333,584.833 785.667,585.167 786,585.5C 792.05,581.554 798.217,577.721 804.5,574C 813.233,572.086 822.066,570.919 831,570.5C 837.645,570.207 843.812,571.54 849.5,574.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#98a2bf" d="M 423.5,572.5 C 419.684,573.482 415.684,574.149 411.5,574.5C 415.183,572.75 419.183,572.083 423.5,572.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#9ea6be" d="M 145.5,576.5 C 145.59,579.152 144.924,581.485 143.5,583.5C 143.41,580.848 144.076,578.515 145.5,576.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#132152" d="M 435.5,572.5 C 431.5,572.5 427.5,572.5 423.5,572.5C 419.183,572.083 415.183,572.75 411.5,574.5C 389.242,579.57 372.909,592.403 362.5,613C 356.408,617.241 350.075,617.574 343.5,614C 337.996,608.137 337.163,601.637 341,594.5C 343.929,589.631 347.096,584.965 350.5,580.5C 351.515,581.46 351.515,582.627 350.5,584C 346.551,587.055 344.718,590.888 345,595.5C 344.586,595.043 344.086,594.709 343.5,594.5C 340.638,598.733 339.805,603.4 341,608.5C 347.943,616.139 355.276,616.472 363,609.5C 363.684,608.216 363.517,607.049 362.5,606C 366.772,603.96 369.606,600.126 371,594.5C 374.005,593.423 376.839,591.423 379.5,588.5C 379.291,587.914 378.957,587.414 378.5,587C 379.572,585.716 380.905,585.383 382.5,586C 398.213,573.156 415.88,568.656 435.5,572.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#6c7794" d="M 742.5,596.5 C 741.841,599.455 741.508,602.455 741.5,605.5C 740.848,604.551 740.514,603.385 740.5,602C 740.393,599.779 741.06,597.946 742.5,596.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#6f7b97" d="M 1117.5,604.5 C 1118.77,606.905 1119.43,609.572 1119.5,612.5C 1117.96,610.162 1117.29,607.495 1117.5,604.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#a8aec5" d="M 135.5,622.5 C 135.802,626.79 135.136,630.79 133.5,634.5C 133.717,630.295 134.383,626.295 135.5,622.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#677393" d="M 653.5,662.5 C 634.473,662.218 615.473,662.551 596.5,663.5C 597.263,662.732 598.263,662.232 599.5,662C 617.671,661.171 635.671,661.338 653.5,662.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#032551" d="M 653.5,662.5 C 664.536,665.228 669.036,672.228 667,683.5C 665.861,687.112 664.194,690.446 662,693.5C 656.35,700.317 650.184,706.65 643.5,712.5C 643.058,737.755 654.725,754.922 678.5,764C 709.272,768.521 729.105,756.021 738,726.5C 747.413,717.842 755.746,718.842 763,729.5C 759.409,758.463 743.909,778.297 716.5,789C 713.111,789.776 709.778,790.609 706.5,791.5C 697.533,792.383 688.533,792.716 679.5,792.5C 657.328,788.994 639.828,777.994 627,759.5C 607.084,786.202 580.584,797.035 547.5,792C 516.901,784.235 497.901,765.068 490.5,734.5C 493.257,721.955 500.59,718.121 512.5,723C 517.164,727.124 519.998,732.291 521,738.5C 533.515,761.003 552.348,769.17 577.5,763C 599.78,754.048 610.947,737.548 611,713.5C 604.698,706.197 598.032,699.197 591,692.5C 586.824,686.46 585.491,679.794 587,672.5C 589.072,668.26 592.238,665.26 596.5,663.5C 615.473,662.551 634.473,662.218 653.5,662.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#01103f" d="M 132.5,640.5 C 131.835,647.48 131.502,654.48 131.5,661.5C 130.669,675.994 130.169,690.661 130,705.5C 128.188,682.722 128.854,660.055 132,637.5C 132.483,638.448 132.649,639.448 132.5,640.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#7c869d" d="M 1119.5,745.5 C 1119.71,748.495 1119.04,751.162 1117.5,753.5C 1117.57,750.572 1118.23,747.905 1119.5,745.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#7581a0" d="M 706.5,791.5 C 705.737,792.268 704.737,792.768 703.5,793C 695.323,793.823 687.323,793.656 679.5,792.5C 688.533,792.716 697.533,792.383 706.5,791.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#a7aec3" d="M 1028.5,883.5 C 1032.79,883.198 1036.79,883.864 1040.5,885.5C 1036.29,885.283 1032.29,884.617 1028.5,883.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#f9f9f9" d="M 233.5,904.5 C 242.833,904.5 252.167,904.5 261.5,904.5C 263.833,904.5 266.167,904.5 268.5,904.5C 304.989,908.827 334.489,925.494 357,954.5C 374.323,977.781 379.323,1003.45 372,1031.5C 365.153,1050.01 351.986,1060.85 332.5,1064C 324.173,1064.5 315.84,1064.67 307.5,1064.5C 307.947,1050.43 307.447,1036.43 306,1022.5C 296.93,1011.58 288.263,1011.91 280,1023.5C 279.833,1038.51 279.333,1053.51 278.5,1068.5C 271.841,1075.83 263.508,1080 253.5,1081C 248.845,1081.5 244.179,1081.67 239.5,1081.5C 237.485,1080.08 235.152,1079.41 232.5,1079.5C 225.481,1077.32 219.315,1073.66 214,1068.5C 213.667,1053.5 213.333,1038.5 213,1023.5C 208.464,1016.16 201.964,1013.66 193.5,1016C 190.333,1017.83 187.833,1020.33 186,1023.5C 185.5,1037.83 185.333,1052.16 185.5,1066.5C 160.376,1072.2 140.21,1064.86 125,1044.5C 120.792,1037.38 118.292,1029.71 117.5,1021.5C 117.482,1013.15 117.815,1004.82 118.5,996.5C 129.171,955.493 154.504,927.826 194.5,913.5C 200.166,912.61 205.5,910.943 210.5,908.5C 211.568,907.566 212.901,907.232 214.5,907.5C 221.111,907.453 227.444,906.453 233.5,904.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#f8f8f9" d="M 1133.5,985.5 C 1133.41,988.152 1134.08,990.485 1135.5,992.5C 1136.26,1002.48 1136.59,1012.48 1136.5,1022.5C 1133.68,1047.82 1119.68,1062.66 1094.5,1067C 1086.48,1067.61 1078.48,1067.44 1070.5,1066.5C 1070.67,1052.83 1070.5,1039.16 1070,1025.5C 1066.12,1016.96 1059.62,1013.79 1050.5,1016C 1047.33,1017.83 1044.83,1020.33 1043,1023.5C 1042.67,1038.17 1042.33,1052.83 1042,1067.5C 1035.97,1075.1 1028.14,1079.43 1018.5,1080.5C 1013.2,1081.27 1007.87,1081.61 1002.5,1081.5C 991.789,1080.39 982.955,1075.73 976,1067.5C 975.667,1052.83 975.333,1038.17 975,1023.5C 971.569,1017.53 966.402,1014.87 959.5,1015.5C 953.942,1016.72 950.275,1020.06 948.5,1025.5C 947.505,1037.99 947.171,1050.66 947.5,1063.5C 946.209,1063.26 945.209,1063.6 944.5,1064.5C 903.542,1067.19 882.208,1048.02 880.5,1007C 880.658,1002.81 880.991,998.641 881.5,994.5C 883.277,991.495 884.277,988.162 884.5,984.5C 894.73,953.43 914.73,930.93 944.5,917C 978.246,903.385 1012.91,900.718 1048.5,909C 1082.5,918.575 1108.67,938.409 1127,968.5C 1129.86,973.928 1132.03,979.595 1133.5,985.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#adb2c9" d="M 233.5,904.5 C 227.444,906.453 221.111,907.453 214.5,907.5C 220.536,905.419 226.869,904.419 233.5,904.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#bec4d7" d="M 210.5,908.5 C 205.5,910.943 200.166,912.61 194.5,913.5C 199.5,911.057 204.834,909.39 210.5,908.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#9ba0b8" d="M 884.5,984.5 C 884.277,988.162 883.277,991.495 881.5,994.5C 881.723,990.838 882.723,987.505 884.5,984.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#9aa5bc" d="M 1133.5,985.5 C 1134.92,987.515 1135.59,989.848 1135.5,992.5C 1134.08,990.485 1133.41,988.152 1133.5,985.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#adb1c6" d="M 118.5,996.5 C 117.815,1004.82 117.482,1013.15 117.5,1021.5C 116.835,1018.69 116.502,1015.69 116.5,1012.5C 116.429,1006.93 117.096,1001.6 118.5,996.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#c9d0dc" d="M 1135.5,992.5 C 1136.96,998.434 1137.63,1004.6 1137.5,1011C 1137.5,1015.02 1137.17,1018.85 1136.5,1022.5C 1136.59,1012.48 1136.26,1002.48 1135.5,992.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#b5bfcb" d="M 948.5,1025.5 C 948.5,1038.5 948.5,1051.5 948.5,1064.5C 947.167,1064.5 945.833,1064.5 944.5,1064.5C 945.209,1063.6 946.209,1063.26 947.5,1063.5C 947.171,1050.66 947.505,1037.99 948.5,1025.5 Z"/></g>
+      <g><path style={{opacity:1}} fill="#8193aa" d="M 232.5,1079.5 C 235.152,1079.41 237.485,1080.08 239.5,1081.5C 236.848,1081.59 234.515,1080.92 232.5,1079.5 Z"/></g>
+    </g>
+  </svg>
 );
 
 export default AppLogo;

components/ConnectionLogsManager.tsx

@@ -12,6 +12,7 @@ import { useI18n } from "../application/i18n/I18nProvider";
 import { cn } from "../lib/utils";
 import { ConnectionLog, Host } from "../types";
 import { ScrollArea } from "./ui/scroll-area";
+import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip";
 
 interface ConnectionLogsManagerProps {
     logs: ConnectionLog[];
@@ -108,31 +109,39 @@ const LogItem = memo<LogItemProps>(({ log, onToggleSaved, onDelete, onClick }) =
 
             {/* Saved column */}
             <div className="flex items-center gap-2 shrink-0">
-                <button
-                    onClick={(e) => {
-                        e.stopPropagation();
-                        onToggleSaved(log.id);
-                    }}
-                    className={cn(
-                        "p-1.5 rounded-md transition-colors",
-                        log.saved
-                            ? "text-primary bg-primary/10"
-                            : "text-muted-foreground hover:text-primary hover:bg-primary/10"
-                    )}
-                    title={log.saved ? t("logs.action.unsave") : t("logs.action.save")}
-                >
-                    <Bookmark size={16} fill={log.saved ? "currentColor" : "none"} />
-                </button>
-                <button
-                    onClick={(e) => {
-                        e.stopPropagation();
-                        onDelete(log.id);
-                    }}
-                    className="p-1.5 rounded-md text-muted-foreground hover:text-destructive hover:bg-destructive/10 transition-colors opacity-0 group-hover:opacity-100"
-                    title={t("logs.action.delete")}
-                >
-                    <Trash2 size={16} />
-                </button>
+                <Tooltip>
+                    <TooltipTrigger asChild>
+                        <button
+                            onClick={(e) => {
+                                e.stopPropagation();
+                                onToggleSaved(log.id);
+                            }}
+                            className={cn(
+                                "p-1.5 rounded-md transition-colors",
+                                log.saved
+                                    ? "text-primary bg-primary/10"
+                                    : "text-muted-foreground hover:text-primary hover:bg-primary/10"
+                            )}
+                        >
+                            <Bookmark size={16} fill={log.saved ? "currentColor" : "none"} />
+                        </button>
+                    </TooltipTrigger>
+                    <TooltipContent>{log.saved ? t("logs.action.unsave") : t("logs.action.save")}</TooltipContent>
+                </Tooltip>
+                <Tooltip>
+                    <TooltipTrigger asChild>
+                        <button
+                            onClick={(e) => {
+                                e.stopPropagation();
+                                onDelete(log.id);
+                            }}
+                            className="p-1.5 rounded-md text-muted-foreground hover:text-destructive hover:bg-destructive/10 transition-colors opacity-0 group-hover:opacity-100"
+                        >
+                            <Trash2 size={16} />
+                        </button>
+                    </TooltipTrigger>
+                    <TooltipContent>{t("logs.action.delete")}</TooltipContent>
+                </Tooltip>
             </div>
         </div>
     );

components/CreateWorkspaceDialog.tsx

@@ -67,27 +67,27 @@ export const CreateWorkspaceDialog: React.FC<CreateWorkspaceDialogProps> = ({
     <Dialog open={isOpen} onOpenChange={(open) => !open && onClose()}>
       <DialogContent className="max-w-md flex flex-col max-h-[80vh]">
         <DialogHeader>
-          <DialogTitle>{t('dialog.createWorkspace.title', 'Create Workspace')}</DialogTitle>
+          <DialogTitle>{t('dialog.createWorkspace.title', { defaultValue: 'Create Workspace' })}</DialogTitle>
         </DialogHeader>
 
         <div className="space-y-4 py-2 flex-1 flex flex-col min-h-0">
           <div className="space-y-2">
-            <Label htmlFor="workspace-name">{t('field.name', 'Name')}</Label>
+            <Label htmlFor="workspace-name">{t('field.name', { defaultValue: 'Name' })}</Label>
             <Input
               id="workspace-name"
               value={name}
               onChange={(e) => setName(e.target.value)}
-              placeholder={t('placeholder.workspaceName', 'Workspace Name')}
+              placeholder={t('placeholder.workspaceName', { defaultValue: 'Workspace Name' })}
               autoFocus
             />
           </div>
 
           <div className="space-y-2 flex-1 flex flex-col min-h-0">
-            <Label>{t('field.selectHosts', 'Select Hosts')}</Label>
+            <Label>{t('field.selectHosts', { defaultValue: 'Select Hosts' })}</Label>
             <div className="relative">
                 <Search className="absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" />
                 <Input
-                placeholder={t('placeholder.searchHosts', 'Search hosts...')}
+                placeholder={t('placeholder.searchHosts', { defaultValue: 'Search hosts...' })}
                 value={search}
                 onChange={(e) => setSearch(e.target.value)}
                 className="pl-8"
@@ -99,7 +99,7 @@ export const CreateWorkspaceDialog: React.FC<CreateWorkspaceDialogProps> = ({
                     <div className="p-2 space-y-1">
                         {filteredHosts.length === 0 ? (
                             <div className="text-center py-4 text-sm text-muted-foreground">
-                                {t('common.noResults', 'No hosts found')}
+                                {t('common.noResults', { defaultValue: 'No hosts found' })}
                             </div>
                         ) : (
                             filteredHosts.map(host => {
@@ -126,15 +126,15 @@ export const CreateWorkspaceDialog: React.FC<CreateWorkspaceDialogProps> = ({
                 </ScrollArea>
             </div>
             <div className="text-xs text-muted-foreground text-right">
-                {selectedHostIds.size} {t('common.selected', 'selected')}
+                {selectedHostIds.size} {t('common.selected', { defaultValue: 'selected' })}
             </div>
           </div>
         </div>
 
         <DialogFooter>
-          <Button variant="ghost" onClick={onClose}>{t('common.cancel', 'Cancel')}</Button>
+          <Button variant="ghost" onClick={onClose}>{t('common.cancel', { defaultValue: 'Cancel' })}</Button>
           <Button onClick={handleCreate} disabled={!name.trim() || selectedHostIds.size === 0}>
-            {t('common.create', 'Create')}
+            {t('common.create', { defaultValue: 'Create' })}
           </Button>
         </DialogFooter>
       </DialogContent>

components/DistroAvatar.tsx

@@ -22,6 +22,16 @@ export const DISTRO_LOGOS: Record<string, string> = {
   macos: "/distro/macos.svg",
   windows: "/distro/windows.svg",
   linux: "/distro/linux.svg",
+  // Network device vendors — auto-detected from the SSH server
+  // identification string (see domain/host.ts `detectVendorFromSshVersion`).
+  cisco: "/distro/cisco.svg",
+  juniper: "/distro/juniper.svg",
+  huawei: "/distro/huawei.svg",
+  hpe: "/distro/hpe.svg",
+  mikrotik: "/distro/mikrotik.svg",
+  fortinet: "/distro/fortinet.svg",
+  paloalto: "/distro/paloalto.svg",
+  zyxel: "/distro/zyxel.svg",
 };
 
 export const DISTRO_COLORS: Record<string, string> = {
@@ -42,6 +52,15 @@ export const DISTRO_COLORS: Record<string, string> = {
   macos: "bg-[#333333]",
   windows: "bg-[#0078D4]",
   linux: "bg-[#333333]",
+  // Network device vendor brand colors
+  cisco: "bg-[#1BA0D7]",
+  juniper: "bg-[#0A6EB4]",
+  huawei: "bg-[#CF0A2C]",
+  hpe: "bg-[#01A982]",
+  mikrotik: "bg-[#293239]",
+  fortinet: "bg-[#EE3124]",
+  paloalto: "bg-[#FA582D]",
+  zyxel: "bg-[#00497A]",
   default: "bg-slate-600",
 };
 

components/FileOpenerDialog.tsx

@@ -17,7 +17,7 @@ interface FileOpenerDialogProps {
   onSelectSystemApp: () => Promise<SystemAppInfo | null>;
 }
 
-export const FileOpenerDialog: React.FC<FileOpenerDialogProps> = ({
+const FileOpenerDialog: React.FC<FileOpenerDialogProps> = ({
   open,
   onClose,
   fileName,

components/GroupDetailsPanel.tsx

@@ -21,6 +21,8 @@ import {
 import React, { useCallback, useMemo, useState } from "react";
 import { useI18n } from "../application/i18n/I18nProvider";
 import { customThemeStore } from "../application/state/customThemeStore";
+import { resolveGroupDefaults, resolveGroupTerminalThemeId } from "../domain/groupConfig";
+import { isCompleteProxyConfig, normalizeManualProxyConfig } from "../domain/proxyProfiles";
 import { cn } from "../lib/utils";
 import {
   EnvVar,
@@ -28,6 +30,7 @@ import {
   Host,
   Identity,
   ProxyConfig,
+  ProxyProfile,
   SSHKey,
 } from "../types";
 import ThemeSelectPanel from "./ThemeSelectPanel";
@@ -39,6 +42,7 @@ import {
 import {
   AsidePanel,
   AsidePanelContent,
+  type AsidePanelLayout,
 } from "./ui/aside-panel";
 import { Badge } from "./ui/badge";
 import { Button } from "./ui/button";
@@ -47,8 +51,11 @@ import { Combobox } from "./ui/combobox";
 import { Dropdown, DropdownContent, DropdownTrigger } from "./ui/dropdown";
 import { Input } from "./ui/input";
 import { Popover, PopoverContent, PopoverTrigger } from "./ui/popover";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./ui/select";
 import { TerminalFontSelect } from "./settings/TerminalFontSelect";
 import { useAvailableFonts } from "../application/state/fontStore";
+import { toast } from "./ui/toast";
+import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip";
 
 type SubPanel = "none" | "proxy" | "chain" | "env-vars" | "theme-select";
 
@@ -57,12 +64,15 @@ interface GroupDetailsPanelProps {
   config: GroupConfig | undefined;
   availableKeys: SSHKey[];
   identities: Identity[];
+  proxyProfiles?: ProxyProfile[];
   allHosts: Host[];
   groups: string[];
   terminalThemeId: string;
+  groupConfigs?: GroupConfig[];
   terminalFontSize: number;
   onSave: (config: GroupConfig, newName?: string, newParent?: string | null) => void;
   onCancel: () => void;
+  layout?: AsidePanelLayout;
 }
 
 const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
@@ -70,12 +80,15 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
   config,
   availableKeys,
   identities: _identities,
+  proxyProfiles = [],
   allHosts,
   groups,
   terminalThemeId,
+  groupConfigs = [],
   terminalFontSize,
   onSave,
   onCancel,
+  layout = "overlay",
 }) => {
   const { t } = useI18n();
   const availableFonts = useAvailableFonts();
@@ -99,7 +112,7 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
     c.protocol === 'ssh' ||
     c.port !== undefined || !!c.username || !!c.password || !!c.identityFileId ||
     c.agentForwarding !== undefined || c.authMethod !== undefined || !!c.identityId ||
-    !!c.proxyConfig || !!c.hostChain || !!c.startupCommand || c.legacyAlgorithms !== undefined || c.backspaceBehavior !== undefined ||
+    !!c.proxyProfileId || !!c.proxyConfig || !!c.hostChain || !!c.startupCommand || c.legacyAlgorithms !== undefined || c.backspaceBehavior !== undefined ||
     (c.environmentVariables && c.environmentVariables.length > 0) ||
     c.moshEnabled !== undefined || !!c.moshServerPath ||
     (c.identityFilePaths && c.identityFilePaths.length > 0);
@@ -126,6 +139,16 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
   // Environment variables state
   const [newEnvName, setNewEnvName] = useState("");
   const [newEnvValue, setNewEnvValue] = useState("");
+  const selectedProxyProfile = useMemo(
+    () => proxyProfiles.find((profile) => profile.id === form.proxyProfileId),
+    [form.proxyProfileId, proxyProfiles],
+  );
+  const hasMissingProxyProfile = Boolean(form.proxyProfileId && !selectedProxyProfile);
+  const proxySummaryLabel = hasMissingProxyProfile
+    ? t("hostDetails.proxyPanel.missingSaved")
+    : selectedProxyProfile
+      ? selectedProxyProfile.label
+      : `${form.proxyConfig?.type?.toUpperCase()} ${form.proxyConfig?.host}:${form.proxyConfig?.port}`;
 
   const update = <K extends keyof GroupConfig>(key: K, value: GroupConfig[K] | undefined) => {
     setForm((prev) => ({ ...prev, [key]: value }));
@@ -150,6 +173,7 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
       delete next.startupCommand;
       delete next.legacyAlgorithms;
       delete next.backspaceBehavior;
+      delete next.proxyProfileId;
       delete next.proxyConfig;
       delete next.hostChain;
       delete next.environmentVariables;
@@ -176,27 +200,38 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
   // Proxy helpers
   const updateProxyConfig = useCallback(
     (field: keyof ProxyConfig, value: string | number) => {
-      setForm((prev) => ({
-        ...prev,
-        proxyConfig: {
-          type: prev.proxyConfig?.type || "http",
-          host: prev.proxyConfig?.host || "",
-          port: prev.proxyConfig?.port || 8080,
-          ...prev.proxyConfig,
-          [field]: value,
-        },
-      }));
+      setForm((prev) => {
+        const { proxyProfileId: _proxyProfileId, ...rest } = prev;
+        return {
+          ...rest,
+          proxyConfig: {
+            type: prev.proxyConfig?.type || "http",
+            host: prev.proxyConfig?.host || "",
+            port: prev.proxyConfig?.port || 8080,
+            ...prev.proxyConfig,
+            [field]: value,
+          },
+        };
+      });
     },
     [],
   );
 
   const clearProxyConfig = useCallback(() => {
     setForm((prev) => {
-      const { proxyConfig: _proxyConfig, ...rest } = prev;
+      const { proxyConfig: _proxyConfig, proxyProfileId: _proxyProfileId, ...rest } = prev;
       return rest;
     });
   }, []);
 
+  const selectProxyProfile = useCallback((profileId: string | undefined) => {
+    setForm((prev) => {
+      const { proxyConfig: _proxyConfig, proxyProfileId: _proxyProfileId, ...rest } = prev;
+      if (!profileId) return rest;
+      return { ...rest, proxyProfileId: profileId };
+    });
+  }, []);
+
   // Chain helpers
   const chainedHosts = useMemo(() => {
     const ids = form.hostChain?.hostIds || [];
@@ -274,7 +309,14 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
   }, [groups, groupPath, t]);
 
   // Effective theme
-  const effectiveThemeId = form.theme || terminalThemeId;
+  const inheritedThemeId = useMemo(() => {
+    if (!parentGroup || groupConfigs.length === 0) return terminalThemeId;
+    return resolveGroupTerminalThemeId(resolveGroupDefaults(parentGroup, groupConfigs), terminalThemeId);
+  }, [groupConfigs, parentGroup, terminalThemeId]);
+  const effectiveThemeId = form.themeOverride === false
+    ? inheritedThemeId
+    : (form.theme || inheritedThemeId);
+  const hasActiveThemeOverride = form.themeOverride === true || (form.theme != null && form.themeOverride !== false);
 
   // Save handler
   const handleSubmit = () => {
@@ -284,6 +326,19 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
       setNameError(t("vault.groups.errors.invalidChars"));
       return;
     }
+    const normalizedProxyConfig = normalizeManualProxyConfig(form.proxyConfig);
+    if (normalizedProxyConfig && !isCompleteProxyConfig(normalizedProxyConfig)) {
+      toast.error(
+        normalizedProxyConfig.host ? t("proxyProfiles.error.port") : t("hostDetails.proxyPanel.error.required"),
+      );
+      setActiveSubPanel("proxy");
+      return;
+    }
+    if (sshEnabled && hasMissingProxyProfile) {
+      toast.error(t("hostDetails.proxyPanel.missingSaved"));
+      setActiveSubPanel("proxy");
+      return;
+    }
     setNameError(null);
 
     const newPath = parentGroup
@@ -307,7 +362,8 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
         ...(form.startupCommand !== undefined && { startupCommand: form.startupCommand }),
         ...(form.legacyAlgorithms !== undefined && { legacyAlgorithms: form.legacyAlgorithms }),
         ...(form.backspaceBehavior !== undefined && { backspaceBehavior: form.backspaceBehavior }),
-        ...(form.proxyConfig !== undefined && { proxyConfig: form.proxyConfig }),
+        ...(form.proxyProfileId !== undefined && { proxyProfileId: form.proxyProfileId }),
+        ...(normalizedProxyConfig !== undefined && { proxyConfig: normalizedProxyConfig }),
         ...(form.hostChain !== undefined && { hostChain: form.hostChain }),
         ...(form.environmentVariables !== undefined && { environmentVariables: form.environmentVariables }),
         ...(form.moshEnabled !== undefined && { moshEnabled: form.moshEnabled }),
@@ -322,7 +378,7 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
       }),
       // Shared fields (always saved)
       ...(form.charset !== undefined && { charset: form.charset }),
-      ...(form.theme !== undefined && { theme: form.theme }),
+      ...((form.themeOverride !== false && form.theme !== undefined) && { theme: form.theme }),
       ...(form.themeOverride !== undefined && { themeOverride: form.themeOverride }),
       ...(form.fontFamily !== undefined && { fontFamily: form.fontFamily }),
       ...(form.fontFamilyOverride !== undefined && { fontFamilyOverride: form.fontFamilyOverride }),
@@ -347,10 +403,14 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
     return (
       <ProxyPanel
         proxyConfig={form.proxyConfig}
+        proxyProfiles={proxyProfiles}
+        selectedProxyProfileId={form.proxyProfileId}
         onUpdateProxy={updateProxyConfig}
+        onSelectProxyProfile={selectProxyProfile}
         onClearProxy={clearProxyConfig}
         onBack={() => setActiveSubPanel("none")}
         onCancel={onCancel}
+        layout={layout}
       />
     );
   }
@@ -368,6 +428,7 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
         onClearChain={clearHostChain}
         onBack={() => setActiveSubPanel("none")}
         onCancel={onCancel}
+        layout={layout}
       />
     );
   }
@@ -395,6 +456,7 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
         }}
         onBack={() => setActiveSubPanel("none")}
         onCancel={onCancel}
+        layout={layout}
       />
     );
   }
@@ -405,12 +467,17 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
         open={true}
         selectedThemeId={effectiveThemeId}
         onSelect={(themeId) => {
+          if (themeId === effectiveThemeId && !hasActiveThemeOverride) {
+            setActiveSubPanel("none");
+            return;
+          }
           setForm((prev) => ({ ...prev, theme: themeId, themeOverride: true }));
           setActiveSubPanel("none");
         }}
         onClose={onCancel}
         onBack={() => setActiveSubPanel("none")}
         showBackButton={true}
+        layout={layout}
       />
     );
   }
@@ -426,7 +493,9 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
       open={true}
       onClose={onCancel}
       width="w-[380px]"
+      dataSection="group-details-panel"
       title={t("vault.groups.details")}
+      layout={layout}
       actions={
         <Button
           variant="ghost"
@@ -747,29 +816,33 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
                       }
                     }}
                   />
-                  <Button
-                    variant="secondary"
-                    size="icon"
-                    className="h-8 w-8 shrink-0"
-                    title={t("hostDetails.credential.browseKeyFile")}
-                    onClick={async () => {
-                      const bridge = (window as unknown as { netcatty?: NetcattyBridge }).netcatty;
-                      if (!bridge?.selectFile) return;
-                      const filePath = await bridge.selectFile(
-                        "Select SSH Private Key",
-                        undefined,
-                        [{ name: "All Files", extensions: ["*"] }]
-                      );
-                      if (filePath) {
-                        const paths = [...(form.identityFilePaths || []), filePath];
-                        update("identityFilePaths", paths);
-                        update("identityFileId", undefined);
-                        update("authMethod", "key");
-                      }
-                    }}
-                  >
-                    <FolderOpen size={14} />
-                  </Button>
+                  <Tooltip>
+                    <TooltipTrigger asChild>
+                      <Button
+                        variant="secondary"
+                        size="icon"
+                        className="h-8 w-8 shrink-0"
+                        onClick={async () => {
+                          const bridge = (window as unknown as { netcatty?: NetcattyBridge }).netcatty;
+                          if (!bridge?.selectFile) return;
+                          const filePath = await bridge.selectFile(
+                            "Select SSH Private Key",
+                            undefined,
+                            [{ name: "All Files", extensions: ["*"] }]
+                          );
+                          if (filePath) {
+                            const paths = [...(form.identityFilePaths || []), filePath];
+                            update("identityFilePaths", paths);
+                            update("identityFileId", undefined);
+                            update("authMethod", "key");
+                          }
+                        }}
+                      >
+                        <FolderOpen size={14} />
+                      </Button>
+                    </TooltipTrigger>
+                    <TooltipContent>{t("hostDetails.credential.browseKeyFile")}</TooltipContent>
+                  </Tooltip>
                   <Button
                     variant="ghost"
                     size="icon"
@@ -804,16 +877,20 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
             />
 
             {/* Backspace behavior */}
-            <div className="flex items-center justify-between">
+            <div className="flex items-center justify-between gap-2">
               <p className="text-xs text-muted-foreground">{t("hostDetails.backspaceBehavior")}</p>
-              <select
-                className="h-8 rounded-md border border-input bg-background px-2 text-xs"
-                value={form.backspaceBehavior ?? ""}
-                onChange={(e) => update("backspaceBehavior", e.target.value || undefined)}
+              <Select
+                value={form.backspaceBehavior ?? "default"}
+                onValueChange={(v) => update("backspaceBehavior", v === "default" ? undefined : v)}
               >
-                <option value="">{t("hostDetails.backspaceBehavior.default")}</option>
-                <option value="ctrl-h">^H (0x08)</option>
-              </select>
+                <SelectTrigger className="h-8 w-auto text-xs">
+                  <SelectValue />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value="default">{t("hostDetails.backspaceBehavior.default")}</SelectItem>
+                  <SelectItem value="ctrl-h">^H (0x08)</SelectItem>
+                </SelectContent>
+              </Select>
             </div>
 
             {/* Proxy */}
@@ -826,11 +903,21 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
                 <Globe size={14} className="text-muted-foreground" />
                 <span className="text-sm">{t("hostDetails.proxy")}</span>
               </div>
-              <div className="flex items-center gap-2">
-                {form.proxyConfig?.host && (
-                  <Badge variant="secondary" className="text-xs">
-                    {form.proxyConfig.type?.toUpperCase()} {form.proxyConfig.host}:{form.proxyConfig.port}
-                  </Badge>
+              <div className="flex min-w-0 items-center gap-2">
+                {(form.proxyConfig?.host || form.proxyProfileId) && (
+                  <Tooltip>
+                    <TooltipTrigger asChild>
+                      <div className="min-w-0 cursor-default">
+                        <Badge
+                          variant="secondary"
+                          className="max-w-[160px] truncate text-xs"
+                        >
+                          {proxySummaryLabel}
+                        </Badge>
+                      </div>
+                    </TooltipTrigger>
+                    <TooltipContent>{proxySummaryLabel}</TooltipContent>
+                  </Tooltip>
                 )}
                 <ChevronRight size={14} className="text-muted-foreground" />
               </div>
@@ -1018,7 +1105,7 @@ const GroupDetailsPanel: React.FC<GroupDetailsPanelProps> = ({
               {customThemeStore.getThemeById(effectiveThemeId)?.name || "Flexoki Dark"}
             </span>
           </button>
-          {form.themeOverride && (
+          {hasActiveThemeOverride && (
             <Button
               variant="ghost"
               size="sm"

components/HostDetailsPanel.proxyProfile.test.tsx

@@ -0,0 +1,256 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+import React from "react";
+import { renderToStaticMarkup } from "react-dom/server";
+
+import { I18nProvider } from "../application/i18n/I18nProvider.tsx";
+import type { Host } from "../types.ts";
+import HostDetailsPanel, { parseOptionalPortInput } from "./HostDetailsPanel.tsx";
+import { TooltipProvider } from "./ui/tooltip.tsx";
+
+const hostWithMissingProxyProfile: Host = {
+  id: "host-1",
+  label: "DB",
+  hostname: "db.example.com",
+  username: "root",
+  tags: [],
+  os: "linux",
+  port: 22,
+  protocol: "ssh",
+  authMethod: "password",
+  proxyProfileId: "missing-proxy",
+  createdAt: 1,
+};
+
+const renderHostDetails = (initialData: Host = hostWithMissingProxyProfile) =>
+  renderToStaticMarkup(
+    React.createElement(
+      I18nProvider,
+      { locale: "en" },
+      React.createElement(
+        TooltipProvider,
+        null,
+        React.createElement(HostDetailsPanel, {
+          initialData,
+          availableKeys: [],
+          identities: [],
+          proxyProfiles: [],
+          groups: [],
+          managedSources: [],
+          allTags: [],
+          allHosts: [],
+          terminalThemeId: "default",
+          terminalFontSize: 14,
+          onSave: () => {},
+          onCancel: () => {},
+        }),
+      ),
+    ),
+  );
+
+const findInputByValue = (markup: string, value: string) => {
+  const match = markup.match(new RegExp(`<input(?=[^>]*value="${value}")[^>]*>`));
+  assert.ok(match, `expected input with value ${value}`);
+  return match[0];
+};
+
+const classTokens = (markup: string) => {
+  const classMatch = markup.match(/class="([^"]*)"/);
+  assert.ok(classMatch, "expected class attribute");
+  return new Set(classMatch[1].split(/\s+/).filter(Boolean));
+};
+
+test("HostDetailsPanel shows a missing saved proxy without undefined fields", () => {
+  const markup = renderHostDetails();
+
+  assert.match(markup, /Missing saved proxy/);
+  assert.doesNotMatch(markup, /undefined:undefined/);
+});
+
+test("HostDetailsPanel keeps explicitly cleared telnet credentials empty", () => {
+  const markup = renderHostDetails({
+    ...hostWithMissingProxyProfile,
+    protocol: "telnet",
+    telnetEnabled: true,
+    telnetPort: 23,
+    username: "root",
+    password: "ssh-password",
+    telnetUsername: "",
+    telnetPassword: "",
+    proxyProfileId: undefined,
+  });
+
+  assert.match(markup, /placeholder="Telnet Username"[^>]*value=""/);
+  assert.match(markup, /placeholder="Telnet Password"[^>]*value=""/);
+  assert.doesNotMatch(markup, /placeholder="Telnet Username"[^>]*value="root"/);
+  assert.doesNotMatch(markup, /placeholder="Telnet Password"[^>]*value="ssh-password"/);
+});
+
+test("HostDetailsPanel gives the telnet port field the same roomy layout as SSH", () => {
+  const markup = renderHostDetails({
+    ...hostWithMissingProxyProfile,
+    protocol: "telnet",
+    telnetEnabled: true,
+    telnetPort: 2325,
+    proxyProfileId: undefined,
+  });
+
+  const telnetMarkup = markup.slice(markup.indexOf("Telnet on"));
+  const wrapperMatch = telnetMarkup.match(/<div class="([^"]*w-1\/2[^"]*)"/);
+  assert.ok(wrapperMatch, "expected telnet port wrapper");
+  const wrapperClasses = new Set(wrapperMatch[1].split(/\s+/).filter(Boolean));
+  assert.ok(wrapperClasses.has("ml-auto"));
+  assert.ok(wrapperClasses.has("w-1/2"));
+  assert.ok(wrapperClasses.has("min-w-0"));
+  assert.ok(wrapperClasses.has("justify-end"));
+  const telnetPortInput = findInputByValue(markup, "2325");
+  const inputClasses = classTokens(telnetPortInput);
+  assert.ok(inputClasses.has("flex-1"));
+  assert.ok(inputClasses.has("min-w-0"));
+  assert.ok(inputClasses.has("text-center"));
+  assert.equal(inputClasses.has("w-16"), false);
+});
+
+test("HostDetailsPanel displays inherited telnet port before falling back to 23", () => {
+  const markup = renderToStaticMarkup(
+    React.createElement(
+      I18nProvider,
+      { locale: "en" },
+      React.createElement(
+        TooltipProvider,
+        null,
+        React.createElement(HostDetailsPanel, {
+          initialData: {
+            ...hostWithMissingProxyProfile,
+            protocol: "telnet",
+            telnetEnabled: true,
+            telnetPort: undefined,
+            port: undefined,
+            group: "network",
+            proxyProfileId: undefined,
+          },
+          availableKeys: [],
+          identities: [],
+          proxyProfiles: [],
+          groups: ["network"],
+          managedSources: [],
+          allTags: [],
+          allHosts: [],
+          terminalThemeId: "default",
+          terminalFontSize: 14,
+          groupConfigs: [{ path: "network", telnetPort: 2325 }],
+          onSave: () => {},
+          onCancel: () => {},
+        }),
+      ),
+    ),
+  );
+
+  assert.match(findInputByValue(markup, "2325"), /type="number"/);
+});
+
+test("HostDetailsPanel uses group telnet port instead of ssh port for optional telnet", () => {
+  const markup = renderToStaticMarkup(
+    React.createElement(
+      I18nProvider,
+      { locale: "en" },
+      React.createElement(
+        TooltipProvider,
+        null,
+        React.createElement(HostDetailsPanel, {
+          initialData: {
+            ...hostWithMissingProxyProfile,
+            protocol: "ssh",
+            telnetEnabled: true,
+            telnetPort: undefined,
+            port: 2222,
+            group: "network",
+            proxyProfileId: undefined,
+          },
+          availableKeys: [],
+          identities: [],
+          proxyProfiles: [],
+          groups: ["network"],
+          managedSources: [],
+          allTags: [],
+          allHosts: [],
+          terminalThemeId: "default",
+          terminalFontSize: 14,
+          groupConfigs: [{ path: "network", telnetPort: 2325 }],
+          onSave: () => {},
+          onCancel: () => {},
+        }),
+      ),
+    ),
+  );
+
+  const telnetMarkup = markup.slice(markup.indexOf("Telnet on"));
+  assert.match(findInputByValue(telnetMarkup, "2325"), /type="number"/);
+  assert.doesNotMatch(telnetMarkup, /value="2222"/);
+});
+
+test("HostDetailsPanel displays inherited telnet credentials", () => {
+  const markup = renderToStaticMarkup(
+    React.createElement(
+      I18nProvider,
+      { locale: "en" },
+      React.createElement(
+        TooltipProvider,
+        null,
+        React.createElement(HostDetailsPanel, {
+          initialData: {
+            ...hostWithMissingProxyProfile,
+            protocol: "telnet",
+            telnetEnabled: true,
+            telnetUsername: undefined,
+            telnetPassword: undefined,
+            username: "ssh-user",
+            password: "ssh-password",
+            group: "network",
+            proxyProfileId: undefined,
+          },
+          availableKeys: [],
+          identities: [],
+          proxyProfiles: [],
+          groups: ["network"],
+          managedSources: [],
+          allTags: [],
+          allHosts: [],
+          terminalThemeId: "default",
+          terminalFontSize: 14,
+          groupConfigs: [{
+            path: "network",
+            telnetUsername: "group-telnet-user",
+            telnetPassword: "group-telnet-password",
+          }],
+          onSave: () => {},
+          onCancel: () => {},
+        }),
+      ),
+    ),
+  );
+
+  assert.match(markup, /placeholder="Telnet Username"[^>]*value="group-telnet-user"/);
+  assert.match(markup, /placeholder="Telnet Password"[^>]*value="group-telnet-password"/);
+  assert.doesNotMatch(markup, /placeholder="Telnet Username"[^>]*value="ssh-user"/);
+  assert.doesNotMatch(markup, /placeholder="Telnet Password"[^>]*value="ssh-password"/);
+});
+
+test("parseOptionalPortInput clears empty port values", () => {
+  assert.equal(parseOptionalPortInput(""), undefined);
+  assert.equal(parseOptionalPortInput("2325"), 2325);
+});
+
+test("HostDetailsPanel does not offer to disable telnet when telnet is the primary protocol", () => {
+  const markup = renderHostDetails({
+    ...hostWithMissingProxyProfile,
+    protocol: "telnet",
+    telnetEnabled: true,
+    telnetPort: 23,
+    proxyProfileId: undefined,
+  });
+  const telnetHeader = markup.match(/Telnet on[\s\S]*?Credentials/);
+
+  assert.ok(telnetHeader);
+  assert.doesNotMatch(telnetHeader[0], /hover:text-destructive/);
+});

components/HostDetailsPanel.tsx

@@ -8,6 +8,7 @@ import {
   FolderPlus,
   Forward,
   Globe,
+  HeartPulse,
   Key,
   KeyRound,
   Link2,
@@ -31,7 +32,14 @@ import {
 import React, { useEffect, useMemo, useState, useCallback } from "react";
 import { useI18n } from "../application/i18n/I18nProvider";
 import { useApplicationBackend } from "../application/state/useApplicationBackend";
-import { getEffectiveHostDistro, LINUX_DISTRO_OPTIONS } from "../domain/host";
+import { resolveGroupDefaults, resolveGroupTerminalThemeId } from "../domain/groupConfig";
+import {
+  getEffectiveHostDistro,
+  LINUX_DISTRO_OPTIONS,
+  normalizePrimaryTelnetState,
+  NETWORK_DEVICE_OPTIONS,
+} from "../domain/host";
+import { isCompleteProxyConfig, normalizeManualProxyConfig } from "../domain/proxyProfiles";
 import { customThemeStore } from "../application/state/customThemeStore";
 import {
   clearHostFontSizeOverride,
@@ -43,7 +51,7 @@ import {
 } from "../domain/terminalAppearance";
 import { MIN_FONT_SIZE, MAX_FONT_SIZE } from "../infrastructure/config/fonts";
 import { cn } from "../lib/utils";
-import { EnvVar, Host, Identity, ManagedSource, ProxyConfig, SSHKey } from "../types";
+import { EnvVar, GroupConfig, Host, Identity, ManagedSource, ProxyConfig, ProxyProfile, SSHKey } from "../types";
 import { DISTRO_COLORS, DISTRO_LOGOS } from "./DistroAvatar";
 import { DistroAvatar } from "./DistroAvatar";
 import ThemeSelectPanel from "./ThemeSelectPanel";
@@ -51,6 +59,7 @@ import {
   AsidePanel,
   AsidePanelContent,
   AsidePanelFooter,
+  type AsidePanelLayout,
 } from "./ui/aside-panel";
 import { Badge } from "./ui/badge";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./ui/tooltip";
@@ -63,6 +72,7 @@ import { Textarea } from "./ui/textarea";
 import { Popover, PopoverContent, PopoverTrigger } from "./ui/popover";
 import { ScrollArea } from "./ui/scroll-area";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./ui/select";
+import { toast } from "./ui/toast";
 
 // Import host-details sub-panels
 import {
@@ -82,12 +92,54 @@ type SubPanel =
   | "theme-select"
   | "telnet-theme-select";
 
-const LINUX_DISTRO_OPTION_IDS = [...LINUX_DISTRO_OPTIONS];
+export const parseOptionalPortInput = (value: string): number | undefined =>
+  value ? Number(value) : undefined;
+
+const resolveDetailsTelnetPort = (
+  host: Host,
+  groupDefaults?: Partial<GroupConfig>,
+): number => {
+  if (host.telnetPort !== undefined && host.telnetPort !== null) return host.telnetPort;
+  if (groupDefaults?.telnetPort !== undefined && groupDefaults.telnetPort !== null) {
+    return groupDefaults.telnetPort;
+  }
+  if (host.protocol === "telnet") {
+    if (host.port !== undefined && host.port !== null) return host.port;
+    if (groupDefaults?.port !== undefined && groupDefaults.port !== null) return groupDefaults.port;
+  }
+  return 23;
+};
+
+const resolveDetailsTelnetUsername = (
+  host: Host,
+  groupDefaults?: Partial<GroupConfig>,
+): string =>
+  host.telnetUsername !== undefined
+    ? host.telnetUsername
+    : groupDefaults?.telnetUsername !== undefined
+      ? groupDefaults.telnetUsername
+      : host.username ?? groupDefaults?.username ?? "";
+
+const resolveDetailsTelnetPassword = (
+  host: Host,
+  groupDefaults?: Partial<GroupConfig>,
+): string =>
+  host.telnetPassword !== undefined
+    ? host.telnetPassword
+    : groupDefaults?.telnetPassword !== undefined
+      ? groupDefaults.telnetPassword
+      : host.password ?? groupDefaults?.password ?? "";
+
+const LINUX_DISTRO_OPTION_IDS = [
+  ...LINUX_DISTRO_OPTIONS,
+  ...NETWORK_DEVICE_OPTIONS,
+];
 
 interface HostDetailsPanelProps {
   initialData?: Host | null;
   availableKeys: SSHKey[];
   identities: Identity[];
+  proxyProfiles?: ProxyProfile[];
   groups: string[];
   managedSources?: ManagedSource[];
   allTags?: string[]; // All available tags for autocomplete
@@ -100,12 +152,16 @@ interface HostDetailsPanelProps {
   onCreateGroup?: (groupPath: string) => void; // Callback to create a new group
   onCreateTag?: (tag: string) => void; // Callback to create a new tag
   groupDefaults?: Partial<import('../domain/models').GroupConfig>;
+  groupConfigs?: GroupConfig[];
+  layout?: AsidePanelLayout;
+  onImportKey?: (draft: Partial<SSHKey>) => SSHKey;
 }
 
 const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
   initialData,
   availableKeys,
   identities,
+  proxyProfiles = [],
   groups,
   managedSources = [],
   allTags = [],
@@ -118,12 +174,15 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
   onCreateGroup,
   onCreateTag,
   groupDefaults,
+  groupConfigs = [],
+  layout = "overlay",
+  onImportKey,
 }) => {
   const { t } = useI18n();
   const { checkSshAgent } = useApplicationBackend();
   const [form, setForm] = useState<Host>(
     () =>
-      initialData ||
+      (initialData ? normalizePrimaryTelnetState(initialData) : null) ||
       ({
         id: crypto.randomUUID(),
         label: "",
@@ -157,6 +216,7 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
 
   // Local key file path input state
   const [newKeyFilePath, setNewKeyFilePath] = useState("");
+  const [pendingReferenceKeyPath, setPendingReferenceKeyPath] = useState<string | null>(null);
 
   // New group creation state
   const [newGroupName, setNewGroupName] = useState("");
@@ -183,15 +243,9 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
 
   useEffect(() => {
     if (initialData) {
-      // Ensure telnetEnabled is set when protocol is telnet
-      const updatedData = { ...initialData };
-      if (initialData.protocol === "telnet" && !initialData.telnetEnabled) {
-        updatedData.telnetEnabled = true;
-        updatedData.telnetPort =
-          initialData.telnetPort || initialData.port || 23;
-      }
-      setForm(updatedData);
+      setForm(normalizePrimaryTelnetState(initialData));
       setGroupInputValue(initialData.group || "");
+      setPendingReferenceKeyPath(null);
       // Reset password visibility when host changes for privacy
       setShowPassword(false);
     }
@@ -201,9 +255,31 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
     setForm((prev) => ({ ...prev, [key]: value }));
   };
 
+  const addLocalKeyFilePath = useCallback((path: string) => {
+    const trimmed = path.trim();
+    if (!trimmed) return;
+    setForm((prev) => ({
+      ...prev,
+      identityFilePaths: onImportKey ? [trimmed] : [...(prev.identityFilePaths || []), trimmed],
+      identityFileId: undefined,
+      authMethod: "key",
+    }));
+    setPendingReferenceKeyPath(onImportKey ? trimmed : null);
+    setNewKeyFilePath("");
+    setSelectedCredentialType(null);
+  }, [onImportKey]);
+
+  const effectiveGroupDefaults = useMemo(() => {
+    const currentGroupPath = form.group || defaultGroup;
+    if (currentGroupPath && groupConfigs.length > 0) {
+      return resolveGroupDefaults(currentGroupPath, groupConfigs);
+    }
+    return groupDefaults;
+  }, [defaultGroup, form.group, groupConfigs, groupDefaults]);
+
   const effectiveThemeId = useMemo(
-    () => resolveHostTerminalThemeId(form, terminalThemeId),
-    [form, terminalThemeId],
+    () => resolveHostTerminalThemeId(form, resolveGroupTerminalThemeId(effectiveGroupDefaults, terminalThemeId)),
+    [effectiveGroupDefaults, form, terminalThemeId],
   );
   const effectiveFontSize = useMemo(
     () => resolveHostTerminalFontSize(form, terminalFontSize),
@@ -219,6 +295,9 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
   );
   const effectiveTelnetThemeId =
     form.protocols?.find((p) => p.protocol === "telnet")?.theme || effectiveThemeId;
+  const effectiveTelnetPort = resolveDetailsTelnetPort(form, effectiveGroupDefaults);
+  const effectiveTelnetUsername = resolveDetailsTelnetUsername(form, effectiveGroupDefaults);
+  const effectiveTelnetPassword = resolveDetailsTelnetPassword(form, effectiveGroupDefaults);
   const distroOptions = useMemo(
     () =>
       LINUX_DISTRO_OPTION_IDS.map((value) => ({
@@ -239,6 +318,24 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
   );
 
   const effectiveFormDistro = getEffectiveHostDistro(form);
+  const selectedProxyProfile = useMemo(
+    () => proxyProfiles.find((profile) => profile.id === form.proxyProfileId),
+    [form.proxyProfileId, proxyProfiles],
+  );
+  const hasMissingProxyProfile = Boolean(form.proxyProfileId && !selectedProxyProfile);
+  const proxySummaryType = hasMissingProxyProfile
+    ? t("hostDetails.proxyPanel.missing")
+    : (selectedProxyProfile?.config.type || form.proxyConfig?.type || "http").toUpperCase();
+  const proxySummaryLabel = hasMissingProxyProfile
+    ? t("hostDetails.proxyPanel.missingSaved")
+    : selectedProxyProfile
+      ? selectedProxyProfile.label
+      : `${form.proxyConfig?.host}:${form.proxyConfig?.port}`;
+  const proxySummaryTooltip = hasMissingProxyProfile
+    ? t("hostDetails.proxyPanel.missingSaved")
+    : selectedProxyProfile
+      ? `${selectedProxyProfile.label} - ${selectedProxyProfile.config.host}:${selectedProxyProfile.config.port}`
+      : `${form.proxyConfig?.type?.toUpperCase()} ${form.proxyConfig?.host}:${form.proxyConfig?.port}`;
 
   const handleDistroModeChange = useCallback((mode: "auto" | "manual") => {
     setForm((prev) => ({
@@ -253,27 +350,38 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
 
   const updateProxyConfig = useCallback(
     (field: keyof ProxyConfig, value: string | number) => {
-      setForm((prev) => ({
-        ...prev,
-        proxyConfig: {
-          type: prev.proxyConfig?.type || "http",
-          host: prev.proxyConfig?.host || "",
-          port: prev.proxyConfig?.port || 8080,
-          ...prev.proxyConfig,
-          [field]: value,
-        },
-      }));
+      setForm((prev) => {
+        const { proxyProfileId: _proxyProfileId, ...rest } = prev;
+        return {
+          ...rest,
+          proxyConfig: {
+            type: prev.proxyConfig?.type || "http",
+            host: prev.proxyConfig?.host || "",
+            port: prev.proxyConfig?.port || 8080,
+            ...prev.proxyConfig,
+            [field]: value,
+          },
+        } as Host;
+      });
     },
     [],
   );
 
   const clearProxyConfig = useCallback(() => {
     setForm((prev) => {
-      const { proxyConfig: _proxyConfig, ...rest } = prev;
+      const { proxyConfig: _proxyConfig, proxyProfileId: _proxyProfileId, ...rest } = prev;
       return rest as Host;
     });
   }, []);
 
+  const selectProxyProfile = useCallback((profileId: string | undefined) => {
+    setForm((prev) => {
+      const { proxyConfig: _proxyConfig, proxyProfileId: _proxyProfileId, ...rest } = prev;
+      if (!profileId) return rest as Host;
+      return { ...rest, proxyProfileId: profileId } as Host;
+    });
+  }, []);
+
   const addHostToChain = (hostId: string) => {
     setForm((prev) => ({
       ...prev,
@@ -321,6 +429,19 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
 
   const handleSubmit = () => {
     if (!form.hostname) return;
+    const normalizedProxyConfig = normalizeManualProxyConfig(form.proxyConfig);
+    if (normalizedProxyConfig && !isCompleteProxyConfig(normalizedProxyConfig)) {
+      toast.error(
+        normalizedProxyConfig.host ? t("proxyProfiles.error.port") : t("hostDetails.proxyPanel.error.required"),
+      );
+      setActiveSubPanel("proxy");
+      return;
+    }
+    if (hasMissingProxyProfile) {
+      toast.error(t("hostDetails.proxyPanel.missingSaved"));
+      setActiveSubPanel("proxy");
+      return;
+    }
     // If label is empty, use hostname as label
     let finalLabel = form.label?.trim() || form.hostname;
     const finalGroup = groupInputValue.trim() || form.group || "";
@@ -356,16 +477,43 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
       finalManagedSourceId = undefined;
     }
 
-    const cleaned: Host = {
-      ...form,
+    const { proxyConfig: _draftProxyConfig, ...formWithoutProxyDraft } = form;
+    const finalPort =
+      form.protocol === "telnet"
+        ? form.port
+        : form.port ?? (groupDefaults?.port ? undefined : 22);
+    let cleaned: Host = {
+      ...formWithoutProxyDraft,
+      ...(normalizedProxyConfig && { proxyConfig: normalizedProxyConfig }),
       label: finalLabel,
       group: finalGroup,
       tags: form.tags || [],
-      port: form.port ?? (groupDefaults?.port ? undefined : 22),
+      port: finalPort,
       // Clear password if savePassword is explicitly set to false
       password: form.savePassword === false ? undefined : form.password,
       managedSourceId: finalManagedSourceId,
     };
+    cleaned = normalizePrimaryTelnetState(cleaned);
+    if (
+      onImportKey &&
+      pendingReferenceKeyPath &&
+      cleaned.identityFilePaths?.includes(pendingReferenceKeyPath)
+    ) {
+      const fileName = pendingReferenceKeyPath.split('/').pop() || pendingReferenceKeyPath;
+      const key = onImportKey({
+        source: 'reference',
+        filePath: pendingReferenceKeyPath,
+        label: fileName,
+        privateKey: '',
+        category: 'key',
+      });
+      cleaned = {
+        ...cleaned,
+        identityFileId: key.id,
+        identityFilePaths: [pendingReferenceKeyPath],
+        authMethod: "key",
+      };
+    }
     const preserveLegacyTheme = initialData?.theme != null && cleaned.themeOverride !== false;
     const preserveLegacyFontFamily = initialData?.fontFamily != null && cleaned.fontFamilyOverride !== false;
     const preserveLegacyFontSize = initialData?.fontSize != null && cleaned.fontSizeOverride !== false;
@@ -387,6 +535,10 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
     } else if (preserveLegacyFontSize && cleaned.fontSize == null) {
       cleaned.fontSize = initialData?.fontSize;
     }
+
+    if ((cleaned.protocol && cleaned.protocol !== "ssh") || cleaned.moshEnabled) {
+      delete cleaned.x11Forwarding;
+    }
     onSave(cleaned);
   };
 
@@ -478,6 +630,7 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
         identityFileId: undefined,
         identityFilePaths: undefined,
       }));
+      setPendingReferenceKeyPath(null);
       setSelectedCredentialType(null);
       setCredentialPopoverOpen(false);
       setIdentitySuggestionsOpen(false);
@@ -502,6 +655,7 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
         onSave={handleCreateGroup}
         onBack={() => setActiveSubPanel("none")}
         onCancel={onCancel}
+        layout={layout}
       />
     );
   }
@@ -510,10 +664,14 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
     return (
       <ProxyPanel
         proxyConfig={form.proxyConfig}
+        proxyProfiles={proxyProfiles}
+        selectedProxyProfileId={form.proxyProfileId}
         onUpdateProxy={updateProxyConfig}
+        onSelectProxyProfile={selectProxyProfile}
         onClearProxy={clearProxyConfig}
         onBack={() => setActiveSubPanel("none")}
         onCancel={onCancel}
+        layout={layout}
       />
     );
   }
@@ -531,6 +689,7 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
         onClearChain={clearHostChain}
         onBack={() => setActiveSubPanel("none")}
         onCancel={onCancel}
+        layout={layout}
       />
     );
   }
@@ -559,6 +718,7 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
         }}
         onBack={() => setActiveSubPanel("none")}
         onCancel={onCancel}
+        layout={layout}
       />
     );
   }
@@ -570,12 +730,17 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
         open={true}
         selectedThemeId={effectiveThemeId}
         onSelect={(themeId) => {
+          if (themeId === effectiveThemeId && !hasEffectiveThemeOverride) {
+            setActiveSubPanel("none");
+            return;
+          }
           setForm((prev) => ({ ...prev, theme: themeId, themeOverride: true }));
           setActiveSubPanel("none");
         }}
         onClose={onCancel}
         onBack={() => setActiveSubPanel("none")}
         showBackButton={true}
+        layout={layout}
       />
     );
   }
@@ -602,7 +767,7 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
               ...(form.protocols || []),
               {
                 protocol: "telnet" as const,
-                port: form.telnetPort || 23,
+                port: effectiveTelnetPort,
                 enabled: true,
                 theme: themeId,
               },
@@ -614,6 +779,7 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
         onClose={onCancel}
         onBack={() => setActiveSubPanel("none")}
         showBackButton={true}
+        layout={layout}
       />
     );
   }
@@ -624,6 +790,8 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
       open={true}
       onClose={onCancel}
       width="w-[420px]"
+      layout={layout}
+      dataSection="host-details-panel"
       title={
         initialData ? t("hostDetails.title.details") : t("hostDetails.title.new")
       }
@@ -770,15 +938,19 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
                     {selectedIdentity.label}
                   </div>
                 </div>
-                <Button
-                  variant="ghost"
-                  size="icon"
-                  className="h-8 w-8 shrink-0"
-                  onClick={clearIdentity}
-                  title={t("common.clear")}
-                >
-                  <X size={14} />
-                </Button>
+                <Tooltip>
+                  <TooltipTrigger asChild>
+                    <Button
+                      variant="ghost"
+                      size="icon"
+                      className="h-8 w-8 shrink-0"
+                      onClick={clearIdentity}
+                    >
+                      <X size={14} />
+                    </Button>
+                  </TooltipTrigger>
+                  <TooltipContent>{t("common.clear")}</TooltipContent>
+                </Tooltip>
               </div>
             ) : form.identityId ? (
               <div className="flex items-center gap-2 h-10 px-3 rounded-md border border-border/70 bg-secondary/60">
@@ -788,15 +960,19 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
                     {t("hostDetails.identity.missing")}
                   </div>
                 </div>
-                <Button
-                  variant="ghost"
-                  size="icon"
-                  className="h-8 w-8 shrink-0"
-                  onClick={clearIdentity}
-                  title={t("common.clear")}
-                >
-                  <X size={14} />
-                </Button>
+                <Tooltip>
+                  <TooltipTrigger asChild>
+                    <Button
+                      variant="ghost"
+                      size="icon"
+                      className="h-8 w-8 shrink-0"
+                      onClick={clearIdentity}
+                    >
+                      <X size={14} />
+                    </Button>
+                  </TooltipTrigger>
+                  <TooltipContent>{t("common.clear")}</TooltipContent>
+                </Tooltip>
               </div>
             ) : (
               (() => {
@@ -851,29 +1027,33 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
                           }}
                           className="h-10 pr-9"
                         />
-                        <button
-                          type="button"
-                          className="absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground transition-colors"
-                          onClick={() => {
-                            setIdentitySuggestionsOpen((prev) => {
-                              if (prev) return false;
-                              const q = (form.username || "")
-                                .toLowerCase()
-                                .trim();
-                              const matches = q
-                                ? identities.filter(
-                                  (i) =>
-                                    i.label.toLowerCase().includes(q) ||
-                                    i.username.toLowerCase().includes(q),
-                                )
-                                : identities;
-                              return matches.length > 0;
-                            });
-                          }}
-                          title={t("hostDetails.identity.suggestions")}
-                        >
-                          <ChevronDown size={16} />
-                        </button>
+                        <Tooltip>
+                          <TooltipTrigger asChild>
+                            <button
+                              type="button"
+                              className="absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground transition-colors"
+                              onClick={() => {
+                                setIdentitySuggestionsOpen((prev) => {
+                                  if (prev) return false;
+                                  const q = (form.username || "")
+                                    .toLowerCase()
+                                    .trim();
+                                  const matches = q
+                                    ? identities.filter(
+                                      (i) =>
+                                        i.label.toLowerCase().includes(q) ||
+                                        i.username.toLowerCase().includes(q),
+                                    )
+                                    : identities;
+                                  return matches.length > 0;
+                                });
+                              }}
+                            >
+                              <ChevronDown size={16} />
+                            </button>
+                          </TooltipTrigger>
+                          <TooltipContent>{t("hostDetails.identity.suggestions")}</TooltipContent>
+                        </Tooltip>
                       </div>
                     </PopoverTrigger>
                     <PopoverContent
@@ -955,14 +1135,18 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
                   onChange={(e) => update("password", e.target.value)}
                   className="h-10 pr-10"
                 />
-                <button
-                  type="button"
-                  onClick={() => setShowPassword(!showPassword)}
-                  className="absolute right-2 top-1/2 -translate-y-1/2 p-1 text-muted-foreground hover:text-foreground transition-colors"
-                  title={showPassword ? t("hostDetails.password.hide") : t("hostDetails.password.show")}
-                >
-                  {showPassword ? <EyeOff size={16} /> : <Eye size={16} />}
-                </button>
+                <Tooltip>
+                  <TooltipTrigger asChild>
+                    <button
+                      type="button"
+                      onClick={() => setShowPassword(!showPassword)}
+                      className="absolute right-2 top-1/2 -translate-y-1/2 p-1 text-muted-foreground hover:text-foreground transition-colors"
+                    >
+                      {showPassword ? <EyeOff size={16} /> : <Eye size={16} />}
+                    </button>
+                  </TooltipTrigger>
+                  <TooltipContent>{showPassword ? t("hostDetails.password.hide") : t("hostDetails.password.show")}</TooltipContent>
+                </Tooltip>
               </div>
             )}
 
@@ -985,9 +1169,14 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
                 {form.identityFilePaths.map((keyPath, idx) => (
                   <div key={idx} className="flex items-center gap-2 p-2 rounded-md bg-secondary/50 border border-border/60 overflow-hidden">
                     <FileKey size={14} className="text-primary shrink-0" />
-                    <span className="text-xs w-0 flex-1 truncate font-mono" title={keyPath}>
-                      {keyPath}
-                    </span>
+                    <Tooltip>
+                      <TooltipTrigger asChild>
+                        <span className="text-xs w-0 flex-1 truncate font-mono cursor-default">
+                          {keyPath}
+                        </span>
+                      </TooltipTrigger>
+                      <TooltipContent>{keyPath}</TooltipContent>
+                    </Tooltip>
                     <Button
                       variant="ghost"
                       size="icon"
@@ -995,6 +1184,9 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
                       onClick={() => {
                         const paths = form.identityFilePaths?.filter((_, i) => i !== idx) || [];
                         update("identityFilePaths", paths.length > 0 ? paths : undefined);
+                        if (keyPath === pendingReferenceKeyPath) {
+                          setPendingReferenceKeyPath(null);
+                        }
                       }}
                     >
                       <Trash2 size={12} />
@@ -1023,6 +1215,7 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
                   onClick={() => {
                     update("identityFileId", undefined);
                     update("authMethod", "password");
+                    setPendingReferenceKeyPath(null);
                     setSelectedCredentialType(null);
                   }}
                 >
@@ -1117,6 +1310,7 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
                       update("identityFileId", val);
                       update("authMethod", "key");
                       update("identityFilePaths", undefined);
+                      setPendingReferenceKeyPath(null);
                       setSelectedCredentialType(null);
                     }}
                     placeholder={t("hostDetails.keys.search")}
@@ -1153,6 +1347,7 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
                       update("identityFileId", val);
                       update("authMethod", "certificate");
                       update("identityFilePaths", undefined);
+                      setPendingReferenceKeyPath(null);
                       setSelectedCredentialType(null);
                     }}
                     placeholder={t("hostDetails.certs.search")}
@@ -1188,37 +1383,34 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
                       onKeyDown={(e) => {
                         if (e.key === "Enter" && newKeyFilePath.trim()) {
                           e.preventDefault();
-                          const paths = [...(form.identityFilePaths || []), newKeyFilePath.trim()];
-                          update("identityFilePaths", paths);
-                          update("identityFileId", undefined);
-                          update("authMethod", "key");
-                          setNewKeyFilePath("");
+                          addLocalKeyFilePath(newKeyFilePath);
                         }
                       }}
                     />
-                    <Button
-                      variant="secondary"
-                      size="icon"
-                      className="h-8 w-8 shrink-0"
-                      title={t("hostDetails.credential.browseKeyFile")}
-                      onClick={async () => {
-                        const bridge = (window as unknown as { netcatty?: NetcattyBridge }).netcatty;
-                        if (!bridge?.selectFile) return;
-                        const filePath = await bridge.selectFile(
-                          "Select SSH Private Key",
-                          undefined,
-                          [{ name: "All Files", extensions: ["*"] }]
-                        );
-                        if (filePath) {
-                          const paths = [...(form.identityFilePaths || []), filePath];
-                          update("identityFilePaths", paths);
-                          update("identityFileId", undefined);
-                          update("authMethod", "key");
-                        }
-                      }}
-                    >
-                      <FolderOpen size={14} />
-                    </Button>
+                    <Tooltip>
+                      <TooltipTrigger asChild>
+                        <Button
+                          variant="secondary"
+                          size="icon"
+                          className="h-8 w-8 shrink-0"
+                          onClick={async () => {
+                            const bridge = (window as unknown as { netcatty?: NetcattyBridge }).netcatty;
+                            if (!bridge?.selectFile) return;
+                            const filePath = await bridge.selectFile(
+                              "Select SSH Private Key",
+                              undefined,
+                              [{ name: "All Files", extensions: ["*"] }]
+                            );
+                            if (filePath) {
+                              addLocalKeyFilePath(filePath);
+                            }
+                          }}
+                        >
+                          <FolderOpen size={14} />
+                        </Button>
+                      </TooltipTrigger>
+                      <TooltipContent>{t("hostDetails.credential.browseKeyFile")}</TooltipContent>
+                    </Tooltip>
                     <Button
                       variant="ghost"
                       size="icon"
@@ -1518,11 +1710,15 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
             enabled={!!form.moshEnabled}
             onToggle={() => {
               const enabling = !form.moshEnabled;
-              if (enabling && form.deviceType === 'network') {
-                // Network device mode is incompatible with Mosh — clear it
-                setForm(prev => ({ ...prev, moshEnabled: true, deviceType: undefined }));
+              if (enabling) {
+                setForm(prev => ({
+                  ...prev,
+                  moshEnabled: true,
+                  deviceType: prev.deviceType === 'network' ? undefined : prev.deviceType,
+                  x11Forwarding: undefined,
+                }));
               } else {
-                update("moshEnabled", enabling);
+                update("moshEnabled", false);
               }
             }}
           />
@@ -1557,6 +1753,24 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
           )}
         </Card>
 
+        {/* X11 Forwarding */}
+        {(!form.protocol || form.protocol === "ssh") && !form.moshEnabled && (
+          <Card className="p-3 space-y-2 bg-card border-border/80">
+            <div className="flex items-center gap-2">
+              <TerminalSquare size={14} className="text-muted-foreground" />
+              <p className="text-xs font-semibold">{t("hostDetails.section.x11Forwarding")}</p>
+            </div>
+            <ToggleRow
+              label={t("hostDetails.x11Forwarding")}
+              enabled={!!form.x11Forwarding}
+              onToggle={() => update("x11Forwarding", !form.x11Forwarding)}
+            />
+            <p className="text-xs text-muted-foreground">
+              {t("hostDetails.x11Forwarding.desc")}
+            </p>
+          </Card>
+        )}
+
         {/* Network Device Mode — only for SSH hosts without Mosh (serial already uses raw mode) */}
         {(!form.protocol || form.protocol === 'ssh') && !form.moshEnabled && (
         <Card className="p-3 space-y-2 bg-card border-border/80">
@@ -1605,19 +1819,89 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
               </p>
             </div>
           )}
-          <div className="flex items-center justify-between">
+          <div className="flex items-center justify-between gap-2">
             <p className="text-xs text-muted-foreground">{t("hostDetails.backspaceBehavior")}</p>
-            <select
-              className="h-8 rounded-md border border-input bg-background px-2 text-xs"
-              value={form.backspaceBehavior ?? ""}
-              onChange={(e) => update("backspaceBehavior", e.target.value || undefined)}
+            <Select
+              value={form.backspaceBehavior ?? "default"}
+              onValueChange={(v) => update("backspaceBehavior", v === "default" ? undefined : v)}
             >
-              <option value="">{t("hostDetails.backspaceBehavior.default")}</option>
-              <option value="ctrl-h">^H (0x08)</option>
-            </select>
+              <SelectTrigger className="h-8 w-auto text-xs">
+                <SelectValue />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value="default">{t("hostDetails.backspaceBehavior.default")}</SelectItem>
+                <SelectItem value="ctrl-h">^H (0x08)</SelectItem>
+              </SelectContent>
+            </Select>
           </div>
         </Card>
 
+        {/* Per-host keepalive override */}
+        <Card className="p-3 space-y-2 bg-card border-border/80">
+          <div className="flex items-center gap-2">
+            <HeartPulse size={14} className="text-muted-foreground" />
+            <p className="text-xs font-semibold">{t("hostDetails.section.keepalive")}</p>
+          </div>
+          <ToggleRow
+            label={t("hostDetails.keepalive.override")}
+            enabled={!!form.keepaliveOverride}
+            onToggle={() => {
+              const next = !form.keepaliveOverride;
+              update("keepaliveOverride", next);
+              // Seed sensible per-host defaults the first time the user
+              // turns the override on so the inputs aren't empty.
+              if (next) {
+                if (form.keepaliveInterval == null) update("keepaliveInterval", 0);
+                if (form.keepaliveCountMax == null) update("keepaliveCountMax", 3);
+              }
+            }}
+          />
+          <p className="text-xs text-muted-foreground break-words">
+            {t("hostDetails.keepalive.desc")}
+          </p>
+          {form.keepaliveOverride && (
+            <div className="space-y-2 pt-1">
+              <div className="flex items-center justify-between gap-2">
+                <p className="text-xs text-muted-foreground">{t("hostDetails.keepalive.interval")}</p>
+                <input
+                  type="number"
+                  min={0}
+                  max={3600}
+                  className="h-8 w-24 rounded-md border border-input bg-background px-2 text-xs"
+                  value={form.keepaliveInterval ?? 0}
+                  onChange={(e) => {
+                    const v = parseInt(e.target.value, 10);
+                    if (!Number.isFinite(v)) return;
+                    if (v < 0 || v > 3600) return;
+                    update("keepaliveInterval", v);
+                  }}
+                />
+              </div>
+              <div className="flex items-center justify-between gap-2">
+                <p className="text-xs text-muted-foreground">{t("hostDetails.keepalive.countMax")}</p>
+                <input
+                  type="number"
+                  min={1}
+                  max={100}
+                  className="h-8 w-24 rounded-md border border-input bg-background px-2 text-xs"
+                  value={form.keepaliveCountMax ?? 3}
+                  onChange={(e) => {
+                    const v = parseInt(e.target.value, 10);
+                    if (!Number.isFinite(v)) return;
+                    if (v < 1 || v > 100) return;
+                    update("keepaliveCountMax", v);
+                  }}
+                />
+              </div>
+              {(form.keepaliveInterval ?? 0) === 0 && (
+                <p className="text-xs text-muted-foreground break-words pl-1">
+                  {t("hostDetails.keepalive.disabledHint")}
+                </p>
+              )}
+            </div>
+          )}
+        </Card>
+
         {/* Proxy via Hosts (Jump Hosts / ProxyJump) */}
         <Card className="p-3 space-y-2 bg-card border-border/80">
           <div className="flex items-center justify-between">
@@ -1699,35 +1983,40 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
             <Globe size={14} className="text-muted-foreground" />
             <p className="text-xs font-semibold">{t("hostDetails.proxy")}</p>
           </div>
-          {form.proxyConfig?.host ? (
-            <button
-              className="w-full min-w-0 grid grid-cols-[auto_minmax(0,1fr)_auto] items-center gap-2 p-2 rounded-md bg-secondary/50 hover:bg-secondary transition-colors cursor-pointer overflow-hidden"
-              onClick={() => setActiveSubPanel("proxy")}
-            >
-              <Badge variant="secondary" className="text-xs shrink-0">
-                {form.proxyConfig.type?.toUpperCase()}
-              </Badge>
-              <TooltipProvider>
-                <Tooltip>
-                  <TooltipTrigger asChild>
-                    <span className="block min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-sm">
-                      {form.proxyConfig.host}:{form.proxyConfig.port}
-                    </span>
-                  </TooltipTrigger>
-                  <TooltipContent side="bottom" align="start" className="max-w-xs break-all">
-                    {form.proxyConfig.type?.toUpperCase()} {form.proxyConfig.host}:{form.proxyConfig.port}
-                  </TooltipContent>
-                </Tooltip>
-              </TooltipProvider>
-              <X
-                size={14}
-                className="text-muted-foreground hover:text-destructive flex-shrink-0"
-                onClick={(e) => {
-                  e.stopPropagation();
-                  clearProxyConfig();
-                }}
-              />
-            </button>
+          {form.proxyConfig?.host || form.proxyProfileId ? (
+            <div className="w-full min-w-0 grid grid-cols-[minmax(0,1fr)_auto] items-center gap-1">
+              <button
+                type="button"
+                className="min-w-0 grid grid-cols-[auto_minmax(0,1fr)] items-center gap-2 p-2 rounded-md bg-secondary/50 hover:bg-secondary transition-colors cursor-pointer overflow-hidden"
+                onClick={() => setActiveSubPanel("proxy")}
+              >
+                <Badge variant="secondary" className="text-xs shrink-0">
+                  {proxySummaryType}
+                </Badge>
+                <TooltipProvider>
+                  <Tooltip>
+                    <TooltipTrigger asChild>
+                      <span className="block min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-sm">
+                        {proxySummaryLabel}
+                      </span>
+                    </TooltipTrigger>
+                    <TooltipContent side="bottom" align="start" className="max-w-xs break-all">
+                      {proxySummaryTooltip}
+                    </TooltipContent>
+                  </Tooltip>
+                </TooltipProvider>
+              </button>
+              <Button
+                type="button"
+                variant="ghost"
+                size="icon"
+                className="h-9 w-9 text-muted-foreground hover:text-destructive shrink-0"
+                aria-label={t("hostDetails.proxyPanel.remove")}
+                onClick={clearProxyConfig}
+              >
+                <X size={14} />
+              </Button>
+            </div>
           ) : (
             <Button
               variant="ghost"
@@ -1810,42 +2099,46 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
         {form.telnetEnabled || form.protocol === "telnet" ? (
           <Card className="p-3 space-y-3 bg-card border-border/80">
             <div className="flex items-center justify-between">
-              <div className="flex items-center gap-2 bg-secondary/70 border border-border/70 rounded-md px-2 py-1">
+              <div className="flex-1 min-w-0 h-10 flex items-center gap-2 bg-secondary/70 border border-border/70 rounded-md px-3">
                 <span className="text-xs text-muted-foreground">{t("hostDetails.telnetOn")}</span>
-                <Input
-                  type="number"
-                  value={form.telnetPort || 23}
-                  onChange={(e) => update("telnetPort", Number(e.target.value))}
-                  className="h-8 w-16 text-center"
-                />
-                <span className="text-xs text-muted-foreground">{t("hostDetails.port")}</span>
+                <div className="ml-auto w-1/2 min-w-0 flex items-center gap-2 justify-end">
+	                  <Input
+	                    type="number"
+	                    value={effectiveTelnetPort}
+	                    onChange={(e) => update("telnetPort", parseOptionalPortInput(e.target.value))}
+	                    className="h-8 flex-1 min-w-0 text-center"
+	                  />
+                  <span className="text-xs text-muted-foreground">{t("hostDetails.port")}</span>
+                </div>
               </div>
-              <Button
-                variant="ghost"
-                size="icon"
-                className="h-8 w-8 text-muted-foreground hover:text-destructive"
-                onClick={() => update("telnetEnabled", false)}
-              >
-                <X size={14} />
-              </Button>
+              {form.protocol !== "telnet" && (
+                <Button
+                  variant="ghost"
+                  size="icon"
+                  className="h-8 w-8 text-muted-foreground hover:text-destructive"
+                  onClick={() => update("telnetEnabled", false)}
+                >
+                  <X size={14} />
+                </Button>
+              )}
             </div>
 
             {/* Telnet Credentials */}
             <p className="text-xs font-semibold">{t("hostDetails.telnet.credentials")}</p>
-            <Input
-              placeholder={t("hostDetails.telnet.username")}
-              value={form.telnetUsername || form.username || ""}
-              onChange={(e) =>
-                update("telnetUsername" as keyof Host, e.target.value)
-              }
+	            <Input
+	              placeholder={t("hostDetails.telnet.username")}
+	              value={effectiveTelnetUsername}
+	              onChange={(e) =>
+	                update("telnetUsername" as keyof Host, e.target.value)
+	              }
               className="h-10"
             />
             <Input
-              placeholder={t("hostDetails.telnet.password")}
-              type="password"
-              value={form.telnetPassword || form.password || ""}
-              onChange={(e) =>
-                update("telnetPassword" as keyof Host, e.target.value)
+	              placeholder={t("hostDetails.telnet.password")}
+	              type="password"
+	              value={effectiveTelnetPassword}
+	              onChange={(e) =>
+	                update("telnetPassword" as keyof Host, e.target.value)
               }
               className="h-10"
             />
@@ -1894,7 +2187,6 @@ const HostDetailsPanel: React.FC<HostDetailsPanelProps> = ({
             className="w-full h-10 justify-start gap-2 border border-dashed border-border/60"
             onClick={() => {
               update("telnetEnabled", true);
-              update("telnetPort", 23);
             }}
           >
             <Plus size={14} />

components/HostTreeView.test.tsx

@@ -0,0 +1,58 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import type { GroupConfig, Host } from "../types.ts";
+import { getHostTreeDisplayDetails } from "./HostTreeView.tsx";
+
+const baseHost: Host = {
+  id: "host-1",
+  label: "Router",
+  hostname: "router.example.com",
+  username: "ssh-user",
+  port: 2222,
+  protocol: "telnet",
+  tags: [],
+  os: "linux",
+  createdAt: 1,
+};
+
+test("HostTreeView display details include inherited telnet defaults", () => {
+  const host: Host = {
+    ...baseHost,
+    group: "network",
+    username: "ssh-user",
+    port: 2222,
+    telnetUsername: undefined,
+    telnetPort: undefined,
+  };
+  const groupConfigs: GroupConfig[] = [{
+    path: "network",
+    telnetUsername: "group-telnet-user",
+    telnetPort: 2325,
+  }];
+
+  assert.deepEqual(getHostTreeDisplayDetails(host, groupConfigs), {
+    protocol: "telnet",
+    username: "group-telnet-user",
+    port: 2325,
+  });
+});
+
+test("HostTreeView display details keep explicit cleared telnet username", () => {
+  const host: Host = {
+    ...baseHost,
+    group: "network",
+    telnetUsername: "",
+  };
+  const groupConfigs: GroupConfig[] = [{
+    path: "network",
+    telnetUsername: "group-telnet-user",
+    telnetPort: 2325,
+  }];
+
+  assert.deepEqual(getHostTreeDisplayDetails(host, groupConfigs), {
+    protocol: "telnet",
+    username: "",
+    port: 2325,
+  });
+});

components/HostTreeView.tsx

@@ -2,10 +2,11 @@ import { CheckSquare, ChevronRight, Edit2, FileSymlink, Folder, FolderOpen, Moni
 import React, { useMemo } from 'react';
 import { useI18n } from '../application/i18n/I18nProvider';
 import { useTreeExpandedState } from '../application/state/useTreeExpandedState';
-import { sanitizeHost } from '../domain/host';
+import { applyGroupDefaults, resolveGroupDefaults } from '../domain/groupConfig';
+import { resolveTelnetPort, resolveTelnetUsername, sanitizeHost } from '../domain/host';
 import { STORAGE_KEY_VAULT_HOSTS_TREE_EXPANDED } from '../infrastructure/config/storageKeys';
 import { cn } from '../lib/utils';
-import { GroupNode, Host } from '../types';
+import { GroupConfig, GroupNode, Host } from '../types';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from './ui/collapsible';
 import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger } from './ui/context-menu';
 import { DistroAvatar } from './DistroAvatar';
@@ -36,6 +37,9 @@ interface HostTreeViewProps {
   isMultiSelectMode?: boolean;
   selectedHostIds?: Set<string>;
   toggleHostSelection?: (hostId: string) => void;
+  getDropTargetClasses?: (target: string) => string;
+  setDragOverDropTarget?: (target: string | null) => void;
+  groupConfigs?: GroupConfig[];
 }
 
 interface TreeNodeProps {
@@ -61,6 +65,9 @@ interface TreeNodeProps {
   isMultiSelectMode?: boolean;
   selectedHostIds?: Set<string>;
   toggleHostSelection?: (hostId: string) => void;
+  getDropTargetClasses?: (target: string) => string;
+  setDragOverDropTarget?: (target: string | null) => void;
+  groupConfigs: GroupConfig[];
 }
 
 
@@ -87,6 +94,9 @@ const TreeNode: React.FC<TreeNodeProps> = ({
   isMultiSelectMode,
   selectedHostIds,
   toggleHostSelection,
+  getDropTargetClasses,
+  setDragOverDropTarget,
+  groupConfigs,
 }) => {
   const { t } = useI18n();
   const isExpanded = expandedPaths.has(node.path);
@@ -140,6 +150,7 @@ const TreeNode: React.FC<TreeNodeProps> = ({
               <div
                 className={cn(
                   "flex items-center py-2 pr-3 text-sm font-medium cursor-pointer transition-colors select-none group hover:bg-secondary/60 rounded-lg",
+                  getDropTargetClasses?.(node.path),
                 )}
                 style={{ paddingLeft }}
                 draggable
@@ -147,10 +158,19 @@ const TreeNode: React.FC<TreeNodeProps> = ({
                 onDragOver={(e) => {
                   e.preventDefault();
                   e.stopPropagation();
+                  setDragOverDropTarget?.(node.path);
+                }}
+                onDragLeave={(e) => {
+                  const nextTarget = e.relatedTarget;
+                  if (nextTarget instanceof Node && e.currentTarget.contains(nextTarget)) {
+                    return;
+                  }
+                  setDragOverDropTarget?.(null);
                 }}
                 onDrop={(e) => {
                   e.preventDefault();
                   e.stopPropagation();
+                  setDragOverDropTarget?.(null);
                   const hostId = e.dataTransfer.getData("host-id");
                   const groupPath = e.dataTransfer.getData("group-path");
                   if (hostId) moveHostToGroup(hostId, node.path);
@@ -239,11 +259,14 @@ const TreeNode: React.FC<TreeNodeProps> = ({
               managedGroupPaths={managedGroupPaths}
               onUnmanageGroup={onUnmanageGroup}
 
-              isMultiSelectMode={isMultiSelectMode}
-              selectedHostIds={selectedHostIds}
-              toggleHostSelection={toggleHostSelection}
-            />
-          ))}
+	              isMultiSelectMode={isMultiSelectMode}
+	              selectedHostIds={selectedHostIds}
+	              toggleHostSelection={toggleHostSelection}
+	              getDropTargetClasses={getDropTargetClasses}
+	              setDragOverDropTarget={setDragOverDropTarget}
+	              groupConfigs={groupConfigs}
+	            />
+	          ))}
 
           {/* Hosts in this group */}
           {sortedHosts.map((host) => (
@@ -258,11 +281,12 @@ const TreeNode: React.FC<TreeNodeProps> = ({
               onCopyCredentials={onCopyCredentials}
               moveHostToGroup={moveHostToGroup}
 
-              isMultiSelectMode={isMultiSelectMode}
-              selectedHostIds={selectedHostIds}
-              toggleHostSelection={toggleHostSelection}
-            />
-          ))}
+	              isMultiSelectMode={isMultiSelectMode}
+	              selectedHostIds={selectedHostIds}
+	              toggleHostSelection={toggleHostSelection}
+	              groupConfigs={groupConfigs}
+	            />
+	          ))}
         </CollapsibleContent>
       </Collapsible>
     </div>
@@ -282,8 +306,28 @@ interface HostTreeItemProps {
   isMultiSelectMode?: boolean;
   selectedHostIds?: Set<string>;
   toggleHostSelection?: (hostId: string) => void;
+  groupConfigs: GroupConfig[];
 }
 
+export const getHostTreeDisplayDetails = (
+  host: Host,
+  groupConfigs: GroupConfig[] = [],
+) => {
+  const displayHost = host.group
+    ? applyGroupDefaults(host, resolveGroupDefaults(host.group, groupConfigs))
+    : host;
+  const isTelnet = displayHost.protocol === 'telnet';
+  return {
+    protocol: displayHost.protocol,
+    username: isTelnet
+      ? (resolveTelnetUsername(displayHost) || '')
+      : (displayHost.username?.trim() || ''),
+    port: isTelnet
+      ? resolveTelnetPort(displayHost)
+      : (displayHost.port ?? 22),
+  };
+};
+
 const HostTreeItem: React.FC<HostTreeItemProps> = ({
   host,
   depth,
@@ -297,18 +341,19 @@ const HostTreeItem: React.FC<HostTreeItemProps> = ({
   isMultiSelectMode,
   selectedHostIds,
   toggleHostSelection,
+  groupConfigs,
 }) => {
   const { t } = useI18n();
   const paddingLeft = `${depth * 20 + 12}px`;
   const safeHost = sanitizeHost(host);
   const tags = host.tags || [];
-  const isTelnet = host.protocol === 'telnet';
-  const displayUsername = isTelnet
-    ? (host.telnetUsername?.trim() || host.username?.trim() || '')
-    : (host.username?.trim() || '');
-  const displayPort = isTelnet
-    ? (host.telnetPort ?? host.port ?? 23)
-    : (host.port ?? 22);
+  const displayDetails = useMemo(
+    () => getHostTreeDisplayDetails(host, groupConfigs),
+    [groupConfigs, host],
+  );
+  const displayProtocol = displayDetails.protocol;
+  const displayUsername = displayDetails.username;
+  const displayPort = displayDetails.port;
   const isSelected = isMultiSelectMode && selectedHostIds?.has(host.id);
 
   return (
@@ -353,11 +398,11 @@ const HostTreeItem: React.FC<HostTreeItemProps> = ({
             </div>
           </div>
           <div className="flex items-center gap-2 opacity-0 group-hover:opacity-100 transition-opacity">
-            {host.protocol && host.protocol !== 'ssh' && (
-              <span className="text-xs px-1.5 py-0.5 bg-primary/10 text-primary rounded">
-                {host.protocol.toUpperCase()}
-              </span>
-            )}
+	            {displayProtocol && displayProtocol !== 'ssh' && (
+	              <span className="text-xs px-1.5 py-0.5 bg-primary/10 text-primary rounded">
+	                {displayProtocol.toUpperCase()}
+	              </span>
+	            )}
             {tags.length > 0 && (
               <span className="text-xs opacity-60">
                 {tags.slice(0, 2).join(', ')}
@@ -425,9 +470,12 @@ export const HostTreeView: React.FC<HostTreeViewProps> = ({
   isMultiSelectMode,
   selectedHostIds,
   toggleHostSelection,
+  getDropTargetClasses,
+  setDragOverDropTarget,
+  groupConfigs = [],
 }) => {
   const { t } = useI18n();
-  
+
   // Use external state if provided, otherwise use local persistent state
   const localTreeState = useTreeExpandedState(STORAGE_KEY_VAULT_HOSTS_TREE_EXPANDED);
   
@@ -548,7 +596,10 @@ export const HostTreeView: React.FC<HostTreeViewProps> = ({
           isMultiSelectMode={isMultiSelectMode}
           selectedHostIds={selectedHostIds}
           toggleHostSelection={toggleHostSelection}
-        />
+	          getDropTargetClasses={getDropTargetClasses}
+	          setDragOverDropTarget={setDragOverDropTarget}
+	          groupConfigs={groupConfigs}
+	        />
       ))}
 
       {/* Ungrouped hosts at root level */}
@@ -564,9 +615,10 @@ export const HostTreeView: React.FC<HostTreeViewProps> = ({
           onCopyCredentials={onCopyCredentials}
           moveHostToGroup={moveHostToGroup}
           isMultiSelectMode={isMultiSelectMode}
-          selectedHostIds={selectedHostIds}
-          toggleHostSelection={toggleHostSelection}
-        />
+	          selectedHostIds={selectedHostIds}
+	          toggleHostSelection={toggleHostSelection}
+	          groupConfigs={groupConfigs}
+	        />
       ))}
       
       {/* Empty state */}
@@ -578,4 +630,4 @@ export const HostTreeView: React.FC<HostTreeViewProps> = ({
       )}
     </div>
   );
-};
+};

components/KeyboardInteractiveModal.tsx

@@ -4,7 +4,7 @@
  * This modal displays prompts from the SSH server and collects user responses.
  */
 import { Eye, EyeOff, KeyRound, Loader2 } from "lucide-react";
-import React, { useCallback, useEffect, useState } from "react";
+import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { useI18n } from "../application/i18n/I18nProvider";
 import { Button } from "./ui/button";
 import {
@@ -24,6 +24,7 @@ export interface KeyboardInteractivePrompt {
 
 export interface KeyboardInteractiveRequest {
   requestId: string;
+  sessionId?: string;
   name: string;
   instructions: string;
   prompts: KeyboardInteractivePrompt[];
@@ -31,9 +32,18 @@ export interface KeyboardInteractiveRequest {
   savedPassword?: string | null;
 }
 
+const isAPasswordPrompt = (prompt: KeyboardInteractivePrompt) => {
+  if (prompt.echo) return false;
+  const lower = prompt.prompt.toLowerCase();
+  if (!lower.includes("password")) return false;
+  // Exclude OTP / one-time password / verification code prompts
+  if (lower.includes("one-time") || lower.includes("otp") || lower.includes("verification") || lower.includes("token") || lower.includes("code")) return false;
+  return true;
+};
+
 interface KeyboardInteractiveModalProps {
   request: KeyboardInteractiveRequest | null;
-  onSubmit: (requestId: string, responses: string[]) => void;
+  onSubmit: (requestId: string, responses: string[], savePassword?: string) => void;
   onCancel: (requestId: string) => void;
 }
 
@@ -46,15 +56,28 @@ export const KeyboardInteractiveModal: React.FC<KeyboardInteractiveModalProps> =
   const [responses, setResponses] = useState<string[]>([]);
   const [showPasswords, setShowPasswords] = useState<boolean[]>([]);
   const [isSubmitting, setIsSubmitting] = useState(false);
+  const [savePassword, setSavePassword] = useState(false);
+
+  // Index of the first password prompt (if any)
+  const passwordPromptIndex = useMemo(() => {
+    if (!request) return -1;
+    return request.prompts.findIndex(p => isAPasswordPrompt(p));
+  }, [request]);
 
   // Reset state when request changes
   useEffect(() => {
     if (request) {
-      setResponses(request.prompts.map(() => ""));
+      const initial = request.prompts.map(() => "");
+      // Auto-fill saved password into the password prompt
+      if (request.savedPassword && passwordPromptIndex >= 0) {
+        initial[passwordPromptIndex] = request.savedPassword;
+      }
+      setResponses(initial);
       setShowPasswords(request.prompts.map(() => false));
       setIsSubmitting(false);
+      setSavePassword(false);
     }
-  }, [request]);
+  }, [request, passwordPromptIndex]);
 
   const handleResponseChange = useCallback((index: number, value: string) => {
     setResponses((prev) => {
@@ -75,8 +98,11 @@ export const KeyboardInteractiveModal: React.FC<KeyboardInteractiveModalProps> =
   const handleSubmit = useCallback(() => {
     if (!request || isSubmitting) return;
     setIsSubmitting(true);
-    onSubmit(request.requestId, responses);
-  }, [request, responses, onSubmit, isSubmitting]);
+    const passwordToSave = savePassword && passwordPromptIndex >= 0
+      ? responses[passwordPromptIndex]
+      : undefined;
+    onSubmit(request.requestId, responses, passwordToSave);
+  }, [request, responses, onSubmit, isSubmitting, savePassword, passwordPromptIndex]);
 
   const handleCancel = useCallback(() => {
     if (!request) return;
@@ -154,19 +180,20 @@ export const KeyboardInteractiveModal: React.FC<KeyboardInteractiveModalProps> =
                     </button>
                   )}
                 </div>
-                {/* Use saved password button - shown below input, right-aligned */}
-                {isPassword && request.savedPassword && !responses[index] && (
-                  <div className="flex justify-end">
-                    <button
-                      type="button"
-                      className="flex items-center gap-1 text-xs text-primary hover:text-primary/80 disabled:opacity-50"
-                      onClick={() => handleResponseChange(index, request.savedPassword!)}
+                {/* Save password checkbox - shown only for the first password prompt */}
+                {index === passwordPromptIndex && (
+                  <label className="flex items-center gap-2 cursor-pointer select-none">
+                    <input
+                      type="checkbox"
+                      checked={savePassword}
+                      onChange={(e) => setSavePassword(e.target.checked)}
                       disabled={isSubmitting}
-                    >
-                      <KeyRound size={12} />
-                      <span>{t("keyboard.interactive.useSavedPassword")}</span>
-                    </button>
-                  </div>
+                      className="accent-primary"
+                    />
+                    <span className="text-xs text-muted-foreground">
+                      {t("keyboard.interactive.savePassword")}
+                    </span>
+                  </label>
                 )}
               </div>
             );

components/KeychainManager.tsx

@@ -3,6 +3,9 @@ import {
   ChevronDown,
   ChevronRight,
   Edit2,
+  Eye,
+  EyeOff,
+  FileKey,
   Info,
   Key,
   LayoutGrid,
@@ -18,11 +21,12 @@ import {
 import React, { useCallback, useMemo, useState } from "react";
 import { useI18n } from "../application/i18n/I18nProvider";
 import { useStoredViewMode } from "../application/state/useStoredViewMode";
-import { resolveHostAuth } from "../domain/sshAuth";
+import { sanitizeCredentialValue } from "../domain/credentials";
+import { resolveBridgeKeyAuth, resolveHostAuth } from "../domain/sshAuth";
 import { STORAGE_KEY_VAULT_KEYS_VIEW_MODE } from "../infrastructure/config/storageKeys";
 import { logger } from "../lib/logger";
 import { cn } from "../lib/utils";
-import { Host, Identity, KeyType, SSHKey } from "../types";
+import { Host, Identity, KeyType, ProxyProfile, SSHKey } from "../types";
 import { ManagedSource } from "../domain/models";
 import { useKeychainBackend } from "../application/state/useKeychainBackend";
 import SelectHostPanel from "./SelectHostPanel";
@@ -50,6 +54,7 @@ import { Input } from "./ui/input";
 import { Label } from "./ui/label";
 import { Textarea } from "./ui/textarea";
 import { toast } from "./ui/toast";
+import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip";
 
 // Import utilities and components from keychain module
 import {
@@ -68,6 +73,7 @@ interface KeychainManagerProps {
   keys: SSHKey[];
   identities?: Identity[];
   hosts?: Host[];
+  proxyProfiles?: ProxyProfile[];
   customGroups?: string[];
   managedSources?: ManagedSource[];
   onSave: (key: SSHKey) => void;
@@ -84,6 +90,7 @@ const KeychainManager: React.FC<KeychainManagerProps> = ({
   keys,
   identities = [],
   hosts = [],
+  proxyProfiles = [],
   customGroups = [],
   managedSources = [],
   onSave,
@@ -173,7 +180,7 @@ echo $3 >> "$FILE"`);
     switch (activeFilter) {
       case "key":
         result = result.filter(
-          (k) => k.source === "generated" || k.source === "imported",
+          (k) => k.source === "generated" || k.source === "imported" || k.source === "reference",
         );
         break;
       case "certificate":
@@ -515,12 +522,12 @@ echo $3 >> "$FILE"`);
       {/* Main Content */}
       <div
         className={cn(
-          "flex-1 overflow-y-auto transition-all duration-200",
+          "flex-1 flex flex-col min-h-0 transition-all duration-200",
           panel.type !== "closed" && "mr-[380px]",
         )}
       >
         {/* Toolbar */}
-        <div className="flex flex-wrap items-center gap-3 bg-secondary/60 border-b border-border/70 px-3 py-1.5">
+        <div className="h-14 px-4 py-2 flex items-center gap-3 bg-secondary/80 supports-[backdrop-filter]:backdrop-blur-sm border-b border-border/50 shrink-0">
           {/* Filter Tabs */}
           <div className="flex items-center gap-1">
             {/* KEY button with split interaction: left=switch view, right=dropdown */}
@@ -528,16 +535,15 @@ echo $3 >> "$FILE"`);
               <div
                 className={cn(
                   "flex items-center rounded-md transition-colors",
-                  activeFilter === "key" ? "bg-primary/15" : "hover:bg-accent",
+                  activeFilter === "key"
+                    ? "bg-foreground/10 text-foreground hover:bg-foreground/15"
+                    : "bg-foreground/5 text-foreground hover:bg-foreground/10",
                 )}
               >
                 <Button
                   size="sm"
                   variant="ghost"
-                  className={cn(
-                    "h-8 px-3 gap-2 rounded-r-none hover:bg-transparent",
-                    activeFilter === "key" && "text-primary",
-                  )}
+                  className="h-10 px-3 gap-2 rounded-r-none hover:bg-transparent text-inherit"
                   onClick={() => setActiveFilter("key")}
                 >
                   <Key size={14} />
@@ -547,10 +553,7 @@ echo $3 >> "$FILE"`);
                   <Button
                     size="sm"
                     variant="ghost"
-                    className={cn(
-                      "h-8 px-1.5 rounded-l-none hover:bg-transparent",
-                      activeFilter === "key" && "text-primary",
-                    )}
+                    className="h-10 px-1.5 rounded-l-none hover:bg-transparent text-inherit"
                   >
                     <ChevronDown size={12} />
                   </Button>
@@ -589,33 +592,24 @@ echo $3 >> "$FILE"`);
                 className={cn(
                   "flex items-center rounded-md transition-colors",
                   activeFilter === "certificate"
-                    ? "bg-primary/15"
-                    : "hover:bg-accent",
+                    ? "bg-foreground/10 text-foreground hover:bg-foreground/15"
+                    : "bg-foreground/5 text-foreground hover:bg-foreground/10",
                 )}
               >
                 <Button
                   size="sm"
                   variant="ghost"
-                  className={cn(
-                    "h-8 px-3 gap-2 rounded-r-none hover:bg-transparent",
-                    activeFilter === "certificate" && "text-primary",
-                  )}
+                  className="h-10 px-3 gap-2 rounded-r-none hover:bg-transparent text-inherit"
                   onClick={() => setActiveFilter("certificate")}
                 >
                   <BadgeCheck size={14} />
                   {t("keychain.filter.certificate")}
-                  <span className="text-[10px] px-1.5 rounded-full bg-muted text-muted-foreground">
-                    {keys.filter((k) => k.certificate).length}
-                  </span>
                 </Button>
                 <DropdownTrigger asChild>
                   <Button
                     size="sm"
                     variant="ghost"
-                    className={cn(
-                      "h-8 px-1.5 rounded-l-none hover:bg-transparent",
-                      activeFilter === "certificate" && "text-primary",
-                    )}
+                    className="h-10 px-1.5 rounded-l-none hover:bg-transparent text-inherit"
                   >
                     <ChevronDown size={12} />
                   </Button>
@@ -645,7 +639,7 @@ echo $3 >> "$FILE"`);
                   value={search}
                   onChange={(e) => setSearch(e.target.value)}
                   placeholder={t("common.searchPlaceholder")}
-                  className="h-9 pl-8 w-full"
+                  className="h-10 pl-9 w-full bg-secondary border-border/60 text-sm"
                 />
               </div>
             )}
@@ -654,7 +648,7 @@ echo $3 >> "$FILE"`);
                 <Button
                   variant="ghost"
                   size="icon"
-                  className="h-9 w-9 flex-shrink-0"
+                  className="h-10 w-10 flex-shrink-0"
                 >
                   {viewMode === "grid" ? (
                     <LayoutGrid size={16} />
@@ -684,8 +678,10 @@ echo $3 >> "$FILE"`);
           </div>
         </div>
 
-        {/* Keys Section */}
-        <div className="space-y-3 p-3">
+        {/* Scrollable Content */}
+        <div className="flex-1 overflow-y-auto">
+          {/* Keys Section */}
+          <div className="space-y-3 p-3">
           <div className="flex items-center justify-between">
             <h2 className="text-base font-semibold text-muted-foreground">
               {t("keychain.section.keys")}
@@ -817,6 +813,7 @@ echo $3 >> "$FILE"`);
             </div>
           </div>
         )}
+        </div>
       </div>
 
       {/* Slide-out Panel */}
@@ -1037,16 +1034,26 @@ echo $3 >> "$FILE"`);
                         keys,
                         identities,
                       });
+                      const exportKeyAuth = resolveBridgeKeyAuth({
+                        key: exportAuth.key,
+                        fallbackIdentityFilePaths: exportAuth.authMethod === "password" || exportAuth.keyId
+                          ? undefined
+                          : exportHost.identityFilePaths,
+                        passphrase: exportAuth.passphrase,
+                      });
+                      const exportPassword = sanitizeCredentialValue(exportAuth.password);
 
                       // Need either password or a usable key to run remote command.
-                      if (!exportAuth.password && !exportAuth.key?.privateKey) {
+                      if (
+                        !exportPassword &&
+                        !exportKeyAuth.privateKey &&
+                        !exportKeyAuth.identityFilePaths?.length
+                      ) {
                         throw new Error(
                           t("keychain.export.missingCredentials"),
                         );
                       }
 
-                      const hostPrivateKey = exportAuth.key?.privateKey;
-
                       // Escape the public key for shell (single quotes, escape existing quotes)
                       const escapedPublicKey = panel.key.publicKey.replace(
                         /'/g,
@@ -1067,8 +1074,14 @@ echo $3 >> "$FILE"`);
                         hostname: exportHost.hostname,
                         username: exportAuth.username,
                         port: exportHost.port || 22,
-                        password: exportAuth.password,
-                        privateKey: hostPrivateKey,
+                        password: exportPassword,
+                        privateKey: exportKeyAuth.privateKey,
+                        certificate: exportAuth.key?.certificate,
+                        publicKey: exportAuth.key?.publicKey,
+                        keyId: exportAuth.keyId,
+                        keySource: exportAuth.key?.source,
+                        passphrase: exportKeyAuth.passphrase,
+                        identityFilePaths: exportKeyAuth.identityFilePaths,
                         command,
                         timeout: 30000,
                         enableKeyboardInteractive: true,
@@ -1148,71 +1161,139 @@ echo $3 >> "$FILE"`);
                   />
                 </div>
 
-                <div className="space-y-2">
-                  <Label className="text-destructive">
-                    {t("keychain.edit.privateKeyRequired")}
-                  </Label>
-                  <Textarea
-                    value={draftKey.privateKey || ""}
-                    onChange={(e) =>
-                      setDraftKey({ ...draftKey, privateKey: e.target.value })
-                    }
-                    placeholder="-----BEGIN OPENSSH PRIVATE KEY-----"
-                    className="min-h-[180px] font-mono text-xs"
-                  />
-                </div>
-
-                <div className="space-y-2">
-                  <Label className="text-muted-foreground">
-                    {t("keychain.edit.publicKey")}
-                  </Label>
-                  <Textarea
-                    value={draftKey.publicKey || ""}
-                    onChange={(e) =>
-                      setDraftKey({ ...draftKey, publicKey: e.target.value })
-                    }
-                    placeholder="ssh-ed25519 AAAA..."
-                    className="min-h-[80px] font-mono text-xs"
-                  />
-                </div>
-
-                <div className="space-y-2">
-                  <Label className="text-muted-foreground">
-                    {t("keychain.edit.certificate")}
-                  </Label>
-                  <Textarea
-                    value={draftKey.certificate || ""}
-                    onChange={(e) =>
-                      setDraftKey({ ...draftKey, certificate: e.target.value })
-                    }
-                    placeholder={t("keychain.edit.certificatePlaceholder")}
-                    className="min-h-[60px] font-mono text-xs"
-                  />
-                </div>
-
-                {/* Key Export section */}
-                <div className="pt-4 mt-4 border-t border-border/60">
-                  <div className="flex items-center gap-2 mb-3">
-                    <span className="text-sm font-medium">
-                      {t("keychain.edit.keyExport")}
-                    </span>
-                    <div className="h-4 w-4 rounded-full bg-muted flex items-center justify-center">
-                      <Info size={10} className="text-muted-foreground" />
+                {/* Reference key: show file path read-only */}
+                {draftKey.source === 'reference' && draftKey.filePath && (
+                  <div className="space-y-2">
+                    <Label className="text-muted-foreground">
+                      {t("keychain.edit.filePath")}
+                    </Label>
+                    <div className="flex items-center gap-2 p-2 rounded-md bg-secondary/50 border border-border/60">
+                      <FileKey size={14} className="text-primary shrink-0" />
+                      <Tooltip>
+                        <TooltipTrigger asChild>
+                          <span className="text-xs font-mono truncate cursor-default">
+                            {draftKey.filePath}
+                          </span>
+                        </TooltipTrigger>
+                        <TooltipContent>{draftKey.filePath}</TooltipContent>
+                      </Tooltip>
                     </div>
                   </div>
-                  <Button
-                    className="w-full h-11"
-                    onClick={() => openKeyExport(panel.key)}
-                  >
-                    {t("keychain.edit.exportToHost")}
-                  </Button>
+                )}
+
+                {/* Managed key: show private key editor */}
+                {draftKey.source !== 'reference' && (
+                  <div className="space-y-2">
+                    <Label className="text-destructive">
+                      {t("keychain.edit.privateKeyRequired")}
+                    </Label>
+                    <Textarea
+                      value={draftKey.privateKey || ""}
+                      onChange={(e) =>
+                        setDraftKey({ ...draftKey, privateKey: e.target.value })
+                      }
+                      placeholder="-----BEGIN OPENSSH PRIVATE KEY-----"
+                      className="min-h-[180px] font-mono text-xs"
+                    />
+                  </div>
+                )}
+
+                {draftKey.source !== 'reference' && (
+                  <div className="space-y-2">
+                    <Label className="text-muted-foreground">
+                      {t("keychain.edit.publicKey")}
+                    </Label>
+                    <Textarea
+                      value={draftKey.publicKey || ""}
+                      onChange={(e) =>
+                        setDraftKey({ ...draftKey, publicKey: e.target.value })
+                      }
+                      placeholder="ssh-ed25519 AAAA..."
+                      className="min-h-[80px] font-mono text-xs"
+                    />
+                  </div>
+                )}
+
+                {draftKey.source !== 'reference' && (
+                  <div className="space-y-2">
+                    <Label className="text-muted-foreground">
+                      {t("keychain.edit.certificate")}
+                    </Label>
+                    <Textarea
+                      value={draftKey.certificate || ""}
+                      onChange={(e) =>
+                        setDraftKey({ ...draftKey, certificate: e.target.value })
+                      }
+                      placeholder={t("keychain.edit.certificatePlaceholder")}
+                      className="min-h-[60px] font-mono text-xs"
+                    />
+                  </div>
+                )}
+
+                {/* Passphrase section */}
+                <div className="space-y-2">
+                  <Label>{t('terminal.auth.passphrase')}</Label>
+                  <div className="relative">
+                    <Input
+                      type={showPassphrase ? 'text' : 'password'}
+                      value={draftKey.passphrase || ''}
+                      onChange={(e) =>
+                        setDraftKey({ ...draftKey, passphrase: e.target.value })
+                      }
+                      placeholder={t('keychain.generate.passphrasePlaceholder')}
+                      className="pr-10"
+                    />
+                    <Button
+                      variant="ghost"
+                      size="icon"
+                      className="absolute right-1 top-1/2 -translate-y-1/2 h-8 w-8"
+                      onClick={() => setShowPassphrase(!showPassphrase)}
+                    >
+                      {showPassphrase ? <EyeOff size={14} /> : <Eye size={14} />}
+                    </Button>
+                  </div>
+                  <div className="flex items-center gap-2">
+                    <input
+                      type="checkbox"
+                      id="editSavePassphrase"
+                      checked={draftKey.savePassphrase || false}
+                      onChange={(e) =>
+                        setDraftKey({ ...draftKey, savePassphrase: e.target.checked })
+                      }
+                      className="h-4 w-4 rounded border-border"
+                    />
+                    <Label htmlFor="editSavePassphrase" className="text-sm font-normal cursor-pointer">
+                      {t('keychain.generate.savePassphrase')}
+                    </Label>
+                  </div>
                 </div>
 
+                {/* Key Export section - only for managed keys */}
+                {draftKey.source !== 'reference' && (
+                  <div className="pt-4 mt-4 border-t border-border/60">
+                    <div className="flex items-center gap-2 mb-3">
+                      <span className="text-sm font-medium">
+                        {t("keychain.edit.keyExport")}
+                      </span>
+                      <div className="h-4 w-4 rounded-full bg-muted flex items-center justify-center">
+                        <Info size={10} className="text-muted-foreground" />
+                      </div>
+                    </div>
+                    <Button
+                      className="w-full h-11"
+                      onClick={() => openKeyExport(panel.key)}
+                    >
+                      {t("keychain.edit.exportToHost")}
+                    </Button>
+                  </div>
+                )}
+
                 {/* Save button */}
                 <Button
                   className="w-full h-11 mt-4"
                   disabled={
-                    !draftKey.label?.trim() || !draftKey.privateKey?.trim()
+                    !draftKey.label?.trim() ||
+                    (draftKey.source !== 'reference' && !draftKey.privateKey?.trim())
                   }
                   onClick={() => {
                     if (draftKey.id) {
@@ -1244,6 +1325,7 @@ echo $3 >> "$FILE"`);
               onBack={() => setShowHostSelector(false)}
               onContinue={() => setShowHostSelector(false)}
               availableKeys={keys}
+              proxyProfiles={proxyProfiles}
               managedSources={managedSources}
               onSaveHost={onSaveHost}
               onCreateGroup={onCreateGroup}

components/KnownHostConfirmDialog.tsx

@@ -1,113 +0,0 @@
-import { ShieldCheck } from 'lucide-react';
-import React from 'react';
-import { Host } from '../types';
-import { DistroAvatar } from './DistroAvatar';
-import { Button } from './ui/button';
-
-export interface HostKeyInfo {
-    hostname: string;
-    port: number;
-    keyType: string; // ssh-rsa, ssh-ed25519, ecdsa-sha2-nistp256, etc.
-    fingerprint: string; // SHA256 fingerprint
-    publicKey?: string; // Full public key
-}
-
-interface KnownHostConfirmDialogProps {
-    host: Host;
-    hostKeyInfo: HostKeyInfo;
-    onClose: () => void;
-    onContinue: () => void; // Continue without adding to known hosts
-    onAddAndContinue: () => void; // Add to known hosts and continue
-}
-
-const KnownHostConfirmDialog: React.FC<KnownHostConfirmDialogProps> = ({
-    host,
-    hostKeyInfo,
-    onClose,
-    onContinue,
-    onAddAndContinue,
-}) => {
-    return (
-        <div className="flex flex-col items-center justify-center h-full p-8 max-w-2xl mx-auto">
-            {/* Header with host info */}
-            <div className="flex items-center gap-3 mb-6">
-                <DistroAvatar host={host} fallback={host.label.slice(0, 2).toUpperCase()} className="h-12 w-12" />
-                <div>
-                    <h2 className="text-base font-semibold">{host.label}</h2>
-                    <p className="text-xs text-muted-foreground font-mono">
-                        SSH {host.hostname}:{host.port || 22}
-                    </p>
-                </div>
-                <Button variant="outline" size="sm" className="ml-4">
-                    Show logs
-                </Button>
-            </div>
-
-            {/* Progress indicator */}
-            <div className="flex items-center gap-3 w-full max-w-md mb-8">
-                <div className="h-8 w-8 rounded-full bg-primary text-primary-foreground flex items-center justify-center">
-                    <div className="h-2 w-2 rounded-full bg-primary-foreground" />
-                </div>
-                <div className="flex-1 h-0.5 bg-primary" />
-                <div className="h-8 w-8 rounded-full bg-primary/20 border-2 border-primary text-primary flex items-center justify-center">
-                    <ShieldCheck size={14} />
-                </div>
-                <div className="flex-1 h-0.5 bg-muted" />
-                <div className="h-8 w-8 rounded-full bg-muted text-muted-foreground flex items-center justify-center text-xs font-mono">
-                    {'>_'}
-                </div>
-            </div>
-
-            {/* Warning message */}
-            <div className="text-center mb-6">
-                <h3 className="text-lg font-semibold text-amber-500 mb-2">
-                    Are you sure you want to connect?
-                </h3>
-                <p className="text-sm text-muted-foreground">
-                    The authenticity of <span className="font-mono font-medium text-foreground">{hostKeyInfo.hostname}</span> can not be established.
-                </p>
-            </div>
-
-            {/* Fingerprint info */}
-            <div className="w-full max-w-md space-y-3 mb-8">
-                <div className="flex items-center gap-2 text-sm">
-                    <span className="text-muted-foreground">{hostKeyInfo.keyType} fingerprint is SHA256:</span>
-                </div>
-                <div className="bg-secondary/80 rounded-lg p-3 border border-border/60">
-                    <code className="text-sm font-mono text-foreground break-all">
-                        {hostKeyInfo.fingerprint}
-                    </code>
-                </div>
-                <p className="text-sm text-muted-foreground">
-                    Do you want to add it to the list of known hosts?
-                </p>
-            </div>
-
-            {/* Action buttons */}
-            <div className="flex items-center gap-3">
-                <Button
-                    variant="secondary"
-                    className="min-w-[100px]"
-                    onClick={onClose}
-                >
-                    Close
-                </Button>
-                <Button
-                    variant="outline"
-                    className="min-w-[100px]"
-                    onClick={onContinue}
-                >
-                    Continue
-                </Button>
-                <Button
-                    className="min-w-[140px]"
-                    onClick={onAddAndContinue}
-                >
-                    Add and continue
-                </Button>
-            </div>
-        </div>
-    );
-};
-
-export default KnownHostConfirmDialog;

components/KnownHostsManager.tsx

@@ -22,6 +22,7 @@ import React, {
 import { useI18n } from "../application/i18n/I18nProvider";
 import { useKnownHostsBackend } from "../application/state/useKnownHostsBackend";
 import { useStoredViewMode, ViewMode } from "../application/state/useStoredViewMode";
+import { fingerprintFromPublicKey } from "../domain/knownHosts";
 import { STORAGE_KEY_VAULT_KNOWN_HOSTS_VIEW_MODE } from "../infrastructure/config/storageKeys";
 import { logger } from "../lib/logger";
 import { cn } from "../lib/utils";
@@ -37,6 +38,7 @@ import { Dropdown, DropdownContent, DropdownTrigger } from "./ui/dropdown";
 import { Input } from "./ui/input";
 import { ScrollArea } from "./ui/scroll-area";
 import { SortDropdown, SortMode } from "./ui/sort-dropdown";
+import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip";
 import { toast } from "./ui/toast";
 
 interface KnownHostsManagerProps {
@@ -79,12 +81,20 @@ const parseKnownHostsFile = (content: string): KnownHost[] => {
         hostname = "(hashed)";
       }
 
+      const fullPublicKey = `${keyType} ${publicKey}`;
+      // Compute the fingerprint up front so the SSH host verifier can match
+      // against this record directly instead of re-deriving on every connect —
+      // the re-derivation path is where the false "fingerprint changed"
+      // warnings in #972 originated.
+      const fingerprint = fingerprintFromPublicKey(fullPublicKey);
+
       parsed.push({
         id: `kh-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
         hostname,
         port,
         keyType,
-        publicKey: publicKey.slice(0, 64) + "...",
+        publicKey: fullPublicKey,
+        fingerprint: fingerprint || undefined,
         discoveredAt: Date.now(),
       });
     } catch {
@@ -122,27 +132,35 @@ const HostItem = React.memo<HostItemProps>(
               {/* Quick action buttons on hover */}
               <div className="absolute top-1 right-1 flex gap-0.5 opacity-0 group-hover:opacity-100 transition-opacity">
                 {!converted && (
-                  <button
-                    className="p-1 rounded hover:bg-primary/20 text-primary"
-                    onClick={(e) => {
-                      e.stopPropagation();
-                      onConvertToHost(knownHost);
-                    }}
-                    title={t("action.convertToHost")}
-                  >
-                    <ArrowRight size={12} />
-                  </button>
+                  <Tooltip>
+                    <TooltipTrigger asChild>
+                      <button
+                        className="p-1 rounded hover:bg-primary/20 text-primary"
+                        onClick={(e) => {
+                          e.stopPropagation();
+                          onConvertToHost(knownHost);
+                        }}
+                      >
+                        <ArrowRight size={12} />
+                      </button>
+                    </TooltipTrigger>
+                    <TooltipContent>{t("action.convertToHost")}</TooltipContent>
+                  </Tooltip>
                 )}
-                <button
-                  className="p-1 rounded hover:bg-destructive/20 text-destructive"
-                  onClick={(e) => {
-                    e.stopPropagation();
-                    onDelete(knownHost.id);
-                  }}
-                  title={t("action.remove")}
-                >
-                  <Trash2 size={12} />
-                </button>
+                <Tooltip>
+                  <TooltipTrigger asChild>
+                    <button
+                      className="p-1 rounded hover:bg-destructive/20 text-destructive"
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        onDelete(knownHost.id);
+                      }}
+                    >
+                      <Trash2 size={12} />
+                    </button>
+                  </TooltipTrigger>
+                  <TooltipContent>{t("action.remove")}</TooltipContent>
+                </Tooltip>
               </div>
               <div className="flex items-center gap-3 h-full">
                 <div className="h-11 w-11 rounded-xl bg-primary/10 text-primary flex items-center justify-center flex-shrink-0">
@@ -193,18 +211,22 @@ const HostItem = React.memo<HostItemProps>(
             </div>
             <div className="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity">
               {!converted && (
-                <Button
-                  variant="ghost"
-                  size="icon"
-                  className="h-8 w-8"
-                  onClick={(e) => {
-                    e.stopPropagation();
-                    onConvertToHost(knownHost);
-                  }}
-                  title={t("action.convertToHost")}
-                >
-                  <ArrowRight size={14} />
-                </Button>
+                <Tooltip>
+                  <TooltipTrigger asChild>
+                    <Button
+                      variant="ghost"
+                      size="icon"
+                      className="h-8 w-8"
+                      onClick={(e) => {
+                        e.stopPropagation();
+                        onConvertToHost(knownHost);
+                      }}
+                    >
+                      <ArrowRight size={14} />
+                    </Button>
+                  </TooltipTrigger>
+                  <TooltipContent>{t("action.convertToHost")}</TooltipContent>
+                </Tooltip>
               )}
             </div>
           </div>
@@ -455,7 +477,7 @@ const KnownHostsManager: React.FC<KnownHostsManagerProps> = ({
   return (
     <div className="h-full flex flex-col">
       {/* Header */}
-      <div className="flex items-center gap-3 px-4 py-3 border-b border-border/50 bg-secondary/50">
+      <div className="h-14 px-4 py-2 flex items-center gap-3 border-b border-border/50 bg-secondary/80 supports-[backdrop-filter]:backdrop-blur-sm">
         <div className="flex-1 min-w-0 flex items-center gap-2">
           <div className="relative flex-1 max-w-xs">
             <Search
@@ -464,7 +486,7 @@ const KnownHostsManager: React.FC<KnownHostsManagerProps> = ({
             />
             <Input
               placeholder={t("knownHosts.search.placeholder")}
-              className="pl-9 h-9 bg-background border-border/60 text-sm"
+              className="pl-9 h-10 bg-secondary border-border/60 text-sm"
               value={search}
               onChange={(e) => setSearch(e.target.value)}
             />
@@ -474,7 +496,7 @@ const KnownHostsManager: React.FC<KnownHostsManagerProps> = ({
           {/* View Mode Toggle */}
           <Dropdown>
             <DropdownTrigger asChild>
-              <Button variant="ghost" size="icon" className="h-9 w-9">
+              <Button variant="ghost" size="icon" className="h-10 w-10">
                 {viewMode === "grid" ? (
                   <LayoutGrid size={16} />
                 ) : (
@@ -505,15 +527,14 @@ const KnownHostsManager: React.FC<KnownHostsManagerProps> = ({
           <SortDropdown
             value={sortMode}
             onChange={setSortMode}
-            className="h-9 w-9"
+            className="h-10 w-10"
           />
         </div>
         <div className="w-px h-5 bg-border/50" />
         <div className="flex items-center gap-2">
           <Button
-            variant="ghost"
-            size="sm"
-            className="h-9 px-3 text-xs"
+            variant="secondary"
+            className="h-10 px-3 bg-foreground/5 text-foreground hover:bg-foreground/10 border-border/40"
             onClick={() => handleScanSystem()}
             disabled={isScanning}
           >
@@ -532,8 +553,7 @@ const KnownHostsManager: React.FC<KnownHostsManagerProps> = ({
           />
           <Button
             variant="secondary"
-            size="sm"
-            className="h-9 px-3 text-xs"
+            className="h-10 px-3 bg-foreground/5 text-foreground hover:bg-foreground/10 border-border/40"
             onClick={openFilePicker}
           >
             <Import size={14} className="mr-2" />

components/LogView.tsx

@@ -36,19 +36,35 @@ const LogViewComponent: React.FC<LogViewProps> = ({
     const [isReady, setIsReady] = useState(false);
     const [themeModalOpen, setThemeModalOpen] = useState(false);
     const [isExporting, setIsExporting] = useState(false);
+    const [previewTheme, setPreviewTheme] = useState<TerminalTheme | null>(null);
 
     // Subscribe to custom theme changes so editing triggers re-render
     const customThemes = useCustomThemes();
+    const explicitThemeId = useMemo(() => {
+        if (!log.themeId) return undefined;
+        const exists = TERMINAL_THEMES.some((theme) => theme.id === log.themeId)
+            || customThemes.some((theme) => theme.id === log.themeId);
+        return exists ? log.themeId : undefined;
+    }, [customThemes, log.themeId]);
+
+    useEffect(() => {
+        if (log.themeId && !explicitThemeId) {
+            onUpdateLog(log.id, { themeId: undefined });
+        }
+    }, [explicitThemeId, log.id, log.themeId, onUpdateLog]);
 
     // Use log's saved theme/fontSize or fall back to defaults
     const currentTheme = useMemo(() => {
-        if (log.themeId) {
-            return TERMINAL_THEMES.find(t => t.id === log.themeId)
-                || customThemes.find(t => t.id === log.themeId)
+        if (previewTheme) {
+            return previewTheme;
+        }
+        if (explicitThemeId) {
+            return TERMINAL_THEMES.find(t => t.id === explicitThemeId)
+                || customThemes.find(t => t.id === explicitThemeId)
                 || defaultTerminalTheme;
         }
         return defaultTerminalTheme;
-    }, [log.themeId, defaultTerminalTheme, customThemes]);
+    }, [customThemes, defaultTerminalTheme, explicitThemeId, previewTheme]);
 
     const currentFontSize = log.fontSize ?? defaultFontSize;
 
@@ -69,6 +85,12 @@ const LogViewComponent: React.FC<LogViewProps> = ({
         onUpdateLog(log.id, { themeId });
     }, [log.id, onUpdateLog]);
 
+    useEffect(() => {
+        if (!themeModalOpen) {
+            setPreviewTheme(null);
+        }
+    }, [themeModalOpen]);
+
     // Handle font size change
     const handleFontSizeChange = useCallback((fontSize: number) => {
         onUpdateLog(log.id, { fontSize });
@@ -255,7 +277,6 @@ const LogViewComponent: React.FC<LogViewProps> = ({
                             className="gap-1.5 h-8 px-2"
                             onClick={handleExport}
                             disabled={isExporting}
-                            title={t("logView.export")}
                         >
                             <Download size={14} />
                             <span className="text-xs">{t("logView.export")}</span>
@@ -268,7 +289,6 @@ const LogViewComponent: React.FC<LogViewProps> = ({
                         size="sm"
                         className="gap-1.5 h-8 px-2"
                         onClick={() => setThemeModalOpen(true)}
-                        title={t("logView.customizeAppearance")}
                     >
                         <Palette size={14} />
                         <span className="text-xs">{t("logView.appearance")}</span>
@@ -295,10 +315,13 @@ const LogViewComponent: React.FC<LogViewProps> = ({
             <ThemeCustomizeModal
                 open={themeModalOpen}
                 onClose={() => setThemeModalOpen(false)}
-                currentThemeId={currentTheme.id}
+                currentThemeId={explicitThemeId}
+                displayThemeId={currentTheme.id}
                 currentFontSize={currentFontSize}
                 onThemeChange={handleThemeChange}
+                onThemeReset={() => onUpdateLog(log.id, { themeId: undefined })}
                 onFontSizeChange={handleFontSizeChange}
+                onPreviewThemeChange={setPreviewTheme}
             />
         </div>
     );

components/PassphraseModal.tsx

@@ -25,7 +25,7 @@ export interface PassphraseRequest {
 
 interface PassphraseModalProps {
   request: PassphraseRequest | null;
-  onSubmit: (requestId: string, passphrase: string) => void;
+  onSubmit: (requestId: string, passphrase: string, remember: boolean) => void;
   onCancel: (requestId: string) => void;
   onSkip?: (requestId: string) => void;
 }
@@ -40,6 +40,7 @@ export const PassphraseModal: React.FC<PassphraseModalProps> = ({
   const [passphrase, setPassphrase] = useState("");
   const [showPassphrase, setShowPassphrase] = useState(false);
   const [isSubmitting, setIsSubmitting] = useState(false);
+  const [rememberPassphrase, setRememberPassphrase] = useState(true);
 
   // Reset state when request changes
   useEffect(() => {
@@ -47,14 +48,15 @@ export const PassphraseModal: React.FC<PassphraseModalProps> = ({
       setPassphrase("");
       setShowPassphrase(false);
       setIsSubmitting(false);
+      setRememberPassphrase(true);
     }
   }, [request]);
 
   const handleSubmit = useCallback(() => {
     if (!request || isSubmitting || !passphrase) return;
     setIsSubmitting(true);
-    onSubmit(request.requestId, passphrase);
-  }, [request, passphrase, onSubmit, isSubmitting]);
+    onSubmit(request.requestId, passphrase, rememberPassphrase);
+  }, [request, passphrase, onSubmit, isSubmitting, rememberPassphrase]);
 
   const handleCancel = useCallback(() => {
     if (!request) return;
@@ -82,15 +84,15 @@ export const PassphraseModal: React.FC<PassphraseModalProps> = ({
 
   return (
     <Dialog open={!!request} onOpenChange={(open) => !open && handleCancel()}>
-      <DialogContent className="sm:max-w-[425px]" hideCloseButton>
+      <DialogContent className="sm:max-w-[500px]" hideCloseButton>
         <DialogHeader>
           <div className="flex items-center gap-3 mb-2">
             <div className="h-10 w-10 rounded-full bg-primary/10 flex items-center justify-center">
               <KeyRound className="h-5 w-5 text-primary" />
             </div>
-            <div>
+            <div className="min-w-0 flex-1">
               <DialogTitle>{t("passphrase.title")}</DialogTitle>
-              <DialogDescription className="mt-1">
+              <DialogDescription className="mt-1 break-words">
                 {request.hostname
                   ? t("passphrase.descWithHost", { keyName: keyDisplayName, hostname: request.hostname })
                   : t("passphrase.desc", { keyName: keyDisplayName })}
@@ -125,9 +127,21 @@ export const PassphraseModal: React.FC<PassphraseModalProps> = ({
                 {showPassphrase ? <EyeOff size={16} /> : <Eye size={16} />}
               </button>
             </div>
-            <p className="text-xs text-muted-foreground">
-              {t("passphrase.keyPath")}: <code className="text-xs">{request.keyPath}</code>
+            <p className="text-xs text-muted-foreground break-all">
+              {t("passphrase.keyPath")}: <code className="text-xs break-all">{request.keyPath}</code>
             </p>
+            <label className="flex items-center gap-2 cursor-pointer select-none mt-2">
+              <input
+                type="checkbox"
+                checked={rememberPassphrase}
+                onChange={(e) => setRememberPassphrase(e.target.checked)}
+                disabled={isSubmitting}
+                className="accent-primary"
+              />
+              <span className="text-xs text-muted-foreground">
+                {t("passphrase.remember")}
+              </span>
+            </label>
           </div>
         </div>
 

components/PortForwardingNew.tsx

@@ -10,7 +10,7 @@ import {
   Shuffle,
   Zap,
 } from "lucide-react";
-import React, { useCallback, useState } from "react";
+import React, { useCallback, useMemo, useState } from "react";
 import { useI18n } from "../application/i18n/I18nProvider";
 import { usePortForwardingState } from "../application/state/usePortForwardingState";
 import {
@@ -19,9 +19,11 @@ import {
   ManagedSource,
   PortForwardingRule,
   PortForwardingType,
+  ProxyProfile,
   SSHKey,
 } from "../domain/models";
 import { resolveGroupDefaults, applyGroupDefaults } from "../domain/groupConfig";
+import { materializeHostProxyProfile } from "../domain/proxyProfiles";
 import { cn } from "../lib/utils";
 import SelectHostPanel from "./SelectHostPanel";
 import {
@@ -69,9 +71,11 @@ interface PortForwardingProps {
   customGroups: string[];
   managedSources?: ManagedSource[];
   groupConfigs?: GroupConfig[];
+  proxyProfiles?: ProxyProfile[];
   onNewHost?: () => void;
   onSaveHost?: (host: Host) => void;
   onCreateGroup?: (groupPath: string) => void;
+  terminalSettings?: { keepaliveInterval: number; keepaliveCountMax: number };
 }
 
 const PortForwarding: React.FC<PortForwardingProps> = ({
@@ -81,9 +85,11 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
   customGroups: _customGroups,
   managedSources = [],
   groupConfigs = [],
+  proxyProfiles = [],
   onNewHost: _onNewHost,
   onSaveHost,
   onCreateGroup: _onCreateGroup,
+  terminalSettings,
 }) => {
   const { t } = useI18n();
   const {
@@ -113,6 +119,20 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
   const [pendingOperations, setPendingOperations] = useState<Set<string>>(
     new Set(),
   );
+  const proxyProfileIdSet = useMemo(
+    () => new Set(proxyProfiles.map((profile) => profile.id)),
+    [proxyProfiles],
+  );
+
+  const resolveEffectiveHost = useCallback(
+    (host: Host): Host => {
+      const withGroupDefaults = host.group
+        ? applyGroupDefaults(host, resolveGroupDefaults(host.group, groupConfigs, { validProxyProfileIds: proxyProfileIdSet }), { validProxyProfileIds: proxyProfileIdSet })
+        : applyGroupDefaults(host, {}, { validProxyProfileIds: proxyProfileIdSet });
+      return materializeHostProxyProfile(withGroupDefaults, proxyProfiles);
+    },
+    [groupConfigs, proxyProfileIdSet, proxyProfiles],
+  );
 
   // Start a port forwarding tunnel
   const handleStartTunnel = useCallback(
@@ -127,9 +147,8 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
         return;
       }
 
-      const _host = _rawHost.group
-        ? applyGroupDefaults(_rawHost, resolveGroupDefaults(_rawHost.group, groupConfigs))
-        : _rawHost;
+      const _host = resolveEffectiveHost(_rawHost);
+      const effectiveHosts = hosts.map((host) => resolveEffectiveHost(host));
 
       setPendingOperations((prev) => new Set([...prev, rule.id]));
       let errorShown = false;
@@ -138,7 +157,7 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
         const result = await startTunnel(
           rule,
           _host,
-          hosts,
+          effectiveHosts,
           keys,
           identities,
           (status, error) => {
@@ -152,6 +171,7 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
             }
           },
           rule.autoStart, // Enable reconnect for auto-start rules
+          terminalSettings,
         );
         // Show error from result only if not already shown
         if (!result.success && result.error && !errorShown) {
@@ -169,7 +189,7 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
         });
       }
     },
-    [hosts, identities, keys, groupConfigs, setRuleStatus, startTunnel, t],
+    [hosts, identities, keys, resolveEffectiveHost, setRuleStatus, startTunnel, t, terminalSettings],
   );
 
   // Stop a port forwarding tunnel
@@ -567,10 +587,13 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
         )}
       >
         {/* Toolbar */}
-        <div className="h-14 px-4 flex items-center gap-3 bg-secondary/60 border-b border-border/60 relative z-20">
+        <div className="h-14 px-4 py-2 flex items-center gap-3 bg-secondary/80 supports-[backdrop-filter]:backdrop-blur-sm border-b border-border/50 relative z-20">
           <Dropdown open={showNewMenu} onOpenChange={setShowNewMenu}>
             <DropdownTrigger asChild>
-              <Button variant="secondary" className="h-9 px-3 gap-2">
+              <Button
+                variant="secondary"
+                className="h-10 px-3 gap-2 bg-foreground/5 text-foreground hover:bg-foreground/10 border-border/40"
+              >
                 <Zap size={14} />
                 {t("pf.action.newForwarding")}
                 <ChevronDown
@@ -618,7 +641,7 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
               />
               <Input
                 placeholder={t("common.searchPlaceholder")}
-                className="h-9 pl-8 w-44"
+                className="h-10 pl-9 w-44 bg-secondary border-border/60 text-sm"
                 value={search}
                 onChange={(e) => setSearch(e.target.value)}
               />
@@ -627,7 +650,7 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
             {/* View mode toggle */}
             <Dropdown>
               <DropdownTrigger asChild>
-                <Button variant="ghost" size="icon" className="h-9 w-9">
+                <Button variant="ghost" size="icon" className="h-10 w-10">
                   {viewMode === "grid" ? (
                     <LayoutGrid size={16} />
                   ) : (
@@ -664,7 +687,7 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
             <SortDropdown
               value={sortMode}
               onChange={setSortMode}
-              className="h-9 w-9"
+              className="h-10 w-10"
             />
           </div>
         </div>
@@ -850,6 +873,7 @@ const PortForwarding: React.FC<PortForwardingProps> = ({
           onContinue={() => setShowHostSelector(false)}
           availableKeys={keys}
           identities={identities}
+          proxyProfiles={proxyProfiles}
           managedSources={managedSources}
           onSaveHost={onSaveHost}
           onCreateGroup={_onCreateGroup}

components/ProxyPanel.test.tsx

@@ -0,0 +1,80 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+import React from "react";
+import { renderToStaticMarkup } from "react-dom/server";
+
+import { I18nProvider } from "../application/i18n/I18nProvider.tsx";
+import type { ProxyProfile } from "../types.ts";
+import { ProxyPanel } from "./host-details/ProxyPanel.tsx";
+
+const proxyProfile: ProxyProfile = {
+  id: "proxy-1",
+  label: "Office Proxy",
+  config: {
+    type: "socks5",
+    host: "office-proxy.example.com",
+    port: 1080,
+  },
+  createdAt: 1,
+};
+
+const renderPanel = (props: Partial<React.ComponentProps<typeof ProxyPanel>> = {}) =>
+  renderToStaticMarkup(
+    React.createElement(
+      I18nProvider,
+      { locale: "en" },
+      React.createElement(ProxyPanel, {
+        proxyConfig: undefined,
+        proxyProfiles: [],
+        selectedProxyProfileId: undefined,
+        onUpdateProxy: () => {},
+        onSelectProxyProfile: () => {},
+        onClearProxy: () => {},
+        onBack: () => {},
+        onCancel: () => {},
+        layout: "inline",
+        ...props,
+      }),
+    ),
+  );
+
+test("ProxyPanel shows saved proxy selection when reusable profiles exist", () => {
+  const markup = renderPanel({
+    proxyProfiles: [proxyProfile],
+    selectedProxyProfileId: proxyProfile.id,
+  });
+
+  assert.match(markup, /Saved proxy/);
+  assert.match(markup, /office-proxy\.example\.com:1080/);
+  assert.doesNotMatch(markup, /Proxy host/);
+});
+
+test("ProxyPanel keeps manual proxy fields available without a saved profile selection", () => {
+  const markup = renderPanel({
+    proxyProfiles: [proxyProfile],
+    proxyConfig: { type: "http", host: "manual-proxy.example.com", port: 3128 },
+  });
+
+  assert.match(markup, /Saved proxy/);
+  assert.match(markup, /Proxy host/);
+  assert.match(markup, /manual-proxy\.example\.com/);
+});
+
+test("ProxyPanel shows a clear missing state for stale saved proxy selections", () => {
+  const markup = renderPanel({
+    proxyProfiles: [proxyProfile],
+    selectedProxyProfileId: "missing-proxy",
+  });
+
+  assert.match(markup, /Missing saved proxy/);
+  assert.match(markup, /Proxy host/);
+});
+
+test("ProxyPanel disables saving invalid manual proxy ports", () => {
+  const markup = renderPanel({
+    proxyConfig: { type: "http", host: "manual-proxy.example.com", port: 65536 },
+  });
+
+  assert.match(markup, /Port must be between 1 and 65535/);
+  assert.match(markup, /disabled=""/);
+});

components/ProxyProfilesManager.test.tsx

@@ -0,0 +1,85 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+import React from "react";
+import { renderToStaticMarkup } from "react-dom/server";
+
+import { I18nProvider } from "../application/i18n/I18nProvider.tsx";
+import { isValidProxyPort } from "../domain/proxyProfiles.ts";
+import { STORAGE_KEY_VAULT_PROXY_PROFILES_VIEW_MODE } from "../infrastructure/config/storageKeys.ts";
+import type { ProxyProfile } from "../types.ts";
+import { ProxyProfilesManager } from "./ProxyProfilesManager.tsx";
+
+const proxyProfile: ProxyProfile = {
+  id: "proxy-1",
+  label: "Office Proxy",
+  config: {
+    type: "http",
+    host: "127.0.0.1",
+    port: 8080,
+  },
+  createdAt: 1,
+};
+
+const installStorageStub = (viewMode: string | null = null) => {
+  const values = new Map<string, string>();
+  if (viewMode) {
+    values.set(STORAGE_KEY_VAULT_PROXY_PROFILES_VIEW_MODE, viewMode);
+  }
+
+  Object.defineProperty(globalThis, "localStorage", {
+    configurable: true,
+    value: {
+      getItem: (key: string) => values.get(key) ?? null,
+      setItem: (key: string, value: string) => {
+        values.set(key, value);
+      },
+      removeItem: (key: string) => {
+        values.delete(key);
+      },
+    },
+  });
+};
+
+const renderManager = (viewMode: string | null = null) => {
+  installStorageStub(viewMode);
+  return renderToStaticMarkup(
+    React.createElement(
+      I18nProvider,
+      { locale: "en" },
+      React.createElement(ProxyProfilesManager, {
+        proxyProfiles: [proxyProfile],
+        hosts: [],
+        groupConfigs: [],
+        onUpdateProxyProfiles: () => {},
+        onUpdateHosts: () => {},
+        onUpdateGroupConfigs: () => {},
+      }),
+    ),
+  );
+};
+
+test("ProxyProfilesManager uses the shared Vault grid card style by default", () => {
+  const markup = renderManager();
+
+  assert.match(markup, /Add Proxy/);
+  assert.match(markup, /aria-label="Search proxies…"/);
+  assert.match(markup, /aria-label="Office Proxy, HTTP, 127\.0\.0\.1:8080, 0 linked"/);
+  assert.match(markup, /Office Proxy/);
+  assert.match(markup, /127\.0\.0\.1:8080/);
+});
+
+test("ProxyProfilesManager uses the shared Vault list row style when persisted", () => {
+  const markup = renderManager("list");
+
+  assert.match(markup, /aria-label="Office Proxy, HTTP, 127\.0\.0\.1:8080, 0 linked"/);
+  assert.match(markup, /Office Proxy/);
+  assert.match(markup, /127\.0\.0\.1:8080/);
+});
+
+test("ProxyProfilesManager validates proxy ports", () => {
+  assert.equal(isValidProxyPort(1), true);
+  assert.equal(isValidProxyPort(65535), true);
+  assert.equal(isValidProxyPort(0), false);
+  assert.equal(isValidProxyPort(65536), false);
+  assert.equal(isValidProxyPort(10.5), false);
+});

components/ProxyProfilesManager.tsx

@@ -0,0 +1,538 @@
+import {
+  AlertTriangle,
+  Check,
+  ChevronDown,
+  Copy,
+  Globe,
+  KeyRound,
+  LayoutGrid,
+  List as ListIcon,
+  Pencil,
+  Plus,
+  Search,
+  Settings2,
+  Trash2,
+} from "lucide-react";
+import React, { useMemo, useState } from "react";
+import { useI18n } from "../application/i18n/I18nProvider";
+import { useStoredViewMode } from "../application/state/useStoredViewMode";
+import { isValidProxyPort, removeProxyProfileReferences } from "../domain/proxyProfiles";
+import {
+  STORAGE_KEY_VAULT_PROXY_PROFILES_VIEW_MODE,
+} from "../infrastructure/config/storageKeys";
+import { cn } from "../lib/utils";
+import type { GroupConfig, Host, ProxyConfig, ProxyProfile } from "../types";
+import {
+  AsidePanel,
+  AsidePanelContent,
+  AsidePanelFooter,
+} from "./ui/aside-panel";
+import { Badge } from "./ui/badge";
+import { Button } from "./ui/button";
+import { Card } from "./ui/card";
+import {
+  ContextMenu,
+  ContextMenuContent,
+  ContextMenuItem,
+  ContextMenuSeparator,
+  ContextMenuTrigger,
+} from "./ui/context-menu";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "./ui/dialog";
+import { Dropdown, DropdownContent, DropdownTrigger } from "./ui/dropdown";
+import { Input } from "./ui/input";
+import { toast } from "./ui/toast";
+
+interface ProxyProfilesManagerProps {
+  proxyProfiles: ProxyProfile[];
+  hosts: Host[];
+  groupConfigs: GroupConfig[];
+  onUpdateProxyProfiles: (profiles: ProxyProfile[]) => void;
+  onUpdateHosts: (hosts: Host[]) => void;
+  onUpdateGroupConfigs: (configs: GroupConfig[]) => void;
+}
+
+const createDraftProfile = (): ProxyProfile => {
+  const now = Date.now();
+  return {
+    id: crypto.randomUUID(),
+    label: "",
+    config: {
+      type: "http",
+      host: "",
+      port: 8080,
+    },
+    createdAt: now,
+    updatedAt: now,
+  };
+};
+
+const getProfileUsageCount = (
+  profileId: string,
+  hosts: Host[],
+  groupConfigs: GroupConfig[],
+): number =>
+  hosts.filter((host) => host.proxyProfileId === profileId).length +
+  groupConfigs.filter((config) => config.proxyProfileId === profileId).length;
+
+type ProxyProfilesViewMode = "grid" | "list";
+
+interface ProxyProfileCardProps {
+  profile: ProxyProfile;
+  usageCount: number;
+  viewMode: ProxyProfilesViewMode;
+  isSelected: boolean;
+  onClick: () => void;
+  onEdit: () => void;
+  onDuplicate: () => void;
+  onDelete: () => void;
+}
+
+const ProxyProfileCard: React.FC<ProxyProfileCardProps> = ({
+  profile,
+  usageCount,
+  viewMode,
+  isSelected,
+  onClick,
+  onEdit,
+  onDuplicate,
+  onDelete,
+}) => {
+  const { t } = useI18n();
+  const usageLabel = t("proxyProfiles.usage", { count: usageCount });
+  const accessibleLabel = `${profile.label}, ${profile.config.type.toUpperCase()}, ${profile.config.host}:${profile.config.port}, ${usageLabel}`;
+
+  return (
+    <ContextMenu>
+      <ContextMenuTrigger asChild>
+        <button
+          type="button"
+          aria-label={accessibleLabel}
+          className={cn(
+            "group w-full text-left focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none",
+            viewMode === "grid"
+              ? "soft-card elevate rounded-xl h-[68px] px-3 py-2"
+              : "h-14 px-3 py-2 hover:bg-secondary/60 rounded-lg transition-colors",
+            isSelected && "ring-2 ring-primary",
+          )}
+          onClick={onClick}
+        >
+          <div className="flex items-center gap-3 h-full">
+            <div className="h-11 w-11 rounded-xl bg-primary/15 text-primary flex items-center justify-center">
+              <Globe size={18} />
+            </div>
+            <div className="min-w-0 flex-1">
+              <div className="flex items-center gap-2 min-w-0">
+                <div className="text-sm font-semibold truncate">{profile.label}</div>
+                <Badge variant="secondary" className="text-[10px] shrink-0">
+                  {profile.config.type.toUpperCase()}
+                </Badge>
+              </div>
+              <div className="text-[11px] font-mono text-muted-foreground truncate">
+                {profile.config.host}:{profile.config.port} -{" "}
+                {usageLabel}
+              </div>
+            </div>
+          </div>
+        </button>
+      </ContextMenuTrigger>
+      <ContextMenuContent>
+        <ContextMenuItem onClick={onEdit}>
+          <Pencil size={14} className="mr-2" />
+          {t("action.edit")}
+        </ContextMenuItem>
+        <ContextMenuItem onClick={onDuplicate}>
+          <Copy size={14} className="mr-2" />
+          {t("action.duplicate")}
+        </ContextMenuItem>
+        <ContextMenuSeparator />
+        <ContextMenuItem onClick={onDelete} className="text-destructive focus:text-destructive">
+          <Trash2 size={14} className="mr-2" />
+          {t("action.delete")}
+        </ContextMenuItem>
+      </ContextMenuContent>
+    </ContextMenu>
+  );
+};
+
+export const ProxyProfilesManager: React.FC<ProxyProfilesManagerProps> = ({
+  proxyProfiles,
+  hosts,
+  groupConfigs,
+  onUpdateProxyProfiles,
+  onUpdateHosts,
+  onUpdateGroupConfigs,
+}) => {
+  const { t } = useI18n();
+  const [search, setSearch] = useState("");
+  const [viewMode, setViewMode] = useStoredViewMode(
+    STORAGE_KEY_VAULT_PROXY_PROFILES_VIEW_MODE,
+    "grid",
+  );
+  const proxyProfilesViewMode: ProxyProfilesViewMode =
+    viewMode === "list" ? "list" : "grid";
+  const [draft, setDraft] = useState<ProxyProfile | null>(null);
+  const [deleteTarget, setDeleteTarget] = useState<ProxyProfile | null>(null);
+
+  const usageByProfileId = useMemo(() => {
+    const map = new Map<string, number>();
+    for (const profile of proxyProfiles) {
+      map.set(profile.id, getProfileUsageCount(profile.id, hosts, groupConfigs));
+    }
+    return map;
+  }, [groupConfigs, hosts, proxyProfiles]);
+
+  const filteredProfiles = useMemo(() => {
+    const q = search.trim().toLowerCase();
+    if (!q) return proxyProfiles;
+    return proxyProfiles.filter((profile) =>
+      profile.label.toLowerCase().includes(q) ||
+      profile.config.host.toLowerCase().includes(q) ||
+      profile.config.type.toLowerCase().includes(q),
+    );
+  }, [proxyProfiles, search]);
+
+  const updateDraftConfig = (field: keyof ProxyConfig, value: string | number) => {
+    setDraft((prev) => {
+      if (!prev) return prev;
+      return {
+        ...prev,
+        config: {
+          ...prev.config,
+          [field]: value,
+        },
+      };
+    });
+  };
+
+  const openCreate = () => {
+    setDraft(createDraftProfile());
+  };
+
+  const openEdit = (profile: ProxyProfile) => {
+    setDraft({
+      ...profile,
+      config: { ...profile.config },
+    });
+  };
+
+  const duplicateProfile = (profile: ProxyProfile) => {
+    const now = Date.now();
+    onUpdateProxyProfiles([
+      ...proxyProfiles,
+      {
+        ...profile,
+        id: crypto.randomUUID(),
+        label: t("proxyProfiles.copyName", { name: profile.label }),
+        config: { ...profile.config },
+        createdAt: now,
+        updatedAt: now,
+      },
+    ]);
+  };
+
+  const saveDraft = () => {
+    if (!draft) return;
+    const label = draft.label.trim();
+    const host = draft.config.host.trim();
+    if (!label || !host || !draft.config.port) {
+      toast.error(t("proxyProfiles.error.required"));
+      return;
+    }
+    if (!isValidProxyPort(draft.config.port)) {
+      toast.error(t("proxyProfiles.error.port"));
+      return;
+    }
+
+    const saved: ProxyProfile = {
+      ...draft,
+      label,
+      config: {
+        ...draft.config,
+        host,
+        port: Number(draft.config.port),
+        username: draft.config.username?.trim() || undefined,
+        password: draft.config.password || undefined,
+      },
+      updatedAt: Date.now(),
+    };
+
+    onUpdateProxyProfiles(
+      proxyProfiles.some((profile) => profile.id === saved.id)
+        ? proxyProfiles.map((profile) => profile.id === saved.id ? saved : profile)
+        : [...proxyProfiles, saved],
+    );
+    setDraft(null);
+  };
+
+  const confirmDelete = () => {
+    if (!deleteTarget) return;
+    const cleaned = removeProxyProfileReferences(deleteTarget.id, {
+      hosts,
+      groupConfigs,
+    });
+    onUpdateProxyProfiles(proxyProfiles.filter((profile) => profile.id !== deleteTarget.id));
+    onUpdateHosts(cleaned.hosts);
+    onUpdateGroupConfigs(cleaned.groupConfigs);
+    if (draft?.id === deleteTarget.id) {
+      setDraft(null);
+    }
+    setDeleteTarget(null);
+  };
+
+  return (
+    <div className="h-full flex relative">
+      <div className={cn("flex-1 flex flex-col min-h-0 transition-all duration-200", draft && "mr-[380px]")}>
+        <header className="border-b border-border/50 bg-secondary/80 supports-[backdrop-filter]:backdrop-blur-sm shrink-0">
+          <div className="h-14 px-4 py-2 flex items-center gap-3">
+            <Button
+              onClick={openCreate}
+              variant="secondary"
+              className="h-10 px-3 gap-2 bg-foreground/5 text-foreground hover:bg-foreground/10 border-border/40"
+            >
+              <Plus size={14} />
+              {t("proxyProfiles.action.add")}
+            </Button>
+            <div className="ml-auto flex items-center gap-2 min-w-0 flex-shrink">
+              <div className="relative flex-shrink min-w-[100px]">
+                <Search size={14} className="absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground" />
+                <Input
+                  aria-label={t("proxyProfiles.search.placeholder")}
+                  value={search}
+                  onChange={(event) => setSearch(event.target.value)}
+                  placeholder={t("proxyProfiles.search.placeholder")}
+                  className="h-10 pl-9 w-full bg-secondary border-border/60 text-sm"
+                />
+              </div>
+              <Dropdown>
+                <DropdownTrigger asChild>
+                  <Button
+                    aria-label={t("proxyProfiles.viewMode")}
+                    variant="ghost"
+                    size="icon"
+                    className="h-10 w-10 flex-shrink-0"
+                  >
+                    {proxyProfilesViewMode === "grid" ? (
+                      <LayoutGrid size={16} />
+                    ) : (
+                      <ListIcon size={16} />
+                    )}
+                    <ChevronDown size={10} className="ml-0.5" />
+                  </Button>
+                </DropdownTrigger>
+                <DropdownContent className="w-32" align="end">
+                  <Button
+                    variant={proxyProfilesViewMode === "grid" ? "secondary" : "ghost"}
+                    className="w-full justify-start gap-2 h-9"
+                    onClick={() => setViewMode("grid")}
+                  >
+                    <LayoutGrid size={14} /> {t("vault.view.grid")}
+                  </Button>
+                  <Button
+                    variant={proxyProfilesViewMode === "list" ? "secondary" : "ghost"}
+                    className="w-full justify-start gap-2 h-9"
+                    onClick={() => setViewMode("list")}
+                  >
+                    <ListIcon size={14} /> {t("vault.view.list")}
+                  </Button>
+                </DropdownContent>
+              </Dropdown>
+            </div>
+          </div>
+        </header>
+
+        <div className="flex-1 overflow-y-auto">
+          <div className="space-y-3 p-3">
+            <div className="flex items-center justify-between">
+              <h2 className="text-base font-semibold text-muted-foreground">
+                {t("proxyProfiles.section.proxies")}
+              </h2>
+              <span className="text-xs text-muted-foreground">
+                {t("proxyProfiles.count.items", { count: filteredProfiles.length })}
+              </span>
+            </div>
+
+            {filteredProfiles.length === 0 ? (
+              <div className="flex flex-col items-center justify-center h-64 text-muted-foreground">
+                <div className="h-16 w-16 rounded-2xl bg-secondary/80 flex items-center justify-center mb-4">
+                  <Globe size={32} className="opacity-60" />
+                </div>
+                <h3 className="text-lg font-semibold text-foreground mb-2">
+                  {t("proxyProfiles.empty.title")}
+                </h3>
+                <p className="text-sm text-center max-w-sm mb-4">
+                  {t("proxyProfiles.empty.desc")}
+                </p>
+                <Button onClick={openCreate}>
+                  <Plus size={14} className="mr-2" />
+                  {t("proxyProfiles.action.add")}
+                </Button>
+              </div>
+            ) : (
+              <div
+                className={
+                  proxyProfilesViewMode === "grid"
+                    ? "grid gap-3 grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4"
+                    : "flex flex-col gap-0"
+                }
+              >
+                {filteredProfiles.map((profile) => (
+                  <ProxyProfileCard
+                    key={profile.id}
+                    profile={profile}
+                    usageCount={usageByProfileId.get(profile.id) ?? 0}
+                    viewMode={proxyProfilesViewMode}
+                    isSelected={draft?.id === profile.id}
+                    onClick={() => openEdit(profile)}
+                    onEdit={() => openEdit(profile)}
+                    onDuplicate={() => duplicateProfile(profile)}
+                    onDelete={() => setDeleteTarget(profile)}
+                  />
+                ))}
+              </div>
+            )}
+          </div>
+        </div>
+      </div>
+
+      {draft && (
+        <AsidePanel
+          open={true}
+          onClose={() => setDraft(null)}
+          title={draft.label || t("proxyProfiles.panel.newTitle")}
+        >
+          <AsidePanelContent>
+            <Card className="p-3 space-y-3 bg-card border-border/80">
+              <div className="flex items-center gap-2">
+                <Settings2 size={14} className="text-muted-foreground" />
+                <p className="text-xs font-semibold">{t("proxyProfiles.field.name")}</p>
+              </div>
+              <Input
+                aria-label={t("proxyProfiles.field.name")}
+                value={draft.label}
+                onChange={(event) => setDraft({ ...draft, label: event.target.value })}
+                placeholder={t("proxyProfiles.field.name")}
+                className="h-10"
+              />
+            </Card>
+
+            <Card className="p-3 space-y-3 bg-card border-border/80">
+              <div className="flex items-center justify-between gap-3">
+                <div className="flex items-center gap-2">
+                  <Globe size={14} className="text-muted-foreground" />
+                  <p className="text-xs font-semibold">{t("field.type")}</p>
+                </div>
+                <div className="flex gap-2">
+                  <Button
+                    variant={draft.config.type === "http" ? "secondary" : "ghost"}
+                    size="sm"
+                    className={cn("h-8", draft.config.type === "http" && "bg-primary/15")}
+                    onClick={() => updateDraftConfig("type", "http")}
+                  >
+                    <Check size={14} className={cn("mr-1", draft.config.type !== "http" && "opacity-0")} />
+                    HTTP
+                  </Button>
+                  <Button
+                    variant={draft.config.type === "socks5" ? "secondary" : "ghost"}
+                    size="sm"
+                    className={cn("h-8", draft.config.type === "socks5" && "bg-primary/15")}
+                    onClick={() => updateDraftConfig("type", "socks5")}
+                  >
+                    <Check size={14} className={cn("mr-1", draft.config.type !== "socks5" && "opacity-0")} />
+                    SOCKS5
+                  </Button>
+                </div>
+              </div>
+
+              <div className="flex gap-2">
+                <Input
+                  aria-label={t("hostDetails.proxyPanel.hostPlaceholder")}
+                  value={draft.config.host}
+                  onChange={(event) => updateDraftConfig("host", event.target.value)}
+                  placeholder={t("hostDetails.proxyPanel.hostPlaceholder")}
+                  className="h-10 flex-1"
+                />
+                <Input
+                  aria-label={t("hostDetails.port")}
+                  type="number"
+                  value={draft.config.port || ""}
+                  onChange={(event) => updateDraftConfig("port", event.target.value === "" ? 0 : Number(event.target.value))}
+                  placeholder="3128"
+                  min={1}
+                  max={65535}
+                  step={1}
+                  className="h-10 w-24 text-center"
+                />
+              </div>
+            </Card>
+
+            <Card className="p-3 space-y-3 bg-card border-border/80">
+              <div className="flex items-center justify-between gap-3">
+                <div className="flex items-center gap-2">
+                  <KeyRound size={14} className="text-muted-foreground" />
+                  <p className="text-xs font-semibold">{t("hostDetails.proxyPanel.credentials")}</p>
+                </div>
+                <Badge variant="secondary" className="text-xs">{t("common.optional")}</Badge>
+              </div>
+              <Input
+                aria-label={t("hostDetails.proxyPanel.usernamePlaceholder")}
+                value={draft.config.username || ""}
+                onChange={(event) => updateDraftConfig("username", event.target.value)}
+                placeholder={t("hostDetails.proxyPanel.usernamePlaceholder")}
+                className="h-10"
+              />
+              <Input
+                aria-label={t("hostDetails.proxyPanel.passwordPlaceholder")}
+                type="password"
+                value={draft.config.password || ""}
+                onChange={(event) => updateDraftConfig("password", event.target.value)}
+                placeholder={t("hostDetails.proxyPanel.passwordPlaceholder")}
+                className="h-10"
+              />
+            </Card>
+          </AsidePanelContent>
+          <AsidePanelFooter>
+            <Button className="w-full" onClick={saveDraft}>
+              {t("common.save")}
+            </Button>
+          </AsidePanelFooter>
+        </AsidePanel>
+      )}
+
+      <Dialog open={Boolean(deleteTarget)} onOpenChange={(open) => !open && setDeleteTarget(null)}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle className="flex items-center gap-2">
+              <AlertTriangle size={18} className="text-destructive" />
+              {t("proxyProfiles.delete.title")}
+            </DialogTitle>
+            <DialogDescription>
+              {deleteTarget
+                ? t("proxyProfiles.delete.desc", {
+                  name: deleteTarget.label,
+                  count: usageByProfileId.get(deleteTarget.id) ?? 0,
+                })
+                : ""}
+            </DialogDescription>
+          </DialogHeader>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setDeleteTarget(null)}>
+              {t("common.cancel")}
+            </Button>
+            <Button variant="destructive" onClick={confirmDelete}>
+              {t("action.delete")}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </div>
+  );
+};
+
+export default ProxyProfilesManager;

components/QuickAddSnippetDialog.tsx

@@ -0,0 +1,219 @@
+/**
+ * QuickAddSnippetDialog — lightweight "new snippet" modal mounted at the
+ * App root and triggered by the `netcatty:snippets:add` window event.
+ *
+ * Intentionally minimal: label + command + package only. Advanced fields
+ * (target hosts, shortkey, tags) can be set later via the full Snippets
+ * manager. This keeps the user in their terminal context instead of
+ * navigating to the Vault view just to add a command.
+ */
+
+import { Package } from 'lucide-react';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useI18n } from '../application/i18n/I18nProvider';
+import type { Snippet } from '../domain/models';
+import { Button } from './ui/button';
+import { Combobox } from './ui/combobox';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from './ui/dialog';
+import { Input } from './ui/input';
+import { Label } from './ui/label';
+import { Textarea } from './ui/textarea';
+
+export interface QuickAddSnippetDialogProps {
+  snippets: Snippet[];
+  packages: string[];
+  onCreateSnippet: (snippet: Snippet) => void;
+  onUpdateSnippet?: (snippet: Snippet) => void;
+  onCreatePackage?: (packagePath: string) => void;
+}
+
+export const QuickAddSnippetDialog: React.FC<QuickAddSnippetDialogProps> = ({
+  snippets,
+  packages,
+  onCreateSnippet,
+  onUpdateSnippet,
+  onCreatePackage,
+}) => {
+  const { t } = useI18n();
+  const [open, setOpen] = useState(false);
+  const [label, setLabel] = useState('');
+  const [command, setCommand] = useState('');
+  const [packagePath, setPackagePath] = useState('');
+  const [editing, setEditing] = useState<Snippet | null>(null);
+  const labelInputRef = useRef<HTMLInputElement>(null);
+
+  // Listen for the global "add snippet" request dispatched by the
+  // terminal-side ScriptsSidePanel + button. We reset form state on
+  // every open so stale input from a previous cancel does not leak.
+  useEffect(() => {
+    const handler = () => {
+      setEditing(null);
+      setLabel('');
+      setCommand('');
+      setPackagePath('');
+      setOpen(true);
+    };
+    window.addEventListener('netcatty:snippets:add', handler);
+    return () => window.removeEventListener('netcatty:snippets:add', handler);
+  }, []);
+
+  // Sibling event for editing an existing snippet from the ScriptsSidePanel
+  // context menu. Prefills the form and flips the dialog into update mode.
+  useEffect(() => {
+    const handler = (e: Event) => {
+      const detail = (e as CustomEvent<{ snippet?: Snippet }>).detail;
+      const snippet = detail?.snippet;
+      if (!snippet) return;
+      setEditing(snippet);
+      setLabel(snippet.label ?? '');
+      setCommand(snippet.command ?? '');
+      setPackagePath(snippet.package ?? '');
+      setOpen(true);
+    };
+    window.addEventListener('netcatty:snippets:edit', handler);
+    return () => window.removeEventListener('netcatty:snippets:edit', handler);
+  }, []);
+
+  // Auto-focus the label input once the dialog renders, so the user can
+  // start typing immediately after clicking the + button.
+  useEffect(() => {
+    if (!open) return;
+    const id = window.setTimeout(() => labelInputRef.current?.focus(), 50);
+    return () => window.clearTimeout(id);
+  }, [open]);
+
+  // Derive combobox options from the union of existing packages (from
+  // props) and any package path referenced by an existing snippet, so
+  // the user can reuse anything they see in the main snippets view.
+  const packageOptions = useMemo(() => {
+    const set = new Set<string>();
+    for (const p of packages) {
+      if (p) set.add(p);
+    }
+    for (const s of snippets) {
+      if (s.package) set.add(s.package);
+    }
+    return Array.from(set).sort().map((value) => ({ value, label: value }));
+  }, [packages, snippets]);
+
+  const canSave = label.trim().length > 0 && command.trim().length > 0;
+
+  const handleSave = useCallback(() => {
+    if (!canSave) return;
+    const trimmedPackage = packagePath.trim();
+    // If the user typed a brand new package name, surface it to the parent
+    // so it can be added to the user's package list alongside the snippet.
+    if (trimmedPackage && !packages.includes(trimmedPackage)) {
+      onCreatePackage?.(trimmedPackage);
+    }
+    if (editing && onUpdateSnippet) {
+      // Preserve tags/targets/shortkey/noAutoRun etc. that this lightweight
+      // dialog does not expose — only the three quick-edit fields change.
+      onUpdateSnippet({
+        ...editing,
+        label: label.trim(),
+        command,
+        package: trimmedPackage || '',
+      });
+    } else {
+      onCreateSnippet({
+        id: crypto.randomUUID(),
+        label: label.trim(),
+        command, // preserve whitespace in multi-line commands
+        tags: [],
+        package: trimmedPackage || '',
+        targets: [],
+      });
+    }
+    setOpen(false);
+  }, [canSave, packagePath, packages, onCreatePackage, onCreateSnippet, onUpdateSnippet, editing, label, command]);
+
+  const handleKeyDown = useCallback(
+    (e: React.KeyboardEvent) => {
+      // Cmd/Ctrl+Enter from anywhere in the dialog saves the snippet.
+      if ((e.metaKey || e.ctrlKey) && e.key === 'Enter' && canSave) {
+        e.preventDefault();
+        handleSave();
+      }
+    },
+    [canSave, handleSave],
+  );
+
+  return (
+    <Dialog open={open} onOpenChange={setOpen}>
+      <DialogContent className="max-w-md" onKeyDown={handleKeyDown}>
+        <DialogHeader>
+          <DialogTitle>
+            {t(editing ? 'snippets.panel.editTitle' : 'snippets.panel.newTitle')}
+          </DialogTitle>
+          <DialogDescription>
+            {t('snippets.empty.desc')}
+          </DialogDescription>
+        </DialogHeader>
+
+        <div className="space-y-3">
+          <div className="space-y-1.5">
+            <Label htmlFor="quick-add-snippet-label" className="text-xs">
+              {t('snippets.field.description')}
+            </Label>
+            <Input
+              id="quick-add-snippet-label"
+              ref={labelInputRef}
+              value={label}
+              onChange={(e) => setLabel(e.target.value)}
+              placeholder={t('snippets.field.descriptionPlaceholder')}
+              className="h-9"
+            />
+          </div>
+
+          <div className="space-y-1.5">
+            <Label htmlFor="quick-add-snippet-command" className="text-xs">
+              {t('snippets.field.scriptRequired')}
+            </Label>
+            <Textarea
+              id="quick-add-snippet-command"
+              value={command}
+              onChange={(e) => setCommand(e.target.value)}
+              placeholder="echo hello"
+              className="min-h-[120px] font-mono text-xs"
+              spellCheck={false}
+            />
+          </div>
+
+          <div className="space-y-1.5">
+            <Label className="text-xs flex items-center gap-1.5">
+              <Package size={12} /> {t('snippets.field.package')}
+            </Label>
+            <Combobox
+              value={packagePath}
+              onValueChange={setPackagePath}
+              options={packageOptions}
+              placeholder={t('snippets.field.packagePlaceholder')}
+              allowCreate
+              onCreateNew={setPackagePath}
+              createText={t('snippets.field.createPackage')}
+            />
+          </div>
+        </div>
+
+        <DialogFooter>
+          <Button variant="outline" onClick={() => setOpen(false)}>
+            {t('common.cancel')}
+          </Button>
+          <Button onClick={handleSave} disabled={!canSave}>
+            {t('common.save')}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};
+
+export default QuickAddSnippetDialog;

components/QuickSwitcher.tsx

@@ -1,8 +1,9 @@
 import {
   Folder,
-  LayoutGrid,
-  Search,
   FolderLock,
+  LayoutGrid,
+  Plus,
+  Search,
   Terminal,
   TerminalSquare,
 } from "lucide-react";
@@ -68,8 +69,9 @@ interface QuickSwitcherProps {
   onSelectTab: (tabId: string) => void;
   onClose: () => void;
   onCreateLocalTerminal?: (shell?: { command: string; args?: string[]; name?: string; icon?: string }) => void;
-  // onCreateWorkspace removed - feature not currently used
+  onCreateWorkspace?: () => void;
   keyBindings?: KeyBinding[];
+  showSftpTab: boolean;
 }
 
 const QuickSwitcherInner: React.FC<QuickSwitcherProps> = ({
@@ -83,17 +85,21 @@ const QuickSwitcherInner: React.FC<QuickSwitcherProps> = ({
   onSelectTab,
   onClose,
   onCreateLocalTerminal,
+  onCreateWorkspace,
   keyBindings,
+  showSftpTab,
 }) => {
   const { t } = useI18n();
   const discoveredShells = useDiscoveredShells();
 
   const filteredShells = useMemo(() => {
-    if (!query.trim()) return discoveredShells;
-    const q = query.toLowerCase();
-    return discoveredShells.filter(
-      (s) => s.name.toLowerCase().includes(q) || s.id.toLowerCase().includes(q)
-    );
+    const list = !query.trim()
+      ? discoveredShells
+      : discoveredShells.filter(
+          (s) => s.name.toLowerCase().includes(query.toLowerCase()) || s.id.toLowerCase().includes(query.toLowerCase())
+        );
+    // Default shell first
+    return [...list].sort((a, b) => (a.isDefault === b.isDefault ? 0 : a.isDefault ? -1 : 1));
   }, [discoveredShells, query]);
 
   // Get hotkey display strings
@@ -159,7 +165,7 @@ const QuickSwitcherInner: React.FC<QuickSwitcherProps> = ({
       );
       // Tabs (built-in + sessions + workspaces)
       items.push({ type: "tab", id: "vault" });
-      items.push({ type: "tab", id: "sftp" });
+      if (showSftpTab) items.push({ type: "tab", id: "sftp" });
       orphanSessions.forEach((s) =>
         items.push({ type: "tab", id: s.id, data: s }),
       );
@@ -192,7 +198,7 @@ const QuickSwitcherInner: React.FC<QuickSwitcherProps> = ({
     });
 
     return { flatItems: items, itemIndexMap: indexMap };
-  }, [showCategorized, results, orphanSessions, workspaces, filteredShells]);
+  }, [showCategorized, results, orphanSessions, workspaces, filteredShells, showSftpTab]);
 
   // O(1) index lookup
   const getItemIndex = useCallback((type: string, id: string) => {
@@ -276,7 +282,7 @@ const QuickSwitcherInner: React.FC<QuickSwitcherProps> = ({
         <ScrollArea className="flex-1 h-full">
           {/* Categorized view: Hosts/Tabs/Quick connect */}
           <div>
-            {/* Jump To hint */}
+            {/* Jump To hint + New Workspace action */}
             <div className="px-4 py-2 flex items-center gap-2">
               <span className="text-xs text-muted-foreground">{t("qs.jumpTo")}</span>
               {quickSwitchKey && (
@@ -284,6 +290,19 @@ const QuickSwitcherInner: React.FC<QuickSwitcherProps> = ({
                   {quickSwitchKey.replace(/ \+ /g, '+')}
                 </kbd>
               )}
+              {onCreateWorkspace && (
+                <button
+                  type="button"
+                  onClick={() => {
+                    onCreateWorkspace();
+                    onClose();
+                  }}
+                  className="ml-auto inline-flex items-center gap-1 text-[11px] text-muted-foreground hover:text-foreground border border-border rounded px-1.5 py-0.5 transition-colors hover:bg-muted/50"
+                >
+                  <Plus size={11} />
+                  <span>New Workspace</span>
+                </button>
+              )}
             </div>
 
             {/* Hosts section */}
@@ -315,7 +334,7 @@ const QuickSwitcherInner: React.FC<QuickSwitcherProps> = ({
               </div>
 
               {/* Built-in tabs */}
-              {["vault", "sftp"].map((tabId) => {
+              {(showSftpTab ? ["vault", "sftp"] : ["vault"]).map((tabId) => {
                 const idx = getItemIndex("tab", tabId);
                 const isSelected = idx === selectedIndex;
                 const icon =

components/ScriptsSidePanel.tsx

@@ -1,17 +1,26 @@
 /**
  * ScriptsSidePanel - Lightweight scripts browser for the terminal side panel
  *
- * Shows snippets organized by package hierarchy with breadcrumb navigation.
- * Clicking a snippet executes it in the focused terminal session.
+ * Shows snippets organized by package hierarchy as a single tree view.
+ * Packages expand / collapse via a chevron; clicking a snippet executes it
+ * in the focused terminal session. Typing in the search box flattens to a
+ * list of matching snippets regardless of package nesting.
  */
 
-import { ChevronRight, Package, Search, Zap } from 'lucide-react';
-import React, { memo, useCallback, useMemo, useState } from 'react';
+import { ChevronRight, Edit2, FileCode, Package, Plus, Search, Trash2, Zap } from 'lucide-react';
+import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useI18n } from '../application/i18n/I18nProvider';
 import { cn } from '../lib/utils';
 import { Snippet } from '../types';
+import {
+  ContextMenu,
+  ContextMenuContent,
+  ContextMenuItem,
+  ContextMenuTrigger,
+} from './ui/context-menu';
 import { Input } from './ui/input';
 import { ScrollArea } from './ui/scroll-area';
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './ui/tooltip';
 
 interface ScriptsSidePanelProps {
   snippets: Snippet[];
@@ -20,6 +29,33 @@ interface ScriptsSidePanelProps {
   isVisible?: boolean;
 }
 
+type TreeRow =
+  | {
+      type: 'package';
+      id: string;
+      path: string;
+      name: string;
+      depth: number;
+      count: number;
+      hasChildren: boolean;
+      isExpanded: boolean;
+    }
+  | {
+      type: 'snippet';
+      id: string;
+      depth: number;
+      snippet: Snippet;
+      packagePath: string;
+    };
+
+const pkgDisplayName = (path: string) => {
+  const clean = path.startsWith('/') ? path.slice(1) : path;
+  const last = clean.split('/').filter(Boolean).pop() ?? clean;
+  // Preserve the leading slash on absolute root packages so they stay
+  // distinguishable from relative ones (matches the previous breadcrumb UI).
+  return path.startsWith('/') && !clean.includes('/') ? `/${last}` : last;
+};
+
 const ScriptsSidePanelInner: React.FC<ScriptsSidePanelProps> = ({
   snippets,
   packages,
@@ -27,107 +63,184 @@ const ScriptsSidePanelInner: React.FC<ScriptsSidePanelProps> = ({
   isVisible = true,
 }) => {
   const { t } = useI18n();
-  const [selectedPackage, setSelectedPackage] = useState<string | null>(null);
   const [search, setSearch] = useState('');
+  const [expandedPaths, setExpandedPaths] = useState<Set<string>>(new Set());
 
-  const displayedPackages = useMemo(() => {
-    if (!selectedPackage) {
-      const absolutePaths = packages.filter(p => p.startsWith('/'));
-      const relativePaths = packages.filter(p => !p.startsWith('/'));
+  // Normalize the package list + derive ancestor packages implied by each path
+  // (e.g. package "a/b/c" implies roots "a" and "a/b" even when not listed).
+  const normalizedPackages = useMemo(() => {
+    const set = new Set<string>();
+    const addWithAncestors = (raw: string) => {
+      const path = raw.trim();
+      if (!path) return;
+      const isAbs = path.startsWith('/');
+      const body = isAbs ? path.slice(1) : path;
+      const parts = body.split('/').filter(Boolean);
+      for (let i = 1; i <= parts.length; i++) {
+        const sub = parts.slice(0, i).join('/');
+        set.add(isAbs ? `/${sub}` : sub);
+      }
+    };
+    packages.forEach(addWithAncestors);
+    // A snippet may reference a package path that's not in `packages` yet.
+    snippets.forEach((s) => {
+      if (s.package) addWithAncestors(s.package);
+    });
+    return set;
+  }, [packages, snippets]);
 
-      const results: { name: string; path: string; count: number }[] = [];
+  // Track every package we've ever observed so we can tell "new" from
+  // "previously-seen-but-user-collapsed". Without this, any unrelated refresh
+  // that reduced prev.size (because the user collapsed a row) would
+  // incorrectly trip a bulk re-expand.
+  const seenPackagesRef = useRef<Set<string>>(new Set());
 
-      const relativeRoots = relativePaths
-        .map((p) => p.split('/')[0])
-        .filter((name): name is string => Boolean(name) && name.length > 0);
+  // Default: auto-expand packages the first time they appear, so the user sees
+  // everything without drilling in. After that, respect the user's collapse
+  // choices across unrelated refreshes.
+  useEffect(() => {
+    const seen = seenPackagesRef.current;
+    const newlySeen: string[] = [];
+    normalizedPackages.forEach((p) => {
+      if (!seen.has(p)) {
+        seen.add(p);
+        newlySeen.push(p);
+      }
+    });
+    if (newlySeen.length === 0) return;
+    setExpandedPaths((prev) => {
+      const next = new Set(prev);
+      newlySeen.forEach((p) => next.add(p));
+      return next;
+    });
+  }, [normalizedPackages]);
 
-      Array.from(new Set(relativeRoots)).forEach((name: string) => {
-        const path: string = name;
-        const count = snippets.filter((s) => {
-          const pkg = s.package || '';
-          return pkg === path || pkg.startsWith(path + '/');
-        }).length;
-        results.push({ name, path, count });
-      });
+  const togglePackage = useCallback((path: string) => {
+    setExpandedPaths((prev) => {
+      const next = new Set(prev);
+      if (next.has(path)) next.delete(path);
+      else next.add(path);
+      return next;
+    });
+  }, []);
 
-      const absoluteRoots = absolutePaths
-        .map((p) => {
-          const cleanPath = p.substring(1);
-          return cleanPath.split('/')[0];
+  // When search is active, flatten everything (no tree, no packages).
+  const searchMatches = useMemo(() => {
+    const q = search.trim().toLowerCase();
+    if (!q) return null;
+    return snippets.filter(
+      (s) =>
+        s.label.toLowerCase().includes(q) ||
+        s.command.toLowerCase().includes(q),
+    );
+  }, [snippets, search]);
+
+  const rows = useMemo<TreeRow[]>(() => {
+    if (searchMatches !== null) return [];
+
+    const out: TreeRow[] = [];
+    const paths: string[] = [];
+    normalizedPackages.forEach((p) => paths.push(p));
+
+    const childPackagesOf = (parent: string | null): string[] => {
+      const prefix = parent === null ? '' : parent + '/';
+      return paths
+        .filter((p) => {
+          if (parent === null) {
+            // Root-level: no "/" inside the body
+            const body = p.startsWith('/') ? p.slice(1) : p;
+            return !body.includes('/');
+          }
+          if (!p.startsWith(prefix)) return false;
+          const rest = p.slice(prefix.length);
+          return rest.length > 0 && !rest.includes('/');
         })
-        .filter((name): name is string => Boolean(name) && name.length > 0);
+        .sort((a, b) => pkgDisplayName(a).localeCompare(pkgDisplayName(b)));
+    };
 
-      Array.from(new Set(absoluteRoots)).forEach((name: string) => {
-        const path: string = `/${name}`;
-        const displayName: string = `/${name}`;
-        const count = snippets.filter((s) => {
-          const pkg = s.package || '';
-          return pkg === path || pkg.startsWith(path + '/');
-        }).length;
-        results.push({ name: displayName, path, count });
+    const snippetsIn = (pkg: string | null): Snippet[] =>
+      snippets
+        .filter((s) => (s.package || '') === (pkg ?? ''))
+        .sort((a, b) => a.label.localeCompare(b.label));
+
+    const countDescendants = (pkg: string): number =>
+      snippets.filter((s) => {
+        const sp = s.package || '';
+        return sp === pkg || sp.startsWith(pkg + '/');
+      }).length;
+
+    const walk = (pkg: string, depth: number) => {
+      const children = childPackagesOf(pkg);
+      const localSnippets = snippetsIn(pkg);
+      const hasChildren = children.length > 0 || localSnippets.length > 0;
+      const isExpanded = expandedPaths.has(pkg);
+
+      out.push({
+        type: 'package',
+        id: pkg,
+        path: pkg,
+        name: pkgDisplayName(pkg),
+        depth,
+        count: countDescendants(pkg),
+        hasChildren,
+        isExpanded,
       });
 
-      return results;
-    }
-
-    const prefix = selectedPackage + '/';
-    const children = packages
-      .filter((p) => p.startsWith(prefix))
-      .map((p) => p.replace(prefix, '').split('/')[0])
-      .filter((name): name is string => Boolean(name) && name.length > 0);
-    return Array.from(new Set(children)).map((name) => {
-      const path = `${selectedPackage}/${name}`;
-      const count = snippets.filter((s) => {
-        const pkg = s.package || '';
-        return pkg === path || pkg.startsWith(path + '/');
-      }).length;
-      return { name, path, count };
-    });
-  }, [packages, selectedPackage, snippets]);
-
-  const displayedSnippets = useMemo(() => {
-    let result = snippets.filter((s) => (s.package || '') === (selectedPackage || ''));
-    if (search.trim()) {
-      const s = search.toLowerCase();
-      result = result.filter(sn =>
-        sn.label.toLowerCase().includes(s) ||
-        sn.command.toLowerCase().includes(s)
+      if (!isExpanded) return;
+      children.forEach((c) => walk(c, depth + 1));
+      localSnippets.forEach((s) =>
+        out.push({ type: 'snippet', id: s.id, depth: depth + 1, snippet: s, packagePath: pkg }),
       );
-    }
-    return result;
-  }, [snippets, selectedPackage, search]);
+    };
 
-  // Also filter packages by search when at root level
-  const filteredPackages = useMemo(() => {
-    if (!search.trim()) return displayedPackages;
-    const s = search.toLowerCase();
-    return displayedPackages.filter(pkg => pkg.name.toLowerCase().includes(s));
-  }, [displayedPackages, search]);
+    // Orphan / uncategorized snippets first (package === '')
+    snippetsIn(null).forEach((s) =>
+      out.push({ type: 'snippet', id: s.id, depth: 0, snippet: s, packagePath: '' }),
+    );
+    childPackagesOf(null).forEach((root) => walk(root, 0));
 
-  const breadcrumb = useMemo(() => {
-    if (!selectedPackage) return [];
-    const isAbsolute = selectedPackage.startsWith('/');
-    const parts = selectedPackage.split('/').filter(Boolean);
-    return parts.map((name, idx) => {
-      const pathSegments = parts.slice(0, idx + 1);
-      const path = isAbsolute ? `/${pathSegments.join('/')}` : pathSegments.join('/');
-      return { name, path };
-    });
-  }, [selectedPackage]);
+    return out;
+  }, [normalizedPackages, snippets, expandedPaths, searchMatches]);
 
-  const handleSnippetClick = useCallback((command: string, noAutoRun?: boolean) => {
-    onSnippetClick(command, noAutoRun);
-  }, [onSnippetClick]);
+  const handleSnippetClick = useCallback(
+    (command: string, noAutoRun?: boolean) => {
+      onSnippetClick(command, noAutoRun);
+    },
+    [onSnippetClick],
+  );
+
+  const handleAddSnippet = useCallback(() => {
+    // Let the App shell listen and navigate to the Snippets section with
+    // the "add" panel pre-opened, so the user does not have to leave the
+    // terminal to jump back and click "New Snippet".
+    window.dispatchEvent(new CustomEvent('netcatty:snippets:add'));
+  }, []);
+
+  const handleEditSnippet = useCallback((snippet: Snippet) => {
+    window.dispatchEvent(
+      new CustomEvent('netcatty:snippets:edit', { detail: { snippet } }),
+    );
+  }, []);
+
+  const handleDeleteSnippet = useCallback((id: string) => {
+    window.dispatchEvent(
+      new CustomEvent('netcatty:snippets:delete', { detail: { id } }),
+    );
+  }, []);
 
   if (!isVisible) return null;
 
   const hasAnyContent = snippets.length > 0 || packages.length > 0;
 
   return (
-    <div className="h-full flex flex-col bg-background overflow-hidden">
-      {/* Search */}
-      <div className="shrink-0 px-2 py-1.5 border-b border-border/50">
-        <div className="relative">
+    <TooltipProvider delayDuration={300}>
+    <div
+      className="h-full flex flex-col bg-background overflow-hidden"
+      data-section="snippets-panel"
+    >
+      {/* Search + Add */}
+      <div className="shrink-0 px-2 py-1.5 border-b border-border/50 flex items-center gap-1.5">
+        <div className="relative flex-1 min-w-0">
           <Search size={12} className="absolute left-2 top-1/2 -translate-y-1/2 text-muted-foreground" />
           <Input
             value={search}
@@ -136,30 +249,19 @@ const ScriptsSidePanelInner: React.FC<ScriptsSidePanelProps> = ({
             className="h-7 pl-7 text-xs bg-muted/30 border-none"
           />
         </div>
-      </div>
-
-      {/* Breadcrumb */}
-      <div className="shrink-0 flex items-center gap-1 px-3 py-1.5 text-[11px] border-b border-border/30 min-h-[28px]">
-        <button
-          className={cn(
-            "hover:text-primary transition-colors truncate",
-            !selectedPackage ? "text-foreground font-medium" : "text-muted-foreground"
-          )}
-          onClick={() => setSelectedPackage(null)}
-        >
-          {t('terminal.toolbar.library')}
-        </button>
-        {breadcrumb.map((b) => (
-          <React.Fragment key={b.path}>
-            <ChevronRight size={10} className="text-muted-foreground shrink-0" />
+        <Tooltip>
+          <TooltipTrigger asChild>
             <button
-              className="text-muted-foreground hover:text-primary transition-colors truncate"
-              onClick={() => setSelectedPackage(b.path)}
+              type="button"
+              onClick={handleAddSnippet}
+              aria-label={t('snippets.action.newSnippet')}
+              className="shrink-0 h-7 w-7 flex items-center justify-center rounded-md text-muted-foreground hover:text-foreground hover:bg-muted/60 transition-colors"
             >
-              {b.name}
+              <Plus size={14} />
             </button>
-          </React.Fragment>
-        ))}
+          </TooltipTrigger>
+          <TooltipContent>{t('snippets.action.newSnippet')}</TooltipContent>
+        </Tooltip>
       </div>
 
       {/* Content */}
@@ -172,41 +274,47 @@ const ScriptsSidePanelInner: React.FC<ScriptsSidePanelProps> = ({
             </div>
           )}
 
-          {/* Packages */}
-          {filteredPackages.map((pkg) => (
-            <button
-              key={pkg.path}
-              className="w-full flex items-center gap-2.5 px-3 py-2 text-left hover:bg-accent/50 transition-colors"
-              onClick={() => { setSelectedPackage(pkg.path); setSearch(''); }}
-            >
-              <div className="w-6 h-6 rounded-md bg-primary/10 text-primary flex items-center justify-center shrink-0">
-                <Package size={12} />
-              </div>
-              <div className="flex-1 min-w-0">
-                <div className="text-xs font-medium truncate">{pkg.name}</div>
-                <div className="text-[10px] text-muted-foreground">
-                  {t('snippets.package.count', { count: pkg.count })}
-                </div>
-              </div>
-              <ChevronRight size={12} className="text-muted-foreground shrink-0" />
-            </button>
-          ))}
+          {/* Search flat list */}
+          {searchMatches !== null && searchMatches.length > 0 &&
+            searchMatches.map((s) => (
+              <SnippetRow
+                key={s.id}
+                snippet={s}
+                depth={0}
+                subtitle={s.package || t('terminal.toolbar.library')}
+                onClick={() => handleSnippetClick(s.command, s.noAutoRun)}
+                onEdit={() => handleEditSnippet(s)}
+                onDelete={() => handleDeleteSnippet(s.id)}
+                editLabel={t('action.edit')}
+                deleteLabel={t('action.delete')}
+              />
+            ))}
 
-          {/* Snippets */}
-          {displayedSnippets.map((s) => (
-            <button
-              key={s.id}
-              onClick={() => handleSnippetClick(s.command, s.noAutoRun)}
-              className="w-full text-left px-3 py-2 hover:bg-accent/50 transition-colors flex flex-col gap-0.5"
-            >
-              <span className="text-xs font-medium truncate">{s.label}</span>
-              <span className="text-muted-foreground truncate font-mono text-[10px] max-w-full">
-                {s.command}
-              </span>
-            </button>
-          ))}
+          {/* Tree */}
+          {searchMatches === null &&
+            rows.map((row) =>
+              row.type === 'package' ? (
+                <PackageRow
+                  key={`pkg:${row.id}`}
+                  row={row}
+                  countLabel={t('snippets.package.count', { count: row.count })}
+                  onToggle={() => togglePackage(row.path)}
+                />
+              ) : (
+                <SnippetRow
+                  key={`snip:${row.id}`}
+                  snippet={row.snippet}
+                  depth={row.depth}
+                  onClick={() => handleSnippetClick(row.snippet.command, row.snippet.noAutoRun)}
+                  onEdit={() => handleEditSnippet(row.snippet)}
+                  onDelete={() => handleDeleteSnippet(row.snippet.id)}
+                  editLabel={t('action.edit')}
+                  deleteLabel={t('action.delete')}
+                />
+              ),
+            )}
 
-          {hasAnyContent && displayedSnippets.length === 0 && filteredPackages.length === 0 && search.trim() && (
+          {hasAnyContent && searchMatches !== null && searchMatches.length === 0 && (
             <div className="px-3 py-4 text-xs text-muted-foreground italic text-center">
               {t('common.noResultsFound')}
             </div>
@@ -214,8 +322,100 @@ const ScriptsSidePanelInner: React.FC<ScriptsSidePanelProps> = ({
         </div>
       </ScrollArea>
     </div>
+    </TooltipProvider>
   );
 };
 
+interface PackageRowProps {
+  row: Extract<TreeRow, { type: 'package' }>;
+  countLabel: string;
+  onToggle: () => void;
+}
+
+const PackageRow: React.FC<PackageRowProps> = ({ row, countLabel, onToggle }) => (
+  <button
+    type="button"
+    onClick={onToggle}
+    className="w-full flex items-center gap-1.5 pr-3 py-1.5 text-left hover:bg-accent/50 transition-colors"
+    style={{ paddingLeft: 8 + row.depth * 14 }}
+  >
+    <ChevronRight
+      size={12}
+      className={cn(
+        'shrink-0 text-muted-foreground transition-transform',
+        row.isExpanded && 'rotate-90',
+        !row.hasChildren && 'opacity-0',
+      )}
+    />
+    <Package size={12} className="shrink-0 text-primary/80" />
+    <span className="flex-1 min-w-0 truncate text-xs font-medium">{row.name}</span>
+    <span className="shrink-0 text-[10px] text-muted-foreground tabular-nums">{countLabel}</span>
+  </button>
+);
+
+interface SnippetRowProps {
+  snippet: Snippet;
+  depth: number;
+  subtitle?: string;
+  onClick: () => void;
+  onEdit: () => void;
+  onDelete: () => void;
+  editLabel: string;
+  deleteLabel: string;
+}
+
+const SnippetRow: React.FC<SnippetRowProps> = ({
+  snippet,
+  depth,
+  subtitle,
+  onClick,
+  onEdit,
+  onDelete,
+  editLabel,
+  deleteLabel,
+}) => (
+  <ContextMenu>
+    <ContextMenuTrigger asChild>
+      <div>
+        <Tooltip>
+          <TooltipTrigger asChild>
+            <button
+              type="button"
+              onClick={onClick}
+              className="w-full flex items-center gap-1.5 pr-3 py-1.5 text-left hover:bg-accent/50 transition-colors overflow-hidden"
+              style={{ paddingLeft: 8 + depth * 14 }}
+            >
+              {/* Hidden chevron column mirrors PackageRow's layout so the
+                  snippet icon lines up exactly with the package icon above. */}
+              <ChevronRight size={12} className="shrink-0 opacity-0" aria-hidden />
+              <FileCode size={12} className="shrink-0 text-muted-foreground" />
+              <span className="flex-1 min-w-0 truncate text-xs font-medium">{snippet.label}</span>
+              {subtitle && (
+                <span className="shrink-0 max-w-[40%] truncate text-[10px] text-muted-foreground">
+                  {subtitle}
+                </span>
+              )}
+            </button>
+          </TooltipTrigger>
+          <TooltipContent side="right" align="start" className="max-w-[480px]">
+            <div className="font-medium text-xs mb-1 break-all">{snippet.label}</div>
+            <pre className="font-mono text-[11px] whitespace-pre-wrap break-all leading-snug opacity-90">
+              {snippet.command}
+            </pre>
+          </TooltipContent>
+        </Tooltip>
+      </div>
+    </ContextMenuTrigger>
+    <ContextMenuContent>
+      <ContextMenuItem onClick={onEdit}>
+        <Edit2 className="mr-2 h-4 w-4" /> {editLabel}
+      </ContextMenuItem>
+      <ContextMenuItem className="text-destructive" onClick={onDelete}>
+        <Trash2 className="mr-2 h-4 w-4" /> {deleteLabel}
+      </ContextMenuItem>
+    </ContextMenuContent>
+  </ContextMenu>
+);
+
 export const ScriptsSidePanel = memo(ScriptsSidePanelInner);
 ScriptsSidePanel.displayName = 'ScriptsSidePanel';

components/SelectHostPanel.tsx

@@ -1,19 +1,18 @@
 import {
-  ArrowLeft,
   Check,
   ChevronRight,
   LayoutGrid,
   Plus,
   Search,
-  X,
 } from "lucide-react";
 import React, { useMemo, useState } from "react";
 import { cn } from "../lib/utils";
 import { useI18n } from "../application/i18n/I18nProvider";
-import { Host, SSHKey } from "../types";
+import { Host, ProxyProfile, SSHKey } from "../types";
 import { ManagedSource } from "../domain/models";
 import { DistroAvatar } from "./DistroAvatar";
 import HostDetailsPanel from "./HostDetailsPanel";
+import { AsidePanel, type AsidePanelLayout } from "./ui/aside-panel";
 import { Button } from "./ui/button";
 import { Input } from "./ui/input";
 import { ScrollArea } from "./ui/scroll-area";
@@ -38,12 +37,14 @@ interface SelectHostPanelProps {
   // Props for inline host creation
   availableKeys?: SSHKey[];
   identities?: import('../domain/models').Identity[];
+  proxyProfiles?: ProxyProfile[];
   managedSources?: ManagedSource[];
   onSaveHost?: (host: Host) => void;
   onCreateGroup?: (groupPath: string) => void;
   title?: string;
   subtitle?: string;
   className?: string;
+  layout?: AsidePanelLayout;
 }
 
 const SelectHostPanel: React.FC<SelectHostPanelProps> = ({
@@ -57,12 +58,14 @@ const SelectHostPanel: React.FC<SelectHostPanelProps> = ({
   onNewHost,
   availableKeys = [],
   identities = [],
+  proxyProfiles = [],
   managedSources = [],
   onSaveHost,
   onCreateGroup,
   title,
   subtitle,
   className,
+  layout = "overlay",
 }) => {
   const { t } = useI18n();
   const panelTitle = title ?? t("selectHost.title");
@@ -205,35 +208,20 @@ const SelectHostPanel: React.FC<SelectHostPanelProps> = ({
 
   return (
     <TooltipProvider delayDuration={300}>
-    <div
+    <AsidePanel
+      open={true}
+      onClose={onBack}
+      title={panelTitle}
+      subtitle={subtitle}
+      showBackButton={true}
+      onBack={onBack}
       className={cn(
-        "absolute right-0 top-0 bottom-0 w-[380px] border-l border-border/60 bg-background z-40 flex flex-col app-no-drag",
+        layout === "overlay" && "z-40",
+        showNewHostPanel && "overflow-visible",
         className,
       )}
+      layout={layout}
     >
-      {/* Header */}
-      <div className="px-4 py-3 border-b border-border/60 flex items-center justify-between gap-3 shrink-0">
-        <div className="flex items-center gap-3 min-w-0">
-          <button
-            onClick={onBack}
-            className="p-1 hover:bg-muted rounded-md transition-colors cursor-pointer shrink-0"
-          >
-            <ArrowLeft size={18} />
-          </button>
-          <div className="min-w-0">
-            <h3 className="text-sm font-semibold">{panelTitle}</h3>
-            {subtitle && (
-              <p className="text-xs text-muted-foreground">{subtitle}</p>
-            )}
-          </div>
-        </div>
-        <button
-          onClick={onBack}
-          className="p-1.5 hover:bg-muted rounded-md transition-colors cursor-pointer shrink-0"
-        >
-          <X size={18} />
-        </button>
-      </div>
 
       {/* Toolbar */}
       <div className="px-4 py-3 flex items-center gap-2 border-b border-border/60 shrink-0">
@@ -277,7 +265,7 @@ const SelectHostPanel: React.FC<SelectHostPanelProps> = ({
       </div>
 
       {/* Content */}
-      <ScrollArea className="flex-1">
+      <ScrollArea className="flex-1 min-w-0">
         <div className="p-3 space-y-3">
           {/* Breadcrumbs */}
           {currentPath && (
@@ -398,7 +386,7 @@ const SelectHostPanel: React.FC<SelectHostPanelProps> = ({
       </ScrollArea>
 
       {/* Footer */}
-      <div className="px-4 py-3 border-t border-border/60">
+      <div className="px-4 py-3 border-t border-border/60 shrink-0">
         <Button
           className="w-full"
           disabled={selectedHostIds.length === 0}
@@ -425,6 +413,7 @@ const SelectHostPanel: React.FC<SelectHostPanelProps> = ({
           initialData={null}
           availableKeys={availableKeys}
           identities={identities}
+          proxyProfiles={proxyProfiles}
           groups={customGroups}
           managedSources={managedSources}
           allHosts={hosts}
@@ -436,7 +425,7 @@ const SelectHostPanel: React.FC<SelectHostPanelProps> = ({
           onCreateGroup={onCreateGroup}
         />
       )}
-    </div>
+    </AsidePanel>
     </TooltipProvider>
   );
 };

components/SerialConnectModal.tsx

@@ -20,6 +20,7 @@ import {
 } from './ui/dialog';
 import { Input } from './ui/input';
 import { Label } from './ui/label';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from './ui/select';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from './ui/collapsible';
 
 interface SerialPort {
@@ -262,35 +263,41 @@ export const SerialConnectModal: React.FC<SerialConnectModalProps> = ({
               <div className="grid grid-cols-2 gap-4">
                 <div className="space-y-2">
                   <Label htmlFor="data-bits">{t('serial.field.dataBits')}</Label>
-                  <select
-                    id="data-bits"
-                    value={dataBits}
-                    onChange={(e) => setDataBits(parseInt(e.target.value, 10) as 5 | 6 | 7 | 8)}
-                    className="w-full h-10 px-3 rounded-md border border-input bg-background text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+                  <Select
+                    value={String(dataBits)}
+                    onValueChange={(v) => setDataBits(parseInt(v, 10) as 5 | 6 | 7 | 8)}
                   >
-                    {DATA_BITS.map((bits) => (
-                      <option key={bits} value={bits}>
-                        {bits}
-                      </option>
-                    ))}
-                  </select>
+                    <SelectTrigger id="data-bits">
+                      <SelectValue />
+                    </SelectTrigger>
+                    <SelectContent>
+                      {DATA_BITS.map((bits) => (
+                        <SelectItem key={bits} value={String(bits)}>
+                          {bits}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
                 </div>
 
                 {/* Stop Bits */}
                 <div className="space-y-2">
                   <Label htmlFor="stop-bits">{t('serial.field.stopBits')}</Label>
-                  <select
-                    id="stop-bits"
-                    value={stopBits}
-                    onChange={(e) => setStopBits(parseFloat(e.target.value) as 1 | 1.5 | 2)}
-                    className="w-full h-10 px-3 rounded-md border border-input bg-background text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+                  <Select
+                    value={String(stopBits)}
+                    onValueChange={(v) => setStopBits(parseFloat(v) as 1 | 1.5 | 2)}
                   >
-                    {STOP_BITS.map((bits) => (
-                      <option key={bits} value={bits}>
-                        {bits}
-                      </option>
-                    ))}
-                  </select>
+                    <SelectTrigger id="stop-bits">
+                      <SelectValue />
+                    </SelectTrigger>
+                    <SelectContent>
+                      {STOP_BITS.map((bits) => (
+                        <SelectItem key={bits} value={String(bits)}>
+                          {bits}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
                   {isStopBits15 && (
                     <p className="text-xs text-yellow-500">
                       {t('serial.field.stopBits15Warning')}
@@ -302,35 +309,41 @@ export const SerialConnectModal: React.FC<SerialConnectModalProps> = ({
               {/* Parity */}
               <div className="space-y-2">
                 <Label htmlFor="parity">{t('serial.field.parity')}</Label>
-                <select
-                  id="parity"
+                <Select
                   value={parity}
-                  onChange={(e) => setParity(e.target.value as SerialParity)}
-                  className="w-full h-10 px-3 rounded-md border border-input bg-background text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+                  onValueChange={(v) => setParity(v as SerialParity)}
                 >
-                  {PARITY_OPTIONS.map((option) => (
-                    <option key={option} value={option}>
-                      {t(`serial.parity.${option}`)}
-                    </option>
-                  ))}
-                </select>
+                  <SelectTrigger id="parity">
+                    <SelectValue />
+                  </SelectTrigger>
+                  <SelectContent>
+                    {PARITY_OPTIONS.map((option) => (
+                      <SelectItem key={option} value={option}>
+                        {t(`serial.parity.${option}`)}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
               </div>
 
               {/* Flow Control */}
               <div className="space-y-2">
                 <Label htmlFor="flow-control">{t('serial.field.flowControl')}</Label>
-                <select
-                  id="flow-control"
+                <Select
                   value={flowControl}
-                  onChange={(e) => setFlowControl(e.target.value as SerialFlowControl)}
-                  className="w-full h-10 px-3 rounded-md border border-input bg-background text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+                  onValueChange={(v) => setFlowControl(v as SerialFlowControl)}
                 >
-                  {FLOW_CONTROL_OPTIONS.map((option) => (
-                    <option key={option} value={option}>
-                      {t(`serial.flowControl.${option}`)}
-                    </option>
-                  ))}
-                </select>
+                  <SelectTrigger id="flow-control">
+                    <SelectValue />
+                  </SelectTrigger>
+                  <SelectContent>
+                    {FLOW_CONTROL_OPTIONS.map((option) => (
+                      <SelectItem key={option} value={option}>
+                        {t(`serial.flowControl.${option}`)}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
               </div>
 
               {/* Terminal Options */}

components/SerialHostDetailsPanel.tsx

@@ -12,11 +12,13 @@ import { Button } from './ui/button';
 import { Combobox, ComboboxOption, MultiCombobox } from './ui/combobox';
 import { Input } from './ui/input';
 import { Label } from './ui/label';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from './ui/select';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from './ui/collapsible';
 import {
   AsidePanel,
   AsidePanelContent,
   AsidePanelFooter,
+  type AsidePanelLayout,
 } from './ui/aside-panel';
 
 interface SerialPort {
@@ -35,6 +37,7 @@ interface SerialHostDetailsPanelProps {
   groups?: string[];
   onSave: (host: Host) => void;
   onCancel: () => void;
+  layout?: AsidePanelLayout;
 }
 
 const BAUD_RATES = [300, 1200, 2400, 4800, 9600, 19200, 38400, 57600, 115200, 230400, 460800, 921600];
@@ -49,6 +52,7 @@ export const SerialHostDetailsPanel: React.FC<SerialHostDetailsPanelProps> = ({
   groups = [],
   onSave,
   onCancel,
+  layout = 'overlay',
 }) => {
   const { t } = useI18n();
   const terminalBackend = useTerminalBackend();
@@ -164,6 +168,8 @@ export const SerialHostDetailsPanel: React.FC<SerialHostDetailsPanelProps> = ({
       title={t('serial.edit.title')}
       subtitle={initialData.label}
       className="z-40"
+      layout={layout}
+      dataSection="serial-host-details-panel"
     >
       <AsidePanelContent>
         {/* Label */}
@@ -286,35 +292,41 @@ export const SerialHostDetailsPanel: React.FC<SerialHostDetailsPanelProps> = ({
             <div className="grid grid-cols-2 gap-4">
               <div className="space-y-2">
                 <Label htmlFor="data-bits">{t('serial.field.dataBits')}</Label>
-                <select
-                  id="data-bits"
-                  value={dataBits}
-                  onChange={(e) => setDataBits(parseInt(e.target.value, 10) as 5 | 6 | 7 | 8)}
-                  className="w-full h-10 px-3 rounded-md border border-input bg-background text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+                <Select
+                  value={String(dataBits)}
+                  onValueChange={(v) => setDataBits(parseInt(v, 10) as 5 | 6 | 7 | 8)}
                 >
-                  {DATA_BITS.map((bits) => (
-                    <option key={bits} value={bits}>
-                      {bits}
-                    </option>
-                  ))}
-                </select>
+                  <SelectTrigger id="data-bits">
+                    <SelectValue />
+                  </SelectTrigger>
+                  <SelectContent>
+                    {DATA_BITS.map((bits) => (
+                      <SelectItem key={bits} value={String(bits)}>
+                        {bits}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
               </div>
 
               {/* Stop Bits */}
               <div className="space-y-2">
                 <Label htmlFor="stop-bits">{t('serial.field.stopBits')}</Label>
-                <select
-                  id="stop-bits"
-                  value={stopBits}
-                  onChange={(e) => setStopBits(parseFloat(e.target.value) as 1 | 1.5 | 2)}
-                  className="w-full h-10 px-3 rounded-md border border-input bg-background text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+                <Select
+                  value={String(stopBits)}
+                  onValueChange={(v) => setStopBits(parseFloat(v) as 1 | 1.5 | 2)}
                 >
-                  {STOP_BITS.map((bits) => (
-                    <option key={bits} value={bits}>
-                      {bits}
-                    </option>
-                  ))}
-                </select>
+                  <SelectTrigger id="stop-bits">
+                    <SelectValue />
+                  </SelectTrigger>
+                  <SelectContent>
+                    {STOP_BITS.map((bits) => (
+                      <SelectItem key={bits} value={String(bits)}>
+                        {bits}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
                 {isStopBits15 && (
                   <p className="text-xs text-yellow-500">
                     {t('serial.field.stopBits15Warning')}
@@ -326,35 +338,41 @@ export const SerialHostDetailsPanel: React.FC<SerialHostDetailsPanelProps> = ({
             {/* Parity */}
             <div className="space-y-2">
               <Label htmlFor="parity">{t('serial.field.parity')}</Label>
-              <select
-                id="parity"
+              <Select
                 value={parity}
-                onChange={(e) => setParity(e.target.value as SerialParity)}
-                className="w-full h-10 px-3 rounded-md border border-input bg-background text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+                onValueChange={(v) => setParity(v as SerialParity)}
               >
-                {PARITY_OPTIONS.map((option) => (
-                  <option key={option} value={option}>
-                    {t(`serial.parity.${option}`)}
-                  </option>
-                ))}
-              </select>
+                <SelectTrigger id="parity">
+                  <SelectValue />
+                </SelectTrigger>
+                <SelectContent>
+                  {PARITY_OPTIONS.map((option) => (
+                    <SelectItem key={option} value={option}>
+                      {t(`serial.parity.${option}`)}
+                    </SelectItem>
+                  ))}
+                </SelectContent>
+              </Select>
             </div>
 
             {/* Flow Control */}
             <div className="space-y-2">
               <Label htmlFor="flow-control">{t('serial.field.flowControl')}</Label>
-              <select
-                id="flow-control"
+              <Select
                 value={flowControl}
-                onChange={(e) => setFlowControl(e.target.value as SerialFlowControl)}
-                className="w-full h-10 px-3 rounded-md border border-input bg-background text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+                onValueChange={(v) => setFlowControl(v as SerialFlowControl)}
               >
-                {FLOW_CONTROL_OPTIONS.map((option) => (
-                  <option key={option} value={option}>
-                    {t(`serial.flowControl.${option}`)}
-                  </option>
-                ))}
-              </select>
+                <SelectTrigger id="flow-control">
+                  <SelectValue />
+                </SelectTrigger>
+                <SelectContent>
+                  {FLOW_CONTROL_OPTIONS.map((option) => (
+                    <SelectItem key={option} value={option}>
+                      {t(`serial.flowControl.${option}`)}
+                    </SelectItem>
+                  ))}
+                </SelectContent>
+              </Select>
             </div>
 
             {/* Terminal Options */}

components/SettingsApplicationTab.tsx

@@ -96,6 +96,18 @@ export default function SettingsApplicationTab({ updateState, checkNow, openRele
     };
   }, [getApplicationInfo]);
 
+  const handleOpenExternal = async (url: string) => {
+    try {
+      await openExternal(url);
+    } catch (err) {
+      console.warn("[SettingsApplicationTab] openExternal failed:", err);
+      toast.error(
+        t("settings.application.openExternal.failedBody"),
+        t("settings.application.openExternal.failedTitle"),
+      );
+    }
+  };
+
   const handleCheckForUpdates = async () => {
     // In demo mode, allow checking even for dev builds
     if (!isUpdateDemoMode && (!appInfo.version || appInfo.version === '0.0.0')) {
@@ -140,7 +152,14 @@ export default function SettingsApplicationTab({ updateState, checkNow, openRele
           <div className="flex items-center gap-4">
             <AppLogo className="w-16 h-16" />
             <div>
-              <div className="text-3xl font-semibold leading-none">{appInfo.name}</div>
+              {/* Match the Vault sidebar wordmark so the Netcatty brand
+                  reads consistently across surfaces — same italic heavy
+                  cut, just scaled up for the Settings hero area and
+                  using the branded mixed-case "Netcatty" instead of
+                  the lowercase electron app name. */}
+              <div className="text-3xl font-black italic tracking-tight leading-none text-foreground">
+                Netcatty
+              </div>
               <div className="flex items-center gap-2 mt-1">
                 <span className="text-sm text-muted-foreground">
                   {appInfo.version ? appInfo.version : " "}
@@ -198,25 +217,25 @@ export default function SettingsApplicationTab({ updateState, checkNow, openRele
               icon={<Bug size={18} />}
               title={t("settings.application.reportProblem")}
               subtitle={t("settings.application.reportProblem.subtitle")}
-              onClick={() => void openExternal(issueUrl)}
+              onClick={() => void handleOpenExternal(issueUrl)}
             />
             <ActionRow
               icon={<MessageCircle size={18} />}
               title={t("settings.application.community")}
               subtitle={t("settings.application.community.subtitle")}
-              onClick={() => void openExternal(discussionsUrl)}
+              onClick={() => void handleOpenExternal(discussionsUrl)}
             />
             <ActionRow
               icon={<Github size={18} />}
               title="GitHub"
               subtitle={t("settings.application.github.subtitle")}
-              onClick={() => void openExternal(REPO_URL)}
+              onClick={() => void handleOpenExternal(REPO_URL)}
             />
             <ActionRow
               icon={<Newspaper size={18} />}
               title={t("settings.application.whatsNew")}
               subtitle={t("settings.application.whatsNew.subtitle")}
-              onClick={() => void openExternal(releasesUrl)}
+              onClick={() => void handleOpenExternal(releasesUrl)}
             />
           </div>
         </div>

components/SettingsPage.tsx

@@ -12,6 +12,7 @@ import { useWindowControls } from "../application/state/useWindowControls";
 import { useUpdateCheck } from "../application/state/useUpdateCheck";
 import { useAIState } from "../application/state/useAIState";
 import { I18nProvider, useI18n } from "../application/i18n/I18nProvider";
+import { sanitizePortForwardingRulesForSync } from "../application/syncPayload";
 import SettingsApplicationTab from "./SettingsApplicationTab";
 import SettingsAppearanceTab from "./settings/tabs/SettingsAppearanceTab";
 import SettingsFileAssociationsTab from "./settings/tabs/SettingsFileAssociationsTab";
@@ -20,6 +21,7 @@ import SettingsTerminalTab from "./settings/tabs/SettingsTerminalTab";
 import SettingsSystemTab from "./settings/tabs/SettingsSystemTab";
 const SettingsAITab = React.lazy(() => import("./settings/tabs/SettingsAITab"));
 import { Tabs, TabsList, TabsTrigger } from "./ui/tabs";
+import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip";
 
 const isMac = typeof navigator !== "undefined" && /Mac|iPhone|iPad/.test(navigator.platform);
 
@@ -41,7 +43,7 @@ class AITabErrorBoundary extends React.Component<
         </div>
       );
     }
-    return this.props.children;
+    return (this.props as { children: React.ReactNode }).children;
   }
 }
 
@@ -49,6 +51,11 @@ type SettingsState = ReturnType<typeof useSettingsState>;
 
 const SettingsSyncTab = React.lazy(() => import("./settings/tabs/SettingsSyncTab"));
 
+const settingsTabTriggerClassName =
+    "w-full justify-start gap-2 px-3 py-2 text-sm data-[state=active]:bg-background hover:bg-background/60 rounded-md transition-colors overflow-hidden";
+const settingsTabIconClassName = "shrink-0";
+const settingsTabLabelClassName = "min-w-0 truncate";
+
 const SettingsTerminalTabContainer: React.FC<{ settings: SettingsState }> = ({ settings }) => {
     const availableFonts = useAvailableFonts();
 
@@ -56,6 +63,8 @@ const SettingsTerminalTabContainer: React.FC<{ settings: SettingsState }> = ({ s
         <SettingsTerminalTab
             terminalThemeId={settings.terminalThemeId}
             setTerminalThemeId={settings.setTerminalThemeId}
+            followAppTerminalTheme={settings.followAppTerminalTheme}
+            setFollowAppTerminalTheme={settings.setFollowAppTerminalTheme}
             terminalFontFamilyId={settings.terminalFontFamilyId}
             setTerminalFontFamilyId={settings.setTerminalFontFamilyId}
             terminalFontSize={settings.terminalFontSize}
@@ -86,6 +95,8 @@ const SettingsAITabContainer: React.FC = () => {
                     setActiveModelId={aiState.setActiveModelId}
                     globalPermissionMode={aiState.globalPermissionMode}
                     setGlobalPermissionMode={aiState.setGlobalPermissionMode}
+                    toolIntegrationMode={aiState.toolIntegrationMode}
+                    setToolIntegrationMode={aiState.setToolIntegrationMode}
                     externalAgents={aiState.externalAgents}
                     setExternalAgents={aiState.setExternalAgents}
                     defaultAgentId={aiState.defaultAgentId}
@@ -109,6 +120,7 @@ const SettingsSyncTabWithVault: React.FC<{ onSettingsApplied?: () => void }> = (
         hosts,
         keys,
         identities,
+        proxyProfiles,
         snippets,
         customGroups,
         snippetPackages,
@@ -122,19 +134,13 @@ const SettingsSyncTabWithVault: React.FC<{ onSettingsApplied?: () => void }> = (
 
     // Strip transient runtime fields before passing to sync
     const portForwardingRulesForSync = useMemo(
-        () =>
-            portForwardingRules.map((rule) => ({
-                ...rule,
-                status: "inactive" as const,
-                error: undefined,
-                lastUsedAt: undefined,
-            })),
+        () => sanitizePortForwardingRulesForSync(portForwardingRules) ?? [],
         [portForwardingRules],
     );
 
     const vault = useMemo(
-        () => ({ hosts, keys, identities, snippets, customGroups, snippetPackages, knownHosts, groupConfigs }),
-        [hosts, keys, identities, snippets, customGroups, snippetPackages, knownHosts, groupConfigs],
+        () => ({ hosts, keys, identities, proxyProfiles, snippets, customGroups, snippetPackages, knownHosts, groupConfigs }),
+        [hosts, keys, identities, proxyProfiles, snippets, customGroups, snippetPackages, knownHosts, groupConfigs],
     );
 
     return (
@@ -182,13 +188,17 @@ const SettingsPageContent: React.FC<{ settings: SettingsState }> = ({ settings }
                 <div className="flex items-center justify-between px-4 py-2">
                     <h1 className="text-lg font-semibold">{t("settings.title")}</h1>
                     {!isMac && (
-                        <button
-                            onClick={handleClose}
-                            className="app-no-drag w-8 h-8 flex items-center justify-center rounded-md hover:bg-destructive/20 hover:text-destructive transition-colors text-muted-foreground"
-                            title={t("common.close")}
-                        >
-                            <X size={16} />
-                        </button>
+                        <Tooltip>
+                            <TooltipTrigger asChild>
+                                <button
+                                    onClick={handleClose}
+                                    className="app-no-drag w-8 h-8 flex items-center justify-center rounded-md hover:bg-destructive/20 hover:text-destructive transition-colors text-muted-foreground"
+                                >
+                                    <X size={16} />
+                                </button>
+                            </TooltipTrigger>
+                            <TooltipContent>{t("common.close")}</TooltipContent>
+                        </Tooltip>
                     )}
                 </div>
             </div>
@@ -203,51 +213,59 @@ const SettingsPageContent: React.FC<{ settings: SettingsState }> = ({ settings }
                     <TabsList className="flex flex-col h-auto bg-transparent gap-1 p-0 justify-start">
                         <TabsTrigger
                             value="application"
-                            className="w-full justify-start gap-2 px-3 py-2 text-sm data-[state=active]:bg-background hover:bg-background/60 rounded-md transition-colors"
+                            className={settingsTabTriggerClassName}
                         >
-                            <AppWindow size={14} /> {t("settings.tab.application")}
+                            <AppWindow size={14} className={settingsTabIconClassName} />
+                            <span className={settingsTabLabelClassName}>{t("settings.tab.application")}</span>
                         </TabsTrigger>
                         <TabsTrigger
                             value="appearance"
-                            className="w-full justify-start gap-2 px-3 py-2 text-sm data-[state=active]:bg-background hover:bg-background/60 rounded-md transition-colors"
+                            className={settingsTabTriggerClassName}
                         >
-                            <Palette size={14} /> {t("settings.tab.appearance")}
+                            <Palette size={14} className={settingsTabIconClassName} />
+                            <span className={settingsTabLabelClassName}>{t("settings.tab.appearance")}</span>
                         </TabsTrigger>
                         <TabsTrigger
                             value="terminal"
-                            className="w-full justify-start gap-2 px-3 py-2 text-sm data-[state=active]:bg-background hover:bg-background/60 rounded-md transition-colors"
+                            className={settingsTabTriggerClassName}
                         >
-                            <TerminalSquare size={14} /> {t("settings.tab.terminal")}
+                            <TerminalSquare size={14} className={settingsTabIconClassName} />
+                            <span className={settingsTabLabelClassName}>{t("settings.tab.terminal")}</span>
                         </TabsTrigger>
                         <TabsTrigger
                             value="shortcuts"
-                            className="w-full justify-start gap-2 px-3 py-2 text-sm data-[state=active]:bg-background hover:bg-background/60 rounded-md transition-colors"
+                            className={settingsTabTriggerClassName}
                         >
-                            <Keyboard size={14} /> {t("settings.tab.shortcuts")}
+                            <Keyboard size={14} className={settingsTabIconClassName} />
+                            <span className={settingsTabLabelClassName}>{t("settings.tab.shortcuts")}</span>
                         </TabsTrigger>
                         <TabsTrigger
                             value="file-associations"
-                            className="w-full justify-start gap-2 px-3 py-2 text-sm data-[state=active]:bg-background hover:bg-background/60 rounded-md transition-colors"
+                            className={settingsTabTriggerClassName}
                         >
-                            <FileType size={14} /> {t("settings.tab.sftpFileAssociations")}
+                            <FileType size={14} className={settingsTabIconClassName} />
+                            <span className={settingsTabLabelClassName}>{t("settings.tab.sftpFileAssociations")}</span>
                         </TabsTrigger>
                         <TabsTrigger
                             value="ai"
-                            className="w-full justify-start gap-2 px-3 py-2 text-sm data-[state=active]:bg-background hover:bg-background/60 rounded-md transition-colors"
+                            className={settingsTabTriggerClassName}
                         >
-                            <Sparkles size={14} /> AI
+                            <Sparkles size={14} className={settingsTabIconClassName} />
+                            <span className={settingsTabLabelClassName}>AI</span>
                         </TabsTrigger>
                         <TabsTrigger
                             value="sync"
-                            className="w-full justify-start gap-2 px-3 py-2 text-sm data-[state=active]:bg-background hover:bg-background/60 rounded-md transition-colors"
+                            className={settingsTabTriggerClassName}
                         >
-                            <Cloud size={14} /> {t("settings.tab.syncCloud")}
+                            <Cloud size={14} className={settingsTabIconClassName} />
+                            <span className={settingsTabLabelClassName}>{t("settings.tab.syncCloud")}</span>
                         </TabsTrigger>
                         <TabsTrigger
                             value="system"
-                            className="w-full justify-start gap-2 px-3 py-2 text-sm data-[state=active]:bg-background hover:bg-background/60 rounded-md transition-colors"
+                            className={settingsTabTriggerClassName}
                         >
-                            <HardDrive size={14} /> {t("settings.tab.system")}
+                            <HardDrive size={14} className={settingsTabIconClassName} />
+                            <span className={settingsTabLabelClassName}>{t("settings.tab.system")}</span>
                         </TabsTrigger>
                     </TabsList>
                 </div>
@@ -282,6 +300,12 @@ const SettingsPageContent: React.FC<{ settings: SettingsState }> = ({ settings }
                             setUiLanguage={settings.setUiLanguage}
                             customCSS={settings.customCSS}
                             setCustomCSS={settings.setCustomCSS}
+                            showRecentHosts={settings.showRecentHosts}
+                            setShowRecentHosts={settings.setShowRecentHosts}
+                            showOnlyUngroupedHostsInRoot={settings.showOnlyUngroupedHostsInRoot}
+                            setShowOnlyUngroupedHostsInRoot={settings.setShowOnlyUngroupedHostsInRoot}
+                            showSftpTab={settings.showSftpTab}
+                            setShowSftpTab={settings.setShowSftpTab}
                         />
                     )}
 

components/SftpPaneFileList.test.tsx

@@ -0,0 +1,72 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+
+import type { SftpFileEntry } from "../types.ts";
+import {
+  getSftpListUploadFilesTargetPath,
+  getSftpTreeUploadFilesTargetPath,
+  getSftpUploadFilesLabelKey,
+  getSftpUploadFolderLabelKey,
+  shouldShowSftpUploadFolderMenu,
+  shouldShowSftpUploadFilesMenu,
+} from "./sftp/sftpUploadMenu.ts";
+
+const baseEntry: SftpFileEntry = {
+  name: "notes.txt",
+  type: "file",
+  size: 1,
+  sizeFormatted: "1 B",
+  lastModified: 1,
+  lastModifiedFormatted: "now",
+};
+
+test("upload file menu is shown only for remote panes with a picker upload handler", () => {
+  assert.equal(shouldShowSftpUploadFilesMenu({ isLocal: false, hasFileListUpload: true }), true);
+  assert.equal(shouldShowSftpUploadFilesMenu({ isLocal: true, hasFileListUpload: true }), false);
+  assert.equal(shouldShowSftpUploadFilesMenu({ isLocal: false, hasFileListUpload: false }), false);
+});
+
+test("upload folder menu is shown only for remote panes with a folder upload handler", () => {
+  assert.equal(shouldShowSftpUploadFolderMenu({ isLocal: false, hasFolderUpload: true }), true);
+  assert.equal(shouldShowSftpUploadFolderMenu({ isLocal: true, hasFolderUpload: true }), false);
+  assert.equal(shouldShowSftpUploadFolderMenu({ isLocal: false, hasFolderUpload: false }), false);
+});
+
+test("directory row upload targets that directory without using its name in the label", () => {
+  const directoryEntry: SftpFileEntry = {
+    ...baseEntry,
+    name: "a-very-long-folder-name-that-should-not-expand-the-context-menu",
+    type: "directory",
+  };
+
+  assert.equal(
+    getSftpListUploadFilesTargetPath(directoryEntry, "/home/app"),
+    "/home/app/a-very-long-folder-name-that-should-not-expand-the-context-menu",
+  );
+  assert.equal(getSftpUploadFilesLabelKey(directoryEntry), "sftp.context.uploadFilesHere");
+  assert.equal(getSftpUploadFolderLabelKey(directoryEntry), "sftp.context.uploadFolderHere");
+});
+
+test("file row upload targets the current directory", () => {
+  assert.equal(getSftpListUploadFilesTargetPath(baseEntry, "/home/app"), undefined);
+  assert.equal(getSftpUploadFilesLabelKey(baseEntry), "sftp.context.uploadFiles");
+  assert.equal(getSftpUploadFolderLabelKey(baseEntry), "sftp.context.uploadFolder");
+});
+
+test("tree directory row upload targets that directory", () => {
+  const directoryEntry: SftpFileEntry = {
+    ...baseEntry,
+    name: "logs",
+    type: "directory",
+  };
+
+  assert.equal(getSftpTreeUploadFilesTargetPath(directoryEntry, "/var/logs"), "/var/logs");
+  assert.equal(getSftpUploadFilesLabelKey(directoryEntry), "sftp.context.uploadFilesHere");
+  assert.equal(getSftpUploadFolderLabelKey(directoryEntry), "sftp.context.uploadFolderHere");
+});
+
+test("tree file row upload targets the file parent directory", () => {
+  assert.equal(getSftpTreeUploadFilesTargetPath(baseEntry, "/var/logs/app.log"), "/var/logs");
+  assert.equal(getSftpUploadFilesLabelKey(baseEntry), "sftp.context.uploadFiles");
+  assert.equal(getSftpUploadFolderLabelKey(baseEntry), "sftp.context.uploadFolder");
+});