From 84b3bc1c90e422295dc7ca21ca82d634a4f1c153 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 02:35:59 +0200
Subject: [PATCH 01/48] feat(workbench): implement center tab management and
 file preview functionality

- Added support for center tabs in the workspace, including dynamic tab creation and management.
- Introduced `CenterTab` and `CenterTabKind` structures to represent different types of tabs.
- Implemented functions to handle opening, closing, and switching between center tabs.
- Enhanced the workspace layout to accommodate center tabs and their respective content panels.
- Added a file preview feature that allows users to view file contents directly within the workspace.
- Updated styles for the new center tab interface and file preview components.
- Refactored existing workspace and terminal management code to integrate with the new tab system.
---
 CHANGELOG.md                          |   4 +
 src-tauri/src/commands.rs             |  11 +
 src-tauri/src/fs_entries.rs           | 105 +++++-
 src-tauri/src/lib.rs                  |   2 +
 src/config/app.config.rs              |   5 +
 src/i18n/keys.rs                      |   5 +
 src/i18n/locales/de_de.rs             |  11 +-
 src/i18n/locales/en_us.rs             |   9 +-
 src/i18n/locales/es_es.rs             |  47 +--
 src/i18n/locales/fr_fr.rs             |  47 +--
 src/i18n/locales/hu_hu.rs             |  47 +--
 src/i18n/locales/it_it.rs             |  47 +--
 src/i18n/locales/ja_jp.rs             |  47 +--
 src/i18n/locales/ko_kr.rs             |  47 +--
 src/i18n/locales/pl_pl.rs             |  47 +--
 src/i18n/locales/pt_br.rs             |  47 +--
 src/i18n/locales/ru_ru.rs             |  47 +--
 src/i18n/locales/zh_cn.rs             |  47 +--
 src/i18n/locales/zh_tw.rs             |  47 +--
 src/tauri_bridge.rs                   |  34 ++
 src/workbench/harness_ui.rs           | 385 ++++++++------------
 src/workbench/mod.rs                  |   7 +-
 src/workbench/project_explorer/mod.rs |  10 +-
 src/workbench/state.rs                | 313 +++++++++++++++--
 src/workbench/workspace_panel.rs      | 488 ++++++++++++++++++--------
 styles.css                            | 286 ++++++++++++++-
 26 files changed, 1533 insertions(+), 659 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index f489b07..8227fc6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,6 +9,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Added
 
+- **Center multi-view tabs**: the workspace pane now hosts a VS Code-style tab strip above the terminal grid. The pinned **Terminals** tab is non-closeable and always renders the existing PTY layout; additional tabs are opened dynamically and closed via the strip. Per-workspace state (`center_tabs`, `center_active_tab_id`, `center_next_tab_id`) is persisted in the workspace snapshot with tolerant serde defaults so older snapshots load cleanly and self-heal to include the Terminals tab. Switching tabs hides (rather than unmounts) the terminal grid so xterm sessions and PTYs are never recreated. Active-tab tracking is wired into `is_workspace_active` so terminal focus/resize observers only fire when the Terminals tab is visible.
+- **File preview tab**: clicking a file row in the sidebar Project Explorer opens (or reuses) a center tab that renders the file's text contents. New Tauri command `read_workspace_text_file` (`src-tauri/src/fs_entries.rs`) reads UTF-8 text under the workspace root with the same `canonical_root` / `resolve_under_root` sandbox the existing `list_path_entries` uses, hard-caps at 512 KiB (`MAX_TEXT_PREVIEW_BYTES`) and returns `{ content, truncated, byteLen }`. Non-text payloads surface `file is not valid UTF-8 text`, directories `not a file`, and out-of-root paths the existing `outside workspace` error. The new `tauri_bridge::read_workspace_text_file` wrapper plus `TextFilePreview` mirror the payload shape. 4 unit tests pin the happy path, traversal rejection, directory rejection, and missing-file rejection.
+- **Docked settings tab**: the harness settings UI moved out of the modal `SettingsChrome` overlay and into a `SettingsDock` component rendered inside a dynamic center tab. Opening settings (command palette `Open Settings`, etc.) now calls `WorkbenchService::open_center_settings_tab` which reuses any existing settings tab for the active workspace instead of stacking duplicates. The legacy scrim + focus-trap helpers (`focus_first_settings_control`, `settings_focusables`, `trap_settings_tab`) and `HarnessUiService::open_settings` are gone; `HarnessSettingsCategory` is now `Serialize/Deserialize` so it can ride along with the snapshot. The chat header, right panel and other categories continue to interact with the existing `settings_category` signal.
 - **GitHub Releases auto-updater**: BLXCode now wires Tauri v2's updater/process plugins with a signed GitHub Releases `latest.json` endpoint, desktop IPC for `app_version`, `updater_check`, `updater_install_start`, progress polling, and relaunch, plus a Leptos startup banner and themed update dialog with release notes, progress, speed, retry, and restart states. Settings -> App gains a persisted startup auto-check toggle and manual update check. Release automation now supports the hybrid flow: macOS/Windows artifacts are built in GitHub Actions, Linux artifacts can be built locally to save CI cost, `.deb`/`.rpm` stay manual download assets, and signed updater-capable payloads are merged into one canonical `latest.json`. Tauri updater signing is documented as separate from Apple/Microsoft installer certificates.
 - **Boot loading screen**: new branded loading experience that paints before the WASM bundle is ready and stays on screen until the workbench is mounted. `index.html` ships a static `#blx-static-boot` section (logo, eyebrow, faux workbench preview, animated rail) so the first paint happens immediately on Trunk-served HTML; once Leptos mounts, the static node is removed and `BootLoadingScreen` (`src/boot_loading.rs`) takes over with phased copy (`Starting BLXCode` → `Restoring workspace` → `Opening workbench`). 306 lines of dedicated CSS in `styles.css` add the radial-gradient backdrop, frame-enter / sheen / rail keyframes, and the sidebar/main/panel preview skeleton. The `App` boot fallback now renders `<BootLoadingScreen phase=app_boot_phase.get()/>` instead of the prior empty `app-shell--boot` div.
 - **Agent question card (`harness.ask_user`)**: new client-side tool that lets the coordinator agent ask a clarifying multiple-choice question and receive the user's answer as a structured tool result. Backend registers `harness.ask_user` (`src-tauri/src/agent/tools.rs`) with a JSON schema accepting `question`, optional `header` (≤12 chars), 2–4 `options` (label + optional description), `multiSelect`, and `allowOther`; the tool sits in the `CoordinatorHarness` group (subagents excluded) and the system prompt instructs the model to use it only when 2–4 distinct options would unblock progress. Frontend adds a new `TimelineItem::AskUser` variant and `ask_user_card/` component (Angular-style folder with co-located CSS) rendering a chat bubble with numbered option buttons, single- or multi-select mode, an optional free-text “Other” field, and a cancel button; the card submits via `agent_submit_tool_result` and transitions the row state to `Answered { selected, other }` or `Cancelled` so the bubble stays visible with disabled controls. Persistence drops `Open` ask-user rows from the saved timeline (the awaiting backend loop is dead after reload). Tool-result payload: `{ "selected": [...], "other": "...", "cancelled": false }`; on cancel: `ok=false` + `{ "cancelled": true }`. 8 new i18n keys (`AgAskUser*`) added in `en_us.rs` and `de_de.rs`; other locales receive English placeholders pending a `render_i18n_locales_from_en.py` pass.
@@ -17,6 +20,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Changed
 
 - **`ChatUsageStats` schema migrated**: `total_cost_usd: f64` and `current_turn_generation: u64` added; legacy `ttft_sum_ms` / `ttft_sample_count` fields removed (TTFT now lives per-row). Older `workbench.json` snapshots deserialize cleanly thanks to `#[serde(default)]` and rewrite without the removed fields on next save. `record_chat_turn_usage` signature changed to accept the new `turn_generation` and `cost_usd` and to return `bool` so callers can drop stale events.
+- **Settings panel restructured**: `AppSettingsPane` (`src/workbench/harness_ui.rs`) now reads top-to-bottom as Language → Keyboard shortcuts → Notifications → **Terminal hooks** → **App updates** (updates moved below hooks to put install actions closer to the per-agent hook list). Keyboard shortcuts and Notifications switched from single-column lists to 2-column grids (new `.app-prefs-shortcut-modes--grid` and `.app-prefs-toggle-grid`). Current version no longer renders inside a readonly `<input>` — it's now a styled `<dl>` row, and a sibling **Available version** row only appears when `UpdateService::available_version` is `Some`. Terminal hooks list (`.harness-hooks__list--grid`) lays out as 3 columns on wide screens, collapsing to 2 / 1 below 900 px / 600 px; status badges dropped from pill (`border-radius: 999px`) to sm (`4px`) rounding. The EULA status row was removed from the App pane (acceptance is still gated at boot; the field added no actionable signal here). Workspace pane changed the agent sandbox `<textarea>` to a single-line `<input>` and gained a new **Default project directory** field above it: persisted to `blxcode_default_project_dir_v1` via new `WorkbenchService::default_project_dir` signal + setters/persist, seeded from the user's home directory through a new `harness_user_home_dir` Tauri command (`src-tauri/src/commands.rs`) on first run. Inline workspace configuration (`start_inline_configure` and snapshot hydration) now prefills new workspace `cwd` from `default_project_dir`, falling back to the agent sandbox root only when blank — sandbox path is reserved for BLXCode Agent sandbox actions. New i18n keys `AppUpdateAvailableVersion`, `WsRootHint`, `WsDefaultProjectDirLabel/Placeholder/Hint` added across all 13 locale files (English authored; other locales carry English placeholders until `scripts/tools/render_i18n_locales_from_en.py` runs).
 
 ### Fixed
 
diff --git a/src-tauri/src/commands.rs b/src-tauri/src/commands.rs
index c84d145..6b4cdd9 100644
--- a/src-tauri/src/commands.rs
+++ b/src-tauri/src/commands.rs
@@ -431,6 +431,17 @@ pub fn agent_submit_tool_result(
     agent.deliver_client_tool_result(&payload.call_id, payload.ok, payload.message, payload.data)
 }
 
+/// Returns the user's home directory as a string. Used as the default for
+/// the "default project directory" setting that seeds new workspace cwds.
+#[tauri::command]
+pub fn harness_user_home_dir(app: AppHandle) -> Result<String, String> {
+    let home = app
+        .path()
+        .home_dir()
+        .map_err(|e| format!("home dir unavailable: {e}"))?;
+    Ok(home.to_string_lossy().into_owned())
+}
+
 /// Returns (and idempotently creates) the default sandbox directory under
 /// the app data dir. Used as a guaranteed-non-empty fallback workspace
 /// root so the agent always has a writable scope to play in.
diff --git a/src-tauri/src/fs_entries.rs b/src-tauri/src/fs_entries.rs
index 5ff52a3..d01bd09 100644
--- a/src-tauri/src/fs_entries.rs
+++ b/src-tauri/src/fs_entries.rs
@@ -3,6 +3,8 @@
 use std::fs;
 use std::path::{Path, PathBuf};
 
+const MAX_TEXT_PREVIEW_BYTES: u64 = 512 * 1024;
+
 #[derive(Debug, Clone, PartialEq, Eq, serde::Serialize)]
 #[serde(rename_all = "camelCase")]
 pub struct FsEntryBrief {
@@ -11,6 +13,14 @@ pub struct FsEntryBrief {
     pub hidden: bool,
 }
 
+#[derive(Debug, Clone, PartialEq, Eq, serde::Serialize)]
+#[serde(rename_all = "camelCase")]
+pub struct TextFilePreview {
+    pub content: String,
+    pub truncated: bool,
+    pub byte_len: u64,
+}
+
 fn canonical_root(workspace_root: &str) -> Result<PathBuf, String> {
     let trimmed = workspace_root.trim();
     if trimmed.is_empty() {
@@ -43,7 +53,10 @@ fn resolve_under_root(root: &Path, rel_or_abs: &str) -> Result<PathBuf, String>
 
 /// Lists files and directories under `path`, constrained to `workspace_root`.
 #[tauri::command]
-pub fn list_path_entries(workspace_root: String, path: String) -> Result<Vec<FsEntryBrief>, String> {
+pub fn list_path_entries(
+    workspace_root: String,
+    path: String,
+) -> Result<Vec<FsEntryBrief>, String> {
     let root = canonical_root(&workspace_root)?;
     let dir = resolve_under_root(&root, &path)?;
     if !dir.is_dir() {
@@ -66,19 +79,44 @@ pub fn list_path_entries(workspace_root: String, path: String) -> Result<Vec<FsE
             })
         })
         .collect();
-    out.sort_by(|a, b| {
-        match (a.is_dir, b.is_dir) {
-            (true, false) => std::cmp::Ordering::Less,
-            (false, true) => std::cmp::Ordering::Greater,
-            _ => a
-                .name
-                .to_ascii_lowercase()
-                .cmp(&b.name.to_ascii_lowercase()),
-        }
+    out.sort_by(|a, b| match (a.is_dir, b.is_dir) {
+        (true, false) => std::cmp::Ordering::Less,
+        (false, true) => std::cmp::Ordering::Greater,
+        _ => a
+            .name
+            .to_ascii_lowercase()
+            .cmp(&b.name.to_ascii_lowercase()),
     });
     Ok(out)
 }
 
+/// Reads a UTF-8 text file under `workspace_root` for the center preview tab.
+#[tauri::command]
+pub fn read_workspace_text_file(
+    workspace_root: String,
+    path: String,
+) -> Result<TextFilePreview, String> {
+    let root = canonical_root(&workspace_root)?;
+    let file = resolve_under_root(&root, &path)?;
+    if !file.is_file() {
+        return Err("not a file".into());
+    }
+    let meta = fs::metadata(&file).map_err(|e| e.to_string())?;
+    let byte_len = meta.len();
+    let mut bytes = fs::read(&file).map_err(|e| e.to_string())?;
+    let truncated = byte_len > MAX_TEXT_PREVIEW_BYTES;
+    if truncated {
+        bytes.truncate(MAX_TEXT_PREVIEW_BYTES as usize);
+    }
+    let content =
+        String::from_utf8(bytes).map_err(|_| "file is not valid UTF-8 text".to_string())?;
+    Ok(TextFilePreview {
+        content,
+        truncated,
+        byte_len,
+    })
+}
+
 #[cfg(test)]
 mod tests {
     use super::*;
@@ -96,4 +134,51 @@ mod tests {
         assert_eq!(entries[0].name, "a_dir");
         let _ = fs::remove_dir_all(tmp);
     }
+
+    #[test]
+    fn read_workspace_text_file_reads_under_root() {
+        let tmp = std::env::temp_dir().join(format!("blx_fs_{}", uuid::Uuid::new_v4()));
+        fs::create_dir_all(&tmp).unwrap();
+        fs::write(tmp.join("hello.txt"), b"hello").unwrap();
+        let root = tmp.to_string_lossy().into_owned();
+        let preview = read_workspace_text_file(root, "hello.txt".into()).unwrap();
+        assert_eq!(preview.content, "hello");
+        assert!(!preview.truncated);
+        assert_eq!(preview.byte_len, 5);
+        let _ = fs::remove_dir_all(tmp);
+    }
+
+    #[test]
+    fn read_workspace_text_file_rejects_outside_root() {
+        let tmp = std::env::temp_dir().join(format!("blx_fs_{}", uuid::Uuid::new_v4()));
+        fs::create_dir_all(&tmp).unwrap();
+        let outside = std::env::temp_dir().join(format!("blx_fs_out_{}", uuid::Uuid::new_v4()));
+        fs::write(&outside, b"outside").unwrap();
+        let root = tmp.to_string_lossy().into_owned();
+        let err = read_workspace_text_file(root, outside.to_string_lossy().into_owned())
+            .expect_err("outside path should fail");
+        assert!(err.contains("outside workspace"));
+        let _ = fs::remove_dir_all(tmp);
+        let _ = fs::remove_file(outside);
+    }
+
+    #[test]
+    fn read_workspace_text_file_rejects_directories() {
+        let tmp = std::env::temp_dir().join(format!("blx_fs_{}", uuid::Uuid::new_v4()));
+        fs::create_dir_all(tmp.join("dir")).unwrap();
+        let root = tmp.to_string_lossy().into_owned();
+        let err = read_workspace_text_file(root, "dir".into()).expect_err("directory should fail");
+        assert_eq!(err, "not a file");
+        let _ = fs::remove_dir_all(tmp);
+    }
+
+    #[test]
+    fn read_workspace_text_file_handles_missing_files() {
+        let tmp = std::env::temp_dir().join(format!("blx_fs_{}", uuid::Uuid::new_v4()));
+        fs::create_dir_all(&tmp).unwrap();
+        let root = tmp.to_string_lossy().into_owned();
+        let err = read_workspace_text_file(root, "missing.txt".into()).expect_err("missing");
+        assert!(err.contains("path not found"));
+        let _ = fs::remove_dir_all(tmp);
+    }
 }
diff --git a/src-tauri/src/lib.rs b/src-tauri/src/lib.rs
index f29b7a3..80d07d4 100644
--- a/src-tauri/src/lib.rs
+++ b/src-tauri/src/lib.rs
@@ -125,6 +125,7 @@ pub fn run() {
             agent_read_image_file,
             agent_export_context_images,
             harness_ensure_default_sandbox,
+            harness_user_home_dir,
             agent_settings_get,
             agent_settings_save,
             agent_api_key_set,
@@ -151,6 +152,7 @@ pub fn run() {
             git_graph::git_is_repository,
             git_graph::git_commit_graph,
             fs_entries::list_path_entries,
+            fs_entries::read_workspace_text_file,
             install_agent_hooks,
             agent_hooks_status,
             uninstall_agent_hooks,
diff --git a/src/config/app.config.rs b/src/config/app.config.rs
index 1797847..f395c2b 100644
--- a/src/config/app.config.rs
+++ b/src/config/app.config.rs
@@ -20,6 +20,11 @@ pub const MEMORY_COLOR_PRESETS_STORAGE_KEY: &str = "blxcode_memory_color_presets
 /// `localStorage` key for agent workspace root (tool sandbox).
 pub const HARNESS_WORKSPACE_ROOT_KEY: &str = "blxcode_harness_workspace_root_v1";
 
+/// `localStorage` key for the default project / development directory
+/// used to seed the cwd of newly created workspaces. Defaults to the
+/// user's home directory when blank.
+pub const DEFAULT_PROJECT_DIR_KEY: &str = "blxcode_default_project_dir_v1";
+
 /// Default URL for embedded browser tab.
 pub const HARNESS_BROWSER_DEFAULT_URL: &str = "https://blxcode.com";
 
diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index 58488ef..d45f5de 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -200,6 +200,7 @@ pub enum I18nKey {
     AppUpdateAutoCheck,
     AppUpdateAutoCheckHint,
     AppUpdateCurrentVersion,
+    AppUpdateAvailableVersion,
     AppUpdateCheck,
     AppUpdateChecking,
     AppUpdateUpToDate,
@@ -330,6 +331,10 @@ pub enum I18nKey {
     WsBrowserDefault,
     WsRootLabel,
     WsRootPlaceholder,
+    WsDefaultProjectDirLabel,
+    WsDefaultProjectDirPlaceholder,
+    WsDefaultProjectDirHint,
+    WsRootHint,
     AgProviderHeading,
     AgProviderField,
     AgProviderOpenrouter,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index a40ce63..b275f4b 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -8,7 +8,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::GitignorePromptTitle => ".blxcode zur .gitignore hinzufügen?",
         I18nKey::GitignorePromptBody => {
             "BLXCode speichert lokale Workspace-Daten (Aufgaben, Sitzungen) im Ordner `.blxcode`. \nSoll dieser Eintrag in die `.gitignore` dieses Projekts aufgenommen werden, damit er nicht versehentlich committed wird?"
-        },
+        }
         I18nKey::GitignorePromptYes => "Ja, hinzufügen",
         I18nKey::GitignorePromptNo => "Nicht jetzt",
         I18nKey::BtnClose => "Schließen",
@@ -194,10 +194,9 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifSoundHint => "Kurzer Ton bei erfolgreichen Handoff-Aktionen.",
         I18nKey::AppUpdateHeading => "App-Updates",
         I18nKey::AppUpdateAutoCheck => "Beim Start nach Updates suchen",
-        I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode prueft GitHub Releases still und zeigt einen Banner, wenn ein Update bereitsteht."
-        }
+        I18nKey::AppUpdateAutoCheckHint => "BLXCode prueft GitHub Releases still und zeigt einen Banner, wenn ein Update bereitsteht.",
         I18nKey::AppUpdateCurrentVersion => "Aktuelle Version",
+        I18nKey::AppUpdateAvailableVersion => "Verfügbare Version",
         I18nKey::AppUpdateCheck => "Nach Updates suchen",
         I18nKey::AppUpdateChecking => "Pruefe...",
         I18nKey::AppUpdateUpToDate => "BLXCode ist aktuell.",
@@ -324,6 +323,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "Voreinstellung:",
         I18nKey::WsRootLabel => "Arbeitsbereich/Sandbox-Root",
         I18nKey::WsRootPlaceholder => "/abs/path/to/repo",
+        I18nKey::WsRootHint => "Wird nur vom BLXCode-Agenten für Sandbox-Dateiaktionen verwendet.",
+        I18nKey::WsDefaultProjectDirLabel => "Standardprojektverzeichnis",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
+        I18nKey::WsDefaultProjectDirHint => "Füllt das Arbeitsverzeichnis für neue Arbeitsbereiche vorab aus.",
         I18nKey::AgProviderHeading => "BLXCode-Agent-Anbieter",
         I18nKey::AgProviderField => "Anbieter",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index f519f7b..13ccc79 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -220,6 +220,7 @@ Add it to this project's `.gitignore` so it is not committed by mistake?"
             "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
         }
         I18nKey::AppUpdateCurrentVersion => "Current version",
+        I18nKey::AppUpdateAvailableVersion => "Available version",
         I18nKey::AppUpdateCheck => "Check for updates",
         I18nKey::AppUpdateChecking => "Checking...",
         I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
@@ -358,8 +359,12 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::WsHeading => "Workspace",
         I18nKey::LayBrowserUrl => "Default embedded browser URL",
         I18nKey::WsBrowserDefault => "Preset:",
-        I18nKey::WsRootLabel => "Workspace / sandbox root",
-        I18nKey::WsRootPlaceholder => "/abs/path/to/repo",
+        I18nKey::WsRootLabel => "Agent sandbox root",
+        I18nKey::WsRootPlaceholder => "/abs/path/to/sandbox",
+        I18nKey::WsRootHint => "Used only by BLXCode Agent for sandboxed file actions.",
+        I18nKey::WsDefaultProjectDirLabel => "Default project directory",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
+        I18nKey::WsDefaultProjectDirHint => "Pre-fills the working directory for new workspaces.",
         I18nKey::AgProviderHeading => "BLXCode Agent Provider",
         I18nKey::AgProviderField => "Provider",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index 8035f98..f8071b6 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -192,28 +192,29 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "Breve confirmación cuando se envía o adjunta contexto.",
         I18nKey::AppNotifSound => "Reproducir sonido de éxito",
         I18nKey::AppNotifSoundHint => "Tono breve sobre acciones de traspaso exitosas.",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
+        I18nKey::AppUpdateHeading => "Actualizaciones de aplicaciones",
+        I18nKey::AppUpdateAutoCheck => "Buscar actualizaciones al iniciar",
         I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+            "BLXCode comprueba las versiones de GitHub de forma silenciosa y muestra un banner cuando hay una actualización lista."
+        }
+        I18nKey::AppUpdateCurrentVersion => "Versión actual",
+        I18nKey::AppUpdateAvailableVersion => "Versión disponible",
+        I18nKey::AppUpdateCheck => "Buscar actualizaciones",
+        I18nKey::AppUpdateChecking => "De cheques...",
+        I18nKey::AppUpdateUpToDate => "BLXCode está actualizado.",
+        I18nKey::AppUpdateDevUnavailable => "El actualizador está deshabilitado en las compilaciones de desarrollo.",
+        I18nKey::UpdateBannerTitle => "Actualización disponible",
+        I18nKey::UpdateBannerAction => "Ver actualización",
+        I18nKey::UpdateDialogTitle => "Actualización del código BLX",
+        I18nKey::UpdateDialogInstall => "Instalar actualización",
+        I18nKey::UpdateDialogLater => "Más tarde",
+        I18nKey::UpdateDialogDownloading => "Descargando",
+        I18nKey::UpdateDialogInstalling => "Instalación",
+        I18nKey::UpdateDialogDone => "Listo para reiniciar",
+        I18nKey::UpdateDialogRelaunch => "Reanudar",
+        I18nKey::UpdateDialogRetry => "Rever",
+        I18nKey::UpdateDialogError => "La actualización falló",
+        I18nKey::UpdateDialogNotes => "Notas de la versión",
         I18nKey::AppShortcutHeading => "Atajos de teclado",
         I18nKey::AppShortcutModeTmux => "Estilo Tmux (Ctrl+b, luego tecla)",
         I18nKey::AppShortcutModeLegacy => "Clásico (Ctrl / Ctrl+Mayús)",
@@ -322,6 +323,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "Programar:",
         I18nKey::WsRootLabel => "Raíz del espacio de trabajo/zona de pruebas",
         I18nKey::WsRootPlaceholder => "/abs/ruta/al/repositorio",
+        I18nKey::WsRootHint => "Utilizado únicamente por BLXCode Agent para acciones de archivos en espacio aislado.",
+        I18nKey::WsDefaultProjectDirLabel => "Directorio de proyecto predeterminado",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$INICIO",
+        I18nKey::WsDefaultProjectDirHint => "Rellena previamente el directorio de trabajo para nuevos espacios de trabajo.",
         I18nKey::AgProviderHeading => "Proveedor de agentes BLXCode",
         I18nKey::AgProviderField => "Proveedor",
         I18nKey::AgProviderOpenrouter => "enrutador abierto",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index 3e171f3..e3077f3 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -194,28 +194,29 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "Brève confirmation lorsque le contexte est envoyé ou joint.",
         I18nKey::AppNotifSound => "Jouer le son du succès",
         I18nKey::AppNotifSoundHint => "Tonalité courte sur les actions de transfert réussies.",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
+        I18nKey::AppUpdateHeading => "Mises à jour de l'application",
+        I18nKey::AppUpdateAutoCheck => "Rechercher des mises à jour au démarrage",
         I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+            "BLXCode vérifie les versions de GitHub en silence et affiche une bannière lorsqu'une mise à jour est prête."
+        }
+        I18nKey::AppUpdateCurrentVersion => "Version actuelle",
+        I18nKey::AppUpdateAvailableVersion => "Version disponible",
+        I18nKey::AppUpdateCheck => "Vérifier les mises à jour",
+        I18nKey::AppUpdateChecking => "Vérification...",
+        I18nKey::AppUpdateUpToDate => "BLXCode est à jour.",
+        I18nKey::AppUpdateDevUnavailable => "Le programme de mise à jour est désactivé dans les versions de développement.",
+        I18nKey::UpdateBannerTitle => "Mise à jour disponible",
+        I18nKey::UpdateBannerAction => "Afficher la mise à jour",
+        I18nKey::UpdateDialogTitle => "Mise à jour du BLXCode",
+        I18nKey::UpdateDialogInstall => "Installer la mise à jour",
+        I18nKey::UpdateDialogLater => "Plus tard",
+        I18nKey::UpdateDialogDownloading => "Téléchargement",
+        I18nKey::UpdateDialogInstalling => "Installation",
+        I18nKey::UpdateDialogDone => "Prêt à redémarrer",
+        I18nKey::UpdateDialogRelaunch => "Redémarrage",
+        I18nKey::UpdateDialogRetry => "Réessayer",
+        I18nKey::UpdateDialogError => "La mise à jour a échoué",
+        I18nKey::UpdateDialogNotes => "Notes de version",
         I18nKey::AppShortcutHeading => "Raccourcis clavier",
         I18nKey::AppShortcutModeTmux => "Style Tmux (Ctrl+b, puis touche)",
         I18nKey::AppShortcutModeLegacy => "Classique (Ctrl / Ctrl+Maj)",
@@ -324,6 +325,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "Préréglage :",
         I18nKey::WsRootLabel => "Racine de l'espace de travail/bac à sable",
         I18nKey::WsRootPlaceholder => "/abs/chemin/vers/repo",
+        I18nKey::WsRootHint => "Utilisé uniquement par l'agent BLXCode pour les actions sur les fichiers en bac à sable.",
+        I18nKey::WsDefaultProjectDirLabel => "Répertoire du projet par défaut",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$ACCUEIL",
+        I18nKey::WsDefaultProjectDirHint => "Pré-remplit le répertoire de travail pour les nouveaux espaces de travail.",
         I18nKey::AgProviderHeading => "Fournisseur d'agents BLXCode",
         I18nKey::AgProviderField => "Fournisseur",
         I18nKey::AgProviderOpenrouter => "OuvrirRouter",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index 90554a9..f8ab4e5 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -192,28 +192,29 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "Rövid megerősítés a kontextus elküldésekor vagy csatolásakor.",
         I18nKey::AppNotifSound => "Játssz siker hangot",
         I18nKey::AppNotifSoundHint => "Rövid hang a sikeres átadási műveletekről.",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
+        I18nKey::AppUpdateHeading => "Alkalmazásfrissítések",
+        I18nKey::AppUpdateAutoCheck => "Indításkor ellenőrizze a frissítéseket",
         I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+            "A BLXCode csendben ellenőrzi a GitHub kiadásokat, és szalaghirdetést jelenít meg, amikor a frissítés készen áll."
+        }
+        I18nKey::AppUpdateCurrentVersion => "Jelenlegi verzió",
+        I18nKey::AppUpdateAvailableVersion => "Elérhető verzió",
+        I18nKey::AppUpdateCheck => "Ellenőrizze a frissítéseket",
+        I18nKey::AppUpdateChecking => "Ellenőrzés...",
+        I18nKey::AppUpdateUpToDate => "A BLXCode naprakész.",
+        I18nKey::AppUpdateDevUnavailable => "A frissítő le van tiltva a fejlesztési buildekben.",
+        I18nKey::UpdateBannerTitle => "Frissítés elérhető",
+        I18nKey::UpdateBannerAction => "Frissítés megtekintése",
+        I18nKey::UpdateDialogTitle => "BLXCode frissítés",
+        I18nKey::UpdateDialogInstall => "Frissítés telepítése",
+        I18nKey::UpdateDialogLater => "Később",
+        I18nKey::UpdateDialogDownloading => "Letöltés",
+        I18nKey::UpdateDialogInstalling => "Telepítés",
+        I18nKey::UpdateDialogDone => "Újraindításra kész",
+        I18nKey::UpdateDialogRelaunch => "Indítsa újra",
+        I18nKey::UpdateDialogRetry => "Próbálja újra",
+        I18nKey::UpdateDialogError => "A frissítés nem sikerült",
+        I18nKey::UpdateDialogNotes => "Kiadási megjegyzések",
         I18nKey::AppShortcutHeading => "Billentyűparancsok",
         I18nKey::AppShortcutModeTmux => "Tmux stílus (Ctrl+b, majd billentyű)",
         I18nKey::AppShortcutModeLegacy => "Klasszikus (Ctrl / Ctrl+Shift)",
@@ -322,6 +323,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "Előre beállított:",
         I18nKey::WsRootLabel => "Munkaterület / sandbox gyökér",
         I18nKey::WsRootPlaceholder => "/abs/path/to/repo",
+        I18nKey::WsRootHint => "Csak a BLXCode Agent használja sandbox fájlműveletekhez.",
+        I18nKey::WsDefaultProjectDirLabel => "Alapértelmezett projektkönyvtár",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
+        I18nKey::WsDefaultProjectDirHint => "Előre kitölti a munkakönyvtárat az új munkaterületekhez.",
         I18nKey::AgProviderHeading => "BLXCode ügynök szolgáltató",
         I18nKey::AgProviderField => "Szolgáltató",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index 43401ea..33042c2 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -192,28 +192,29 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "Breve conferma quando il contesto viene inviato o allegato.",
         I18nKey::AppNotifSound => "Riproduci il suono del successo",
         I18nKey::AppNotifSoundHint => "Tono breve sulle azioni di trasferimento riuscite.",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
+        I18nKey::AppUpdateHeading => "Aggiornamenti dell'app",
+        I18nKey::AppUpdateAutoCheck => "Controlla gli aggiornamenti all'avvio",
         I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+            "BLXCode controlla silenziosamente le versioni di GitHub e mostra un banner quando un aggiornamento è pronto."
+        }
+        I18nKey::AppUpdateCurrentVersion => "Versione attuale",
+        I18nKey::AppUpdateAvailableVersion => "Versione disponibile",
+        I18nKey::AppUpdateCheck => "Controlla gli aggiornamenti",
+        I18nKey::AppUpdateChecking => "Controllo...",
+        I18nKey::AppUpdateUpToDate => "BLXCode è aggiornato.",
+        I18nKey::AppUpdateDevUnavailable => "Il programma di aggiornamento è disabilitato nelle build di sviluppo.",
+        I18nKey::UpdateBannerTitle => "Aggiornamento disponibile",
+        I18nKey::UpdateBannerAction => "Visualizza aggiornamento",
+        I18nKey::UpdateDialogTitle => "Aggiornamento del codice BLX",
+        I18nKey::UpdateDialogInstall => "Installa l'aggiornamento",
+        I18nKey::UpdateDialogLater => "Dopo",
+        I18nKey::UpdateDialogDownloading => "Download in corso",
+        I18nKey::UpdateDialogInstalling => "Installazione",
+        I18nKey::UpdateDialogDone => "Pronti per ripartire",
+        I18nKey::UpdateDialogRelaunch => "Ricomincia",
+        I18nKey::UpdateDialogRetry => "Riprova",
+        I18nKey::UpdateDialogError => "Aggiornamento non riuscito",
+        I18nKey::UpdateDialogNotes => "Note sulla versione",
         I18nKey::AppShortcutHeading => "Scorciatoie da tastiera",
         I18nKey::AppShortcutModeTmux => "Stile Tmux (Ctrl+b, quindi tasto)",
         I18nKey::AppShortcutModeLegacy => "Classico (Ctrl/Ctrl+Maiusc)",
@@ -322,6 +323,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "Preimpostazione:",
         I18nKey::WsRootLabel => "Radice dell'area di lavoro/sandbox",
         I18nKey::WsRootPlaceholder => "/abs/percorso/del/repo",
+        I18nKey::WsRootHint => "Used only by BLXCode Agent for sandboxed file actions.",
+        I18nKey::WsDefaultProjectDirLabel => "Directory di progetto predefinita",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$CASA",
+        I18nKey::WsDefaultProjectDirHint => "Precompila la directory di lavoro per i nuovi spazi di lavoro.",
         I18nKey::AgProviderHeading => "Fornitore dell'agente BLXCode",
         I18nKey::AgProviderField => "Fornitore",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index 946c811..fe5452c 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -188,28 +188,27 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "コンテキストが送信または添付されるときの簡単な確認。",
         I18nKey::AppNotifSound => "成功音を鳴らす",
         I18nKey::AppNotifSoundHint => "成功したハンドオフアクションに関する短いトーン。",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
-        I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+        I18nKey::AppUpdateHeading => "アプリのアップデート",
+        I18nKey::AppUpdateAutoCheck => "起動時にアップデートを確認する",
+        I18nKey::AppUpdateAutoCheckHint => "BLXCode は GitHub リリースをサイレントにチェックし、更新の準備ができたらバナーを表示します。",
+        I18nKey::AppUpdateCurrentVersion => "現在のバージョン",
+        I18nKey::AppUpdateAvailableVersion => "利用可能なバージョン",
+        I18nKey::AppUpdateCheck => "アップデートをチェックする",
+        I18nKey::AppUpdateChecking => "チェック中...",
+        I18nKey::AppUpdateUpToDate => "BLXCodeは最新です。",
+        I18nKey::AppUpdateDevUnavailable => "開発ビルドではアップデーターは無効になっています。",
+        I18nKey::UpdateBannerTitle => "利用可能なアップデート",
+        I18nKey::UpdateBannerAction => "更新を見る",
+        I18nKey::UpdateDialogTitle => "BLXコードの更新",
+        I18nKey::UpdateDialogInstall => "アップデートをインストールする",
+        I18nKey::UpdateDialogLater => "後で",
+        I18nKey::UpdateDialogDownloading => "ダウンロード中",
+        I18nKey::UpdateDialogInstalling => "インストール中",
+        I18nKey::UpdateDialogDone => "再起動の準備ができました",
+        I18nKey::UpdateDialogRelaunch => "再起動",
+        I18nKey::UpdateDialogRetry => "リトライ",
+        I18nKey::UpdateDialogError => "アップデートに失敗しました",
+        I18nKey::UpdateDialogNotes => "リリースノート",
         I18nKey::AppShortcutHeading => "キーボードショートカット",
         I18nKey::AppShortcutModeTmux => "Tmux スタイル (Ctrl+b、次にキー)",
         I18nKey::AppShortcutModeLegacy => "クラシック (Ctrl / Ctrl+Shift)",
@@ -318,6 +317,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "プリセット：",
         I18nKey::WsRootLabel => "ワークスペース/サンドボックスのルート",
         I18nKey::WsRootPlaceholder => "/abs/パス/へ/リポジトリ",
+        I18nKey::WsRootHint => "サンドボックス化されたファイル アクションのために BLXCode Agent によってのみ使用されます。",
+        I18nKey::WsDefaultProjectDirLabel => "デフォルトのプロジェクトディレクトリ",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$ホーム",
+        I18nKey::WsDefaultProjectDirHint => "新しいワークスペースの作業ディレクトリを事前に入力します。",
         I18nKey::AgProviderHeading => "BLXCodeエージェントプロバイダー",
         I18nKey::AgProviderField => "プロバイダー",
         I18nKey::AgProviderOpenrouter => "オープンルーター",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index 75dbcfb..0e4debe 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -188,28 +188,27 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "컨텍스트가 전송되거나 첨부될 때 간단한 확인입니다.",
         I18nKey::AppNotifSound => "성공 소리 재생",
         I18nKey::AppNotifSoundHint => "성공적인 핸드오프 작업에 대한 짧은 톤입니다.",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
-        I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+        I18nKey::AppUpdateHeading => "앱 업데이트",
+        I18nKey::AppUpdateAutoCheck => "시작 시 업데이트 확인",
+        I18nKey::AppUpdateAutoCheckHint => "BLXCode는 GitHub 릴리스를 자동으로 확인하고 업데이트가 준비되면 배너를 표시합니다.",
+        I18nKey::AppUpdateCurrentVersion => "현재 버전",
+        I18nKey::AppUpdateAvailableVersion => "사용 가능한 버전",
+        I18nKey::AppUpdateCheck => "업데이트 확인",
+        I18nKey::AppUpdateChecking => "확인 중...",
+        I18nKey::AppUpdateUpToDate => "BLXCode가 최신 상태입니다.",
+        I18nKey::AppUpdateDevUnavailable => "개발 빌드에서는 업데이터가 비활성화됩니다.",
+        I18nKey::UpdateBannerTitle => "업데이트 가능",
+        I18nKey::UpdateBannerAction => "업데이트 보기",
+        I18nKey::UpdateDialogTitle => "BLX코드 업데이트",
+        I18nKey::UpdateDialogInstall => "업데이트 설치",
+        I18nKey::UpdateDialogLater => "나중에",
+        I18nKey::UpdateDialogDownloading => "다운로드 중",
+        I18nKey::UpdateDialogInstalling => "설치 중",
+        I18nKey::UpdateDialogDone => "다시 시작할 준비가 되었습니다.",
+        I18nKey::UpdateDialogRelaunch => "다시 시작",
+        I18nKey::UpdateDialogRetry => "다시 해 보다",
+        I18nKey::UpdateDialogError => "업데이트 실패",
+        I18nKey::UpdateDialogNotes => "릴리스 노트",
         I18nKey::AppShortcutHeading => "키보드 단축키",
         I18nKey::AppShortcutModeTmux => "Tmux 스타일(Ctrl+b를 누른 다음 키)",
         I18nKey::AppShortcutModeLegacy => "클래식(Ctrl / Ctrl+Shift)",
@@ -318,6 +317,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "사전 설정:",
         I18nKey::WsRootLabel => "작업공간/샌드박스 루트",
         I18nKey::WsRootPlaceholder => "/abs/경로/to/repo",
+        I18nKey::WsRootHint => "샌드박스 파일 작업을 위해 BLXCode Agent에서만 사용됩니다.",
+        I18nKey::WsDefaultProjectDirLabel => "기본 프로젝트 디렉토리",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
+        I18nKey::WsDefaultProjectDirHint => "새 작업공간에 대한 작업 디렉토리를 미리 채웁니다.",
         I18nKey::AgProviderHeading => "BLXCode 에이전트 제공자",
         I18nKey::AgProviderField => "공급자",
         I18nKey::AgProviderOpenrouter => "오픈라우터",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index 1ab6333..bcac1da 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -192,28 +192,27 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "Krótkie potwierdzenie wysłania lub załączenia kontekstu.",
         I18nKey::AppNotifSound => "Odtwórz dźwięk sukcesu",
         I18nKey::AppNotifSoundHint => "Krótki sygnał dźwiękowy informujący o udanych akcjach przekazania.",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
-        I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+        I18nKey::AppUpdateHeading => "Aktualizacje aplikacji",
+        I18nKey::AppUpdateAutoCheck => "Sprawdź dostępność aktualizacji podczas uruchamiania",
+        I18nKey::AppUpdateAutoCheckHint => "BLXCode po cichu sprawdza wydania GitHub i wyświetla baner, gdy aktualizacja jest gotowa.",
+        I18nKey::AppUpdateCurrentVersion => "Aktualna wersja",
+        I18nKey::AppUpdateAvailableVersion => "Dostępna wersja",
+        I18nKey::AppUpdateCheck => "Sprawdź aktualizacje",
+        I18nKey::AppUpdateChecking => "Kontrola...",
+        I18nKey::AppUpdateUpToDate => "BLXCode jest aktualny.",
+        I18nKey::AppUpdateDevUnavailable => "Aktualizator jest wyłączony w kompilacjach deweloperskich.",
+        I18nKey::UpdateBannerTitle => "Dostępna aktualizacja",
+        I18nKey::UpdateBannerAction => "Zobacz aktualizację",
+        I18nKey::UpdateDialogTitle => "Aktualizacja BLXCode",
+        I18nKey::UpdateDialogInstall => "Zainstaluj aktualizację",
+        I18nKey::UpdateDialogLater => "Później",
+        I18nKey::UpdateDialogDownloading => "Ściąganie",
+        I18nKey::UpdateDialogInstalling => "Instalowanie",
+        I18nKey::UpdateDialogDone => "Gotowy do ponownego uruchomienia",
+        I18nKey::UpdateDialogRelaunch => "Uruchom ponownie",
+        I18nKey::UpdateDialogRetry => "Spróbować ponownie",
+        I18nKey::UpdateDialogError => "Aktualizacja nie powiodła się",
+        I18nKey::UpdateDialogNotes => "Informacje o wydaniu",
         I18nKey::AppShortcutHeading => "Skróty klawiaturowe",
         I18nKey::AppShortcutModeTmux => "Styl Tmux (Ctrl+b, następnie klawisz)",
         I18nKey::AppShortcutModeLegacy => "Klasyczny (Ctrl / Ctrl+Shift)",
@@ -322,6 +321,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "Ustawienie wstępne:",
         I18nKey::WsRootLabel => "Katalog główny obszaru roboczego/piaskownicy",
         I18nKey::WsRootPlaceholder => "/abs/ścieżka/do/repo",
+        I18nKey::WsRootHint => "Używany wyłącznie przez agenta BLXCode do działań na plikach w trybie piaskownicy.",
+        I18nKey::WsDefaultProjectDirLabel => "Domyślny katalog projektu",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$DOM",
+        I18nKey::WsDefaultProjectDirHint => "Wstępnie wypełnia katalog roboczy dla nowych obszarów roboczych.",
         I18nKey::AgProviderHeading => "Dostawca agenta BLXCode",
         I18nKey::AgProviderField => "Dostawca",
         I18nKey::AgProviderOpenrouter => "OtwórzRouter",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index afbf043..042d2e3 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -192,28 +192,29 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "Breve confirmação quando o contexto é enviado ou anexado.",
         I18nKey::AppNotifSound => "Reproduzir som de sucesso",
         I18nKey::AppNotifSoundHint => "Tom curto sobre ações de transferência bem-sucedidas.",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
+        I18nKey::AppUpdateHeading => "Atualizações de aplicativos",
+        I18nKey::AppUpdateAutoCheck => "Verifique se há atualizações na inicialização",
         I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+            "BLXCode verifica silenciosamente os lançamentos do GitHub e mostra um banner quando uma atualização está pronta."
+        }
+        I18nKey::AppUpdateCurrentVersion => "Versão atual",
+        I18nKey::AppUpdateAvailableVersion => "Versão disponível",
+        I18nKey::AppUpdateCheck => "Verifique se há atualizações",
+        I18nKey::AppUpdateChecking => "Verificando...",
+        I18nKey::AppUpdateUpToDate => "BLXCode está atualizado.",
+        I18nKey::AppUpdateDevUnavailable => "O atualizador está desabilitado em compilações de desenvolvimento.",
+        I18nKey::UpdateBannerTitle => "Atualização disponível",
+        I18nKey::UpdateBannerAction => "Ver atualização",
+        I18nKey::UpdateDialogTitle => "Atualização do BLXCode",
+        I18nKey::UpdateDialogInstall => "Instalar atualização",
+        I18nKey::UpdateDialogLater => "Mais tarde",
+        I18nKey::UpdateDialogDownloading => "Baixando",
+        I18nKey::UpdateDialogInstalling => "Instalando",
+        I18nKey::UpdateDialogDone => "Pronto para reiniciar",
+        I18nKey::UpdateDialogRelaunch => "Reiniciar",
+        I18nKey::UpdateDialogRetry => "Tentar novamente",
+        I18nKey::UpdateDialogError => "Falha na atualização",
+        I18nKey::UpdateDialogNotes => "Notas de lançamento",
         I18nKey::AppShortcutHeading => "Atalhos de teclado",
         I18nKey::AppShortcutModeTmux => "Estilo Tmux (Ctrl + b e depois tecla)",
         I18nKey::AppShortcutModeLegacy => "Clássico (Ctrl / Ctrl+Shift)",
@@ -322,6 +323,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "Predefinição:",
         I18nKey::WsRootLabel => "Raiz do espaço de trabalho/sandbox",
         I18nKey::WsRootPlaceholder => "/abs/caminho/para/repo",
+        I18nKey::WsRootHint => "Usado apenas pelo Agente BLXCode para ações de arquivo em área restrita.",
+        I18nKey::WsDefaultProjectDirLabel => "Diretório padrão do projeto",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
+        I18nKey::WsDefaultProjectDirHint => "Preenche previamente o diretório de trabalho para novos espaços de trabalho.",
         I18nKey::AgProviderHeading => "Provedor de agente BLXCode",
         I18nKey::AgProviderField => "Provedor",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index 73a3d16..1e37cba 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -192,28 +192,27 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "Краткое подтверждение отправки или прикрепления контекста.",
         I18nKey::AppNotifSound => "Воспроизвести звук успеха",
         I18nKey::AppNotifSoundHint => "Короткий сигнал об успешных действиях по передаче обслуживания.",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
-        I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+        I18nKey::AppUpdateHeading => "Обновления приложений",
+        I18nKey::AppUpdateAutoCheck => "Проверка обновлений при запуске",
+        I18nKey::AppUpdateAutoCheckHint => "BLXCode автоматически проверяет выпуски GitHub и показывает баннер, когда обновление готово.",
+        I18nKey::AppUpdateCurrentVersion => "Текущая версия",
+        I18nKey::AppUpdateAvailableVersion => "Доступная версия",
+        I18nKey::AppUpdateCheck => "Проверьте наличие обновлений",
+        I18nKey::AppUpdateChecking => "Проверка...",
+        I18nKey::AppUpdateUpToDate => "BLXCode обновлен.",
+        I18nKey::AppUpdateDevUnavailable => "Программа обновления отключена в разрабатываемых сборках.",
+        I18nKey::UpdateBannerTitle => "Доступно обновление",
+        I18nKey::UpdateBannerAction => "Посмотреть обновление",
+        I18nKey::UpdateDialogTitle => "Обновление BLXCode",
+        I18nKey::UpdateDialogInstall => "Установить обновление",
+        I18nKey::UpdateDialogLater => "Позже",
+        I18nKey::UpdateDialogDownloading => "Загрузка",
+        I18nKey::UpdateDialogInstalling => "Установка",
+        I18nKey::UpdateDialogDone => "Готов перезапустить",
+        I18nKey::UpdateDialogRelaunch => "Перезапуск",
+        I18nKey::UpdateDialogRetry => "Повторить попытку",
+        I18nKey::UpdateDialogError => "Обновление не выполнено",
+        I18nKey::UpdateDialogNotes => "Примечания к выпуску",
         I18nKey::AppShortcutHeading => "Сочетания клавиш",
         I18nKey::AppShortcutModeTmux => "Стиль Tmux (Ctrl+b, затем клавиша)",
         I18nKey::AppShortcutModeLegacy => "Классический (Ctrl / Ctrl+Shift)",
@@ -322,6 +321,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "Предустановка:",
         I18nKey::WsRootLabel => "Корень рабочей области/песочницы",
         I18nKey::WsRootPlaceholder => "/abs/путь/к/репо",
+        I18nKey::WsRootHint => "Используется только агентом BLXCode для действий с файлами в изолированной программной среде.",
+        I18nKey::WsDefaultProjectDirLabel => "Каталог проекта по умолчанию",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
+        I18nKey::WsDefaultProjectDirHint => "Предварительно заполняет рабочий каталог для новых рабочих пространств.",
         I18nKey::AgProviderHeading => "Поставщик агента BLXCode",
         I18nKey::AgProviderField => "Поставщик",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index de883f7..14931db 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -188,28 +188,27 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "发送或附加上下文时的简短确认。",
         I18nKey::AppNotifSound => "播放成功声音",
         I18nKey::AppNotifSoundHint => "成功切换操作时发出短声。",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
-        I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+        I18nKey::AppUpdateHeading => "应用程序更新",
+        I18nKey::AppUpdateAutoCheck => "启动时检查更新",
+        I18nKey::AppUpdateAutoCheckHint => "BLXCode 以静默方式检查 GitHub 版本，并在更新准备就绪时显示横幅。",
+        I18nKey::AppUpdateCurrentVersion => "当前版本",
+        I18nKey::AppUpdateAvailableVersion => "可用版本",
+        I18nKey::AppUpdateCheck => "检查更新",
+        I18nKey::AppUpdateChecking => "检查...",
+        I18nKey::AppUpdateUpToDate => "BLXCode 是最新的。",
+        I18nKey::AppUpdateDevUnavailable => "更新程序在开发版本中被禁用。",
+        I18nKey::UpdateBannerTitle => "可用更新",
+        I18nKey::UpdateBannerAction => "查看更新",
+        I18nKey::UpdateDialogTitle => "BLX代码更新",
+        I18nKey::UpdateDialogInstall => "安装更新",
+        I18nKey::UpdateDialogLater => "之后",
+        I18nKey::UpdateDialogDownloading => "正在下载",
+        I18nKey::UpdateDialogInstalling => "安装中",
+        I18nKey::UpdateDialogDone => "准备重新启动",
+        I18nKey::UpdateDialogRelaunch => "重新启动",
+        I18nKey::UpdateDialogRetry => "重试",
+        I18nKey::UpdateDialogError => "更新失败",
+        I18nKey::UpdateDialogNotes => "发行说明",
         I18nKey::AppShortcutHeading => "键盘快捷键",
         I18nKey::AppShortcutModeTmux => "Tmux 风格（Ctrl+b，然后按键）",
         I18nKey::AppShortcutModeLegacy => "经典（Ctrl / Ctrl+Shift）",
@@ -316,6 +315,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "预设：",
         I18nKey::WsRootLabel => "工作区/沙箱根目录",
         I18nKey::WsRootPlaceholder => "/abs/路径/到/repo",
+        I18nKey::WsRootHint => "仅由 BLXCode Agent 用于沙盒文件操作。",
+        I18nKey::WsDefaultProjectDirLabel => "默认项目目录",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
+        I18nKey::WsDefaultProjectDirHint => "预填充新工作区的工作目录。",
         I18nKey::AgProviderHeading => "BLXCode代理提供商",
         I18nKey::AgProviderField => "提供者",
         I18nKey::AgProviderOpenrouter => "开放路由器",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index c45f93a..79beaaf 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -188,28 +188,27 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppNotifToastsHint => "發送或附加上下文時的簡短確認。",
         I18nKey::AppNotifSound => "播放成功聲音",
         I18nKey::AppNotifSoundHint => "成功切換操作時發出短聲。",
-        I18nKey::AppUpdateHeading => "App updates",
-        I18nKey::AppUpdateAutoCheck => "Check for updates on startup",
-        I18nKey::AppUpdateAutoCheckHint => {
-            "BLXCode checks GitHub Releases silently and shows a banner when an update is ready."
-        },
-        I18nKey::AppUpdateCurrentVersion => "Current version",
-        I18nKey::AppUpdateCheck => "Check for updates",
-        I18nKey::AppUpdateChecking => "Checking...",
-        I18nKey::AppUpdateUpToDate => "BLXCode is up to date.",
-        I18nKey::AppUpdateDevUnavailable => "Updater is disabled in development builds.",
-        I18nKey::UpdateBannerTitle => "Update available",
-        I18nKey::UpdateBannerAction => "View update",
-        I18nKey::UpdateDialogTitle => "BLXCode update",
-        I18nKey::UpdateDialogInstall => "Install update",
-        I18nKey::UpdateDialogLater => "Later",
-        I18nKey::UpdateDialogDownloading => "Downloading",
-        I18nKey::UpdateDialogInstalling => "Installing",
-        I18nKey::UpdateDialogDone => "Ready to restart",
-        I18nKey::UpdateDialogRelaunch => "Restart",
-        I18nKey::UpdateDialogRetry => "Retry",
-        I18nKey::UpdateDialogError => "Update failed",
-        I18nKey::UpdateDialogNotes => "Release notes",
+        I18nKey::AppUpdateHeading => "應用程式更新",
+        I18nKey::AppUpdateAutoCheck => "啟動時檢查更新",
+        I18nKey::AppUpdateAutoCheckHint => "BLXCode 以靜默方式檢查 GitHub 版本，並在更新準備就緒時顯示橫幅。",
+        I18nKey::AppUpdateCurrentVersion => "目前版本",
+        I18nKey::AppUpdateAvailableVersion => "可用版本",
+        I18nKey::AppUpdateCheck => "檢查更新",
+        I18nKey::AppUpdateChecking => "檢查...",
+        I18nKey::AppUpdateUpToDate => "BLXCode 是最新的。",
+        I18nKey::AppUpdateDevUnavailable => "更新程式在開發版本中已停用。",
+        I18nKey::UpdateBannerTitle => "可用更新",
+        I18nKey::UpdateBannerAction => "查看更新",
+        I18nKey::UpdateDialogTitle => "BLX程式碼更新",
+        I18nKey::UpdateDialogInstall => "安裝更新",
+        I18nKey::UpdateDialogLater => "之後",
+        I18nKey::UpdateDialogDownloading => "正在下載",
+        I18nKey::UpdateDialogInstalling => "安裝中",
+        I18nKey::UpdateDialogDone => "準備重新啟動",
+        I18nKey::UpdateDialogRelaunch => "重新啟動",
+        I18nKey::UpdateDialogRetry => "重試",
+        I18nKey::UpdateDialogError => "更新失敗",
+        I18nKey::UpdateDialogNotes => "發行說明",
         I18nKey::AppShortcutHeading => "鍵盤快速鍵",
         I18nKey::AppShortcutModeTmux => "Tmux 風格（Ctrl+b，然後按鍵）",
         I18nKey::AppShortcutModeLegacy => "經典（Ctrl / Ctrl+Shift）",
@@ -316,6 +315,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "預設：",
         I18nKey::WsRootLabel => "工作區/沙箱根目錄",
         I18nKey::WsRootPlaceholder => "/abs/路徑/到/repo",
+        I18nKey::WsRootHint => "僅由 BLXCode Agent 用於沙盒文件操作。",
+        I18nKey::WsDefaultProjectDirLabel => "預設項目目錄",
+        I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
+        I18nKey::WsDefaultProjectDirHint => "預填新工作區的工作目錄。",
         I18nKey::AgProviderHeading => "BLXCode代理提供者",
         I18nKey::AgProviderField => "提供者",
         I18nKey::AgProviderOpenrouter => "開放路由器",
diff --git a/src/tauri_bridge.rs b/src/tauri_bridge.rs
index c0b531b..de61fc7 100644
--- a/src/tauri_bridge.rs
+++ b/src/tauri_bridge.rs
@@ -109,6 +109,12 @@ pub async fn harness_ensure_default_sandbox() -> Result<String, String> {
     invoke_typed("harness_ensure_default_sandbox", serde_json::json!({})).await
 }
 
+/// Returns the user's home directory. Default for the "default project
+/// directory" setting that seeds new workspace cwds.
+pub async fn harness_user_home_dir() -> Result<String, String> {
+    invoke_typed("harness_user_home_dir", serde_json::json!({})).await
+}
+
 pub async fn app_version() -> Result<String, String> {
     invoke_typed("app_version", serde_json::json!({})).await
 }
@@ -650,6 +656,34 @@ pub async fn list_path_entries(
     .await
 }
 
+#[derive(Debug, Clone, PartialEq, Eq, serde::Deserialize)]
+#[serde(rename_all = "camelCase")]
+pub struct TextFilePreview {
+    pub content: String,
+    pub truncated: bool,
+    pub byte_len: u64,
+}
+
+pub async fn read_workspace_text_file(
+    workspace_root: String,
+    path: String,
+) -> Result<TextFilePreview, String> {
+    #[derive(Serialize)]
+    #[serde(rename_all = "camelCase")]
+    struct A {
+        workspace_root: String,
+        path: String,
+    }
+    invoke_typed(
+        "read_workspace_text_file",
+        A {
+            workspace_root,
+            path,
+        },
+    )
+    .await
+}
+
 pub async fn list_directory(path: String) -> Result<Vec<DirEntryBrief>, String> {
     #[derive(Serialize)]
     struct A {
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index ebfbf66..4e9e0b4 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -10,7 +10,7 @@ use super::state::{
     MemoryColorPreset, RecentWorkspaceItem, RightPanelTab, WorkbenchService,
 };
 use super::update_service::{UpdateService, UpdateUiStatus};
-use crate::config::{EULA_STORAGE_KEY, HARNESS_BROWSER_DEFAULT_URL};
+use crate::config::HARNESS_BROWSER_DEFAULT_URL;
 use crate::i18n::{lookup, I18nKey, Locale, APP_LOCALES};
 use crate::service::I18nService;
 use crate::tauri_bridge::{
@@ -23,7 +23,6 @@ use crate::tauri_bridge::{
 };
 use gloo_timers::future::TimeoutFuture;
 use js_sys::Date;
-use leptos::html;
 use leptos::leptos_dom::helpers::window_event_listener_untyped;
 use leptos::prelude::*;
 use leptos_icons::Icon as LxIcon;
@@ -122,9 +121,6 @@ pub fn HarnessHost() -> impl IntoView {
         <Show when=move || ui.palette_open().get()>
             <PaletteChrome ui=ui wb=wb embed=embed />
         </Show>
-        <Show when=move || ui.settings_open().get()>
-            <SettingsChrome ui=ui wb=wb embed=embed />
-        </Show>
     }
 }
 
@@ -494,13 +490,6 @@ fn checkbox_checked(ev: &web_sys::Event) -> Option<bool> {
         .map(|i| i.checked())
 }
 
-fn textarea_str(ev: &web_sys::Event) -> Option<String> {
-    ev.target()?
-        .dyn_into::<web_sys::HtmlTextAreaElement>()
-        .ok()
-        .map(|i| i.value())
-}
-
 fn select_str(ev: &web_sys::Event) -> Option<String> {
     ev.target()?
         .dyn_into::<web_sys::HtmlSelectElement>()
@@ -636,7 +625,9 @@ fn palette_run(
             ui.open_quick_open();
         }
         PaletteAction::OpenSettings => {
-            ui.open_settings(HarnessSettingsCategory::App);
+            ui.close_command_palette();
+            ui.settings_category().set(HarnessSettingsCategory::App);
+            wb.open_center_settings_tab(HarnessSettingsCategory::App);
         }
         PaletteAction::ToggleRightPanel => {
             wb.toggle_right_panel();
@@ -676,41 +667,6 @@ fn defer_browser_bounds(wb: WorkbenchService, embed: BrowserEmbedSurface) {
     });
 }
 
-fn focus_first_settings_control(section_ref: NodeRef<html::Section>) {
-    leptos::task::spawn_local(async move {
-        TimeoutFuture::new(24).await;
-        let Some(section) = section_ref.get() else {
-            return;
-        };
-        let selector = "button:not([disabled]):not([tabindex='-1']), input:not([disabled]), select:not([disabled]), textarea:not([disabled])";
-        let Ok(Some(node)) = section.query_selector(selector) else {
-            return;
-        };
-        let Ok(el) = node.dyn_into::<web_sys::HtmlElement>() else {
-            return;
-        };
-        let _ = el.focus();
-    });
-}
-
-fn settings_focusables(section: &web_sys::HtmlElement) -> Vec<web_sys::HtmlElement> {
-    let selector = "button:not([disabled]):not([tabindex='-1']), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [role='option']:not([disabled])";
-    let Ok(list) = section.query_selector_all(selector) else {
-        return Vec::new();
-    };
-    let mut out = Vec::new();
-    let len = list.length();
-    for idx in 0..len {
-        let Some(node) = list.item(idx) else {
-            continue;
-        };
-        if let Ok(el) = node.dyn_into::<web_sys::HtmlElement>() {
-            out.push(el);
-        }
-    }
-    out
-}
-
 fn harness_settings_cat_icon(cat: HarnessSettingsCategory) -> icondata::Icon {
     match cat {
         HarnessSettingsCategory::App => icondata::LuLayoutDashboard,
@@ -722,132 +678,47 @@ fn harness_settings_cat_icon(cat: HarnessSettingsCategory) -> icondata::Icon {
     }
 }
 
-fn trap_settings_tab(section_ref: NodeRef<html::Section>, ev: web_sys::KeyboardEvent) {
-    let key = ev.key();
-    if key != "Tab" {
-        return;
-    }
-    let Some(section) = section_ref.get() else {
-        return;
-    };
-    let section: web_sys::HtmlElement = section.into();
-    let focusables = settings_focusables(&section);
-    if focusables.is_empty() {
-        return;
-    }
-    let Some(active) = web_sys::window()
-        .and_then(|w| w.document())
-        .and_then(|doc| doc.active_element())
-        .and_then(|el| el.dyn_into::<web_sys::HtmlElement>().ok())
-    else {
-        return;
-    };
-    let current_idx = focusables
-        .iter()
-        .position(|el| el.is_same_node(Some(&active)))
-        .unwrap_or(0);
-    let next_idx = if ev.shift_key() {
-        if current_idx == 0 {
-            focusables.len().saturating_sub(1)
-        } else {
-            current_idx - 1
-        }
-    } else if current_idx + 1 >= focusables.len() {
-        0
-    } else {
-        current_idx + 1
-    };
-    ev.prevent_default();
-    let _ = focusables[next_idx].focus();
-}
-
 #[component]
-fn SettingsChrome(
+pub fn SettingsDock(
     ui: HarnessUiService,
     wb: WorkbenchService,
     embed: BrowserEmbedSurface,
 ) -> impl IntoView {
     let i18n = expect_context::<I18nService>();
-    let section_ref = NodeRef::<html::Section>::new();
-
-    Effect::new(move |_| {
-        if ui.settings_open().get() {
-            focus_first_settings_control(section_ref);
-        }
-    });
 
     view! {
-        <div class="harness-overlay harness-overlay--modal" role="presentation">
-            <button
-                type="button"
-                class="harness-scrim"
-                tabindex="-1"
-                aria-label=move || i18n.tr(I18nKey::HsCloseSettingsAria)()
-                on:click=move |_| ui.close_settings()
-            ></button>
-
-            <section
-                class="harness-sheet harness-sheet--settings"
-                role="dialog"
-                aria-modal="true"
-                node_ref=section_ref
-                on:keydown=move |ev: web_sys::KeyboardEvent| {
-                    if ev.key() == "Escape" {
-                        ev.prevent_default();
-                        ui.close_settings();
-                        return;
-                    }
-                    trap_settings_tab(section_ref, ev);
-                }
-            >
-                <header class="harness-settings-head">
-                    <h2 class="harness-settings-title">
-                        <span class="harness-settings-title__icon" aria-hidden="true">
-                            <LxIcon icon=icondata::LuSettings2 width="1.05rem" height="1.05rem" />
-                        </span>
-                        <span class="harness-settings-title__text">{move || i18n.tr(I18nKey::HsTitle)()}</span>
-                    </h2>
-                    <button type="button" class="workbench-mini-btn harness-settings-close" on:click=move |_| ui.close_settings()>
-                        <span class="harness-btn-inline">
-                            <LxIcon icon=icondata::LuX width="0.82rem" height="0.82rem" />
-                            <span>{move || i18n.tr(I18nKey::BtnClose)()}</span>
-                        </span>
-                    </button>
-                </header>
-                <div class="harness-settings-grid">
-                    <nav class="harness-settings-cats" aria-label=move || i18n.tr(I18nKey::HsAriaCats)()>
-                        <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::App label=I18nKey::HsCatApp />
-                        <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Workspace label=I18nKey::HsCatWorkspace />
-                        <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::AgentProvider label=I18nKey::HsCatProvider />
-                        <HarnessCatStaticBtn ui=ui cat=HarnessSettingsCategory::Memory label="Memory" />
-                        <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Voice label=I18nKey::HsCatVoice />
-                        <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Image label=I18nKey::HsCatImage />
-                    </nav>
-
-                    <div class="harness-settings-detail">
-                        {move || match ui.settings_category().get() {
-                            HarnessSettingsCategory::App => view! {
-                                <AppSettingsPane />
-                            }.into_any(),
-                            HarnessSettingsCategory::Workspace => view! {
-                                <WorkspaceSettingsPane ui=ui wb=wb embed=embed />
-                            }.into_any(),
-                            HarnessSettingsCategory::AgentProvider => view! {
-                                <AgentProviderPane />
-                            }.into_any(),
-                            HarnessSettingsCategory::Memory => view! {
-                                <MemorySettingsPane wb=wb />
-                            }.into_any(),
-                            HarnessSettingsCategory::Voice => view! {
-                                <crate::workbench::harness_voice_pane::VoicePane />
-                            }.into_any(),
-                            HarnessSettingsCategory::Image => view! {
-                                <crate::workbench::harness_image_pane::ImagePane />
-                            }.into_any(),
-                        }}
-                    </div>
-                </div>
-            </section>
+        <div class="harness-settings-grid harness-settings-grid--docked">
+            <nav class="harness-settings-cats" aria-label=move || i18n.tr(I18nKey::HsAriaCats)()>
+                <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::App label=I18nKey::HsCatApp />
+                <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Workspace label=I18nKey::HsCatWorkspace />
+                <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::AgentProvider label=I18nKey::HsCatProvider />
+                <HarnessCatStaticBtn ui=ui cat=HarnessSettingsCategory::Memory label="Memory" />
+                <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Voice label=I18nKey::HsCatVoice />
+                <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Image label=I18nKey::HsCatImage />
+            </nav>
+
+            <div class="harness-settings-detail">
+                {move || match ui.settings_category().get() {
+                    HarnessSettingsCategory::App => view! {
+                        <AppSettingsPane />
+                    }.into_any(),
+                    HarnessSettingsCategory::Workspace => view! {
+                        <WorkspaceSettingsPane ui=ui wb=wb embed=embed />
+                    }.into_any(),
+                    HarnessSettingsCategory::AgentProvider => view! {
+                        <AgentProviderPane />
+                    }.into_any(),
+                    HarnessSettingsCategory::Memory => view! {
+                        <MemorySettingsPane wb=wb />
+                    }.into_any(),
+                    HarnessSettingsCategory::Voice => view! {
+                        <crate::workbench::harness_voice_pane::VoicePane />
+                    }.into_any(),
+                    HarnessSettingsCategory::Image => view! {
+                        <crate::workbench::harness_image_pane::ImagePane />
+                    }.into_any(),
+                }}
+            </div>
         </div>
     }
 }
@@ -1069,20 +940,6 @@ fn AppSettingsPane() -> impl IntoView {
                 </span>
                 <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::AppHeading)()}</span>
             </h3>
-            <label class="harness-stack">
-                <span class="harness-field-label">
-                    <span class="harness-field-label__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuScale width="0.82rem" height="0.82rem" />
-                    </span>
-                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::GenEulaStatus)()}</span>
-                </span>
-                <input
-                    class="workbench-plain-input"
-                    type="text"
-                    prop:readonly=true
-                    prop:value=move || eula_preview(i18n.locale().get())
-                />
-            </label>
             <label class="harness-stack">
                 <span class="harness-field-label">
                     <span class="harness-field-label__icon" aria-hidden="true">
@@ -1099,7 +956,7 @@ fn AppSettingsPane() -> impl IntoView {
                     </span>
                     <span>{move || i18n.tr(I18nKey::AppShortcutHeading)()}</span>
                 </h4>
-                <fieldset class="app-prefs-shortcut-modes">
+                <fieldset class="app-prefs-shortcut-modes app-prefs-shortcut-modes--grid">
                     <label class="app-prefs-radio">
                         <input
                             type="radio"
@@ -1134,32 +991,41 @@ fn AppSettingsPane() -> impl IntoView {
                     </span>
                     <span>{move || i18n.tr(I18nKey::AppNotifHeading)()}</span>
                 </h4>
-                <label class="app-prefs-toggle">
-                    <input
-                        type="checkbox"
-                        prop:checked=move || prefs.success_toast_enabled().get()
-                        on:change=move |ev| {
-                            if let Some(checked) = checkbox_checked(&ev) {
-                                prefs.set_success_toast(checked);
-                            }
-                        }
-                    />
-                    <span>{move || i18n.tr(I18nKey::AppNotifToasts)()}</span>
-                </label>
-                <p class="app-prefs-hint">{move || i18n.tr(I18nKey::AppNotifToastsHint)()}</p>
-                <label class="app-prefs-toggle">
-                    <input
-                        type="checkbox"
-                        prop:checked=move || prefs.success_sound_enabled().get()
-                        on:change=move |ev| {
-                            if let Some(checked) = checkbox_checked(&ev) {
-                                prefs.set_success_sound(checked);
-                            }
-                        }
-                    />
-                    <span>{move || i18n.tr(I18nKey::AppNotifSound)()}</span>
-                </label>
-                <p class="app-prefs-hint">{move || i18n.tr(I18nKey::AppNotifSoundHint)()}</p>
+                <div class="app-prefs-toggle-grid">
+                    <div class="app-prefs-toggle-cell">
+                        <label class="app-prefs-toggle">
+                            <input
+                                type="checkbox"
+                                prop:checked=move || prefs.success_toast_enabled().get()
+                                on:change=move |ev| {
+                                    if let Some(checked) = checkbox_checked(&ev) {
+                                        prefs.set_success_toast(checked);
+                                    }
+                                }
+                            />
+                            <span>{move || i18n.tr(I18nKey::AppNotifToasts)()}</span>
+                        </label>
+                        <p class="app-prefs-hint">{move || i18n.tr(I18nKey::AppNotifToastsHint)()}</p>
+                    </div>
+                    <div class="app-prefs-toggle-cell">
+                        <label class="app-prefs-toggle">
+                            <input
+                                type="checkbox"
+                                prop:checked=move || prefs.success_sound_enabled().get()
+                                on:change=move |ev| {
+                                    if let Some(checked) = checkbox_checked(&ev) {
+                                        prefs.set_success_sound(checked);
+                                    }
+                                }
+                            />
+                            <span>{move || i18n.tr(I18nKey::AppNotifSound)()}</span>
+                        </label>
+                        <p class="app-prefs-hint">{move || i18n.tr(I18nKey::AppNotifSoundHint)()}</p>
+                    </div>
+                </div>
+            </section>
+            <section class="harness-subpane">
+                <AgentHooksPanel />
             </section>
             <section class="harness-subpane">
                 <h4 class="harness-pane-subhead">
@@ -1181,20 +1047,31 @@ fn AppSettingsPane() -> impl IntoView {
                     <span>{move || i18n.tr(I18nKey::AppUpdateAutoCheck)()}</span>
                 </label>
                 <p class="app-prefs-hint">{move || i18n.tr(I18nKey::AppUpdateAutoCheckHint)()}</p>
-                <label class="harness-stack">
-                    <span class="harness-field-label">
-                        <span class="harness-field-label__icon" aria-hidden="true">
-                            <LxIcon icon=icondata::LuBadgeInfo width="0.82rem" height="0.82rem" />
-                        </span>
-                        <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AppUpdateCurrentVersion)()}</span>
-                    </span>
-                    <input
-                        class="workbench-plain-input"
-                        type="text"
-                        prop:readonly=true
-                        prop:value=move || updates.current_version().get()
-                    />
-                </label>
+                <dl class="app-prefs-version">
+                    <div class="app-prefs-version__row">
+                        <dt>
+                            <span class="harness-field-label__icon" aria-hidden="true">
+                                <LxIcon icon=icondata::LuBadgeInfo width="0.82rem" height="0.82rem" />
+                            </span>
+                            <span>{move || i18n.tr(I18nKey::AppUpdateCurrentVersion)()}</span>
+                        </dt>
+                        <dd>{move || {
+                            let v = updates.current_version().get();
+                            if v.is_empty() { "—".to_string() } else { v }
+                        }}</dd>
+                    </div>
+                    <Show when=move || updates.available_version().get().is_some()>
+                        <div class="app-prefs-version__row app-prefs-version__row--available">
+                            <dt>
+                                <span class="harness-field-label__icon" aria-hidden="true">
+                                    <LxIcon icon=icondata::LuCircleArrowUp width="0.82rem" height="0.82rem" />
+                                </span>
+                                <span>{move || i18n.tr(I18nKey::AppUpdateAvailableVersion)()}</span>
+                            </dt>
+                            <dd>{move || updates.available_version().get().unwrap_or_default()}</dd>
+                        </div>
+                    </Show>
+                </dl>
                 <button
                     type="button"
                     class="workbench-mini-btn workbench-mini-btn--primary"
@@ -1221,9 +1098,6 @@ fn AppSettingsPane() -> impl IntoView {
                     }}
                 </p>
             </section>
-            <section class="harness-subpane">
-                <AgentHooksPanel />
-            </section>
         </article>
     }
 }
@@ -1403,6 +1277,43 @@ fn WorkspaceSettingsPane(
                 </span>
                 <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::WsHeading)()}</span>
             </h3>
+            <label class="harness-stack">
+                <span class="harness-field-label">
+                    <span class="harness-field-label__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuFolderGit2 width="0.82rem" height="0.82rem" />
+                    </span>
+                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::WsDefaultProjectDirLabel)()}</span>
+                </span>
+                <input
+                    class="workbench-plain-input"
+                    type="text"
+                    placeholder=move || i18n.tr(I18nKey::WsDefaultProjectDirPlaceholder)()
+                    prop:value=move || wb.default_project_dir().get()
+                    on:input=move |ev| {
+                        if let Some(txt) = input_str(&ev) {
+                            wb.set_default_project_dir_text(txt);
+                        }
+                    }
+                />
+                <small class="harness-muted">
+                    {move || i18n.tr(I18nKey::WsDefaultProjectDirHint)()}
+                </small>
+            </label>
+            <div class="harness-row-gap">
+                <button
+                    type="button"
+                    class="workbench-mini-btn workbench-mini-btn--primary"
+                    on:click=move |_| {
+                        let trimmed = wb.default_project_dir().get_untracked().trim().to_owned();
+                        wb.persist_default_project_dir(trimmed);
+                    }
+                >
+                    <span class="harness-btn-inline">
+                        <LxIcon icon=icondata::LuSave width="0.78rem" height="0.78rem" />
+                        <span>{move || i18n.tr(I18nKey::BtnSave)()}</span>
+                    </span>
+                </button>
+            </div>
             <label class="harness-stack">
                 <span class="harness-field-label">
                     <span class="harness-field-label__icon" aria-hidden="true">
@@ -1410,17 +1321,20 @@ fn WorkspaceSettingsPane(
                     </span>
                     <span class="harness-field-label__text">{move || i18n.tr(I18nKey::WsRootLabel)()}</span>
                 </span>
-                <textarea
-                    class="workbench-plain-textarea"
-                    rows="3"
+                <input
+                    class="workbench-plain-input"
+                    type="text"
                     placeholder=move || i18n.tr(I18nKey::WsRootPlaceholder)()
                     prop:value=move || wb.harness_workspace_root().get()
                     on:input=move |ev| {
-                        if let Some(txt) = textarea_str(&ev) {
+                        if let Some(txt) = input_str(&ev) {
                             wb.set_harness_workspace_root_text(txt);
                         }
                     }
-                ></textarea>
+                />
+                <small class="harness-muted">
+                    {move || i18n.tr(I18nKey::WsRootHint)()}
+                </small>
             </label>
             <div class="harness-row-gap">
                 <button
@@ -2390,7 +2304,7 @@ fn AgentHooksPanel() -> impl IntoView {
                 <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgHooksHeading)()}</span>
             </h4>
             <p class="harness-muted">{move || i18n.tr(I18nKey::AgHooksDesc)()}</p>
-            <ul class="harness-hooks__list" role="list">
+            <ul class="harness-hooks__list harness-hooks__list--grid" role="list">
                 {move || {
                     let rendered = report.get();
                     let installed_label = i18n.tr(I18nKey::AgHooksStatusInstalled)().to_string();
@@ -2496,17 +2410,6 @@ fn AgentHooksPanel() -> impl IntoView {
     }
 }
 
-fn eula_preview(loc: Locale) -> String {
-    web_sys::window()
-        .and_then(|w| w.local_storage().ok().flatten())
-        .and_then(|s| s.get_item(EULA_STORAGE_KEY).ok().flatten())
-        .map(|v| match v.as_str() {
-            "1" => lookup(loc, I18nKey::EulaAccepted).to_string(),
-            other => format!("„{other}“"),
-        })
-        .unwrap_or_else(|| lookup(loc, I18nKey::EulaUnknown).to_string())
-}
-
 fn persist_browser_defaults(
     wb: WorkbenchService,
     ui: HarnessUiService,
diff --git a/src/workbench/mod.rs b/src/workbench/mod.rs
index 29a1a3c..95bd2c9 100644
--- a/src/workbench/mod.rs
+++ b/src/workbench/mod.rs
@@ -51,7 +51,7 @@ use crate::i18n::I18nKey;
 use crate::open_http::{dom_click_nav_href, DomNavHref};
 use crate::service::I18nService;
 use crate::tauri_bridge::{
-    browser_embedding_kind, harness_ensure_default_sandbox, is_tauri_shell,
+    browser_embedding_kind, harness_ensure_default_sandbox, harness_user_home_dir, is_tauri_shell,
     workbench_extract_sessions_prefix, workbench_load_state, workbench_merge_sessions_workspace,
     workbench_prune_notifications, workbench_prune_sessions, workbench_save_state,
 };
@@ -171,6 +171,11 @@ pub fn WorkbenchShell() -> impl IntoView {
                     wb.persist_harness_workspace_root(path);
                 }
             }
+            if wb.default_project_dir().get_untracked().trim().is_empty() {
+                if let Ok(home) = harness_user_home_dir().await {
+                    wb.persist_default_project_dir(home);
+                }
+            }
             persistence_enabled.set(allow_save);
             hydrated.set(true);
         });
diff --git a/src/workbench/project_explorer/mod.rs b/src/workbench/project_explorer/mod.rs
index 245b8a1..bef7ee5 100644
--- a/src/workbench/project_explorer/mod.rs
+++ b/src/workbench/project_explorer/mod.rs
@@ -354,7 +354,15 @@ fn ExplorerNode(
                     }
                     style=pad.clone()
                     role="treeitem"
-                    on:click=|ev: web_sys::MouseEvent| ev.stop_propagation()
+                    on:click={
+                        let rel_path = rel_path.clone();
+                        move |ev: web_sys::MouseEvent| {
+                            ev.stop_propagation();
+                            if let Some(ws) = wb.with_active_workspace_entry() {
+                                wb.open_center_file_tab(ws.id, rel_path.clone());
+                            }
+                        }
+                    }
                 >
                     <span class="project-explorer__chev project-explorer__chev--spacer" aria-hidden="true"></span>
                     <span class="project-explorer__icon" aria-hidden="true">
diff --git a/src/workbench/state.rs b/src/workbench/state.rs
index 9e726f9..3ddb80c 100644
--- a/src/workbench/state.rs
+++ b/src/workbench/state.rs
@@ -1,12 +1,12 @@
 use crate::agent_wire::{AgentContextItem, AgentImageContextItem};
 use crate::config::{
-    HARNESS_BROWSER_DEFAULT_URL, HARNESS_BROWSER_URL_KEY, HARNESS_WORKSPACE_ROOT_KEY,
-    MEMORY_COLOR_PRESETS_STORAGE_KEY, SIDEBAR_WIDTH_PX_DEFAULT, SIDEBAR_WIDTH_PX_KEY,
+    DEFAULT_PROJECT_DIR_KEY, HARNESS_BROWSER_DEFAULT_URL, HARNESS_BROWSER_URL_KEY,
+    HARNESS_WORKSPACE_ROOT_KEY, MEMORY_COLOR_PRESETS_STORAGE_KEY, SIDEBAR_WIDTH_PX_DEFAULT,
+    SIDEBAR_WIDTH_PX_KEY,
 };
 use crate::tauri_bridge::{
     agent_environment_invalidate, is_tauri_shell, skills_rules_bootstrap, workbench_drop_sessions,
-    workbench_extract_sessions_prefix, workbench_merge_sessions_workspace,
-    workspace_ensure_agents,
+    workbench_extract_sessions_prefix, workbench_merge_sessions_workspace, workspace_ensure_agents,
 };
 use crate::workbench::agent_timeline::TimelineItem;
 use gloo_timers::future::TimeoutFuture;
@@ -87,12 +87,68 @@ pub struct WorkspaceEntry {
     /// Relative paths (from `cwd`) expanded in the project explorer tree.
     #[serde(default)]
     pub sidebar_explorer_expanded_paths: Vec<String>,
+    /// Center editor tabs for this workspace. The terminal grid is a pinned
+    /// default tab; other tabs are opened dynamically from the UI.
+    #[serde(default = "default_center_tabs")]
+    pub center_tabs: Vec<CenterTab>,
+    /// Currently selected center tab.
+    #[serde(default = "default_center_active_tab_id")]
+    pub center_active_tab_id: u64,
+    /// Next id for dynamically-created center tabs.
+    #[serde(default = "default_center_next_tab_id")]
+    pub center_next_tab_id: u64,
 }
 
 fn default_sidebar_section_open() -> bool {
     true
 }
 
+pub const CENTER_TERMINALS_TAB_ID: u64 = 1;
+
+fn default_center_active_tab_id() -> u64 {
+    CENTER_TERMINALS_TAB_ID
+}
+
+fn default_center_next_tab_id() -> u64 {
+    CENTER_TERMINALS_TAB_ID + 1
+}
+
+fn default_center_tabs() -> Vec<CenterTab> {
+    vec![CenterTab::terminals()]
+}
+
+#[derive(Clone, Debug, PartialEq, Eq, Serialize, Deserialize)]
+#[serde(rename_all = "camelCase")]
+pub struct CenterTab {
+    pub id: u64,
+    pub title: String,
+    pub kind: CenterTabKind,
+}
+
+impl CenterTab {
+    #[must_use]
+    pub fn terminals() -> Self {
+        Self {
+            id: CENTER_TERMINALS_TAB_ID,
+            title: "Terminals".into(),
+            kind: CenterTabKind::Terminals,
+        }
+    }
+
+    #[must_use]
+    pub fn closeable(&self) -> bool {
+        !matches!(self.kind, CenterTabKind::Terminals)
+    }
+}
+
+#[derive(Clone, Debug, PartialEq, Eq, Serialize, Deserialize)]
+#[serde(rename_all = "camelCase", tag = "type")]
+pub enum CenterTabKind {
+    Terminals,
+    Settings,
+    FilePreview { rel_path: String },
+}
+
 /// Aggregated token / cost stats for a workspace's agent chat. Each
 /// `AgentEvent::TurnUsage` (ModelRound or ToolExec) updates these running
 /// totals. Per-row metrics live on the timeline items themselves; this
@@ -317,6 +373,9 @@ impl WorkspaceEntry {
             sidebar_explorer_open: true,
             sidebar_graph_open: true,
             sidebar_explorer_expanded_paths: Vec::new(),
+            center_tabs: default_center_tabs(),
+            center_active_tab_id: default_center_active_tab_id(),
+            center_next_tab_id: default_center_next_tab_id(),
         }
     }
 
@@ -350,6 +409,33 @@ impl WorkspaceEntry {
     }
 }
 
+fn ensure_center_tabs(workspace: &mut WorkspaceEntry) {
+    if !workspace
+        .center_tabs
+        .iter()
+        .any(|tab| matches!(tab.kind, CenterTabKind::Terminals))
+    {
+        workspace.center_tabs.insert(0, CenterTab::terminals());
+    }
+    if !workspace
+        .center_tabs
+        .iter()
+        .any(|tab| tab.id == workspace.center_active_tab_id)
+    {
+        workspace.center_active_tab_id = CENTER_TERMINALS_TAB_ID;
+    }
+    let max_id = workspace
+        .center_tabs
+        .iter()
+        .map(|tab| tab.id)
+        .max()
+        .unwrap_or(CENTER_TERMINALS_TAB_ID);
+    workspace.center_next_tab_id = workspace
+        .center_next_tab_id
+        .max(max_id.saturating_add(1))
+        .max(default_center_next_tab_id());
+}
+
 #[inline]
 fn normalize_cwd_key(path: &str) -> String {
     path.trim().trim_end_matches(['/', '\\']).to_string()
@@ -515,7 +601,7 @@ pub enum RightPanelTab {
 }
 
 /// Kategorien in den Harness-Einstellungen (Befehlspalette).
-#[derive(Clone, Copy, PartialEq, Eq)]
+#[derive(Clone, Copy, Debug, PartialEq, Eq, Serialize, Deserialize)]
 pub enum HarnessSettingsCategory {
     App,
     Workspace,
@@ -660,13 +746,6 @@ impl HarnessUiService {
         }
     }
 
-    pub fn open_settings(&self, cat: HarnessSettingsCategory) {
-        self.settings_category.set(cat);
-        self.close_command_palette();
-        self.close_quick_open();
-        self.settings_open.set(true);
-    }
-
     pub fn close_settings(&self) {
         self.settings_open.set(false);
     }
@@ -788,6 +867,10 @@ pub struct WorkbenchService {
     embedded_browser_active_id: RwSignal<u64>,
     embedded_browser_next_id: RwSignal<u64>,
     harness_workspace_root: RwSignal<String>,
+    /// Default project / development directory used to seed new workspace
+    /// cwds. Sandbox path above is reserved for BLXCode Agent sandbox
+    /// actions only; this is what regular workspaces start from.
+    default_project_dir: RwSignal<String>,
     workspace_next_id: RwSignal<u64>,
     /// Drafts for workspaces currently in inline-configuration mode,
     /// keyed by workspace id. Entries are removed on commit or cancel.
@@ -844,6 +927,8 @@ impl WorkbenchService {
 
         let harness_workspace_root =
             read_local_storage(HARNESS_WORKSPACE_ROOT_KEY).unwrap_or_default();
+        let default_project_dir =
+            read_local_storage(DEFAULT_PROJECT_DIR_KEY).unwrap_or_default();
         let memory_color_presets = read_memory_color_presets();
 
         let first_tab_id = 1_u64;
@@ -879,6 +964,7 @@ impl WorkbenchService {
             embedded_browser_active_id: RwSignal::new(first_tab_id),
             embedded_browser_next_id: RwSignal::new(first_tab_id + 1),
             harness_workspace_root: RwSignal::new(harness_workspace_root),
+            default_project_dir: RwSignal::new(default_project_dir),
             workspace_next_id: RwSignal::new(1),
             workspace_drafts: RwSignal::new(HashMap::new()),
             workspace_config_steps: RwSignal::new(HashMap::new()),
@@ -899,8 +985,7 @@ impl WorkbenchService {
     }
 
     fn bump_sidebar_repo_epoch(&self) {
-        self.sidebar_repo_epoch
-            .update(|n| *n = n.wrapping_add(1));
+        self.sidebar_repo_epoch.update(|n| *n = n.wrapping_add(1));
     }
 
     pub fn notifications(&self) -> RwSignal<HashMap<String, u32>> {
@@ -1294,6 +1379,140 @@ impl WorkbenchService {
         self.update_active_workspace(|w| w.sidebar_explorer_expanded_paths = paths);
     }
 
+    #[must_use]
+    pub fn center_tabs_for_workspace(&self, workspace_id: u64) -> Vec<CenterTab> {
+        self.workspaces.with(|workspaces| {
+            workspaces
+                .iter()
+                .find(|w| w.id == workspace_id)
+                .map(|w| {
+                    let mut clone = w.clone();
+                    ensure_center_tabs(&mut clone);
+                    clone.center_tabs
+                })
+                .unwrap_or_else(default_center_tabs)
+        })
+    }
+
+    #[must_use]
+    pub fn active_center_tab_id_for_workspace(&self, workspace_id: u64) -> u64 {
+        self.workspaces.with(|workspaces| {
+            workspaces
+                .iter()
+                .find(|w| w.id == workspace_id)
+                .map(|w| w.center_active_tab_id)
+                .unwrap_or(CENTER_TERMINALS_TAB_ID)
+        })
+    }
+
+    pub fn set_active_center_tab(&self, workspace_id: u64, tab_id: u64) {
+        self.workspaces.update(|workspaces| {
+            let Some(workspace) = workspaces.iter_mut().find(|w| w.id == workspace_id) else {
+                return;
+            };
+            ensure_center_tabs(workspace);
+            if workspace.center_tabs.iter().any(|tab| tab.id == tab_id) {
+                workspace.center_active_tab_id = tab_id;
+            }
+        });
+        self.bump_terminal_layout();
+    }
+
+    pub fn close_center_tab(&self, workspace_id: u64, tab_id: u64) {
+        if tab_id == CENTER_TERMINALS_TAB_ID {
+            return;
+        }
+        self.workspaces.update(|workspaces| {
+            let Some(workspace) = workspaces.iter_mut().find(|w| w.id == workspace_id) else {
+                return;
+            };
+            ensure_center_tabs(workspace);
+            let Some(index) = workspace
+                .center_tabs
+                .iter()
+                .position(|tab| tab.id == tab_id)
+            else {
+                return;
+            };
+            if !workspace.center_tabs[index].closeable() {
+                return;
+            }
+            workspace.center_tabs.remove(index);
+            if workspace.center_active_tab_id == tab_id {
+                workspace.center_active_tab_id = workspace
+                    .center_tabs
+                    .get(index)
+                    .or_else(|| {
+                        index
+                            .checked_sub(1)
+                            .and_then(|i| workspace.center_tabs.get(i))
+                    })
+                    .map(|tab| tab.id)
+                    .unwrap_or(CENTER_TERMINALS_TAB_ID);
+            }
+            ensure_center_tabs(workspace);
+        });
+        self.bump_terminal_layout();
+    }
+
+    pub fn open_center_settings_tab(&self, cat: HarnessSettingsCategory) {
+        let Some(workspace_id) = self.active_id.get_untracked() else {
+            return;
+        };
+        self.workspaces.update(|workspaces| {
+            let Some(workspace) = workspaces.iter_mut().find(|w| w.id == workspace_id) else {
+                return;
+            };
+            ensure_center_tabs(workspace);
+            if let Some(tab) = workspace
+                .center_tabs
+                .iter()
+                .find(|tab| matches!(tab.kind, CenterTabKind::Settings))
+            {
+                workspace.center_active_tab_id = tab.id;
+                return;
+            }
+            let id = workspace
+                .center_next_tab_id
+                .max(default_center_next_tab_id());
+            workspace.center_next_tab_id = id.saturating_add(1);
+            workspace.center_tabs.push(CenterTab {
+                id,
+                title: settings_tab_title(cat).into(),
+                kind: CenterTabKind::Settings,
+            });
+            workspace.center_active_tab_id = id;
+        });
+        self.bump_terminal_layout();
+    }
+
+    pub fn open_center_file_tab(&self, workspace_id: u64, rel_path: String) {
+        let rel_path = rel_path.trim().trim_start_matches(['/', '\\']).to_string();
+        if rel_path.is_empty() {
+            return;
+        }
+        self.workspaces.update(|workspaces| {
+            let Some(workspace) = workspaces.iter_mut().find(|w| w.id == workspace_id) else {
+                return;
+            };
+            ensure_center_tabs(workspace);
+            if let Some(tab) = workspace.center_tabs.iter().find(|tab| {
+                matches!(&tab.kind, CenterTabKind::FilePreview { rel_path: existing } if existing == &rel_path)
+            }) {
+                workspace.center_active_tab_id = tab.id;
+                return;
+            }
+            let id = workspace.center_next_tab_id.max(default_center_next_tab_id());
+            workspace.center_next_tab_id = id.saturating_add(1);
+            workspace.center_tabs.push(CenterTab {
+                id,
+                title: file_tab_title(&rel_path),
+                kind: CenterTabKind::FilePreview { rel_path },
+            });
+            workspace.center_active_tab_id = id;
+        });
+    }
+
     #[must_use]
     pub fn with_active_workspace_entry(&self) -> Option<WorkspaceEntry> {
         self.with_active_workspace(|w| w.clone())
@@ -1301,9 +1520,8 @@ impl WorkbenchService {
 
     fn with_active_workspace<R>(&self, f: impl FnOnce(&WorkspaceEntry) -> R) -> Option<R> {
         let id = self.active_id.get_untracked()?;
-        self.workspaces.with_untracked(|ws| {
-            ws.iter().find(|w| w.id == id).map(f)
-        })
+        self.workspaces
+            .with_untracked(|ws| ws.iter().find(|w| w.id == id).map(f))
     }
 
     fn update_active_workspace(&self, f: impl FnOnce(&mut WorkspaceEntry)) {
@@ -1401,6 +1619,9 @@ impl WorkbenchService {
                 sidebar_explorer_open: true,
                 sidebar_graph_open: true,
                 sidebar_explorer_expanded_paths: Vec::new(),
+                center_tabs: default_center_tabs(),
+                center_active_tab_id: default_center_active_tab_id(),
+                center_next_tab_id: default_center_next_tab_id(),
             });
         });
         Ok(id)
@@ -1893,6 +2114,20 @@ impl WorkbenchService {
         self.harness_workspace_root.set(path);
     }
 
+    #[must_use]
+    pub fn default_project_dir(&self) -> RwSignal<String> {
+        self.default_project_dir
+    }
+
+    pub fn set_default_project_dir_text(&self, path: String) {
+        self.default_project_dir.set(path);
+    }
+
+    pub fn persist_default_project_dir(&self, path: String) {
+        write_local_storage(DEFAULT_PROJECT_DIR_KEY, &path);
+        self.default_project_dir.set(path);
+    }
+
     // --- Inline workspace configuration ---
 
     #[must_use]
@@ -1937,9 +2172,13 @@ impl WorkbenchService {
     pub fn start_inline_configure(&self) -> u64 {
         let id = self.allocate_workspace_id();
 
-        let root = self.harness_workspace_root.get_untracked();
+        let project_root = self.default_project_dir.get_untracked();
         let mut draft = CreateWorkspaceDraft::default();
-        draft.cwd_display = root;
+        draft.cwd_display = if project_root.trim().is_empty() {
+            self.harness_workspace_root.get_untracked()
+        } else {
+            project_root
+        };
 
         let entry = WorkspaceEntry {
             id,
@@ -1963,6 +2202,9 @@ impl WorkbenchService {
             sidebar_explorer_open: true,
             sidebar_graph_open: true,
             sidebar_explorer_expanded_paths: Vec::new(),
+            center_tabs: default_center_tabs(),
+            center_active_tab_id: default_center_active_tab_id(),
+            center_next_tab_id: default_center_next_tab_id(),
         };
         self.active_id.set(Some(id));
         self.workspaces.update(|v| v.push(entry));
@@ -2137,6 +2379,7 @@ impl WorkbenchService {
             let Some(ws) = v.iter_mut().find(|w| w.id == id) else {
                 return;
             };
+            ensure_center_tabs(ws);
             ws.title = title;
             ws.cwd = cwd;
             ws.terminal_count = draft.terminal_count;
@@ -2285,7 +2528,10 @@ impl WorkbenchService {
     pub fn clear_chat_usage(&self, workspace_id: u64) {
         self.workspaces.update(|workspaces| {
             if let Some(ws) = workspaces.iter_mut().find(|w| w.id == workspace_id) {
-                let next_gen = ws.agent_chat_usage.current_turn_generation.saturating_add(1);
+                let next_gen = ws
+                    .agent_chat_usage
+                    .current_turn_generation
+                    .saturating_add(1);
                 ws.agent_chat_usage = ChatUsageStats {
                     current_turn_generation: next_gen,
                     ..ChatUsageStats::default()
@@ -2610,6 +2856,7 @@ impl WorkbenchService {
                 if w.storage_key.trim().is_empty() {
                     w.storage_key = WorkspaceEntry::new_storage_key();
                 }
+                ensure_center_tabs(&mut w);
                 w
             })
             .collect();
@@ -2628,14 +2875,21 @@ impl WorkbenchService {
         // workspace persisted in configuring state — drafts are transient
         // and not serialised, so without this the configurator would
         // render against an empty draft.
-        let root = self.harness_workspace_root.get_untracked();
+        let project_root = {
+            let p = self.default_project_dir.get_untracked();
+            if p.trim().is_empty() {
+                self.harness_workspace_root.get_untracked()
+            } else {
+                p
+            }
+        };
         self.workspace_drafts.update(|m| {
             m.clear();
             for ws in &workspaces {
                 if ws.configuring {
                     let mut d = CreateWorkspaceDraft::default();
-                    if !root.is_empty() {
-                        d.cwd_display.clone_from(&root);
+                    if !project_root.is_empty() {
+                        d.cwd_display.clone_from(&project_root);
                     }
                     m.insert(ws.id, d);
                 }
@@ -2698,6 +2952,19 @@ impl WorkbenchService {
     }
 }
 
+fn settings_tab_title(_cat: HarnessSettingsCategory) -> &'static str {
+    "Settings"
+}
+
+fn file_tab_title(rel_path: &str) -> String {
+    rel_path
+        .rsplit(['/', '\\'])
+        .next()
+        .filter(|name| !name.is_empty())
+        .unwrap_or(rel_path)
+        .to_string()
+}
+
 /// On-disk schema for the workbench layout. Versioned via
 /// [`WORKBENCH_SNAPSHOT_VERSION`].
 #[derive(Clone, Debug, Serialize, Deserialize)]
diff --git a/src/workbench/workspace_panel.rs b/src/workbench/workspace_panel.rs
index 10c514e..8238aae 100644
--- a/src/workbench/workspace_panel.rs
+++ b/src/workbench/workspace_panel.rs
@@ -1,14 +1,16 @@
 use crate::i18n::{lookup, I18nKey};
 use crate::service::I18nService;
+use crate::tauri_bridge::{is_tauri_shell, read_workspace_text_file, TextFilePreview};
+use crate::workbench::app_prefs::AppPrefsService;
 use crate::workbench::browser_tab::sync_embedded_browser_layer;
 use crate::workbench::create_workspace_wizard::WorkspaceConfigurator;
-use crate::workbench::app_prefs::AppPrefsService;
 use crate::workbench::harness_chords::{
     dispatch_shortcut_action, HarnessShortcutAction, ShortcutKeys,
 };
+use crate::workbench::harness_ui::SettingsDock;
 use crate::workbench::state::{
-    workspace_entry_has_folder, BrowserEmbedSurface, HarnessUiService, RightPanelTab,
-    TerminalSplitAxis, WorkspaceEntry,
+    workspace_entry_has_folder, BrowserEmbedSurface, CenterTab, CenterTabKind, HarnessUiService,
+    RightPanelTab, TerminalSplitAxis, WorkspaceEntry, CENTER_TERMINALS_TAB_ID,
 };
 use crate::workbench::terminal_cell::WorkspaceTerminalCell;
 use crate::workbench::terminal_glue::{
@@ -219,6 +221,9 @@ fn WorkspaceSurface(workspace_id: u64) -> impl IntoView {
         terminal_unobserve_workspace_grid(workspace_id);
     });
 
+    let active_center_tab_id =
+        Memo::new(move |_| wb.active_center_tab_id_for_workspace(workspace_id));
+
     view! {
         <div
             class=move || {
@@ -233,150 +238,357 @@ fn WorkspaceSurface(workspace_id: u64) -> impl IntoView {
                 <WorkspaceConfigurator workspace_id=workspace_id />
             </Show>
             <Show when=move || !is_configuring.get()>
-            <div
-                class="ws-term-grid"
-                node_ref=term_grid_ref
-                style=move || {
-                    let full = full_size_terminal.get().is_some();
-                    // Derive the authoritative track count from the
-                    // workspace itself; row_fr/col_fr only carry user-driven
-                    // resize fractions. If the cached fractions don't match
-                    // the current row/col count (e.g. right after wizard
-                    // commit, before the sync Effect fires), fall back to
-                    // even 1.0 fractions instead of rendering a stale
-                    // template. Without this fallback the grid renders the
-                    // old N×M layout, CSS auto-flow pushes children into
-                    // implicit rows at `auto` height, terminals collapse to
-                    // header-only, and xterm.fit() returns 0×0 — which makes
-                    // the spawned agent (claude/codex) see a broken TTY.
-                    let ws_rows = workspace.get().map(|w| w.grid_rows as usize).unwrap_or(1);
-                    let ws_cols = workspace.get().map(|w| w.grid_cols as usize).unwrap_or(1);
-                    let rf = row_fr.get();
-                    let cf = col_fr.get();
-                    let row_frac = if rf.len() == ws_rows { rf } else { vec![1.0; ws_rows] };
-                    let col_frac = if cf.len() == ws_cols { cf } else { vec![1.0; ws_cols] };
-                    let rows = if full { "minmax(0,1fr)".to_string() } else { fr_template(&row_frac) };
-                    let cols = if full { "minmax(0,1fr)".to_string() } else { fr_template(&col_frac) };
-                    format!(
-                        "display:grid;grid-template-rows:{rows};grid-template-columns:{cols};gap:4px;"
-                    )
-                }
-            >
-                <For
-                    each=move || {
-                        workspace
-                            .get()
-                            .map(|workspace| terminal_slots(&workspace))
-                            .unwrap_or_default()
-                    }
-                    key=|slot| slot.id
-                    children=move |slot| {
-                        let terminal_id = slot.id;
-                        let index = slot.index;
-                        let slug = slot.agent_slug;
-                        let cwd = workspace.get_untracked().map(|w| w.cwd).unwrap_or_default();
-                        let on_full_size = Callback::new(move |()| {
-                            full_size_terminal.update(|current| {
-                                *current = if *current == Some(terminal_id) {
-                                    None
-                                } else {
-                                    Some(terminal_id)
-                                };
-                            });
-                        });
+                <CenterTabStrip workspace_id=workspace_id active_tab_id=active_center_tab_id />
+                <div class="workspace-center-tab-body">
+                    <div
+                        class="workspace-center-panel"
+                        class:workspace-center-panel--hidden=move || active_center_tab_id.get() != CENTER_TERMINALS_TAB_ID
+                    >
+                        <div
+                            class="ws-term-grid"
+                            node_ref=term_grid_ref
+                            style=move || {
+                                let full = full_size_terminal.get().is_some();
+                                // Derive the authoritative track count from the
+                                // workspace itself; row_fr/col_fr only carry user-driven
+                                // resize fractions. If the cached fractions don't match
+                                // the current row/col count (e.g. right after wizard
+                                // commit, before the sync Effect fires), fall back to
+                                // even 1.0 fractions instead of rendering a stale
+                                // template. Without this fallback the grid renders the
+                                // old N×M layout, CSS auto-flow pushes children into
+                                // implicit rows at `auto` height, terminals collapse to
+                                // header-only, and xterm.fit() returns 0×0 — which makes
+                                // the spawned agent (claude/codex) see a broken TTY.
+                                let ws_rows = workspace.get().map(|w| w.grid_rows as usize).unwrap_or(1);
+                                let ws_cols = workspace.get().map(|w| w.grid_cols as usize).unwrap_or(1);
+                                let rf = row_fr.get();
+                                let cf = col_fr.get();
+                                let row_frac = if rf.len() == ws_rows { rf } else { vec![1.0; ws_rows] };
+                                let col_frac = if cf.len() == ws_cols { cf } else { vec![1.0; ws_cols] };
+                                let rows = if full { "minmax(0,1fr)".to_string() } else { fr_template(&row_frac) };
+                                let cols = if full { "minmax(0,1fr)".to_string() } else { fr_template(&col_frac) };
+                                format!(
+                                    "display:grid;grid-template-rows:{rows};grid-template-columns:{cols};gap:4px;"
+                                )
+                            }
+                        >
+                            <For
+                                each=move || {
+                                    workspace
+                                        .get()
+                                        .map(|workspace| terminal_slots(&workspace))
+                                        .unwrap_or_default()
+                                }
+                                key=|slot| slot.id
+                                children=move |slot| {
+                                    let terminal_id = slot.id;
+                                    let index = slot.index;
+                                    let slug = slot.agent_slug;
+                                    let cwd = workspace.get_untracked().map(|w| w.cwd).unwrap_or_default();
+                                    let on_full_size = Callback::new(move |()| {
+                                        full_size_terminal.update(|current| {
+                                            *current = if *current == Some(terminal_id) {
+                                                None
+                                            } else {
+                                                Some(terminal_id)
+                                            };
+                                        });
+                                    });
 
+                                    view! {
+                                        <TerminalSlotSurface
+                                            workspace_id=workspace_id
+                                            slot_id=terminal_id
+                                            index=index
+                                            cwd=cwd
+                                            agent_slug=slug
+                                            is_workspace_active=Signal::derive(move || {
+                                                wb.active_id().get() == Some(workspace_id)
+                                                    && active_center_tab_id.get() == CENTER_TERMINALS_TAB_ID
+                                            })
+                                            hidden=Signal::derive(move || {
+                                                full_size_terminal.get().is_some_and(|active| active != terminal_id)
+                                            })
+                                            is_full_size=Signal::derive(move || {
+                                                full_size_terminal.get() == Some(terminal_id)
+                                            })
+                                            on_full_size=on_full_size
+                                        />
+                                    }
+                                }
+                            />
+                            <Show when=move || full_size_terminal.get().is_none()>
+                                <For
+                                    each=move || {
+                                        let cols = workspace.get().map(|w| w.grid_cols).unwrap_or(1);
+                                        (0..cols.saturating_sub(1) as usize).collect::<Vec<_>>()
+                                    }
+                                    key=|i| *i
+                                    children=move |i| {
+                                        view! {
+                                            <button
+                                                type="button"
+                                                class="ws-term-grid__resize ws-term-grid__resize--col"
+                                                style=move || grid_col_handle_style(i, &col_fr.get())
+                                                aria-label=move || i18n.tr(I18nKey::WsResizeTermCols)()
+                                                on:mousedown=move |ev| {
+                                                    ev.prevent_default();
+                                                    let total_px = ev
+                                                        .current_target()
+                                                        .and_then(|t| t.dyn_into::<web_sys::Element>().ok())
+                                                        .and_then(|el| el.parent_element())
+                                                        .map(|el| el.client_width() as f64)
+                                                        .unwrap_or(1.0);
+                                                    drag_state.set(Some(GridDragState {
+                                                            axis: GridResizeAxis::Col,
+                                                            index: i,
+                                                            start_pos: ev.client_x() as f64,
+                                                            start_sizes: col_fr.get_untracked(),
+                                                            total_px,
+                                                    }));
+                                                }
+                                            ></button>
+                                        }
+                                    }
+                                />
+                                <For
+                                    each=move || {
+                                        let rows = workspace.get().map(|w| w.grid_rows).unwrap_or(1);
+                                        (0..rows.saturating_sub(1) as usize).collect::<Vec<_>>()
+                                    }
+                                    key=|i| *i
+                                    children=move |i| {
+                                        view! {
+                                            <button
+                                                type="button"
+                                                class="ws-term-grid__resize ws-term-grid__resize--row"
+                                                style=move || grid_row_handle_style(i, &row_fr.get())
+                                                aria-label=move || i18n.tr(I18nKey::WsResizeTermRows)()
+                                                on:mousedown=move |ev| {
+                                                    ev.prevent_default();
+                                                    let total_px = ev
+                                                        .current_target()
+                                                        .and_then(|t| t.dyn_into::<web_sys::Element>().ok())
+                                                        .and_then(|el| el.parent_element())
+                                                        .map(|el| el.client_height() as f64)
+                                                        .unwrap_or(1.0);
+                                                    drag_state.set(Some(GridDragState {
+                                                            axis: GridResizeAxis::Row,
+                                                            index: i,
+                                                            start_pos: ev.client_y() as f64,
+                                                            start_sizes: row_fr.get_untracked(),
+                                                            total_px,
+                                                    }));
+                                                }
+                                            ></button>
+                                        }
+                                    }
+                                />
+                            </Show>
+                        </div>
+                    </div>
+                    <DynamicCenterPanels workspace_id=workspace_id active_tab_id=active_center_tab_id />
+                </div>
+            </Show>
+        </div>
+    }
+}
+
+#[component]
+fn CenterTabStrip(workspace_id: u64, active_tab_id: Memo<u64>) -> impl IntoView {
+    let wb = expect_context::<WorkbenchService>();
+
+    view! {
+        <header class="workspace-center-tabs">
+            <div class="workspace-center-tabs__strip" role="tablist" aria-label="Workspace views">
+                <For
+                    each=move || wb.center_tabs_for_workspace(workspace_id)
+                    key=|tab| tab.id
+                    children=move |tab| {
                         view! {
-                            <TerminalSlotSurface
+                            <CenterTabButton
                                 workspace_id=workspace_id
-                                slot_id=terminal_id
-                                index=index
-                                cwd=cwd
-                                agent_slug=slug
-                                is_workspace_active=Signal::derive(move || {
-                                    wb.active_id().get() == Some(workspace_id)
-                                })
-                                hidden=Signal::derive(move || {
-                                    full_size_terminal.get().is_some_and(|active| active != terminal_id)
-                                })
-                                is_full_size=Signal::derive(move || {
-                                    full_size_terminal.get() == Some(terminal_id)
-                                })
-                                on_full_size=on_full_size
+                                tab=tab
+                                active_tab_id=active_tab_id
                             />
                         }
                     }
                 />
-                <Show when=move || full_size_terminal.get().is_none()>
-                    <For
-                        each=move || {
-                            let cols = workspace.get().map(|w| w.grid_cols).unwrap_or(1);
-                            (0..cols.saturating_sub(1) as usize).collect::<Vec<_>>()
-                        }
-                        key=|i| *i
-                        children=move |i| {
-                            view! {
-                                <button
-                                    type="button"
-                                    class="ws-term-grid__resize ws-term-grid__resize--col"
-                                    style=move || grid_col_handle_style(i, &col_fr.get())
-                                    aria-label=move || i18n.tr(I18nKey::WsResizeTermCols)()
-                                    on:mousedown=move |ev| {
-                                        ev.prevent_default();
-                                        let total_px = ev
-                                            .current_target()
-                                            .and_then(|t| t.dyn_into::<web_sys::Element>().ok())
-                                            .and_then(|el| el.parent_element())
-                                            .map(|el| el.client_width() as f64)
-                                            .unwrap_or(1.0);
-                                        drag_state.set(Some(GridDragState {
-                                                axis: GridResizeAxis::Col,
-                                                index: i,
-                                                start_pos: ev.client_x() as f64,
-                                                start_sizes: col_fr.get_untracked(),
-                                                total_px,
-                                        }));
-                                    }
-                                ></button>
-                            }
-                        }
-                    />
-                    <For
-                        each=move || {
-                            let rows = workspace.get().map(|w| w.grid_rows).unwrap_or(1);
-                            (0..rows.saturating_sub(1) as usize).collect::<Vec<_>>()
-                        }
-                        key=|i| *i
-                        children=move |i| {
-                            view! {
-                                <button
-                                    type="button"
-                                    class="ws-term-grid__resize ws-term-grid__resize--row"
-                                    style=move || grid_row_handle_style(i, &row_fr.get())
-                                    aria-label=move || i18n.tr(I18nKey::WsResizeTermRows)()
-                                    on:mousedown=move |ev| {
-                                        ev.prevent_default();
-                                        let total_px = ev
-                                            .current_target()
-                                            .and_then(|t| t.dyn_into::<web_sys::Element>().ok())
-                                            .and_then(|el| el.parent_element())
-                                            .map(|el| el.client_height() as f64)
-                                            .unwrap_or(1.0);
-                                        drag_state.set(Some(GridDragState {
-                                                axis: GridResizeAxis::Row,
-                                                index: i,
-                                                start_pos: ev.client_y() as f64,
-                                                start_sizes: row_fr.get_untracked(),
-                                                total_px,
-                                        }));
-                                    }
-                                ></button>
-                            }
-                        }
-                    />
-                </Show>
             </div>
+        </header>
+    }
+}
+
+#[component]
+fn CenterTabButton(workspace_id: u64, tab: CenterTab, active_tab_id: Memo<u64>) -> impl IntoView {
+    let wb = expect_context::<WorkbenchService>();
+    let id = tab.id;
+    let title = tab.title.clone();
+    let closeable = tab.closeable();
+    let icon = center_tab_icon(&tab.kind);
+
+    view! {
+        <button
+            type="button"
+            role="tab"
+            aria-selected=move || active_tab_id.get() == id
+            class="workspace-center-tab"
+            class:workspace-center-tab--active=move || active_tab_id.get() == id
+            title=title.clone()
+            on:click=move |_| wb.set_active_center_tab(workspace_id, id)
+        >
+            <span class="workspace-center-tab__icon" aria-hidden="true">
+                <LxIcon icon=icon width="14px" height="14px" />
+            </span>
+            <span class="workspace-center-tab__label">{title.clone()}</span>
+            <Show when=move || closeable>
+                <span
+                    role="button"
+                    tabindex="0"
+                    class="workspace-center-tab__close"
+                    aria-label="Close tab"
+                    title="Close tab"
+                    on:click=move |ev: MouseEvent| {
+                        ev.prevent_default();
+                        ev.stop_propagation();
+                        wb.close_center_tab(workspace_id, id);
+                    }
+                    on:keydown=move |ev: web_sys::KeyboardEvent| {
+                        let key = ev.key();
+                        if key == "Enter" || key == " " {
+                            ev.prevent_default();
+                            ev.stop_propagation();
+                            wb.close_center_tab(workspace_id, id);
+                        }
+                    }
+                >
+                    <LxIcon icon=icondata::LuX width="12px" height="12px" />
+                </span>
             </Show>
-        </div>
+        </button>
+    }
+}
+
+#[component]
+fn DynamicCenterPanels(workspace_id: u64, active_tab_id: Memo<u64>) -> impl IntoView {
+    let wb = expect_context::<WorkbenchService>();
+    let ui = expect_context::<HarnessUiService>();
+    let embed = expect_context::<BrowserEmbedSurface>();
+
+    view! {
+        <For
+            each=move || {
+                wb.center_tabs_for_workspace(workspace_id)
+                    .into_iter()
+                    .filter(|tab| !matches!(tab.kind, CenterTabKind::Terminals))
+                    .collect::<Vec<_>>()
+            }
+            key=|tab| tab.id
+            children=move |tab| {
+                let tab_id = tab.id;
+                match tab.kind {
+                    CenterTabKind::Settings => view! {
+                        <div
+                            class="workspace-center-panel workspace-center-panel--scroll"
+                            class:workspace-center-panel--hidden=move || active_tab_id.get() != tab_id
+                        >
+                            <SettingsDock ui=ui wb=wb embed=embed />
+                        </div>
+                    }.into_any(),
+                    CenterTabKind::FilePreview { rel_path } => view! {
+                        <div
+                            class="workspace-center-panel"
+                            class:workspace-center-panel--hidden=move || active_tab_id.get() != tab_id
+                        >
+                            <FilePreviewDock workspace_id=workspace_id rel_path=rel_path />
+                        </div>
+                    }.into_any(),
+                    CenterTabKind::Terminals => view! { <></> }.into_any(),
+                }
+            }
+        />
+    }
+}
+
+#[component]
+fn FilePreviewDock(workspace_id: u64, rel_path: String) -> impl IntoView {
+    let wb = expect_context::<WorkbenchService>();
+    let result = RwSignal::new(None::<Result<TextFilePreview, String>>);
+    let load_gen = RwSignal::new(0_u32);
+    let rel_for_effect = rel_path.clone();
+
+    Effect::new(move |_| {
+        let _ = load_gen.get();
+        result.set(None);
+        if !is_tauri_shell() {
+            result.set(Some(Err(
+                "File preview is available in the desktop app.".into()
+            )));
+            return;
+        }
+        let Some(workspace) = wb
+            .workspaces()
+            .get()
+            .into_iter()
+            .find(|workspace| workspace.id == workspace_id)
+        else {
+            result.set(Some(Err("Workspace not found.".into())));
+            return;
+        };
+        let root = workspace.cwd;
+        let path = rel_for_effect.clone();
+        leptos::task::spawn_local(async move {
+            let next = read_workspace_text_file(root, path).await;
+            result.set(Some(next));
+        });
+    });
+
+    view! {
+        <article class="file-preview">
+            <header class="file-preview__header">
+                <div class="file-preview__title">
+                    <span class="file-preview__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuFileText width="1rem" height="1rem" />
+                    </span>
+                    <span>{rel_path.clone()}</span>
+                </div>
+                <button
+                    type="button"
+                    class="workbench-mini-btn"
+                    on:click=move |_| load_gen.update(|n| *n = n.wrapping_add(1))
+                >
+                    <span class="harness-btn-inline">
+                        <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
+                        <span>"Refresh"</span>
+                    </span>
+                </button>
+            </header>
+            {move || match result.get() {
+                None => view! {
+                    <div class="file-preview__status">"Loading file..."</div>
+                }.into_any(),
+                Some(Err(err)) => view! {
+                    <div class="file-preview__status file-preview__status--error">{err}</div>
+                }.into_any(),
+                Some(Ok(preview)) => view! {
+                    <Show when=move || preview.truncated>
+                        <div class="file-preview__notice">
+                            {format!("Preview truncated at 512 KiB of {} bytes.", preview.byte_len)}
+                        </div>
+                    </Show>
+                    <pre class="file-preview__content"><code>{preview.content}</code></pre>
+                }.into_any(),
+            }}
+        </article>
+    }
+}
+
+fn center_tab_icon(kind: &CenterTabKind) -> icondata::Icon {
+    match kind {
+        CenterTabKind::Terminals => icondata::LuTerminal,
+        CenterTabKind::Settings => icondata::LuSettings2,
+        CenterTabKind::FilePreview { .. } => icondata::LuFileText,
     }
 }
 
diff --git a/styles.css b/styles.css
index 13b685e..1ef8b2f 100644
--- a/styles.css
+++ b/styles.css
@@ -1494,6 +1494,74 @@ button.workbench-shortcut-row--action:focus-visible {
   gap: 0.45rem;
 }
 
+.app-prefs-shortcut-modes--grid {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+  gap: 0.45rem 0.9rem;
+}
+
+.app-prefs-toggle-grid {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+  gap: 0.55rem 0.9rem;
+}
+
+.app-prefs-toggle-cell {
+  display: flex;
+  flex-direction: column;
+  gap: 0.15rem;
+}
+
+.app-prefs-version {
+  margin: 0.55rem 0 0;
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+}
+
+.app-prefs-version__row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.6rem;
+  padding: 0.32rem 0.5rem;
+  border-radius: 4px;
+  border: 1px solid var(--border);
+  background: rgba(255, 255, 255, 0.02);
+  font-size: 0.78rem;
+  margin: 0;
+}
+
+.app-prefs-version__row dt {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+  color: rgba(180, 185, 200, 0.85);
+  margin: 0;
+}
+
+.app-prefs-version__row dd {
+  margin: 0;
+  font-family: var(--font-mono);
+  color: var(--text);
+}
+
+.app-prefs-version__row--available {
+  border-color: rgba(104, 220, 159, 0.35);
+  background: rgba(104, 220, 159, 0.08);
+}
+
+.app-prefs-version__row--available dd {
+  color: #86e7b2;
+}
+
+@media (max-width: 720px) {
+  .app-prefs-shortcut-modes--grid,
+  .app-prefs-toggle-grid {
+    grid-template-columns: minmax(0, 1fr);
+  }
+}
+
 .app-prefs-radio {
   display: flex;
   align-items: center;
@@ -4333,6 +4401,24 @@ button.workbench-shortcut-row--action:focus-visible {
   gap: 0.55rem;
 }
 
+.harness-hooks__list--grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 0.5rem;
+}
+
+@media (max-width: 900px) {
+  .harness-hooks__list--grid {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 600px) {
+  .harness-hooks__list--grid {
+    grid-template-columns: minmax(0, 1fr);
+  }
+}
+
 .harness-hooks__item {
   display: flex;
   align-items: center;
@@ -4392,8 +4478,8 @@ button.workbench-shortcut-row--action:focus-visible {
   display: inline-flex;
   align-items: center;
   gap: 0.42rem;
-  padding: 0.28rem 0.5rem;
-  border-radius: 999px;
+  padding: 0.22rem 0.45rem;
+  border-radius: 4px;
   border: 1px solid rgba(255, 122, 122, 0.32);
   color: #ff9a9a;
   background: rgba(255, 122, 122, 0.08);
@@ -4924,6 +5010,202 @@ button {
   display: none;
 }
 
+.workspace-center-tabs {
+  flex: 0 0 auto;
+  min-width: 0;
+  padding: 0.32rem 0.35rem 0;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0)),
+    rgba(0, 0, 0, 0.18);
+}
+
+.workspace-center-tabs__strip {
+  display: flex;
+  align-items: center;
+  gap: 0.18rem;
+  min-width: 0;
+  overflow-x: auto;
+  scrollbar-width: thin;
+}
+
+.workspace-center-tab {
+  flex: 0 1 13rem;
+  min-width: 2.35rem;
+  max-width: 15rem;
+  height: 32px;
+  display: flex;
+  align-items: center;
+  gap: 0.38rem;
+  padding: 0 0.35rem 0 0.55rem;
+  border: 1px solid transparent;
+  border-bottom: 0;
+  border-radius: 4px 4px 0 0;
+  background: transparent;
+  color: var(--text-muted);
+  cursor: pointer;
+  font-family: var(--font-mono);
+  font-size: 0.72rem;
+  font-weight: 700;
+  letter-spacing: 0;
+  overflow: hidden;
+}
+
+.workspace-center-tab:hover {
+  color: var(--text);
+  background: rgba(255, 255, 255, 0.055);
+}
+
+.workspace-center-tab--active {
+  color: var(--accent);
+  border-color: rgba(88, 166, 255, 0.32);
+  background: rgba(88, 166, 255, 0.11);
+  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
+}
+
+.workspace-center-tab__icon,
+.workspace-center-tab__close {
+  flex-shrink: 0;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.workspace-center-tab__label {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workspace-center-tab__close {
+  width: 18px;
+  height: 18px;
+  margin-left: auto;
+  border-radius: 4px;
+  color: var(--text-muted);
+}
+
+.workspace-center-tab__close:hover,
+.workspace-center-tab__close:focus-visible {
+  color: var(--text);
+  background: rgba(255, 255, 255, 0.1);
+}
+
+.workspace-center-tab-body {
+  flex: 1 1 0;
+  min-width: 0;
+  min-height: 0;
+  position: relative;
+  display: flex;
+}
+
+.workspace-center-panel {
+  flex: 1 1 0;
+  min-width: 0;
+  min-height: 0;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.workspace-center-panel--hidden {
+  display: none;
+}
+
+.workspace-center-panel--scroll {
+  overflow: auto;
+}
+
+.harness-settings-grid--docked {
+  flex: 1 1 0;
+  min-height: 0;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.12);
+}
+
+.harness-settings-grid--docked .harness-settings-detail {
+  min-height: 0;
+}
+
+.file-preview {
+  flex: 1 1 0;
+  min-width: 0;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+  background: rgba(8, 10, 14, 0.62);
+}
+
+.file-preview__header {
+  flex: 0 0 auto;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.65rem;
+  min-height: 42px;
+  padding: 0.45rem 0.65rem;
+  border-bottom: 1px solid var(--border);
+  background: rgba(0, 0, 0, 0.2);
+}
+
+.file-preview__title {
+  min-width: 0;
+  display: flex;
+  align-items: center;
+  gap: 0.45rem;
+  font-family: var(--font-mono);
+  font-size: 0.78rem;
+  color: var(--text);
+}
+
+.file-preview__title span:last-child {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-preview__icon {
+  flex-shrink: 0;
+  color: var(--accent);
+}
+
+.file-preview__status,
+.file-preview__notice {
+  margin: 0.8rem;
+  color: var(--text-muted);
+  font-size: 0.82rem;
+}
+
+.file-preview__status--error {
+  color: #ff8c8c;
+}
+
+.file-preview__notice {
+  flex: 0 0 auto;
+  margin-bottom: 0;
+  padding: 0.48rem 0.58rem;
+  border: 1px solid rgba(251, 191, 36, 0.28);
+  border-radius: 4px;
+  background: rgba(251, 191, 36, 0.08);
+  color: #f6d58a;
+}
+
+.file-preview__content {
+  flex: 1 1 0;
+  min-height: 0;
+  margin: 0;
+  padding: 0.75rem 0.85rem;
+  overflow: auto;
+  font-family: var(--font-mono);
+  font-size: 0.78rem;
+  line-height: 1.55;
+  white-space: pre;
+  color: #d9e2f1;
+  background: transparent;
+}
+
 .ws-term-grid__resize {
   position: absolute;
   z-index: 6;

From 1a73b0b16750c4d4d4df4ad9989087d6a1b3635e Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 02:47:04 +0200
Subject: [PATCH 02/48] style: enhance layout and spacing for app preferences
 and harness components

---
 styles.css | 221 ++++++++++++++++++++++++++++++++++++-----------------
 1 file changed, 149 insertions(+), 72 deletions(-)

diff --git a/styles.css b/styles.css
index 1ef8b2f..3f03c32 100644
--- a/styles.css
+++ b/styles.css
@@ -1496,27 +1496,40 @@ button.workbench-shortcut-row--action:focus-visible {
 
 .app-prefs-shortcut-modes--grid {
   display: grid;
-  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
-  gap: 0.45rem 0.9rem;
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+  gap: 0.55rem 1rem;
 }
 
 .app-prefs-toggle-grid {
   display: grid;
-  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
-  gap: 0.55rem 0.9rem;
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+  gap: 0.8rem 1.1rem;
 }
 
 .app-prefs-toggle-cell {
   display: flex;
   flex-direction: column;
-  gap: 0.15rem;
+  gap: 0.2rem;
+  padding: 0.55rem 0.7rem;
+  border: 1px solid var(--border);
+  border-radius: 0.5rem;
+  background: rgba(255, 255, 255, 0.02);
+}
+
+.app-prefs-toggle-cell .app-prefs-toggle {
+  margin: 0;
+  font-size: 0.85rem;
+}
+
+.app-prefs-toggle-cell .app-prefs-hint {
+  margin: 0 0 0 1.55rem;
 }
 
 .app-prefs-version {
-  margin: 0.55rem 0 0;
+  margin: 0.35rem 0 0.1rem;
   display: flex;
   flex-direction: column;
-  gap: 0.25rem;
+  gap: 0.4rem;
 }
 
 .app-prefs-version__row {
@@ -1524,26 +1537,33 @@ button.workbench-shortcut-row--action:focus-visible {
   align-items: center;
   justify-content: space-between;
   gap: 0.6rem;
-  padding: 0.32rem 0.5rem;
-  border-radius: 4px;
+  padding: 0.55rem 0.75rem;
+  border-radius: 0.5rem;
   border: 1px solid var(--border);
-  background: rgba(255, 255, 255, 0.02);
-  font-size: 0.78rem;
+  background: rgba(255, 255, 255, 0.025);
+  font-size: 0.85rem;
   margin: 0;
 }
 
 .app-prefs-version__row dt {
   display: inline-flex;
   align-items: center;
-  gap: 0.4rem;
-  color: rgba(180, 185, 200, 0.85);
+  gap: 0.5rem;
+  color: var(--text-muted);
   margin: 0;
+  font-weight: 500;
+}
+
+.app-prefs-version__row dt svg {
+  width: 0.9rem;
+  height: 0.9rem;
 }
 
 .app-prefs-version__row dd {
   margin: 0;
   font-family: var(--font-mono);
   color: var(--text);
+  font-size: 0.9rem;
 }
 
 .app-prefs-version__row--available {
@@ -1555,13 +1575,6 @@ button.workbench-shortcut-row--action:focus-visible {
   color: #86e7b2;
 }
 
-@media (max-width: 720px) {
-  .app-prefs-shortcut-modes--grid,
-  .app-prefs-toggle-grid {
-    grid-template-columns: minmax(0, 1fr);
-  }
-}
-
 .app-prefs-radio {
   display: flex;
   align-items: center;
@@ -4115,25 +4128,46 @@ button.workbench-shortcut-row--action:focus-visible {
 }
 
 .harness-settings-detail {
-  padding: 0.75rem;
+  padding: 1.4rem clamp(1rem, 3vw, 1.75rem) 2rem;
   overflow: auto;
 }
 
+.harness-pane {
+  display: flex;
+  flex-direction: column;
+  gap: 1.25rem;
+  max-width: 880px;
+}
+
 .harness-pane-title {
-  margin: 0 0 0.45rem;
-  font-family: var(--font-mono);
-  font-size: 0.9rem;
+  margin: 0 0 0.25rem;
+  font-family: inherit;
+  font-size: 0.95rem;
+  font-weight: 600;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
   display: flex;
   align-items: center;
-  gap: 0.42rem;
+  gap: 0.65rem;
   min-width: 0;
+  color: var(--text);
 }
 
 .harness-pane-title__icon {
   flex-shrink: 0;
-  display: grid;
-  place-items: center;
-  color: var(--accent);
+  width: 30px;
+  height: 30px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 0.5rem;
+  background: var(--accent-soft);
+  color: var(--accent-cool, var(--accent));
+}
+
+.harness-pane-title__icon svg {
+  width: 1.05rem;
+  height: 1.05rem;
 }
 
 .harness-pane-title__text {
@@ -4141,21 +4175,34 @@ button.workbench-shortcut-row--action:focus-visible {
 }
 
 .harness-pane-subhead {
-  margin: 0;
-  font-family: var(--font-mono);
-  font-size: 0.78rem;
+  margin: 0 0 0.7rem;
+  font-family: inherit;
+  font-size: 0.86rem;
+  font-weight: 600;
+  letter-spacing: 0.03em;
   display: flex;
   align-items: center;
-  gap: 0.38rem;
+  gap: 0.55rem;
   min-width: 0;
+  color: var(--text);
 }
 
 .harness-pane-subhead__icon {
   flex-shrink: 0;
-  display: grid;
-  place-items: center;
-  color: var(--accent);
-  opacity: 0.95;
+  width: 24px;
+  height: 24px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 0.4rem;
+  background: var(--accent-soft);
+  color: var(--accent-cool, var(--accent));
+  opacity: 1;
+}
+
+.harness-pane-subhead__icon svg {
+  width: 0.9rem;
+  height: 0.9rem;
 }
 
 .harness-pane-subhead__text {
@@ -4165,18 +4212,25 @@ button.workbench-shortcut-row--action:focus-visible {
 .harness-field-label {
   display: inline-flex;
   align-items: center;
-  gap: 0.35rem;
+  gap: 0.45rem;
   min-width: 0;
   color: var(--text-muted);
-  font-size: 0.75rem;
+  font-size: 0.82rem;
+  font-weight: 500;
 }
 
 .harness-field-label__icon {
   flex-shrink: 0;
-  display: grid;
-  place-items: center;
-  color: var(--accent);
-  opacity: 0.85;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--accent-cool, var(--accent));
+  opacity: 0.9;
+}
+
+.harness-field-label__icon svg {
+  width: 0.92rem;
+  height: 0.92rem;
 }
 
 .harness-field-label__text {
@@ -4184,9 +4238,9 @@ button.workbench-shortcut-row--action:focus-visible {
 }
 
 .harness-pane p {
-  font-size: 0.76rem;
+  font-size: 0.8rem;
   color: var(--text-muted);
-  line-height: 1.62;
+  line-height: 1.6;
 }
 
 .harness-error-text {
@@ -4198,9 +4252,29 @@ button.workbench-shortcut-row--action:focus-visible {
 }
 
 .harness-subpane {
-  margin-top: 1rem;
-  padding-top: 0.85rem;
-  border-top: 1px solid var(--border);
+  margin: 0;
+  padding: 1.05rem 1.1rem;
+  border: 1px solid var(--border);
+  border-radius: 0.7rem;
+  background: var(--bg-raised, rgba(255, 255, 255, 0.018));
+  display: flex;
+  flex-direction: column;
+  gap: 0.65rem;
+}
+
+@media (max-width: 720px) {
+  .harness-settings-detail {
+    padding: 1rem 0.9rem 1.5rem;
+  }
+  .harness-pane {
+    gap: 1rem;
+  }
+  .harness-subpane {
+    padding: 0.85rem 0.9rem;
+  }
+  .harness-pane-title {
+    font-size: 0.86rem;
+  }
 }
 
 .memory-preset-list {
@@ -4348,9 +4422,9 @@ button.workbench-shortcut-row--action:focus-visible {
 .harness-stack {
   display: flex;
   flex-direction: column;
-  gap: 0.35rem;
-  margin: 0.75rem 0;
-  font-size: 0.75rem;
+  gap: 0.45rem;
+  margin: 0;
+  font-size: 0.82rem;
 }
 
 .workbench-plain-textarea {
@@ -4389,7 +4463,7 @@ button.workbench-shortcut-row--action:focus-visible {
 .harness-hooks {
   display: flex;
   flex-direction: column;
-  gap: 0.75rem;
+  gap: 0.85rem;
 }
 
 .harness-hooks__list {
@@ -4403,31 +4477,25 @@ button.workbench-shortcut-row--action:focus-visible {
 
 .harness-hooks__list--grid {
   display: grid;
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-  gap: 0.5rem;
-}
-
-@media (max-width: 900px) {
-  .harness-hooks__list--grid {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-}
-
-@media (max-width: 600px) {
-  .harness-hooks__list--grid {
-    grid-template-columns: minmax(0, 1fr);
-  }
+  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+  gap: 0.7rem;
 }
 
 .harness-hooks__item {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  gap: 0.75rem;
-  padding: 0.6rem 0.7rem;
+  gap: 0.7rem;
+  padding: 0.7rem 0.8rem;
   border: 1px solid var(--border);
-  border-radius: 6px;
-  background: rgba(255, 255, 255, 0.02);
+  border-radius: 0.6rem;
+  background: var(--bg-panel);
+  transition: border-color 140ms ease, background 140ms ease;
+}
+
+.harness-hooks__item:hover {
+  border-color: var(--border-strong, rgba(255, 255, 255, 0.12));
+  background: rgba(255, 255, 255, 0.035);
 }
 
 .harness-hooks__main {
@@ -4471,6 +4539,9 @@ button.workbench-shortcut-row--action:focus-visible {
 .harness-hooks__name {
   display: block;
   text-transform: lowercase;
+  font-size: 0.88rem;
+  font-weight: 600;
+  color: var(--text);
 }
 
 .harness-hooks__status {
@@ -4494,13 +4565,19 @@ button.workbench-shortcut-row--action:focus-visible {
 
 .workbench-plain-input {
   font-family: var(--font-mono);
-  font-size: 0.75rem;
-  border-radius: 4px;
+  font-size: 0.82rem;
+  border-radius: 6px;
   border: 1px solid var(--border);
   background: var(--bg-panel);
   color: var(--text);
-  padding: 0.35rem 0.45rem;
+  padding: 0.55rem 0.7rem;
   width: 100%;
+  transition: border-color 140ms ease, box-shadow 140ms ease;
+}
+.workbench-plain-input:focus {
+  outline: none;
+  border-color: rgba(88, 166, 255, 0.55);
+  box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.18);
 }
 
 @media (max-width: 720px) {

From d3997fec50298175fdc359dd79b4d6925ce8b483 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 02:53:10 +0200
Subject: [PATCH 03/48] feat(i18n): add appearance category and headings to
 localization files

---
 src/i18n/keys.rs            |  2 +
 src/i18n/locales/de_de.rs   |  2 +
 src/i18n/locales/en_us.rs   |  2 +
 src/i18n/locales/es_es.rs   |  2 +
 src/i18n/locales/fr_fr.rs   |  2 +
 src/i18n/locales/hu_hu.rs   |  2 +
 src/i18n/locales/it_it.rs   |  2 +
 src/i18n/locales/ja_jp.rs   |  2 +
 src/i18n/locales/ko_kr.rs   |  2 +
 src/i18n/locales/pl_pl.rs   |  2 +
 src/i18n/locales/pt_br.rs   |  2 +
 src/i18n/locales/ru_ru.rs   |  2 +
 src/i18n/locales/zh_cn.rs   |  2 +
 src/i18n/locales/zh_tw.rs   |  2 +
 src/workbench/harness_ui.rs | 76 ++++++++++++++++++++++++-------------
 src/workbench/state.rs      |  1 +
 styles.css                  | 32 ++++------------
 17 files changed, 86 insertions(+), 51 deletions(-)

diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index d45f5de..e567a88 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -318,11 +318,13 @@ pub enum I18nKey {
     HsTitle,
     HsAriaCats,
     HsCatApp,
+    HsCatAppearance,
     HsCatWorkspace,
     HsCatProvider,
     HsCatVoice,
     HsCatImage,
     AppHeading,
+    AppearanceHeading,
     GenEulaStatus,
     AppLanguage,
     AppHooksHeading,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index b275f4b..5eb7f87 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -310,11 +310,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "BLXCode-Einstellungen",
         I18nKey::HsAriaCats => "Kategorien",
         I18nKey::HsCatApp => "App",
+        I18nKey::HsCatAppearance => "Erscheinungsbild",
         I18nKey::HsCatWorkspace => "Arbeitsplatz",
         I18nKey::HsCatProvider => "Agentenanbieter",
         I18nKey::HsCatVoice => "Stimme",
         I18nKey::HsCatImage => "Bild",
         I18nKey::AppHeading => "App",
+        I18nKey::AppearanceHeading => "Erscheinungsbild",
         I18nKey::GenEulaStatus => "EULA-Status",
         I18nKey::AppLanguage => "UI-Sprache",
         I18nKey::AppHooksHeading => "Terminal-Hooks",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index 13ccc79..067baa8 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -348,11 +348,13 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::HsTitle => "BLXCode settings",
         I18nKey::HsAriaCats => "Categories",
         I18nKey::HsCatApp => "App",
+        I18nKey::HsCatAppearance => "Appearance",
         I18nKey::HsCatWorkspace => "Workspace",
         I18nKey::HsCatProvider => "Agent Provider",
         I18nKey::HsCatVoice => "Voice",
         I18nKey::HsCatImage => "Image",
         I18nKey::AppHeading => "App",
+        I18nKey::AppearanceHeading => "Appearance",
         I18nKey::GenEulaStatus => "EULA status",
         I18nKey::AppLanguage => "UI language",
         I18nKey::AppHooksHeading => "Terminal hooks",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index f8071b6..a8b24f9 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -310,11 +310,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "Configuración del código BLX",
         I18nKey::HsAriaCats => "Categorías",
         I18nKey::HsCatApp => "Aplicación",
+        I18nKey::HsCatAppearance => "Apariencia",
         I18nKey::HsCatWorkspace => "Espacio de trabajo",
         I18nKey::HsCatProvider => "Proveedor de agentes",
         I18nKey::HsCatVoice => "Voz",
         I18nKey::HsCatImage => "Imagen",
         I18nKey::AppHeading => "Aplicación",
+        I18nKey::AppearanceHeading => "Apariencia",
         I18nKey::GenEulaStatus => "Estado del CLUF",
         I18nKey::AppLanguage => "Idioma de la interfaz de usuario",
         I18nKey::AppHooksHeading => "Ganchos terminales",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index e3077f3..215096e 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -312,11 +312,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "Paramètres du code BLX",
         I18nKey::HsAriaCats => "Catégories",
         I18nKey::HsCatApp => "Application",
+        I18nKey::HsCatAppearance => "Apparence",
         I18nKey::HsCatWorkspace => "Espace de travail",
         I18nKey::HsCatProvider => "Fournisseur d'agents",
         I18nKey::HsCatVoice => "Voix",
         I18nKey::HsCatImage => "Image",
         I18nKey::AppHeading => "Application",
+        I18nKey::AppearanceHeading => "Apparence",
         I18nKey::GenEulaStatus => "Statut du CLUF",
         I18nKey::AppLanguage => "Langue de l'interface utilisateur",
         I18nKey::AppHooksHeading => "Crochets de borne",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index f8ab4e5..222ce6f 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -310,11 +310,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "BLXCode beállítások",
         I18nKey::HsAriaCats => "Kategóriák",
         I18nKey::HsCatApp => "App",
+        I18nKey::HsCatAppearance => "Megjelenés",
         I18nKey::HsCatWorkspace => "Munkaterület",
         I18nKey::HsCatProvider => "Ügynökszolgáltató",
         I18nKey::HsCatVoice => "Hang",
         I18nKey::HsCatImage => "Kép",
         I18nKey::AppHeading => "App",
+        I18nKey::AppearanceHeading => "Megjelenés",
         I18nKey::GenEulaStatus => "EULA állapot",
         I18nKey::AppLanguage => "UI nyelv",
         I18nKey::AppHooksHeading => "Terminál horgok",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index 33042c2..c005940 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -310,11 +310,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "Impostazioni del codice BLX",
         I18nKey::HsAriaCats => "Categorie",
         I18nKey::HsCatApp => "App",
+        I18nKey::HsCatAppearance => "Aspetto",
         I18nKey::HsCatWorkspace => "Spazio di lavoro",
         I18nKey::HsCatProvider => "Fornitore di agenti",
         I18nKey::HsCatVoice => "Voce",
         I18nKey::HsCatImage => "Immagine",
         I18nKey::AppHeading => "App",
+        I18nKey::AppearanceHeading => "Aspetto",
         I18nKey::GenEulaStatus => "Stato dell'EULA",
         I18nKey::AppLanguage => "Lingua dell'interfaccia utente",
         I18nKey::AppHooksHeading => "Ganci terminali",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index fe5452c..2b18d8c 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -304,11 +304,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "BLXCodeの設定",
         I18nKey::HsAriaCats => "カテゴリー",
         I18nKey::HsCatApp => "アプリ",
+        I18nKey::HsCatAppearance => "外観",
         I18nKey::HsCatWorkspace => "ワークスペース",
         I18nKey::HsCatProvider => "エージェントプロバイダー",
         I18nKey::HsCatVoice => "声",
         I18nKey::HsCatImage => "画像",
         I18nKey::AppHeading => "アプリ",
+        I18nKey::AppearanceHeading => "外観",
         I18nKey::GenEulaStatus => "EULAステータス",
         I18nKey::AppLanguage => "UI言語",
         I18nKey::AppHooksHeading => "端子フック",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index 0e4debe..08d1d0a 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -304,11 +304,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "BLX코드 설정",
         I18nKey::HsAriaCats => "카테고리",
         I18nKey::HsCatApp => "앱",
+        I18nKey::HsCatAppearance => "모양새",
         I18nKey::HsCatWorkspace => "작업공간",
         I18nKey::HsCatProvider => "에이전트 제공자",
         I18nKey::HsCatVoice => "목소리",
         I18nKey::HsCatImage => "영상",
         I18nKey::AppHeading => "앱",
+        I18nKey::AppearanceHeading => "모양새",
         I18nKey::GenEulaStatus => "EULA 상태",
         I18nKey::AppLanguage => "UI 언어",
         I18nKey::AppHooksHeading => "단자 후크",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index bcac1da..5acd18f 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -308,11 +308,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "Ustawienia BLXCode",
         I18nKey::HsAriaCats => "Kategorie",
         I18nKey::HsCatApp => "Aplikacja",
+        I18nKey::HsCatAppearance => "Wygląd",
         I18nKey::HsCatWorkspace => "Obszar roboczy",
         I18nKey::HsCatProvider => "Dostawca agenta",
         I18nKey::HsCatVoice => "Głos",
         I18nKey::HsCatImage => "Obraz",
         I18nKey::AppHeading => "Aplikacja",
+        I18nKey::AppearanceHeading => "Wygląd",
         I18nKey::GenEulaStatus => "Stan EULA",
         I18nKey::AppLanguage => "Język interfejsu",
         I18nKey::AppHooksHeading => "Haki końcowe",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index 042d2e3..f28cf78 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -310,11 +310,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "Configurações do BLXCode",
         I18nKey::HsAriaCats => "Categorias",
         I18nKey::HsCatApp => "Aplicativo",
+        I18nKey::HsCatAppearance => "Aparência",
         I18nKey::HsCatWorkspace => "Espaço de trabalho",
         I18nKey::HsCatProvider => "Provedor de agente",
         I18nKey::HsCatVoice => "Voz",
         I18nKey::HsCatImage => "Imagem",
         I18nKey::AppHeading => "Aplicativo",
+        I18nKey::AppearanceHeading => "Aparência",
         I18nKey::GenEulaStatus => "Status do EULA",
         I18nKey::AppLanguage => "Idioma da IU",
         I18nKey::AppHooksHeading => "Ganchos terminais",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index 1e37cba..100c220 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -308,11 +308,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "Настройки BLXкода",
         I18nKey::HsAriaCats => "Категории",
         I18nKey::HsCatApp => "Приложение",
+        I18nKey::HsCatAppearance => "Внешний вид",
         I18nKey::HsCatWorkspace => "Рабочая область",
         I18nKey::HsCatProvider => "Поставщик агентов",
         I18nKey::HsCatVoice => "Голос",
         I18nKey::HsCatImage => "Изображение",
         I18nKey::AppHeading => "Приложение",
+        I18nKey::AppearanceHeading => "Внешний вид",
         I18nKey::GenEulaStatus => "Статус лицензионного соглашения",
         I18nKey::AppLanguage => "язык пользовательского интерфейса",
         I18nKey::AppHooksHeading => "Терминальные крючки",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index 14931db..10789dd 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -302,11 +302,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "BLX 代码设置",
         I18nKey::HsAriaCats => "类别",
         I18nKey::HsCatApp => "应用程序",
+        I18nKey::HsCatAppearance => "外观",
         I18nKey::HsCatWorkspace => "工作空间",
         I18nKey::HsCatProvider => "代理提供商",
         I18nKey::HsCatVoice => "嗓音",
         I18nKey::HsCatImage => "图像",
         I18nKey::AppHeading => "应用程序",
+        I18nKey::AppearanceHeading => "外观",
         I18nKey::GenEulaStatus => "EULA 状态",
         I18nKey::AppLanguage => "用户界面语言",
         I18nKey::AppHooksHeading => "端子挂钩",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index 79beaaf..8b4ae2c 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -302,11 +302,13 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsTitle => "BLX 代碼設定",
         I18nKey::HsAriaCats => "類別",
         I18nKey::HsCatApp => "應用程式",
+        I18nKey::HsCatAppearance => "外觀",
         I18nKey::HsCatWorkspace => "工作空間",
         I18nKey::HsCatProvider => "代理商提供者",
         I18nKey::HsCatVoice => "嗓音",
         I18nKey::HsCatImage => "影像",
         I18nKey::AppHeading => "應用程式",
+        I18nKey::AppearanceHeading => "外觀",
         I18nKey::GenEulaStatus => "EULA 狀態",
         I18nKey::AppLanguage => "使用者介面語言",
         I18nKey::AppHooksHeading => "端子掛鉤",
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index 4e9e0b4..fe66a1c 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -670,6 +670,7 @@ fn defer_browser_bounds(wb: WorkbenchService, embed: BrowserEmbedSurface) {
 fn harness_settings_cat_icon(cat: HarnessSettingsCategory) -> icondata::Icon {
     match cat {
         HarnessSettingsCategory::App => icondata::LuLayoutDashboard,
+        HarnessSettingsCategory::Appearance => icondata::LuSunMoon,
         HarnessSettingsCategory::Workspace => icondata::LuFolderOpen,
         HarnessSettingsCategory::AgentProvider => icondata::LuCpu,
         HarnessSettingsCategory::Memory => icondata::LuPalette,
@@ -690,6 +691,7 @@ pub fn SettingsDock(
         <div class="harness-settings-grid harness-settings-grid--docked">
             <nav class="harness-settings-cats" aria-label=move || i18n.tr(I18nKey::HsAriaCats)()>
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::App label=I18nKey::HsCatApp />
+                <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Appearance label=I18nKey::HsCatAppearance />
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Workspace label=I18nKey::HsCatWorkspace />
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::AgentProvider label=I18nKey::HsCatProvider />
                 <HarnessCatStaticBtn ui=ui cat=HarnessSettingsCategory::Memory label="Memory" />
@@ -702,6 +704,9 @@ pub fn SettingsDock(
                     HarnessSettingsCategory::App => view! {
                         <AppSettingsPane />
                     }.into_any(),
+                    HarnessSettingsCategory::Appearance => view! {
+                        <AppearanceSettingsPane />
+                    }.into_any(),
                     HarnessSettingsCategory::Workspace => view! {
                         <WorkspaceSettingsPane ui=ui wb=wb embed=embed />
                     }.into_any(),
@@ -956,32 +961,36 @@ fn AppSettingsPane() -> impl IntoView {
                     </span>
                     <span>{move || i18n.tr(I18nKey::AppShortcutHeading)()}</span>
                 </h4>
-                <fieldset class="app-prefs-shortcut-modes app-prefs-shortcut-modes--grid">
-                    <label class="app-prefs-radio">
-                        <input
-                            type="radio"
-                            name="shortcut-mode"
-                            prop:checked=move || prefs.shortcut_mode().get() == ShortcutMode::Tmux
-                            on:change=move |_| {
-                                prefs.set_shortcut_mode(ShortcutMode::Tmux);
-                                ui.clear_prefix();
-                            }
-                        />
-                        <span>{move || i18n.tr(I18nKey::AppShortcutModeTmux)()}</span>
-                    </label>
-                    <label class="app-prefs-radio">
-                        <input
-                            type="radio"
-                            name="shortcut-mode"
-                            prop:checked=move || prefs.shortcut_mode().get() == ShortcutMode::Legacy
-                            on:change=move |_| {
-                                prefs.set_shortcut_mode(ShortcutMode::Legacy);
-                                ui.clear_prefix();
-                            }
-                        />
-                        <span>{move || i18n.tr(I18nKey::AppShortcutModeLegacy)()}</span>
-                    </label>
-                </fieldset>
+                <div class="app-prefs-toggle-grid">
+                    <div class="app-prefs-toggle-cell">
+                        <label class="app-prefs-radio">
+                            <input
+                                type="radio"
+                                name="shortcut-mode"
+                                prop:checked=move || prefs.shortcut_mode().get() == ShortcutMode::Tmux
+                                on:change=move |_| {
+                                    prefs.set_shortcut_mode(ShortcutMode::Tmux);
+                                    ui.clear_prefix();
+                                }
+                            />
+                            <span>{move || i18n.tr(I18nKey::AppShortcutModeTmux)()}</span>
+                        </label>
+                    </div>
+                    <div class="app-prefs-toggle-cell">
+                        <label class="app-prefs-radio">
+                            <input
+                                type="radio"
+                                name="shortcut-mode"
+                                prop:checked=move || prefs.shortcut_mode().get() == ShortcutMode::Legacy
+                                on:change=move |_| {
+                                    prefs.set_shortcut_mode(ShortcutMode::Legacy);
+                                    ui.clear_prefix();
+                                }
+                            />
+                            <span>{move || i18n.tr(I18nKey::AppShortcutModeLegacy)()}</span>
+                        </label>
+                    </div>
+                </div>
                 <p class="app-prefs-hint">{move || i18n.tr(I18nKey::AppShortcutModeHint)()}</p>
             </section>
             <section class="harness-subpane">
@@ -1102,6 +1111,21 @@ fn AppSettingsPane() -> impl IntoView {
     }
 }
 
+#[component]
+fn AppearanceSettingsPane() -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    view! {
+        <article class="harness-pane">
+            <h3 class="harness-pane-title">
+                <span class="harness-pane-title__icon" aria-hidden="true">
+                    <LxIcon icon=icondata::LuSunMoon width="1.02rem" height="1.02rem" />
+                </span>
+                <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::AppearanceHeading)()}</span>
+            </h3>
+        </article>
+    }
+}
+
 #[component]
 fn MemorySettingsPane(wb: WorkbenchService) -> impl IntoView {
     let new_label = RwSignal::new(String::new());
diff --git a/src/workbench/state.rs b/src/workbench/state.rs
index 3ddb80c..bf9e0a9 100644
--- a/src/workbench/state.rs
+++ b/src/workbench/state.rs
@@ -604,6 +604,7 @@ pub enum RightPanelTab {
 #[derive(Clone, Copy, Debug, PartialEq, Eq, Serialize, Deserialize)]
 pub enum HarnessSettingsCategory {
     App,
+    Appearance,
     Workspace,
     AgentProvider,
     Memory,
diff --git a/styles.css b/styles.css
index 3f03c32..d7e77b5 100644
--- a/styles.css
+++ b/styles.css
@@ -1485,21 +1485,6 @@ button.workbench-shortcut-row--action:focus-visible {
   user-select: none;
 }
 
-.app-prefs-shortcut-modes {
-  border: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 0.45rem;
-}
-
-.app-prefs-shortcut-modes--grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
-  gap: 0.55rem 1rem;
-}
-
 .app-prefs-toggle-grid {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
@@ -1516,7 +1501,8 @@ button.workbench-shortcut-row--action:focus-visible {
   background: rgba(255, 255, 255, 0.02);
 }
 
-.app-prefs-toggle-cell .app-prefs-toggle {
+.app-prefs-toggle-cell .app-prefs-toggle,
+.app-prefs-toggle-cell .app-prefs-radio {
   margin: 0;
   font-size: 0.85rem;
 }
@@ -4136,7 +4122,8 @@ button.workbench-shortcut-row--action:focus-visible {
   display: flex;
   flex-direction: column;
   gap: 1.25rem;
-  max-width: 880px;
+  width: 100%;
+  max-width: none;
 }
 
 .harness-pane-title {
@@ -4483,9 +4470,9 @@ button.workbench-shortcut-row--action:focus-visible {
 
 .harness-hooks__item {
   display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 0.7rem;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 0.55rem;
   padding: 0.7rem 0.8rem;
   border: 1px solid var(--border);
   border-radius: 0.6rem;
@@ -4589,11 +4576,6 @@ button.workbench-shortcut-row--action:focus-visible {
     grid-template-columns: minmax(0, 1fr);
   }
 
-  .harness-hooks__item {
-    align-items: flex-start;
-    flex-direction: column;
-  }
-
   .harness-settings-cats {
     flex-direction: row;
     overflow-x: auto;

From 1b66656519e8198b1195a90886a10971b0a5b602 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 02:58:24 +0200
Subject: [PATCH 04/48] feat(i18n): add API keys category and headings to
 localization files

---
 src/i18n/keys.rs            |  2 ++
 src/i18n/locales/de_de.rs   |  2 ++
 src/i18n/locales/en_us.rs   |  2 ++
 src/i18n/locales/es_es.rs   |  2 ++
 src/i18n/locales/fr_fr.rs   |  2 ++
 src/i18n/locales/hu_hu.rs   |  2 ++
 src/i18n/locales/it_it.rs   |  2 ++
 src/i18n/locales/ja_jp.rs   |  2 ++
 src/i18n/locales/ko_kr.rs   |  2 ++
 src/i18n/locales/pl_pl.rs   |  2 ++
 src/i18n/locales/pt_br.rs   |  2 ++
 src/i18n/locales/ru_ru.rs   |  2 ++
 src/i18n/locales/zh_cn.rs   |  2 ++
 src/i18n/locales/zh_tw.rs   |  2 ++
 src/workbench/harness_ui.rs | 20 ++++++++++++++++++++
 src/workbench/state.rs      |  1 +
 16 files changed, 49 insertions(+)

diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index e567a88..54977f7 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -319,12 +319,14 @@ pub enum I18nKey {
     HsAriaCats,
     HsCatApp,
     HsCatAppearance,
+    HsCatApiKeys,
     HsCatWorkspace,
     HsCatProvider,
     HsCatVoice,
     HsCatImage,
     AppHeading,
     AppearanceHeading,
+    ApiKeysHeading,
     GenEulaStatus,
     AppLanguage,
     AppHooksHeading,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index 5eb7f87..21947bb 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -311,12 +311,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "Kategorien",
         I18nKey::HsCatApp => "App",
         I18nKey::HsCatAppearance => "Erscheinungsbild",
+        I18nKey::HsCatApiKeys => "API-Schlüssel",
         I18nKey::HsCatWorkspace => "Arbeitsplatz",
         I18nKey::HsCatProvider => "Agentenanbieter",
         I18nKey::HsCatVoice => "Stimme",
         I18nKey::HsCatImage => "Bild",
         I18nKey::AppHeading => "App",
         I18nKey::AppearanceHeading => "Erscheinungsbild",
+        I18nKey::ApiKeysHeading => "API-Schlüssel",
         I18nKey::GenEulaStatus => "EULA-Status",
         I18nKey::AppLanguage => "UI-Sprache",
         I18nKey::AppHooksHeading => "Terminal-Hooks",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index 067baa8..7e0fad6 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -349,12 +349,14 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::HsAriaCats => "Categories",
         I18nKey::HsCatApp => "App",
         I18nKey::HsCatAppearance => "Appearance",
+        I18nKey::HsCatApiKeys => "API Keys",
         I18nKey::HsCatWorkspace => "Workspace",
         I18nKey::HsCatProvider => "Agent Provider",
         I18nKey::HsCatVoice => "Voice",
         I18nKey::HsCatImage => "Image",
         I18nKey::AppHeading => "App",
         I18nKey::AppearanceHeading => "Appearance",
+        I18nKey::ApiKeysHeading => "API Keys",
         I18nKey::GenEulaStatus => "EULA status",
         I18nKey::AppLanguage => "UI language",
         I18nKey::AppHooksHeading => "Terminal hooks",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index a8b24f9..324a31f 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -311,12 +311,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "Categorías",
         I18nKey::HsCatApp => "Aplicación",
         I18nKey::HsCatAppearance => "Apariencia",
+        I18nKey::HsCatApiKeys => "Claves API",
         I18nKey::HsCatWorkspace => "Espacio de trabajo",
         I18nKey::HsCatProvider => "Proveedor de agentes",
         I18nKey::HsCatVoice => "Voz",
         I18nKey::HsCatImage => "Imagen",
         I18nKey::AppHeading => "Aplicación",
         I18nKey::AppearanceHeading => "Apariencia",
+        I18nKey::ApiKeysHeading => "Claves API",
         I18nKey::GenEulaStatus => "Estado del CLUF",
         I18nKey::AppLanguage => "Idioma de la interfaz de usuario",
         I18nKey::AppHooksHeading => "Ganchos terminales",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index 215096e..a5fd698 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -313,12 +313,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "Catégories",
         I18nKey::HsCatApp => "Application",
         I18nKey::HsCatAppearance => "Apparence",
+        I18nKey::HsCatApiKeys => "Clés API",
         I18nKey::HsCatWorkspace => "Espace de travail",
         I18nKey::HsCatProvider => "Fournisseur d'agents",
         I18nKey::HsCatVoice => "Voix",
         I18nKey::HsCatImage => "Image",
         I18nKey::AppHeading => "Application",
         I18nKey::AppearanceHeading => "Apparence",
+        I18nKey::ApiKeysHeading => "Clés API",
         I18nKey::GenEulaStatus => "Statut du CLUF",
         I18nKey::AppLanguage => "Langue de l'interface utilisateur",
         I18nKey::AppHooksHeading => "Crochets de borne",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index 222ce6f..73e7b9c 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -311,12 +311,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "Kategóriák",
         I18nKey::HsCatApp => "App",
         I18nKey::HsCatAppearance => "Megjelenés",
+        I18nKey::HsCatApiKeys => "API-kulcsok",
         I18nKey::HsCatWorkspace => "Munkaterület",
         I18nKey::HsCatProvider => "Ügynökszolgáltató",
         I18nKey::HsCatVoice => "Hang",
         I18nKey::HsCatImage => "Kép",
         I18nKey::AppHeading => "App",
         I18nKey::AppearanceHeading => "Megjelenés",
+        I18nKey::ApiKeysHeading => "API-kulcsok",
         I18nKey::GenEulaStatus => "EULA állapot",
         I18nKey::AppLanguage => "UI nyelv",
         I18nKey::AppHooksHeading => "Terminál horgok",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index c005940..3d0b3f1 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -311,12 +311,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "Categorie",
         I18nKey::HsCatApp => "App",
         I18nKey::HsCatAppearance => "Aspetto",
+        I18nKey::HsCatApiKeys => "Chiavi API",
         I18nKey::HsCatWorkspace => "Spazio di lavoro",
         I18nKey::HsCatProvider => "Fornitore di agenti",
         I18nKey::HsCatVoice => "Voce",
         I18nKey::HsCatImage => "Immagine",
         I18nKey::AppHeading => "App",
         I18nKey::AppearanceHeading => "Aspetto",
+        I18nKey::ApiKeysHeading => "Chiavi API",
         I18nKey::GenEulaStatus => "Stato dell'EULA",
         I18nKey::AppLanguage => "Lingua dell'interfaccia utente",
         I18nKey::AppHooksHeading => "Ganci terminali",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index 2b18d8c..26002d7 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -305,12 +305,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "カテゴリー",
         I18nKey::HsCatApp => "アプリ",
         I18nKey::HsCatAppearance => "外観",
+        I18nKey::HsCatApiKeys => "APIキー",
         I18nKey::HsCatWorkspace => "ワークスペース",
         I18nKey::HsCatProvider => "エージェントプロバイダー",
         I18nKey::HsCatVoice => "声",
         I18nKey::HsCatImage => "画像",
         I18nKey::AppHeading => "アプリ",
         I18nKey::AppearanceHeading => "外観",
+        I18nKey::ApiKeysHeading => "APIキー",
         I18nKey::GenEulaStatus => "EULAステータス",
         I18nKey::AppLanguage => "UI言語",
         I18nKey::AppHooksHeading => "端子フック",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index 08d1d0a..cd65704 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -305,12 +305,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "카테고리",
         I18nKey::HsCatApp => "앱",
         I18nKey::HsCatAppearance => "모양새",
+        I18nKey::HsCatApiKeys => "API 키",
         I18nKey::HsCatWorkspace => "작업공간",
         I18nKey::HsCatProvider => "에이전트 제공자",
         I18nKey::HsCatVoice => "목소리",
         I18nKey::HsCatImage => "영상",
         I18nKey::AppHeading => "앱",
         I18nKey::AppearanceHeading => "모양새",
+        I18nKey::ApiKeysHeading => "API 키",
         I18nKey::GenEulaStatus => "EULA 상태",
         I18nKey::AppLanguage => "UI 언어",
         I18nKey::AppHooksHeading => "단자 후크",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index 5acd18f..0eab830 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -309,12 +309,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "Kategorie",
         I18nKey::HsCatApp => "Aplikacja",
         I18nKey::HsCatAppearance => "Wygląd",
+        I18nKey::HsCatApiKeys => "Klucze API",
         I18nKey::HsCatWorkspace => "Obszar roboczy",
         I18nKey::HsCatProvider => "Dostawca agenta",
         I18nKey::HsCatVoice => "Głos",
         I18nKey::HsCatImage => "Obraz",
         I18nKey::AppHeading => "Aplikacja",
         I18nKey::AppearanceHeading => "Wygląd",
+        I18nKey::ApiKeysHeading => "Klucze API",
         I18nKey::GenEulaStatus => "Stan EULA",
         I18nKey::AppLanguage => "Język interfejsu",
         I18nKey::AppHooksHeading => "Haki końcowe",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index f28cf78..8bad670 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -311,12 +311,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "Categorias",
         I18nKey::HsCatApp => "Aplicativo",
         I18nKey::HsCatAppearance => "Aparência",
+        I18nKey::HsCatApiKeys => "Chaves de API",
         I18nKey::HsCatWorkspace => "Espaço de trabalho",
         I18nKey::HsCatProvider => "Provedor de agente",
         I18nKey::HsCatVoice => "Voz",
         I18nKey::HsCatImage => "Imagem",
         I18nKey::AppHeading => "Aplicativo",
         I18nKey::AppearanceHeading => "Aparência",
+        I18nKey::ApiKeysHeading => "Chaves de API",
         I18nKey::GenEulaStatus => "Status do EULA",
         I18nKey::AppLanguage => "Idioma da IU",
         I18nKey::AppHooksHeading => "Ganchos terminais",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index 100c220..91735e8 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -309,12 +309,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "Категории",
         I18nKey::HsCatApp => "Приложение",
         I18nKey::HsCatAppearance => "Внешний вид",
+        I18nKey::HsCatApiKeys => "API-ключи",
         I18nKey::HsCatWorkspace => "Рабочая область",
         I18nKey::HsCatProvider => "Поставщик агентов",
         I18nKey::HsCatVoice => "Голос",
         I18nKey::HsCatImage => "Изображение",
         I18nKey::AppHeading => "Приложение",
         I18nKey::AppearanceHeading => "Внешний вид",
+        I18nKey::ApiKeysHeading => "API-ключи",
         I18nKey::GenEulaStatus => "Статус лицензионного соглашения",
         I18nKey::AppLanguage => "язык пользовательского интерфейса",
         I18nKey::AppHooksHeading => "Терминальные крючки",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index 10789dd..9f0e57a 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -303,12 +303,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "类别",
         I18nKey::HsCatApp => "应用程序",
         I18nKey::HsCatAppearance => "外观",
+        I18nKey::HsCatApiKeys => "API 密钥",
         I18nKey::HsCatWorkspace => "工作空间",
         I18nKey::HsCatProvider => "代理提供商",
         I18nKey::HsCatVoice => "嗓音",
         I18nKey::HsCatImage => "图像",
         I18nKey::AppHeading => "应用程序",
         I18nKey::AppearanceHeading => "外观",
+        I18nKey::ApiKeysHeading => "API 密钥",
         I18nKey::GenEulaStatus => "EULA 状态",
         I18nKey::AppLanguage => "用户界面语言",
         I18nKey::AppHooksHeading => "端子挂钩",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index 8b4ae2c..73bc939 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -303,12 +303,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsAriaCats => "類別",
         I18nKey::HsCatApp => "應用程式",
         I18nKey::HsCatAppearance => "外觀",
+        I18nKey::HsCatApiKeys => "API 金鑰",
         I18nKey::HsCatWorkspace => "工作空間",
         I18nKey::HsCatProvider => "代理商提供者",
         I18nKey::HsCatVoice => "嗓音",
         I18nKey::HsCatImage => "影像",
         I18nKey::AppHeading => "應用程式",
         I18nKey::AppearanceHeading => "外觀",
+        I18nKey::ApiKeysHeading => "API 金鑰",
         I18nKey::GenEulaStatus => "EULA 狀態",
         I18nKey::AppLanguage => "使用者介面語言",
         I18nKey::AppHooksHeading => "端子掛鉤",
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index fe66a1c..0cf82fc 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -671,6 +671,7 @@ fn harness_settings_cat_icon(cat: HarnessSettingsCategory) -> icondata::Icon {
     match cat {
         HarnessSettingsCategory::App => icondata::LuLayoutDashboard,
         HarnessSettingsCategory::Appearance => icondata::LuSunMoon,
+        HarnessSettingsCategory::ApiKeys => icondata::LuKeyRound,
         HarnessSettingsCategory::Workspace => icondata::LuFolderOpen,
         HarnessSettingsCategory::AgentProvider => icondata::LuCpu,
         HarnessSettingsCategory::Memory => icondata::LuPalette,
@@ -692,6 +693,7 @@ pub fn SettingsDock(
             <nav class="harness-settings-cats" aria-label=move || i18n.tr(I18nKey::HsAriaCats)()>
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::App label=I18nKey::HsCatApp />
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Appearance label=I18nKey::HsCatAppearance />
+                <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::ApiKeys label=I18nKey::HsCatApiKeys />
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Workspace label=I18nKey::HsCatWorkspace />
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::AgentProvider label=I18nKey::HsCatProvider />
                 <HarnessCatStaticBtn ui=ui cat=HarnessSettingsCategory::Memory label="Memory" />
@@ -707,6 +709,9 @@ pub fn SettingsDock(
                     HarnessSettingsCategory::Appearance => view! {
                         <AppearanceSettingsPane />
                     }.into_any(),
+                    HarnessSettingsCategory::ApiKeys => view! {
+                        <ApiKeysSettingsPane />
+                    }.into_any(),
                     HarnessSettingsCategory::Workspace => view! {
                         <WorkspaceSettingsPane ui=ui wb=wb embed=embed />
                     }.into_any(),
@@ -1126,6 +1131,21 @@ fn AppearanceSettingsPane() -> impl IntoView {
     }
 }
 
+#[component]
+fn ApiKeysSettingsPane() -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    view! {
+        <article class="harness-pane">
+            <h3 class="harness-pane-title">
+                <span class="harness-pane-title__icon" aria-hidden="true">
+                    <LxIcon icon=icondata::LuKeyRound width="1.02rem" height="1.02rem" />
+                </span>
+                <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::ApiKeysHeading)()}</span>
+            </h3>
+        </article>
+    }
+}
+
 #[component]
 fn MemorySettingsPane(wb: WorkbenchService) -> impl IntoView {
     let new_label = RwSignal::new(String::new());
diff --git a/src/workbench/state.rs b/src/workbench/state.rs
index bf9e0a9..af4c8b9 100644
--- a/src/workbench/state.rs
+++ b/src/workbench/state.rs
@@ -605,6 +605,7 @@ pub enum RightPanelTab {
 pub enum HarnessSettingsCategory {
     App,
     Appearance,
+    ApiKeys,
     Workspace,
     AgentProvider,
     Memory,

From 1f5d8181f03164de57c9f2ed761410f3a948004c Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 03:01:13 +0200
Subject: [PATCH 05/48] feat(plans): add workspace color and terminal badge
 plan for sidebar integration

---
 .agents/plans/PLANS.md                        |  1 +
 .../plans/workspace-color-terminal-badge.md   | 76 +++++++++++++++++++
 2 files changed, 77 insertions(+)
 create mode 100644 .agents/plans/workspace-color-terminal-badge.md

diff --git a/.agents/plans/PLANS.md b/.agents/plans/PLANS.md
index 98380a6..52702fb 100644
--- a/.agents/plans/PLANS.md
+++ b/.agents/plans/PLANS.md
@@ -19,3 +19,4 @@ Persistent plans for multi-step work on **blxcode**. Individual plans live as Ma
 | done | [coordinated-subagents.md](coordinated-subagents.md) | Coordinated Subagents fuer BLXCode Agent mit Rollen, i18n Live-Subcards, Provider-Reuse, Environment Detection, Shell/Git/Web Toolsets und scoped Toolgruppen |
 | done | [better-harness.md](better-harness.md) | BetterHarness: Shrink system prompt by extracting tool docs into 6 embedded Core Skills; Skills tab gets Core/User sub-tabs |
 | done | [agent-chat-maximize.md](agent-chat-maximize.md) | Agent-Tab: Chat-Maximize-Toggle vor Reset; Voice-Hero kompakt (`agent-hero--compact`), mehr Platz fuer Chat-Verlauf |
+| planned | [workspace-color-terminal-badge.md](workspace-color-terminal-badge.md) | Workspace-Farbe persistent in Sidebar (Dot, farbiges Unread-Badge), Terminal-Slot-Zahl vor Name, aenderbar via Kontextmenue-Dialog |
diff --git a/.agents/plans/workspace-color-terminal-badge.md b/.agents/plans/workspace-color-terminal-badge.md
new file mode 100644
index 0000000..6809e19
--- /dev/null
+++ b/.agents/plans/workspace-color-terminal-badge.md
@@ -0,0 +1,76 @@
+# Workspace-Farbe und Terminal-Badge in der Sidebar
+
+## Summary
+
+Workspaces erhalten ein persistentes `color`-Feld (analog Memory-Kategorien), änderbar über den bestehenden Kontextmenü-Dialog. In der Sidebar erscheinen ein Farbpunkt links, eine Terminal-Slot-Zahl vor dem Namen (nur bei mehr als einem Slot) und ein farblich passendes Unread-Badge rechts. Persistenz über `workbench.json`; keine Backend-Änderungen.
+
+## Decisions
+
+- **Terminal-Zahl:** zählt Terminal-Slots (`slot_ids.len()`), nicht Split-Panes oder laufende PTY-Sessions.
+- **Anzeige Terminal-Badge:** nur wenn `slot_ids.len() > 1` (bei einem Slot ausblenden).
+- **Default-Farbe:** `stable_category_color(&storage_key)` für neue und backgefüllte Workspaces.
+- **Farb-Presets:** bestehende `memory_color_presets()` wiederverwenden (kein neuer localStorage-Key).
+- **Kontextmenü:** Rename-Dialog wird zu „Workspace bearbeiten" mit Name + Farbe (wie `MemoryCategoryEditDialog`).
+- **Terminal-Badge-Farbe:** fest orange `#e8954a` (Mockup); Unread-Badge rechts nutzt Workspace-Farbe.
+
+## Implementation Notes
+
+### Datenmodell — [`src/workbench/state.rs`](../../src/workbench/state.rs)
+
+- `WorkspaceEntry.color: String` mit `#[serde(default)]` (leer = noch nicht gesetzt).
+- `workspace_effective_color(entry)` — gespeicherte Farbe oder `stable_category_color(&entry.storage_key)`.
+- Backfill leerer `color`-Felder beim Laden (`backfill_workspace_colors()` oder in `backfill_storage_keys()`).
+- `create_workspace`: initiale Farbe setzen.
+- Setter: `set_workspace_display(id, title, color)` oder `rename_workspace` + `set_workspace_color` erweitern.
+- `normalize_memory_color` aus [`memory_panel.rs`](../../src/workbench/memory_panel.rs) nach shared Modul (`state.rs` oder `color_util.rs`) verschieben.
+
+### Kontextmenü & Dialog — [`src/workbench/sidebar.rs`](../../src/workbench/sidebar.rs)
+
+- Rechtsklick-Menü: Eintrag „Bearbeiten" öffnet Dialog mit Name, `<input type="color">`, Hex-Feld, Swatches aus `wb.memory_color_presets()`.
+- Speichern schreibt Titel + normalisierte Farbe → debounced Auto-Save in [`mod.rs`](../../src/workbench/mod.rs).
+
+### Sidebar-Rendering — [`src/workbench/sidebar.rs`](../../src/workbench/sidebar.rs)
+
+Zeilenlayout (expanded):
+
+```mermaid
+flowchart LR
+  dot[Farbpunkt] --> termBadge[Terminal-Zahl] --> name[Name] --> unreadBadge[Unread]
+```
+
+- Farbpunkt: `.workbench-sidebar__color-dot` mit `--workspace-color`.
+- Terminal-Badge: `.workbench-sidebar__terminal-count` vor dem Namen.
+- `▸`-Bullet entfernen oder durch Farbpunkt ersetzen.
+- Unread-Badge: inline-style mit Workspace-Farbe statt festem Orange.
+- Collapsed-Modus: Farbe am Icon-Rand oder als Hintergrund des Initialen-Kästchens.
+
+### CSS — [`styles.css`](../../styles.css)
+
+Neue/angepasste Klassen: `__color-dot`, `__terminal-count`, dynamisches `__badge--total`, optional `__row--active` mit `--workspace-color` für `border-left-color`.
+
+### i18n — [`src/i18n/keys.rs`](../../src/i18n/keys.rs) + alle `locales/*.rs`
+
+Neue Keys: `SbEditMenu`, `SbEditTitle`, `SbEditSubmit`, `SbColorLabel`, `SbTerminalCountAria`.
+
+## Tests
+
+- Neuer Workspace: Farbpunkt sichtbar, persistiert nach Neustart.
+- Bestehende Workspaces ohne `color` in JSON: Backfill weist stabile Farbe zu.
+- Kontextmenü → Bearbeiten → Farbe ändern → Neustart → Farbe bleibt.
+- Terminal-Slots hinzufügen/entfernen: Zahl vor Name aktualisiert sich reaktiv.
+- Unread-Badge rechts nutzt Workspace-Farbe.
+- Collapsed-Sidebar: Farbe weiterhin erkennbar.
+
+```bash
+cargo check -p blxcode-ui --target wasm32-unknown-unknown
+cargo test --workspace
+```
+
+## Tasks
+
+- [ ] `model-color` - WorkspaceEntry.color, workspace_effective_color, Backfill und Setter in state.rs
+- [ ] `shared-color-util` - normalize_hex_color aus memory_panel extrahieren und gemeinsam nutzen
+- [ ] `edit-dialog` - Rename-Dialog in sidebar.rs zu Edit-Dialog mit Color-Picker und Presets erweitern
+- [ ] `sidebar-ui` - Farbpunkt, Terminal-Slot-Badge und farbiges Unread-Badge rendern
+- [ ] `css` - Neue Sidebar-Klassen in styles.css; Active-State mit Workspace-Farbe
+- [ ] `i18n` - Neue I18nKeys in keys.rs und allen locales/*.rs

From e67c03a0115b740370ffe9f3e6a94019221047fd Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 03:15:27 +0200
Subject: [PATCH 06/48] feat(plans): introduce centralized API keys management
 plan
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Added a new plan for the centralized management of API keys under Settings → API Keys.
- Outlined decisions regarding the UI structure, backend catalog, and key management processes.
- Included tasks for implementation across various modules, ensuring a streamlined approach to API key handling.
---
 .agents/plans/PLANS.md                |  1 +
 .agents/plans/api-keys-centralized.md | 26 ++++++++++++++++++++++++++
 2 files changed, 27 insertions(+)
 create mode 100644 .agents/plans/api-keys-centralized.md

diff --git a/.agents/plans/PLANS.md b/.agents/plans/PLANS.md
index 52702fb..27fd46f 100644
--- a/.agents/plans/PLANS.md
+++ b/.agents/plans/PLANS.md
@@ -20,3 +20,4 @@ Persistent plans for multi-step work on **blxcode**. Individual plans live as Ma
 | done | [better-harness.md](better-harness.md) | BetterHarness: Shrink system prompt by extracting tool docs into 6 embedded Core Skills; Skills tab gets Core/User sub-tabs |
 | done | [agent-chat-maximize.md](agent-chat-maximize.md) | Agent-Tab: Chat-Maximize-Toggle vor Reset; Voice-Hero kompakt (`agent-hero--compact`), mehr Platz fuer Chat-Verlauf |
 | planned | [workspace-color-terminal-badge.md](workspace-color-terminal-badge.md) | Workspace-Farbe persistent in Sidebar (Dot, farbiges Unread-Badge), Terminal-Slot-Zahl vor Name, aenderbar via Kontextmenue-Dialog |
+| planned | [api-keys-centralized.md](api-keys-centralized.md) | API-Schlüssel zentral unter Settings → API Keys; Backend-Katalog + resolve; Agent-Tab ohne Key-Felder; Coming-soon-Provider mit CRUD |
diff --git a/.agents/plans/api-keys-centralized.md b/.agents/plans/api-keys-centralized.md
new file mode 100644
index 0000000..0c8b5f0
--- /dev/null
+++ b/.agents/plans/api-keys-centralized.md
@@ -0,0 +1,26 @@
+# API Keys zentralisieren
+
+## Summary
+
+Zentrale Verwaltung aller API-Schlüssel unter **Settings → API Keys**. Agent-Tab behält nur Provider/Model/Thinking und Web-Backend-Auswahl. Backend-Modul `api_keys` mit Katalog, einheitlichem `resolve`, Keyring-Kompatibilität.
+
+Vollständiger Plan inkl. User-Entscheidungen: siehe Cursor-Plan `api_keys_zentralisieren` oder Abschnitte unten.
+
+## Decisions
+
+- Web-Keys (Tavily/Brave) in API Keys; Provider-Wahl bleibt im Agent-Tab.
+- UI: `src/workbench/settings/api_keys/` (Ordner `settings/` jetzt anlegen).
+- Katalog und Resolver im Backend; `api_keys_catalog` ist Quelle der Wahrheit.
+- `key_statuses` aus `agent_settings_get` entfernen.
+- Optionaler Env-Fallback für aktive Keys — **kein `.env` Pflicht**; Keyring/UI bleibt Standard. Reihenfolge: Keyring → (Agent: Fallback-Datei) → Env.
+- Icons: brand-icons wenn vorhanden, sonst LuIcon-Fallback.
+- Keyring-Konten unverändert; Coming-soon-Provider mit vollem CRUD.
+
+## Tasks
+
+- [ ] `api-keys-backend` - Modul `api_keys/`, Katalog, resolve, Commands, Delegation; `key_statuses` entfernen
+- [ ] `api-keys-bridge` - tauri_bridge, agent_wire, lib.rs
+- [ ] `settings-scaffold` - `src/workbench/settings/mod.rs` + wiring
+- [ ] `api-keys-ui` - `settings/api_keys/` mit Backend-Katalog + ApiKeyRow
+- [ ] `agent-pane-trim` - AgentProviderPane ohne Key-UI
+- [ ] `i18n-docs` - Locales + user/developer docs

From 9ea5b12cc6a04ac90dd819b0492444ac6c06c2dc Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 03:17:51 +0200
Subject: [PATCH 07/48] refactor(plans): update centralized API keys management
 plan
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Revised the summary to clarify the centralized API key management under Settings → API Keys, emphasizing a unified save button and backend improvements.
- Adjusted decisions and tasks to reflect changes in UI design, batch processing, and the removal of individual save actions.
- Enhanced task descriptions for better clarity on implementation across various modules.
---
 .agents/plans/api-keys-centralized.md | 27 +++++++++++----------------
 1 file changed, 11 insertions(+), 16 deletions(-)

diff --git a/.agents/plans/api-keys-centralized.md b/.agents/plans/api-keys-centralized.md
index 0c8b5f0..d63a23f 100644
--- a/.agents/plans/api-keys-centralized.md
+++ b/.agents/plans/api-keys-centralized.md
@@ -2,25 +2,20 @@
 
 ## Summary
 
-Zentrale Verwaltung aller API-Schlüssel unter **Settings → API Keys**. Agent-Tab behält nur Provider/Model/Thinking und Web-Backend-Auswahl. Backend-Modul `api_keys` mit Katalog, einheitlichem `resolve`, Keyring-Kompatibilität.
-
-Vollständiger Plan inkl. User-Entscheidungen: siehe Cursor-Plan `api_keys_zentralisieren` oder Abschnitte unten.
+Zentrale API-Schlüssel unter **Settings → API Keys**. UI folgt **App**- und **Workspace**-Harness-Stil; **ein** Speichern-Button für alle Keys. Backend: Katalog, Batch-`api_keys_apply`, zentraler `resolve`.
 
 ## Decisions
 
-- Web-Keys (Tavily/Brave) in API Keys; Provider-Wahl bleibt im Agent-Tab.
-- UI: `src/workbench/settings/api_keys/` (Ordner `settings/` jetzt anlegen).
-- Katalog und Resolver im Backend; `api_keys_catalog` ist Quelle der Wahrheit.
-- `key_statuses` aus `agent_settings_get` entfernen.
-- Optionaler Env-Fallback für aktive Keys — **kein `.env` Pflicht**; Keyring/UI bleibt Standard. Reihenfolge: Keyring → (Agent: Fallback-Datei) → Env.
-- Icons: brand-icons wenn vorhanden, sonst LuIcon-Fallback.
-- Keyring-Konten unverändert; Coming-soon-Provider mit vollem CRUD.
+- Design-Vorlage: `harness-pane`, `harness-subpane`, `harness-stack`, `workbench-plain-input`, Footer wie Workspace (`workbench-mini-btn--primary` + `LuSave` + `BtnSave`).
+- **Kein Save pro Zeile**; optional „Key entfernen“ pro Zeile → Draft, Ausführung mit globalem Save.
+- Batch-IPC: `api_keys_apply`.
+- (Siehe Cursor-Plan für Keyring, Env, Coming soon, Pfade.)
 
 ## Tasks
 
-- [ ] `api-keys-backend` - Modul `api_keys/`, Katalog, resolve, Commands, Delegation; `key_statuses` entfernen
-- [ ] `api-keys-bridge` - tauri_bridge, agent_wire, lib.rs
-- [ ] `settings-scaffold` - `src/workbench/settings/mod.rs` + wiring
-- [ ] `api-keys-ui` - `settings/api_keys/` mit Backend-Katalog + ApiKeyRow
-- [ ] `agent-pane-trim` - AgentProviderPane ohne Key-UI
-- [ ] `i18n-docs` - Locales + user/developer docs
+- [ ] `api-keys-backend` - Katalog, resolve, `api_keys_apply`
+- [ ] `api-keys-bridge` - tauri_bridge, agent_wire
+- [ ] `settings-scaffold` - `settings/mod.rs`
+- [ ] `api-keys-ui` - Harness-Stil, ein Save-Footer, Draft-State
+- [ ] `agent-pane-trim` - Agent ohne Key-UI
+- [ ] `i18n-docs` - Locales + docs

From 5855e4c7b719267c78d6e2f63dd86ce0236ef883 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 03:19:59 +0200
Subject: [PATCH 08/48] feat(plans): add runtime review section and update
 tasks for API keys management

---
 .agents/plans/api-keys-centralized.md | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/.agents/plans/api-keys-centralized.md b/.agents/plans/api-keys-centralized.md
index d63a23f..4a9d4b4 100644
--- a/.agents/plans/api-keys-centralized.md
+++ b/.agents/plans/api-keys-centralized.md
@@ -11,6 +11,10 @@ Zentrale API-Schlüssel unter **Settings → API Keys**. UI folgt **App**- und *
 - Batch-IPC: `api_keys_apply`.
 - (Siehe Cursor-Plan für Keyring, Env, Coming soon, Pfade.)
 
+## Runtime (Review)
+
+Agent, Subagents (gleicher Turn-Key), Image/Voice (Reuse OpenAI/OpenRouter-IDs), Web, Model-Refresh → alle über `api_keys::resolve` / `provider_key_pub`. Subagents: kein separater Lookup. Image-Fehler heute irreführend („Image-Einstellungen“) → auf API Keys umstellen.
+
 ## Tasks
 
 - [ ] `api-keys-backend` - Katalog, resolve, `api_keys_apply`
@@ -18,4 +22,5 @@ Zentrale API-Schlüssel unter **Settings → API Keys**. UI folgt **App**- und *
 - [ ] `settings-scaffold` - `settings/mod.rs`
 - [ ] `api-keys-ui` - Harness-Stil, ein Save-Footer, Draft-State
 - [ ] `agent-pane-trim` - Agent ohne Key-UI
-- [ ] `i18n-docs` - Locales + docs
+- [ ] `runtime-wiring` - provider_key_pub, image/voice/web, Fehlermeldungen
+- [ ] `i18n-docs` - Locales + docs + Fehlertexte

From 55a1ff702832d49fe7178e5fa51f8211d2fe3f29 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 03:27:03 +0200
Subject: [PATCH 09/48] feat(plans): enhance centralized API keys management
 with detailed UI and backend specifications

---
 .agents/plans/api-keys-centralized.md | 64 +++++++++++++++++++++------
 1 file changed, 51 insertions(+), 13 deletions(-)

diff --git a/.agents/plans/api-keys-centralized.md b/.agents/plans/api-keys-centralized.md
index 4a9d4b4..a388976 100644
--- a/.agents/plans/api-keys-centralized.md
+++ b/.agents/plans/api-keys-centralized.md
@@ -2,25 +2,63 @@
 
 ## Summary
 
-Zentrale API-Schlüssel unter **Settings → API Keys**. UI folgt **App**- und **Workspace**-Harness-Stil; **ein** Speichern-Button für alle Keys. Backend: Katalog, Batch-`api_keys_apply`, zentraler `resolve`.
+Zentrale API-Schlüssel unter **Settings → API Keys**. UI folgt **App**- und **Workspace**-Harness-Stil; **ein** Speichern-Button für alle Keys. Backend: Katalog, Batch-`api_keys_apply`, zentraler `api_keys::resolve` als einzige Lookup-Quelle für Agent, Subagents, Image, Voice, Web und Model-Refresh.
 
 ## Decisions
 
+### UI
 - Design-Vorlage: `harness-pane`, `harness-subpane`, `harness-stack`, `workbench-plain-input`, Footer wie Workspace (`workbench-mini-btn--primary` + `LuSave` + `BtnSave`).
-- **Kein Save pro Zeile**; optional „Key entfernen“ pro Zeile → Draft, Ausführung mit globalem Save.
-- Batch-IPC: `api_keys_apply`.
-- (Siehe Cursor-Plan für Keyring, Env, Coming soon, Pfade.)
+- **Kein Save pro Zeile**; optional „Key entfernen" pro Zeile → Draft, Ausführung mit globalem Save.
+- **Draft-UX**: Discard-Button neben Save; Verlassen-Warnung bei Dirty-State (Pane-Wechsel / Tab-Schließen).
+
+### Backend
+- Batch-IPC: `api_keys_apply` (setzt/löscht Keys in einem Aufruf).
+- Zentrale Resolve-Funktion: `api_keys::resolve(provider) -> Option<String>` (intern genutzt) plus `provider_key_pub` für IPC-Konsumenten.
+- **Env-Precedence**: Store gewinnt. Env (z. B. `BLX_ANTHROPIC_API_KEY`) ist nur Fallback, wenn Store leer ist. UI zeigt „via env" als Hinweis, wenn Fallback aktiv.
+- **Migration (one-shot, beim Start)**: Bestehende Pro-Provider-Eintr. aus dem alten `agent_api_key_set`-Store werden in den zentralen Katalog übernommen; alter Store wird danach geleert. Idempotent — mehrfacher Start überschreibt nichts.
+- **Alte IPCs entfernen (selber PR)**: `agent_api_key_set`, `agent_api_key_delete` + Bridge-Wrapper raus. Kein Deprecate-Shim.
+
+### Image / Voice / Web
+- Key-Felder vollständig aus `image_settings`, Voice-Settings und Web-Settings entfernen (UI **und** Backend-Struct).
+- Runtime liest ausschließlich über `api_keys::resolve` mit den **reused** Provider-IDs (OpenAI / OpenRouter / …).
+- Fehlermeldungen verweisen auf **Settings → API Keys**, nicht mehr auf „Image-Einstellungen" o. ä.
+
+### Cursor-Plan (inline)
+> Folgende Abschnitte aus dem ursprünglichen Cursor-Plan müssen hier eingetragen werden, damit dieser Plan eigenständig review-/umsetzbar ist:
+- **Keyring-Strategie**: OS-Keyring (Linux: secret-service, macOS: Keychain, Windows: Credential Manager) vs. Plaintext-Datei — Fallback-Policy, Speicherort, Verschlüsselung. _(TODO: Inhalte aus Cursor-Plan einfügen)_
+- **Pfade**: Konkreter Pfad des zentralen Katalogs (z. B. `~/.config/blxcode/api_keys.json` oder Keyring-Eintragsname). _(TODO)_
+- **Env-Vars**: Vollständige Liste der respektierten Env-Vars pro Provider. _(TODO)_
+- **Coming-soon-Provider**: Welche Provider erscheinen als deaktivierte Zeilen im UI? _(TODO)_
 
 ## Runtime (Review)
 
-Agent, Subagents (gleicher Turn-Key), Image/Voice (Reuse OpenAI/OpenRouter-IDs), Web, Model-Refresh → alle über `api_keys::resolve` / `provider_key_pub`. Subagents: kein separater Lookup. Image-Fehler heute irreführend („Image-Einstellungen“) → auf API Keys umstellen.
+**Heute**: Agent / Subagent / Image / Voice / Web haben jeweils eigenen Key-Pfad. Image-Fehler zeigt irreführend „Image-Einstellungen". Subagent macht separaten Lookup.
+
+**Ziel**: Agent, Subagents (gleicher Turn-Key), Image / Voice (Reuse OpenAI/OpenRouter-IDs), Web, Model-Refresh → **alle** über `api_keys::resolve` / `provider_key_pub`. Subagents ohne separaten Lookup. Image-Fehler auf API Keys umgestellt.
+
+## Tasks (in Ausführungsreihenfolge)
+
+1. [ ] **`api-keys-backend`** — Katalog-Struct, Storage (Keyring/Datei), `api_keys_apply`, `api_keys::resolve`, One-shot-Migration aus altem `agent_api_key_set`-Store, Env-Fallback-Logik.
+   _Blockiert von: —_
+2. [ ] **`api-keys-bridge`** — `tauri_bridge.rs` + `agent_wire.rs`: neue Batch-Typen + Wrapper; alte `agent_api_key_set/delete` Wrapper entfernen.
+   _Blockiert von: `api-keys-backend`_
+3. [ ] **`settings-scaffold`** — `src/workbench/settings/mod.rs` neu (folgt Harness-Stil), Routing/Tab in Sidebar/Right-Panel.
+   _Blockiert von: —_ (parallel zu Backend möglich)
+4. [ ] **`api-keys-ui`** — Pane unter Settings → API Keys: ein Save-Footer, Discard-Button, Draft-State, Per-Row-Remove, Verlassen-Warnung bei Dirty-State, „via env"-Hinweis.
+   _Blockiert von: `api-keys-bridge`, `settings-scaffold`_
+5. [ ] **`runtime-wiring`** — Agent/Subagent/Image/Voice/Web/Model-Refresh auf `provider_key_pub` / `resolve` umstellen; Image/Voice-Settings: Key-Felder aus Struct + UI entfernen; Fehlermeldungen umtexten.
+   _Blockiert von: `api-keys-backend`_
+6. [ ] **`agent-pane-trim`** — Key-Eingabe im Agent-Pane entfernen (Verweis auf Settings → API Keys).
+   _Blockiert von: `api-keys-ui`, `runtime-wiring`_
+7. [ ] **`i18n-docs`** — Locales (API-Keys-Kategorie/Headings sind teilweise schon gelandet — siehe Commits `1b66656`, `e67c03a`; ergänzen statt neu), Doc-Update, neue Fehlertexte.
+   _Blockiert von: `api-keys-ui`, `runtime-wiring`_
 
-## Tasks
+## Acceptance Criteria
 
-- [ ] `api-keys-backend` - Katalog, resolve, `api_keys_apply`
-- [ ] `api-keys-bridge` - tauri_bridge, agent_wire
-- [ ] `settings-scaffold` - `settings/mod.rs`
-- [ ] `api-keys-ui` - Harness-Stil, ein Save-Footer, Draft-State
-- [ ] `agent-pane-trim` - Agent ohne Key-UI
-- [ ] `runtime-wiring` - provider_key_pub, image/voice/web, Fehlermeldungen
-- [ ] `i18n-docs` - Locales + docs + Fehlertexte
+- [ ] Subagent läuft mit zentral gesetztem Key (kein separater Lookup-Pfad).
+- [ ] Image-Fehlermeldung verweist auf **Settings → API Keys** (nicht mehr „Image-Einstellungen").
+- [ ] Agent-Pane enthält kein Key-Eingabefeld mehr.
+- [ ] Migration-Smoke: Vorhandene Pro-Provider-Keys (alter Store) sind nach erstem Start im zentralen Katalog lesbar; alter Store geleert.
+- [ ] `agent_api_key_set` / `agent_api_key_delete` (Backend-Command + Bridge-Wrapper) sind aus dem Repo entfernt.
+- [ ] Env-Fallback: Bei leerem Store-Eintrag wird `BLX_ANTHROPIC_API_KEY` gelesen; UI zeigt „via env".
+- [ ] Discard-Button verwirft Draft; Verlassen mit Dirty-State löst Bestätigung aus.

From 861709d7d717cec391fa5700d908cacc16d331d8 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 03:56:01 +0200
Subject: [PATCH 10/48] feat: Implement centralized API keys management pane

- Added a new module `api_keys` to handle API key management.
- Introduced `ApiKeyEntry`, `ApiKeysStatus`, and related enums for API key actions.
- Created commands `api_keys_status` and `api_keys_apply` for fetching and applying API keys.
- Developed a new UI component `ApiKeysPane` for displaying and managing API keys.
- Implemented CSS styles for the API keys pane layout.
- Removed legacy API key handling code from the agent provider pane.
- Updated the main application structure to include the new API keys pane.
---
 index.html                                    |   1 +
 src-tauri/src/agent/mod.rs                    |   3 +-
 src-tauri/src/agent/session_orchestrator.rs   |   2 +-
 src-tauri/src/agent/web_commands.rs           |  30 +-
 src-tauri/src/agent/web_settings.rs           |  33 +-
 src-tauri/src/agent_settings.rs               | 278 +++++++------
 src-tauri/src/api_keys.rs                     | 185 +++++++++
 src-tauri/src/lib.rs                          |  16 +-
 src/tauri_bridge.rs                           | 166 ++++----
 src/workbench/api_keys_pane/api_keys_pane.css |  95 +++++
 src/workbench/api_keys_pane/mod.rs            | 366 ++++++++++++++++++
 src/workbench/harness_ui.rs                   | 307 +--------------
 src/workbench/mod.rs                          |   2 +
 13 files changed, 911 insertions(+), 573 deletions(-)
 create mode 100644 src-tauri/src/api_keys.rs
 create mode 100644 src/workbench/api_keys_pane/api_keys_pane.css
 create mode 100644 src/workbench/api_keys_pane/mod.rs

diff --git a/index.html b/index.html
index afa2c57..f0a4b6e 100644
--- a/index.html
+++ b/index.html
@@ -15,6 +15,7 @@
     <link data-trunk rel="css" href="src/workbench/model_picker/model_picker.css" />
     <link data-trunk rel="css" href="src/workbench/update_dialog.css" />
     <link data-trunk rel="css" href="src/workbench/harness_image_pane/harness_image_pane.css" />
+    <link data-trunk rel="css" href="src/workbench/api_keys_pane/api_keys_pane.css" />
     <link data-trunk rel="css" href="src/workbench/agent_panel/ask_user_card/ask_user_card.css" />
     <link data-trunk rel="css" href="src/workbench/agent_panel/turn_metrics_bar/turn_metrics_bar.css" />
     <link data-trunk rel="copy-dir" href="public" />
diff --git a/src-tauri/src/agent/mod.rs b/src-tauri/src/agent/mod.rs
index 2d09384..29f88bc 100644
--- a/src-tauri/src/agent/mod.rs
+++ b/src-tauri/src/agent/mod.rs
@@ -23,8 +23,7 @@ mod web_tools;
 mod workspace_agent;
 
 pub use web_commands::{
-    agent_environment_invalidate, agent_web_api_key_delete, agent_web_api_key_set,
-    agent_web_settings_get, agent_web_settings_save,
+    agent_environment_invalidate, agent_web_settings_get, agent_web_settings_save,
 };
 
 pub use protocol::{AgentEvent, UserTurn};
diff --git a/src-tauri/src/agent/session_orchestrator.rs b/src-tauri/src/agent/session_orchestrator.rs
index 5dc93e5..639e90c 100644
--- a/src-tauri/src/agent/session_orchestrator.rs
+++ b/src-tauri/src/agent/session_orchestrator.rs
@@ -140,7 +140,7 @@ async fn run_image_turn(
         Ok(k) if !k.trim().is_empty() => k,
         Ok(_) | Err(_) => {
             return Err(format!(
-                "Kein API-Key für Bild-Provider {} hinterlegt. In den Image-Einstellungen setzen.",
+                "Kein API-Key für Bild-Provider {} hinterlegt. In Settings → API Keys setzen.",
                 settings.provider.as_str()
             ));
         }
diff --git a/src-tauri/src/agent/web_commands.rs b/src-tauri/src/agent/web_commands.rs
index 0e51e85..09f1f7b 100644
--- a/src-tauri/src/agent/web_commands.rs
+++ b/src-tauri/src/agent/web_commands.rs
@@ -1,8 +1,6 @@
 //! Tauri commands for web tool settings.
 
-use crate::agent::web_settings::{
-    self, AgentWebSettings, AgentWebSettingsView, WebKeyKind, WebProviderKind,
-};
+use crate::agent::web_settings::{self, AgentWebSettings, AgentWebSettingsView, WebProviderKind};
 use serde::Deserialize;
 use tauri::AppHandle;
 
@@ -12,13 +10,6 @@ pub struct WebSettingsPatch {
     pub provider: WebProviderKind,
 }
 
-#[derive(Debug, Deserialize)]
-#[serde(rename_all = "camelCase")]
-pub struct WebKeyPayload {
-    pub kind: String,
-    pub api_key: String,
-}
-
 #[tauri::command]
 pub fn agent_web_settings_get(app: AppHandle) -> Result<AgentWebSettingsView, String> {
     web_settings::refresh_runtime_from_app(&app);
@@ -36,26 +27,7 @@ pub fn agent_web_settings_save(
     web_settings::save(&app, &settings)
 }
 
-#[tauri::command]
-pub fn agent_web_api_key_set(app: AppHandle, payload: WebKeyPayload) -> Result<AgentWebSettingsView, String> {
-    let kind = parse_key_kind(&payload.kind)?;
-    web_settings::set_key(&app, kind, payload.api_key)
-}
-
-#[tauri::command]
-pub fn agent_web_api_key_delete(app: AppHandle, kind: String) -> Result<AgentWebSettingsView, String> {
-    web_settings::delete_key(&app, parse_key_kind(&kind)?)
-}
-
 #[tauri::command]
 pub fn agent_environment_invalidate() {
     crate::agent::environment::invalidate_cache();
 }
-
-fn parse_key_kind(s: &str) -> Result<WebKeyKind, String> {
-    match s {
-        "tavily" => Ok(WebKeyKind::Tavily),
-        "brave" => Ok(WebKeyKind::Brave),
-        _ => Err(format!("unknown web key kind: {s}")),
-    }
-}
diff --git a/src-tauri/src/agent/web_settings.rs b/src-tauri/src/agent/web_settings.rs
index 6196a53..7b5ef90 100644
--- a/src-tauri/src/agent/web_settings.rs
+++ b/src-tauri/src/agent/web_settings.rs
@@ -144,12 +144,37 @@ fn key_masked(kind: WebKeyKind) -> Result<Option<String>, String> {
     }
 }
 
-fn env_key(kind: WebKeyKind) -> Option<String> {
-    let var = match kind {
+pub fn env_var_name(kind: WebKeyKind) -> &'static str {
+    match kind {
         WebKeyKind::Tavily => "BLX_TAVILY_API_KEY",
         WebKeyKind::Brave => "BLX_BRAVE_API_KEY",
-    };
-    std::env::var(var).ok().filter(|s| !s.trim().is_empty())
+    }
+}
+
+fn env_key(kind: WebKeyKind) -> Option<String> {
+    std::env::var(env_var_name(kind))
+        .ok()
+        .filter(|s| !s.trim().is_empty())
+}
+
+/// (masked_value, via_env). Mirrors the LLM provider equivalent in
+/// `agent_settings::provider_key_with_source`. Order: keyring → env.
+pub fn key_with_source(kind: WebKeyKind) -> Result<(Option<String>, bool), String> {
+    let entry = keyring_entry(kind)?;
+    match entry.get_password() {
+        Ok(secret) if !secret.trim().is_empty() => {
+            Ok((agent_settings::mask_secret_pub(&secret), false))
+        }
+        Ok(_) | Err(keyring_core::Error::NoEntry) => match env_key(kind) {
+            Some(secret) => Ok((agent_settings::mask_secret_pub(&secret), true)),
+            None => Ok((None, false)),
+        },
+        Err(_) if cfg!(target_os = "linux") => match env_key(kind) {
+            Some(secret) => Ok((agent_settings::mask_secret_pub(&secret), true)),
+            None => Ok((None, false)),
+        },
+        Err(e) => Err(format!("keyring get {}: {e}", kind.account())),
+    }
 }
 
 pub fn resolve_key(kind: WebKeyKind) -> Option<String> {
diff --git a/src-tauri/src/agent_settings.rs b/src-tauri/src/agent_settings.rs
index c1a7579..22e2af2 100644
--- a/src-tauri/src/agent_settings.rs
+++ b/src-tauri/src/agent_settings.rs
@@ -130,13 +130,6 @@ pub struct AgentProviderSettingsPatch {
     pub thinking_level: ThinkingLevel,
 }
 
-#[derive(Clone, Debug, Deserialize)]
-#[serde(rename_all = "camelCase")]
-pub struct ProviderKeyPayload {
-    pub provider: AgentProviderKind,
-    pub api_key: String,
-}
-
 #[derive(Clone, Debug, Deserialize)]
 #[serde(rename_all = "camelCase")]
 pub struct ProviderRef {
@@ -190,6 +183,123 @@ pub(crate) fn provider_key_pub(
     provider_key(app, provider)
 }
 
+/// Source of a successfully resolved key. Surfaces in the UI so users
+/// understand why a row shows a masked value (e.g. \"via env\").
+#[derive(Clone, Copy, Debug, PartialEq, Eq)]
+pub(crate) enum KeySource {
+    Keyring,
+    File,
+    Env,
+    None,
+}
+
+pub(crate) fn provider_env_var(provider: AgentProviderKind) -> &'static str {
+    match provider {
+        AgentProviderKind::Openrouter => "BLX_OPENROUTER_API_KEY",
+        AgentProviderKind::Anthropic => "BLX_ANTHROPIC_API_KEY",
+        AgentProviderKind::Openai => "BLX_OPENAI_API_KEY",
+    }
+}
+
+fn provider_env_secret(provider: AgentProviderKind) -> Option<String> {
+    std::env::var(provider_env_var(provider))
+        .ok()
+        .map(|s| s.trim().to_string())
+        .filter(|s| !s.is_empty())
+}
+
+/// Mask + source resolution for the new central API-keys view.
+pub(crate) fn provider_key_with_source(
+    app: &AppHandle,
+    provider: AgentProviderKind,
+) -> Result<(Option<String>, KeySource), String> {
+    let entry = keyring_entry(provider)?;
+    match entry.get_password() {
+        Ok(secret) if !secret.trim().is_empty() => {
+            Ok((mask_secret(&secret), KeySource::Keyring))
+        }
+        Ok(_) | Err(keyring_core::Error::NoEntry) => match read_fallback_secret(app, provider)? {
+            Some(secret) => Ok((mask_secret(&secret), KeySource::File)),
+            None => match provider_env_secret(provider) {
+                Some(secret) => Ok((mask_secret(&secret), KeySource::Env)),
+                None => Ok((None, KeySource::None)),
+            },
+        },
+        Err(_) if cfg!(target_os = "linux") => match read_fallback_secret(app, provider)? {
+            Some(secret) => Ok((mask_secret(&secret), KeySource::File)),
+            None => match provider_env_secret(provider) {
+                Some(secret) => Ok((mask_secret(&secret), KeySource::Env)),
+                None => Ok((None, KeySource::None)),
+            },
+        },
+        Err(e) => Err(format!("keyring get {}: {e}", provider.as_str())),
+    }
+}
+
+/// Set a provider key (keyring with file fallback on Linux). Same write +
+/// verify logic as the legacy `agent_api_key_set` command body, exposed
+/// for the centralized `api_keys_apply` batch command.
+pub(crate) fn set_provider_key_secret(
+    app: &AppHandle,
+    provider: AgentProviderKind,
+    secret: &str,
+) -> Result<(), String> {
+    let trimmed = secret.trim();
+    if trimmed.is_empty() {
+        return Err("API key must not be empty".into());
+    }
+    let entry = keyring_entry(provider)?;
+    let keyring_write = entry.set_password(trimmed);
+    match keyring_write {
+        Ok(()) => {}
+        Err(_e) if cfg!(target_os = "linux") => {
+            write_fallback_secret(app, provider, trimmed)?;
+            return Ok(());
+        }
+        Err(e) => return Err(format!("keyring set {}: {e}", provider.as_str())),
+    }
+    match entry.get_password() {
+        Ok(saved) if saved.trim().is_empty() => {
+            if cfg!(target_os = "linux") {
+                write_fallback_secret(app, provider, trimmed)?;
+                return Ok(());
+            }
+            return Err(format!(
+                "keyring verify {}: secret was written, but readback returned an empty value",
+                provider.as_str()
+            ));
+        }
+        Ok(_) => {}
+        Err(e) => {
+            if cfg!(target_os = "linux") {
+                write_fallback_secret(app, provider, trimmed)?;
+                return Ok(());
+            }
+            return Err(format!(
+                "keyring verify {}: readback failed after write: {e}",
+                provider.as_str()
+            ));
+        }
+    }
+    let _ = delete_fallback_secret(app, provider);
+    Ok(())
+}
+
+/// Delete a provider key from keyring + fallback file. Idempotent.
+pub(crate) fn delete_provider_key_secret(
+    app: &AppHandle,
+    provider: AgentProviderKind,
+) -> Result<(), String> {
+    let entry = keyring_entry(provider)?;
+    match entry.delete_credential() {
+        Ok(()) | Err(keyring_core::Error::NoEntry) => {}
+        Err(_) if cfg!(target_os = "linux") => {}
+        Err(e) => return Err(format!("keyring delete {}: {e}", provider.as_str())),
+    }
+    delete_fallback_secret(app, provider)?;
+    Ok(())
+}
+
 /// Shared envelope reader: parses `agent_provider_settings.json` as a JSON
 /// object so sub-modules (`voice`, `image`) can insert their keys without
 /// clobbering each other.
@@ -338,17 +448,7 @@ fn key_masked_value(
     app: &AppHandle,
     provider: AgentProviderKind,
 ) -> Result<Option<String>, String> {
-    let entry = keyring_entry(provider)?;
-    match entry.get_password() {
-        Ok(secret) => Ok(mask_secret(&secret)),
-        Err(keyring_core::Error::NoEntry) => {
-            Ok(read_fallback_secret(app, provider)?.and_then(|secret| mask_secret(&secret)))
-        }
-        Err(_) if cfg!(target_os = "linux") => {
-            Ok(read_fallback_secret(app, provider)?.and_then(|secret| mask_secret(&secret)))
-        }
-        Err(e) => Err(format!("keyring get {}: {e}", provider.as_str())),
-    }
+    provider_key_with_source(app, provider).map(|(masked, _)| masked)
 }
 
 #[allow(dead_code)]
@@ -358,14 +458,22 @@ fn key_is_configured(app: &AppHandle, provider: AgentProviderKind) -> Result<boo
 
 fn provider_key(app: &AppHandle, provider: AgentProviderKind) -> Result<String, String> {
     let entry = keyring_entry(provider)?;
+    let from_fallback_or_env = || -> Result<String, String> {
+        if let Some(secret) = read_fallback_secret(app, provider)? {
+            return Ok(secret);
+        }
+        provider_env_secret(provider).ok_or_else(|| {
+            format!(
+                "no API key configured for {} (set it in Settings \u{2192} API Keys or via {})",
+                provider.as_str(),
+                provider_env_var(provider)
+            )
+        })
+    };
     match entry.get_password() {
         Ok(secret) if !secret.trim().is_empty() => Ok(secret),
-        Ok(_) => read_fallback_secret(app, provider)?
-            .ok_or_else(|| format!("keyring get {}: empty secret", provider.as_str())),
-        Err(keyring_core::Error::NoEntry) => read_fallback_secret(app, provider)?
-            .ok_or_else(|| format!("keyring get {}: no stored secret", provider.as_str())),
-        Err(_) if cfg!(target_os = "linux") => read_fallback_secret(app, provider)?
-            .ok_or_else(|| format!("keyring get {}: no stored secret", provider.as_str())),
+        Ok(_) | Err(keyring_core::Error::NoEntry) => from_fallback_or_env(),
+        Err(_) if cfg!(target_os = "linux") => from_fallback_or_env(),
         Err(e) => Err(format!("keyring get {}: {e}", provider.as_str())),
     }
 }
@@ -472,16 +580,6 @@ fn settings_view(
     })
 }
 
-fn provider_configured_in_view(
-    view: &AgentProviderSettingsView,
-    provider: AgentProviderKind,
-) -> bool {
-    view.key_statuses
-        .iter()
-        .find(|status| status.provider == provider)
-        .map(|status| status.configured)
-        .unwrap_or(false)
-}
 
 #[derive(Deserialize)]
 struct OpenrouterModelsEnvelope {
@@ -657,118 +755,6 @@ pub fn agent_settings_save(
     settings_view(&app, settings)
 }
 
-#[tauri::command]
-pub fn agent_api_key_set(
-    app: AppHandle,
-    payload: ProviderKeyPayload,
-) -> Result<AgentProviderSettingsView, String> {
-    let trimmed = payload.api_key.trim();
-    if trimmed.is_empty() {
-        return Err("API key must not be empty".into());
-    }
-    let entry = keyring_entry(payload.provider)?;
-    let keyring_write = entry.set_password(trimmed);
-    match keyring_write {
-        Ok(()) => {}
-        Err(_e) if cfg!(target_os = "linux") => {
-            write_fallback_secret(&app, payload.provider, trimmed)?;
-            let view = settings_view(&app, load_settings(&app)?)?;
-            if !provider_configured_in_view(&view, payload.provider) {
-                return Err(format!(
-                    "linux fallback verify {}: fallback secret was written, but a fresh lookup still reports no stored secret",
-                    payload.provider.as_str()
-                ));
-            }
-            return Ok(view);
-        }
-        Err(e) => return Err(format!("keyring set {}: {e}", payload.provider.as_str())),
-    }
-    match entry.get_password() {
-        Ok(saved) if saved.trim().is_empty() => {
-            if cfg!(target_os = "linux") {
-                write_fallback_secret(&app, payload.provider, trimmed)?;
-            } else {
-                return Err(format!(
-                    "keyring verify {}: secret was written, but readback returned an empty value",
-                    payload.provider.as_str()
-                ));
-            }
-        }
-        Ok(_) => {}
-        Err(e) => {
-            if cfg!(target_os = "linux") {
-                write_fallback_secret(&app, payload.provider, trimmed)?;
-            } else {
-                return Err(format!(
-                    "keyring verify {}: readback failed after write: {e}",
-                    payload.provider.as_str()
-                ));
-            }
-        }
-    }
-    let view = settings_view(&app, load_settings(&app)?)?;
-    if !provider_configured_in_view(&view, payload.provider) {
-        if cfg!(target_os = "linux") {
-            write_fallback_secret(&app, payload.provider, trimmed)?;
-            let view = settings_view(&app, load_settings(&app)?)?;
-            if !provider_configured_in_view(&view, payload.provider) {
-                return Err(format!(
-                    "linux fallback verify {}: fallback secret was written, but a fresh lookup still reports no stored secret",
-                    payload.provider.as_str()
-                ));
-            }
-            return Ok(view);
-        } else {
-            return Err(format!(
-                "keyring verify {}: readback succeeded on the immediate handle, but a fresh lookup still reports no stored secret",
-                payload.provider.as_str()
-            ));
-        }
-    }
-    let _ = delete_fallback_secret(&app, payload.provider);
-    Ok(view)
-}
-
-#[tauri::command]
-pub fn agent_api_key_delete(
-    app: AppHandle,
-    payload: ProviderRef,
-) -> Result<AgentProviderSettingsView, String> {
-    let entry = keyring_entry(payload.provider)?;
-    match entry.delete_credential() {
-        Ok(()) | Err(keyring_core::Error::NoEntry) => {}
-        Err(_) if cfg!(target_os = "linux") => {}
-        Err(e) => return Err(format!("keyring delete {}: {e}", payload.provider.as_str())),
-    }
-    delete_fallback_secret(&app, payload.provider)?;
-    match entry.get_password() {
-        Ok(_) => {
-            if !cfg!(target_os = "linux") {
-                return Err(format!(
-                    "keyring verify {}: secret still present after delete",
-                    payload.provider.as_str()
-                ));
-            }
-        }
-        Err(keyring_core::Error::NoEntry) => {}
-        Err(_) if cfg!(target_os = "linux") => {}
-        Err(e) => {
-            return Err(format!(
-                "keyring verify {}: readback after delete failed unexpectedly: {e}",
-                payload.provider.as_str()
-            ));
-        }
-    }
-    let view = settings_view(&app, load_settings(&app)?)?;
-    if provider_configured_in_view(&view, payload.provider) {
-        return Err(format!(
-            "keyring verify {}: delete returned successfully, but a fresh lookup still reports a stored secret",
-            payload.provider.as_str()
-        ));
-    }
-    Ok(view)
-}
-
 #[tauri::command]
 pub async fn agent_provider_models(
     app: AppHandle,
diff --git a/src-tauri/src/api_keys.rs b/src-tauri/src/api_keys.rs
new file mode 100644
index 0000000..7321836
--- /dev/null
+++ b/src-tauri/src/api_keys.rs
@@ -0,0 +1,185 @@
+//! Centralized API-key catalog: a single Tauri surface that lists every
+//! provider key the app understands (LLM + Search), dispatches batch
+//! set/delete actions, and surfaces masked values + env-var fallback
+//! status. Storage is delegated to the existing per-subsystem helpers
+//! (`agent_settings` for LLM keys, `agent::web_settings` for search keys)
+//! so no migration is needed.
+//!
+//! Wired into the frontend via `api_keys_status` and `api_keys_apply`.
+
+use serde::{Deserialize, Serialize};
+use tauri::AppHandle;
+
+use crate::agent::web_settings::{self, WebKeyKind};
+use crate::agent_settings::{
+    self, delete_provider_key_secret, provider_env_var, provider_key_with_source,
+    set_provider_key_secret, AgentProviderKind, KeySource,
+};
+
+#[derive(Clone, Copy, Debug, Serialize)]
+#[serde(rename_all = "camelCase")]
+pub enum ApiKeyCategory {
+    Llm,
+    Search,
+}
+
+/// One row in the API-keys pane. `kind` is the stable identifier the UI
+/// echoes back in `api_keys_apply` actions.
+#[derive(Clone, Debug, Serialize)]
+#[serde(rename_all = "camelCase")]
+pub struct ApiKeyEntry {
+    pub kind: String,
+    pub label: String,
+    pub category: ApiKeyCategory,
+    pub configured: bool,
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub masked_value: Option<String>,
+    pub via_env: bool,
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub env_var: Option<String>,
+    pub coming_soon: bool,
+}
+
+#[derive(Clone, Debug, Serialize)]
+#[serde(rename_all = "camelCase")]
+pub struct ApiKeysStatus {
+    pub entries: Vec<ApiKeyEntry>,
+}
+
+#[derive(Clone, Debug, Deserialize)]
+#[serde(rename_all = "camelCase", tag = "type")]
+pub enum ApiKeyAction {
+    Set { kind: String, value: String },
+    Delete { kind: String },
+}
+
+#[derive(Clone, Debug, Deserialize)]
+#[serde(rename_all = "camelCase")]
+pub struct ApiKeysApplyRequest {
+    pub actions: Vec<ApiKeyAction>,
+}
+
+const LLM_KINDS: &[(AgentProviderKind, &str, &str)] = &[
+    (AgentProviderKind::Openrouter, "openrouter", "OpenRouter"),
+    (AgentProviderKind::Anthropic, "anthropic", "Anthropic"),
+    (AgentProviderKind::Openai, "openai", "OpenAI"),
+];
+
+const SEARCH_KINDS: &[(WebKeyKind, &str, &str)] = &[
+    (WebKeyKind::Tavily, "tavily", "Tavily"),
+    (WebKeyKind::Brave, "brave", "Brave Search"),
+];
+
+const COMING_SOON_LLM: &[(&str, &str)] = &[
+    ("google", "Google"),
+    ("mistral", "Mistral"),
+    ("groq", "Groq"),
+];
+
+fn llm_provider_from_kind(kind: &str) -> Option<AgentProviderKind> {
+    LLM_KINDS
+        .iter()
+        .find(|(_, k, _)| *k == kind)
+        .map(|(p, _, _)| *p)
+}
+
+fn search_kind_from_kind(kind: &str) -> Option<WebKeyKind> {
+    SEARCH_KINDS
+        .iter()
+        .find(|(_, k, _)| *k == kind)
+        .map(|(k, _, _)| *k)
+}
+
+fn build_status(app: &AppHandle) -> Result<ApiKeysStatus, String> {
+    let mut entries = Vec::with_capacity(LLM_KINDS.len() + SEARCH_KINDS.len() + COMING_SOON_LLM.len());
+
+    for (provider, kind, label) in LLM_KINDS {
+        let (masked, source) = provider_key_with_source(app, *provider)?;
+        entries.push(ApiKeyEntry {
+            kind: (*kind).into(),
+            label: (*label).into(),
+            category: ApiKeyCategory::Llm,
+            configured: masked.is_some(),
+            masked_value: masked,
+            via_env: matches!(source, KeySource::Env),
+            env_var: Some(provider_env_var(*provider).into()),
+            coming_soon: false,
+        });
+    }
+
+    for (search_kind, kind, label) in SEARCH_KINDS {
+        let (masked, via_env) = web_settings::key_with_source(*search_kind)?;
+        entries.push(ApiKeyEntry {
+            kind: (*kind).into(),
+            label: (*label).into(),
+            category: ApiKeyCategory::Search,
+            configured: masked.is_some(),
+            masked_value: masked,
+            via_env,
+            env_var: Some(web_settings::env_var_name(*search_kind).into()),
+            coming_soon: false,
+        });
+    }
+
+    for (kind, label) in COMING_SOON_LLM {
+        entries.push(ApiKeyEntry {
+            kind: (*kind).into(),
+            label: (*label).into(),
+            category: ApiKeyCategory::Llm,
+            configured: false,
+            masked_value: None,
+            via_env: false,
+            env_var: None,
+            coming_soon: true,
+        });
+    }
+
+    Ok(ApiKeysStatus { entries })
+}
+
+fn apply_one(app: &AppHandle, action: &ApiKeyAction) -> Result<(), String> {
+    match action {
+        ApiKeyAction::Set { kind, value } => {
+            if let Some(provider) = llm_provider_from_kind(kind) {
+                set_provider_key_secret(app, provider, value)?;
+                return Ok(());
+            }
+            if let Some(search_kind) = search_kind_from_kind(kind) {
+                web_settings::set_key(app, search_kind, value.clone())?;
+                return Ok(());
+            }
+            Err(format!("unknown api key kind: {kind}"))
+        }
+        ApiKeyAction::Delete { kind } => {
+            if let Some(provider) = llm_provider_from_kind(kind) {
+                delete_provider_key_secret(app, provider)?;
+                return Ok(());
+            }
+            if let Some(search_kind) = search_kind_from_kind(kind) {
+                web_settings::delete_key(app, search_kind)?;
+                return Ok(());
+            }
+            Err(format!("unknown api key kind: {kind}"))
+        }
+    }
+}
+
+#[tauri::command]
+pub fn api_keys_status(app: AppHandle) -> Result<ApiKeysStatus, String> {
+    build_status(&app)
+}
+
+#[tauri::command]
+pub fn api_keys_apply(
+    app: AppHandle,
+    payload: ApiKeysApplyRequest,
+) -> Result<ApiKeysStatus, String> {
+    for action in &payload.actions {
+        apply_one(&app, action)?;
+    }
+    // Keep the web runtime cache in sync if any search key changed.
+    web_settings::refresh_runtime_from_app(&app);
+    // agent_settings has its own load_settings cache-free path, no refresh needed.
+    let _ = agent_settings::load_settings_pub(&app);
+    build_status(&app)
+}
diff --git a/src-tauri/src/lib.rs b/src-tauri/src/lib.rs
index 80d07d4..c3550c7 100644
--- a/src-tauri/src/lib.rs
+++ b/src-tauri/src/lib.rs
@@ -2,6 +2,7 @@ mod agent;
 mod agent_hooks;
 mod agent_settings;
 mod agents_layout;
+mod api_keys;
 mod browser_host;
 mod commands;
 mod fs_entries;
@@ -19,14 +20,11 @@ mod voice;
 mod workbench_state;
 
 use agent::{
-    agent_environment_invalidate, agent_web_api_key_delete, agent_web_api_key_set,
-    agent_web_settings_get, agent_web_settings_save, AgentEngineState,
+    agent_environment_invalidate, agent_web_settings_get, agent_web_settings_save, AgentEngineState,
 };
 use agent_hooks::{agent_hooks_status, install_agent_hooks, uninstall_agent_hooks};
-use agent_settings::{
-    agent_api_key_delete, agent_api_key_set, agent_provider_models, agent_settings_get,
-    agent_settings_save,
-};
+use agent_settings::{agent_provider_models, agent_settings_get, agent_settings_save};
+use api_keys::{api_keys_apply, api_keys_status};
 use browser_host::BrowserHost;
 use commands::*;
 use image::{image_curated_models, image_settings_get, image_settings_save};
@@ -128,9 +126,9 @@ pub fn run() {
             harness_user_home_dir,
             agent_settings_get,
             agent_settings_save,
-            agent_api_key_set,
-            agent_api_key_delete,
             agent_provider_models,
+            api_keys_status,
+            api_keys_apply,
             browser_sync_bounds,
             browser_navigate,
             browser_run_js,
@@ -226,8 +224,6 @@ pub fn run() {
             image_settings_save,
             agent_web_settings_get,
             agent_web_settings_save,
-            agent_web_api_key_set,
-            agent_web_api_key_delete,
             agent_environment_invalidate,
             image_curated_models,
             crate::image::commands::generated_image_preview,
diff --git a/src/tauri_bridge.rs b/src/tauri_bridge.rs
index de61fc7..c1c7ac6 100644
--- a/src/tauri_bridge.rs
+++ b/src/tauri_bridge.rs
@@ -384,6 +384,77 @@ pub struct ProviderModelsResponse {
     pub message: Option<String>,
 }
 
+// ---------- Centralized API keys (Settings → API Keys) ----------
+
+#[allow(dead_code)]
+#[derive(Clone, Copy, Debug, serde::Deserialize, PartialEq, Eq)]
+#[serde(rename_all = "camelCase")]
+pub enum ApiKeyCategory {
+    Llm,
+    Search,
+}
+
+#[allow(dead_code)]
+#[derive(Clone, Debug, serde::Deserialize, PartialEq)]
+#[serde(rename_all = "camelCase")]
+pub struct ApiKeyEntry {
+    pub kind: String,
+    pub label: String,
+    pub category: ApiKeyCategory,
+    pub configured: bool,
+    #[serde(default)]
+    pub masked_value: Option<String>,
+    #[serde(default)]
+    pub via_env: bool,
+    #[serde(default)]
+    pub env_var: Option<String>,
+    #[serde(default)]
+    pub coming_soon: bool,
+}
+
+#[allow(dead_code)]
+#[derive(Clone, Debug, serde::Deserialize, PartialEq)]
+#[serde(rename_all = "camelCase")]
+pub struct ApiKeysStatus {
+    pub entries: Vec<ApiKeyEntry>,
+}
+
+#[allow(dead_code)]
+#[derive(Clone, Debug, Serialize)]
+#[serde(rename_all = "camelCase", tag = "type")]
+pub enum ApiKeyAction {
+    Set { kind: String, value: String },
+    Delete { kind: String },
+}
+
+#[allow(dead_code)]
+pub async fn api_keys_status() -> Result<ApiKeysStatus, String> {
+    invoke_typed("api_keys_status", serde_json::json!({})).await
+}
+
+#[allow(dead_code)]
+pub async fn api_keys_apply(actions: Vec<ApiKeyAction>) -> Result<ApiKeysStatus, String> {
+    #[derive(Serialize)]
+    #[serde(rename_all = "camelCase")]
+    struct Args {
+        payload: Payload,
+    }
+    #[derive(Serialize)]
+    #[serde(rename_all = "camelCase")]
+    struct Payload {
+        actions: Vec<ApiKeyAction>,
+    }
+    invoke_typed(
+        "api_keys_apply",
+        Args {
+            payload: Payload { actions },
+        },
+    )
+    .await
+}
+
+// ---------- Legacy per-provider settings ----------
+
 pub async fn agent_settings_get() -> Result<AgentProviderSettingsView, String> {
     invoke_typed("agent_settings_get", serde_json::json!({})).await
 }
@@ -420,32 +491,6 @@ pub async fn agent_settings_save(
     .await
 }
 
-pub async fn agent_api_key_set(
-    provider: AgentProviderKind,
-    api_key: String,
-) -> Result<AgentProviderSettingsView, String> {
-    #[derive(Serialize)]
-    #[serde(rename_all = "camelCase")]
-    struct Args {
-        payload: Payload,
-    }
-
-    #[derive(Serialize)]
-    #[serde(rename_all = "camelCase")]
-    struct Payload {
-        provider: AgentProviderKind,
-        api_key: String,
-    }
-
-    invoke_typed(
-        "agent_api_key_set",
-        Args {
-            payload: Payload { provider, api_key },
-        },
-    )
-    .await
-}
-
 #[derive(Clone, Copy, Debug, PartialEq, Eq, Serialize, Deserialize)]
 #[serde(rename_all = "camelCase")]
 pub enum WebProviderKind {
@@ -454,6 +499,7 @@ pub enum WebProviderKind {
     Brave,
 }
 
+#[allow(dead_code)]
 #[derive(Clone, Debug, Deserialize)]
 #[serde(rename_all = "camelCase")]
 pub struct WebKeyStatus {
@@ -468,6 +514,7 @@ pub struct AgentWebSettings {
     pub provider: WebProviderKind,
 }
 
+#[allow(dead_code)]
 #[derive(Clone, Debug, Deserialize)]
 #[serde(rename_all = "camelCase")]
 pub struct AgentWebSettingsView {
@@ -503,78 +550,11 @@ pub async fn agent_web_settings_save(
     .await
 }
 
-pub async fn agent_web_api_key_set(
-    kind: &str,
-    api_key: String,
-) -> Result<AgentWebSettingsView, String> {
-    #[derive(Serialize)]
-    #[serde(rename_all = "camelCase")]
-    struct Args {
-        payload: Payload,
-    }
-
-    #[derive(Serialize)]
-    #[serde(rename_all = "camelCase")]
-    struct Payload {
-        kind: String,
-        api_key: String,
-    }
-
-    invoke_typed(
-        "agent_web_api_key_set",
-        Args {
-            payload: Payload {
-                kind: kind.to_string(),
-                api_key,
-            },
-        },
-    )
-    .await
-}
-
-pub async fn agent_web_api_key_delete(kind: &str) -> Result<AgentWebSettingsView, String> {
-    #[derive(Serialize)]
-    struct Args {
-        kind: String,
-    }
-
-    invoke_typed(
-        "agent_web_api_key_delete",
-        Args {
-            kind: kind.to_string(),
-        },
-    )
-    .await
-}
 
 pub async fn agent_environment_invalidate() -> Result<(), String> {
     invoke_unit_js("agent_environment_invalidate", JsValue::NULL).await
 }
 
-pub async fn agent_api_key_delete(
-    provider: AgentProviderKind,
-) -> Result<AgentProviderSettingsView, String> {
-    #[derive(Serialize)]
-    #[serde(rename_all = "camelCase")]
-    struct Args {
-        payload: Payload,
-    }
-
-    #[derive(Serialize)]
-    #[serde(rename_all = "camelCase")]
-    struct Payload {
-        provider: AgentProviderKind,
-    }
-
-    invoke_typed(
-        "agent_api_key_delete",
-        Args {
-            payload: Payload { provider },
-        },
-    )
-    .await
-}
-
 pub async fn agent_provider_models(
     provider: AgentProviderKind,
 ) -> Result<ProviderModelsResponse, String> {
diff --git a/src/workbench/api_keys_pane/api_keys_pane.css b/src/workbench/api_keys_pane/api_keys_pane.css
new file mode 100644
index 0000000..bfdfd83
--- /dev/null
+++ b/src/workbench/api_keys_pane/api_keys_pane.css
@@ -0,0 +1,95 @@
+/* Centralized API keys pane (Settings → API Keys). Layout only —
+   global tokens live in the project-wide styles. */
+
+.api-keys-pane .api-keys-list {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 0.6rem;
+}
+
+.api-keys-row {
+    display: flex;
+    flex-direction: column;
+    gap: 0.35rem;
+    padding: 0.55rem 0.65rem;
+    border-radius: 6px;
+    background: rgba(255, 255, 255, 0.03);
+    border: 1px solid rgba(255, 255, 255, 0.06);
+}
+
+.api-keys-row--coming-soon {
+    opacity: 0.55;
+}
+
+.api-keys-row--marked-delete {
+    border-color: rgba(248, 113, 113, 0.45);
+    background: rgba(248, 113, 113, 0.06);
+}
+
+.api-keys-row__head {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    justify-content: space-between;
+}
+
+.api-keys-row__label {
+    font-weight: 600;
+    font-size: 0.9rem;
+}
+
+.api-keys-row__masked {
+    font-family: var(--font-mono, ui-monospace, SFMono-Regular, monospace);
+    font-size: 0.78rem;
+    opacity: 0.82;
+}
+
+.api-keys-row__badge {
+    font-size: 0.72rem;
+    padding: 0.1rem 0.45rem;
+    border-radius: 999px;
+    background: rgba(255, 255, 255, 0.08);
+    text-transform: uppercase;
+    letter-spacing: 0.04em;
+}
+
+.api-keys-row__badge--warn {
+    background: rgba(248, 113, 113, 0.18);
+}
+
+.api-keys-row__badge--muted {
+    background: rgba(255, 255, 255, 0.04);
+    opacity: 0.7;
+}
+
+.api-keys-row__body {
+    display: flex;
+    gap: 0.4rem;
+    align-items: center;
+}
+
+.api-keys-row__input {
+    flex: 1 1 auto;
+    min-width: 0;
+}
+
+.api-keys-row__hint,
+.api-keys-row__envhint {
+    margin: 0;
+    font-size: 0.72rem;
+}
+
+.api-keys-footer {
+    margin-top: 0.85rem;
+    display: flex;
+    gap: 0.5rem;
+    align-items: center;
+}
+
+.api-keys-dirty {
+    margin-left: 0.35rem;
+    font-size: 0.75rem;
+}
diff --git a/src/workbench/api_keys_pane/mod.rs b/src/workbench/api_keys_pane/mod.rs
new file mode 100644
index 0000000..87b2421
--- /dev/null
+++ b/src/workbench/api_keys_pane/mod.rs
@@ -0,0 +1,366 @@
+//! Centralized API-keys pane (Settings → API Keys).
+//!
+//! Draft model: every text edit and per-row remove writes into a local
+//! draft map. The single footer Save dispatches the full batch via
+//! `api_keys_apply`; Discard rolls back without IPC. A window-level
+//! `beforeunload` listener nudges the user when the draft is dirty so
+//! reloads/quits don't silently drop pending keys.
+
+use crate::i18n::I18nKey;
+use crate::service::I18nService;
+use crate::tauri_bridge::{
+    api_keys_apply, api_keys_status, is_tauri_shell, ApiKeyAction, ApiKeyCategory, ApiKeyEntry,
+    ApiKeysStatus,
+};
+use leptos::leptos_dom::helpers::window_event_listener_untyped;
+use leptos::prelude::*;
+use leptos_icons::Icon as LxIcon;
+use std::collections::BTreeMap;
+use wasm_bindgen::JsCast;
+
+#[derive(Clone, Debug)]
+enum DraftAction {
+    Set(String),
+    Delete,
+}
+
+type DraftMap = BTreeMap<String, DraftAction>;
+
+fn input_str(ev: &web_sys::Event) -> Option<String> {
+    ev.target()?
+        .dyn_into::<web_sys::HtmlInputElement>()
+        .ok()
+        .map(|i| i.value())
+}
+
+fn draft_to_actions(drafts: &DraftMap) -> Vec<ApiKeyAction> {
+    drafts
+        .iter()
+        .filter_map(|(kind, action)| match action {
+            DraftAction::Set(value) if !value.trim().is_empty() => Some(ApiKeyAction::Set {
+                kind: kind.clone(),
+                value: value.trim().to_string(),
+            }),
+            DraftAction::Set(_) => None,
+            DraftAction::Delete => Some(ApiKeyAction::Delete { kind: kind.clone() }),
+        })
+        .collect()
+}
+
+#[component]
+pub fn ApiKeysPane() -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let status: RwSignal<Option<ApiKeysStatus>> = RwSignal::new(None);
+    let drafts: RwSignal<DraftMap> = RwSignal::new(DraftMap::new());
+    let busy = RwSignal::new(false);
+    let status_msg: RwSignal<Option<String>> = RwSignal::new(None);
+    let error_msg: RwSignal<Option<String>> = RwSignal::new(None);
+
+    let dirty = Memo::new(move |_| !drafts.with(|m| m.is_empty()));
+
+    let load = move || {
+        if !is_tauri_shell() {
+            return;
+        }
+        leptos::task::spawn_local(async move {
+            match api_keys_status().await {
+                Ok(s) => {
+                    status.set(Some(s));
+                    error_msg.set(None);
+                }
+                Err(err) => error_msg.set(Some(err)),
+            }
+        });
+    };
+
+    Effect::new(move |_| {
+        load();
+    });
+
+    // `beforeunload` warning while the draft is dirty.
+    Effect::new(move |_| {
+        let handler = window_event_listener_untyped("beforeunload", move |ev| {
+            if !dirty.get_untracked() {
+                return;
+            }
+            if let Ok(be) = ev.dyn_into::<web_sys::BeforeUnloadEvent>() {
+                be.prevent_default();
+                be.set_return_value("");
+            }
+        });
+        on_cleanup(move || handler.remove());
+    });
+
+    let save = move || {
+        let actions = draft_to_actions(&drafts.get_untracked());
+        if actions.is_empty() {
+            drafts.set(DraftMap::new());
+            return;
+        }
+        busy.set(true);
+        error_msg.set(None);
+        status_msg.set(None);
+        leptos::task::spawn_local(async move {
+            match api_keys_apply(actions).await {
+                Ok(s) => {
+                    status.set(Some(s));
+                    drafts.set(DraftMap::new());
+                    status_msg.set(Some("Saved.".into()));
+                }
+                Err(err) => error_msg.set(Some(err)),
+            }
+            busy.set(false);
+        });
+    };
+
+    let discard = move || {
+        drafts.set(DraftMap::new());
+        status_msg.set(None);
+        error_msg.set(None);
+    };
+
+    let llm_entries = Memo::new(move |_| {
+        status
+            .get()
+            .map(|s| {
+                s.entries
+                    .into_iter()
+                    .filter(|e| matches!(e.category, ApiKeyCategory::Llm))
+                    .collect::<Vec<_>>()
+            })
+            .unwrap_or_default()
+    });
+    let search_entries = Memo::new(move |_| {
+        status
+            .get()
+            .map(|s| {
+                s.entries
+                    .into_iter()
+                    .filter(|e| matches!(e.category, ApiKeyCategory::Search))
+                    .collect::<Vec<_>>()
+            })
+            .unwrap_or_default()
+    });
+
+    view! {
+        <article class="harness-pane api-keys-pane">
+            <h3 class="harness-pane-title">
+                <span class="harness-pane-title__icon" aria-hidden="true">
+                    <LxIcon icon=icondata::LuKeyRound width="1.02rem" height="1.02rem" />
+                </span>
+                <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::ApiKeysHeading)()}</span>
+            </h3>
+
+            <p class="harness-muted">{move || i18n.tr(I18nKey::AgApiKeyHint)()}</p>
+
+            <section class="harness-subpane">
+                <h4 class="harness-pane-subhead">
+                    <span class="harness-pane-subhead__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuCpu width="0.9rem" height="0.9rem" />
+                    </span>
+                    <span class="harness-pane-subhead__text">"LLM Providers"</span>
+                </h4>
+                <ApiKeyRows entries=llm_entries drafts=drafts />
+            </section>
+
+            <section class="harness-subpane">
+                <h4 class="harness-pane-subhead">
+                    <span class="harness-pane-subhead__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuGlobe width="0.9rem" height="0.9rem" />
+                    </span>
+                    <span class="harness-pane-subhead__text">"Search Providers"</span>
+                </h4>
+                <ApiKeyRows entries=search_entries drafts=drafts />
+            </section>
+
+            <Show when=move || status_msg.with(|m| m.is_some())>
+                <p class="harness-status">{move || status_msg.get().unwrap_or_default()}</p>
+            </Show>
+            <Show when=move || error_msg.with(|m| m.is_some())>
+                <p class="harness-error">{move || error_msg.get().unwrap_or_default()}</p>
+            </Show>
+
+            <footer class="api-keys-footer harness-row-gap">
+                <button
+                    type="button"
+                    class="workbench-mini-btn workbench-mini-btn--primary"
+                    prop:disabled=move || busy.get() || !dirty.get() || !is_tauri_shell()
+                    on:click=move |_| save()
+                >
+                    <span class="harness-btn-inline">
+                        <LxIcon icon=icondata::LuSave width="0.78rem" height="0.78rem" />
+                        <span>{move || i18n.tr(I18nKey::AgSaveProvider)()}</span>
+                    </span>
+                </button>
+                <button
+                    type="button"
+                    class="workbench-mini-btn"
+                    prop:disabled=move || busy.get() || !dirty.get()
+                    on:click=move |_| discard()
+                >
+                    <span class="harness-btn-inline">
+                        <LxIcon icon=icondata::LuUndo2 width="0.78rem" height="0.78rem" />
+                        <span>"Discard"</span>
+                    </span>
+                </button>
+                <Show when=move || dirty.get()>
+                    <span class="api-keys-dirty harness-muted">"Unsaved changes"</span>
+                </Show>
+            </footer>
+        </article>
+    }
+}
+
+#[component]
+fn ApiKeyRows(entries: Memo<Vec<ApiKeyEntry>>, drafts: RwSignal<DraftMap>) -> impl IntoView {
+    view! {
+        <ul class="api-keys-list">
+            <For
+                each=move || entries.get()
+                key=|e| e.kind.clone()
+                children=move |entry: ApiKeyEntry| {
+                    view! { <ApiKeyRow entry=entry drafts=drafts /> }
+                }
+            />
+        </ul>
+    }
+}
+
+#[component]
+fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
+    let kind: std::sync::Arc<str> = std::sync::Arc::from(entry.kind.as_str());
+    let coming_soon = entry.coming_soon;
+    let configured = entry.configured;
+    let via_env = entry.via_env;
+
+    let label = StoredValue::new(entry.label.clone());
+    let masked = StoredValue::new(entry.masked_value.clone().unwrap_or_default());
+    let env_hint_text = StoredValue::new(
+        entry
+            .env_var
+            .clone()
+            .filter(|_| !configured || via_env)
+            .map(|v| format!("Env fallback: {v}"))
+            .unwrap_or_default(),
+    );
+    let has_env_hint = !env_hint_text.with_value(|s| s.is_empty());
+
+    let kind_for_draft = kind.clone();
+    let draft_value = Signal::derive(move || {
+        drafts.with(|m| match m.get(kind_for_draft.as_ref()) {
+            Some(DraftAction::Set(v)) => v.clone(),
+            _ => String::new(),
+        })
+    });
+
+    let kind_for_delete_check = kind.clone();
+    let marked_delete = Signal::derive(move || {
+        drafts.with(|m| matches!(m.get(kind_for_delete_check.as_ref()), Some(DraftAction::Delete)))
+    });
+
+    let kind_for_dirty = kind.clone();
+    let row_dirty = Signal::derive(move || {
+        drafts.with(|m| m.contains_key(kind_for_dirty.as_ref()))
+    });
+
+    let kind_for_input = kind.clone();
+    let on_input = move |ev: web_sys::Event| {
+        let Some(value) = input_str(&ev) else { return };
+        let k = kind_for_input.to_string();
+        drafts.update(|m| {
+            if value.is_empty() {
+                m.remove(&k);
+            } else {
+                m.insert(k, DraftAction::Set(value));
+            }
+        });
+    };
+
+    let kind_for_undo = kind.clone();
+    let on_undo = move |_| {
+        let k = kind_for_undo.to_string();
+        drafts.update(|m| {
+            m.remove(&k);
+        });
+    };
+
+    let kind_for_remove = kind.clone();
+    let on_remove = move |_| {
+        let k = kind_for_remove.to_string();
+        drafts.update(|m| {
+            m.insert(k, DraftAction::Delete);
+        });
+    };
+
+    view! {
+        <li
+            class="api-keys-row"
+            class:api-keys-row--coming-soon=move || coming_soon
+            class:api-keys-row--marked-delete=move || marked_delete.get()
+        >
+            <div class="api-keys-row__head">
+                <span class="api-keys-row__label">{move || label.get_value()}</span>
+                {move || {
+                    if coming_soon {
+                        view! { <span class="api-keys-row__badge">"Coming soon"</span> }.into_any()
+                    } else if marked_delete.get() {
+                        view! { <span class="api-keys-row__badge api-keys-row__badge--warn">"Will be removed"</span> }.into_any()
+                    } else if configured && via_env {
+                        view! { <span class="api-keys-row__badge">"via env"</span> }.into_any()
+                    } else if configured {
+                        view! { <span class="api-keys-row__masked">{move || masked.get_value()}</span> }.into_any()
+                    } else {
+                        view! { <span class="api-keys-row__badge api-keys-row__badge--muted">"Not set"</span> }.into_any()
+                    }
+                }}
+            </div>
+            <Show when=move || !coming_soon>
+                <div class="api-keys-row__body harness-row-gap">
+                    <input
+                        class="workbench-plain-input api-keys-row__input"
+                        type="password"
+                        autocomplete="off"
+                        prop:value=move || draft_value.get()
+                        prop:disabled=move || marked_delete.get()
+                        on:input=on_input.clone()
+                    />
+                    {
+                        let on_undo = on_undo.clone();
+                        let on_remove = on_remove.clone();
+                        move || {
+                            if marked_delete.get() {
+                                let on_undo = on_undo.clone();
+                                view! {
+                                    <button type="button" class="workbench-mini-btn" on:click=on_undo>
+                                        <span class="harness-btn-inline">
+                                            <LxIcon icon=icondata::LuUndo2 width="0.78rem" height="0.78rem" />
+                                            <span>"Undo"</span>
+                                        </span>
+                                    </button>
+                                }.into_any()
+                            } else if configured {
+                                let on_remove = on_remove.clone();
+                                view! {
+                                    <button type="button" class="workbench-mini-btn" on:click=on_remove>
+                                        <span class="harness-btn-inline">
+                                            <LxIcon icon=icondata::LuTrash2 width="0.78rem" height="0.78rem" />
+                                            <span>"Remove"</span>
+                                        </span>
+                                    </button>
+                                }.into_any()
+                            } else {
+                                view! { <span></span> }.into_any()
+                            }
+                        }
+                    }
+                </div>
+                <Show when=move || row_dirty.get() && !marked_delete.get()>
+                    <p class="harness-muted api-keys-row__hint">"Pending — press Save to apply."</p>
+                </Show>
+                <Show when=move || has_env_hint>
+                    <p class="harness-muted api-keys-row__envhint">{move || env_hint_text.get_value()}</p>
+                </Show>
+            </Show>
+        </li>
+    }
+}
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index 0cf82fc..debd106 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -14,11 +14,10 @@ use crate::config::HARNESS_BROWSER_DEFAULT_URL;
 use crate::i18n::{lookup, I18nKey, Locale, APP_LOCALES};
 use crate::service::I18nService;
 use crate::tauri_bridge::{
-    agent_api_key_delete, agent_api_key_set, agent_hooks_status, agent_provider_models,
-    agent_settings_get, agent_settings_save, agent_web_api_key_delete, agent_web_api_key_set,
+    agent_hooks_status, agent_provider_models, agent_settings_get, agent_settings_save,
     agent_web_settings_get, agent_web_settings_save, install_agent_hooks, is_tauri_shell,
     uninstall_agent_hooks, AgentHooksReport, AgentProviderKind, AgentProviderSettingsView,
-    AgentWebSettingsView, ProviderModelEntry, ProviderModelsResponse, ThinkingLevel, WebKeyStatus,
+    AgentWebSettingsView, ProviderModelEntry, ProviderModelsResponse, ThinkingLevel,
     WebProviderKind,
 };
 use gloo_timers::future::TimeoutFuture;
@@ -1133,17 +1132,7 @@ fn AppearanceSettingsPane() -> impl IntoView {
 
 #[component]
 fn ApiKeysSettingsPane() -> impl IntoView {
-    let i18n = expect_context::<I18nService>();
-    view! {
-        <article class="harness-pane">
-            <h3 class="harness-pane-title">
-                <span class="harness-pane-title__icon" aria-hidden="true">
-                    <LxIcon icon=icondata::LuKeyRound width="1.02rem" height="1.02rem" />
-                </span>
-                <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::ApiKeysHeading)()}</span>
-            </h3>
-        </article>
-    }
+    view! { <crate::workbench::ApiKeysPane /> }
 }
 
 #[component]
@@ -1691,7 +1680,6 @@ fn AgentProviderPane() -> impl IntoView {
     let selected_provider = RwSignal::new(AgentProviderKind::Openrouter);
     let custom_model = RwSignal::new(String::new());
     let thinking_level = RwSignal::new(ThinkingLevel::Medium);
-    let api_key_input = RwSignal::new(String::new());
     let model_entries: RwSignal<Vec<ProviderModelEntry>> = RwSignal::new(Vec::new());
     let models_source = RwSignal::new(String::new());
     let models_message: RwSignal<Option<String>> = RwSignal::new(None);
@@ -1702,8 +1690,6 @@ fn AgentProviderPane() -> impl IntoView {
     let provider_refresh_request: RwSignal<Option<AgentProviderKind>> = RwSignal::new(None);
     let web_settings: RwSignal<Option<AgentWebSettingsView>> = RwSignal::new(None);
     let web_provider = RwSignal::new(WebProviderKind::None);
-    let web_tavily_key = RwSignal::new(String::new());
-    let web_brave_key = RwSignal::new(String::new());
     let web_status_msg: RwSignal<Option<String>> = RwSignal::new(None);
 
     let apply_web_settings = move |view: AgentWebSettingsView| {
@@ -1899,121 +1885,21 @@ fn AgentProviderPane() -> impl IntoView {
             </Show>
 
             <section class="harness-subpane">
-                <div class="harness-row-gap harness-row-gap--space">
-                    <h4 class="harness-pane-subhead">
-                        <span class="harness-pane-subhead__icon" aria-hidden="true">
-                            <LxIcon icon=icondata::LuKeyRound width="0.9rem" height="0.9rem" />
-                        </span>
-                        <span class="harness-pane-subhead__text">
-                            {move || format!("{} {}", i18n.tr(I18nKey::AgApiKeyField)(), provider_label(&i18n, selected_provider.get()))}
-                        </span>
-                    </h4>
-                    <small class="harness-muted">
-                        {move || {
-                            settings
-                                .get()
-                                .map(|view| provider_key_status_text(&i18n, &view, selected_provider.get()))
-                                .unwrap_or_else(|| i18n.tr(I18nKey::AgApiKeyMissing)().to_string())
-                        }}
-                    </small>
-                </div>
-                <p class="harness-muted">{move || i18n.tr(I18nKey::AgApiKeyHint)()}</p>
-                <label class="harness-stack">
-                    <input
-                        class="workbench-plain-input"
-                        type="password"
-                        autocomplete="off"
-                        placeholder=move || {
-                            settings
-                                .get()
-                                .and_then(|view| provider_key_mask(&view, selected_provider.get()))
-                                .unwrap_or_default()
-                        }
-                        prop:value=move || api_key_input.get()
-                        on:input=move |ev| {
-                            if let Some(value) = input_str(&ev) {
-                                api_key_input.set(value);
-                            }
-                        }
-                    />
-                </label>
-                <div class="harness-row-gap">
-                    <button
-                        type="button"
-                        class="workbench-mini-btn workbench-mini-btn--primary"
-                        prop:disabled=move || busy.get() || !is_tauri_shell()
-                        on:click=move |_| {
-                            let provider = selected_provider.get_untracked();
-                            let api_key = api_key_input.get_untracked();
-                            if api_key.trim().is_empty() {
-                                status_msg.set(None);
-                                error_msg.set(Some("API key is empty".into()));
-                                return;
-                            }
-                            busy.set(true);
-                            error_msg.set(None);
-                            leptos::task::spawn_local(async move {
-                                match agent_api_key_set(provider, api_key).await {
-                                    Ok(view) => {
-                                        if !provider_key_configured(&view, provider) {
-                                            status_msg.set(None);
-                                            error_msg.set(Some(format!(
-                                                "API-Key speichern fehlgeschlagen: provider state for {} is still missing after save",
-                                                provider.as_str()
-                                            )));
-                                            busy.set(false);
-                                            return;
-                                        }
-                                        api_key_input.set(String::new());
-                                        status_msg.set(Some(i18n.tr(I18nKey::AgSaveProviderDone)().to_string()));
-                                        error_msg.set(None);
-                                        apply_settings(view);
-                                        refresh_models(provider);
-                                    }
-                                    Err(err) => {
-                                        status_msg.set(None);
-                                        error_msg.set(Some(format!("API-Key speichern fehlgeschlagen: {err}")));
-                                    }
-                                }
-                                busy.set(false);
-                            });
-                        }
-                    >
-                        <span class="harness-btn-inline">
-                            <LxIcon icon=icondata::LuCheck width="0.78rem" height="0.78rem" />
-                            <span>{move || i18n.tr(I18nKey::AgApiKeySet)()}</span>
-                        </span>
-                    </button>
-                    <button
-                        type="button"
-                        class="workbench-mini-btn"
-                        prop:disabled=move || busy.get() || !is_tauri_shell()
-                        on:click=move |_| {
-                            let provider = selected_provider.get_untracked();
-                            busy.set(true);
-                            error_msg.set(None);
-                            leptos::task::spawn_local(async move {
-                                match agent_api_key_delete(provider).await {
-                                    Ok(view) => {
-                                        status_msg.set(None);
-                                        error_msg.set(None);
-                                        apply_settings(view);
-                                    }
-                                    Err(err) => {
-                                        status_msg.set(None);
-                                        error_msg.set(Some(format!("API-Key löschen fehlgeschlagen: {err}")));
-                                    }
-                                }
-                                busy.set(false);
-                            });
-                        }
-                    >
-                        <span class="harness-btn-inline">
-                            <LxIcon icon=icondata::LuTrash2 width="0.78rem" height="0.78rem" />
-                            <span>{move || i18n.tr(I18nKey::AgApiKeyDelete)()}</span>
-                        </span>
-                    </button>
-                </div>
+                <h4 class="harness-pane-subhead">
+                    <span class="harness-pane-subhead__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuKeyRound width="0.9rem" height="0.9rem" />
+                    </span>
+                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgApiKeyField)()}</span>
+                </h4>
+                <p class="harness-muted">"Manage API keys in Settings → API Keys."</p>
+                <small class="harness-muted">
+                    {move || {
+                        settings
+                            .get()
+                            .map(|view| provider_key_status_text(&i18n, &view, selected_provider.get()))
+                            .unwrap_or_else(|| i18n.tr(I18nKey::AgApiKeyMissing)().to_string())
+                    }}
+                </small>
             </section>
 
             <div class="harness-row-gap">
@@ -2072,137 +1958,7 @@ fn AgentProviderPane() -> impl IntoView {
                         <option value="brave">{move || i18n.tr(I18nKey::AgWebProviderBrave)()}</option>
                     </select>
                 </label>
-                <p class="harness-muted">{move || i18n.tr(I18nKey::AgWebKeyHint)()}</p>
-                <label class="harness-stack">
-                    <span class="harness-field-label">
-                        <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgWebTavilyKey)()}</span>
-                    </span>
-                    <small class="harness-muted">
-                        {move || web_key_status_text(&i18n, web_settings.get(), "tavily")}
-                    </small>
-                    <input
-                        class="workbench-plain-input"
-                        type="password"
-                        autocomplete="off"
-                        placeholder=move || web_key_mask(web_settings.get(), "tavily").unwrap_or_default()
-                        prop:value=move || web_tavily_key.get()
-                        on:input=move |ev| {
-                            if let Some(value) = input_str(&ev) {
-                                web_tavily_key.set(value);
-                            }
-                        }
-                    />
-                </label>
-                <div class="harness-row-gap">
-                    <button
-                        type="button"
-                        class="workbench-mini-btn workbench-mini-btn--primary"
-                        prop:disabled=move || busy.get() || !is_tauri_shell()
-                        on:click=move |_| {
-                            let key = web_tavily_key.get_untracked();
-                            if key.trim().is_empty() {
-                                error_msg.set(Some("API key is empty".into()));
-                                return;
-                            }
-                            busy.set(true);
-                            leptos::task::spawn_local(async move {
-                                match agent_web_api_key_set("tavily", key).await {
-                                    Ok(view) => {
-                                        web_tavily_key.set(String::new());
-                                        web_status_msg.set(Some(i18n.tr(I18nKey::AgWebSaveDone)().to_string()));
-                                        apply_web_settings(view);
-                                    }
-                                    Err(err) => error_msg.set(Some(err)),
-                                }
-                                busy.set(false);
-                            });
-                        }
-                    >
-                        <span>{move || i18n.tr(I18nKey::AgWebKeySet)()}</span>
-                    </button>
-                    <button
-                        type="button"
-                        class="workbench-mini-btn"
-                        prop:disabled=move || busy.get() || !is_tauri_shell()
-                        on:click=move |_| {
-                            busy.set(true);
-                            leptos::task::spawn_local(async move {
-                                match agent_web_api_key_delete("tavily").await {
-                                    Ok(view) => apply_web_settings(view),
-                                    Err(err) => error_msg.set(Some(err)),
-                                }
-                                busy.set(false);
-                            });
-                        }
-                    >
-                        <span>{move || i18n.tr(I18nKey::AgWebKeyDelete)()}</span>
-                    </button>
-                </div>
-                <label class="harness-stack">
-                    <span class="harness-field-label">
-                        <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgWebBraveKey)()}</span>
-                    </span>
-                    <small class="harness-muted">
-                        {move || web_key_status_text(&i18n, web_settings.get(), "brave")}
-                    </small>
-                    <input
-                        class="workbench-plain-input"
-                        type="password"
-                        autocomplete="off"
-                        placeholder=move || web_key_mask(web_settings.get(), "brave").unwrap_or_default()
-                        prop:value=move || web_brave_key.get()
-                        on:input=move |ev| {
-                            if let Some(value) = input_str(&ev) {
-                                web_brave_key.set(value);
-                            }
-                        }
-                    />
-                </label>
-                <div class="harness-row-gap">
-                    <button
-                        type="button"
-                        class="workbench-mini-btn workbench-mini-btn--primary"
-                        prop:disabled=move || busy.get() || !is_tauri_shell()
-                        on:click=move |_| {
-                            let key = web_brave_key.get_untracked();
-                            if key.trim().is_empty() {
-                                error_msg.set(Some("API key is empty".into()));
-                                return;
-                            }
-                            busy.set(true);
-                            leptos::task::spawn_local(async move {
-                                match agent_web_api_key_set("brave", key).await {
-                                    Ok(view) => {
-                                        web_brave_key.set(String::new());
-                                        web_status_msg.set(Some(i18n.tr(I18nKey::AgWebSaveDone)().to_string()));
-                                        apply_web_settings(view);
-                                    }
-                                    Err(err) => error_msg.set(Some(err)),
-                                }
-                                busy.set(false);
-                            });
-                        }
-                    >
-                        <span>{move || i18n.tr(I18nKey::AgWebKeySet)()}</span>
-                    </button>
-                    <button
-                        type="button"
-                        class="workbench-mini-btn"
-                        prop:disabled=move || busy.get() || !is_tauri_shell()
-                        on:click=move |_| {
-                            busy.set(true);
-                            leptos::task::spawn_local(async move {
-                                match agent_web_api_key_delete("brave").await {
-                                    Ok(view) => apply_web_settings(view),
-                                    Err(err) => error_msg.set(Some(err)),
-                                }
-                                busy.set(false);
-                            });
-                        }
-                    >
-                        <span>{move || i18n.tr(I18nKey::AgWebKeyDelete)()}</span>
-                    </button>
-                </div>
+                <p class="harness-muted">"Manage Tavily / Brave keys in Settings → API Keys."</p>
                 <div class="harness-row-gap">
                     <button
                         type="button"
@@ -2260,31 +2016,6 @@ fn web_provider_from_value(value: &str) -> WebProviderKind {
     }
 }
 
-fn web_key_entry<'a>(
-    view: Option<&'a AgentWebSettingsView>,
-    kind: &str,
-) -> Option<&'a WebKeyStatus> {
-    view?.key_statuses.iter().find(|k| k.kind == kind)
-}
-
-fn web_key_mask(view: Option<AgentWebSettingsView>, kind: &str) -> Option<String> {
-    web_key_entry(view.as_ref(), kind).and_then(|k| k.masked_value.clone())
-}
-
-fn web_key_status_text(
-    i18n: &I18nService,
-    view: Option<AgentWebSettingsView>,
-    kind: &str,
-) -> String {
-    match web_key_entry(view.as_ref(), kind) {
-        Some(k) if k.configured => k
-            .masked_value
-            .clone()
-            .unwrap_or_else(|| i18n.tr(I18nKey::AgApiKeyConfigured)().to_string()),
-        _ => i18n.tr(I18nKey::AgApiKeyMissing)().to_string(),
-    }
-}
-
 #[component]
 fn AgentHooksPanel() -> impl IntoView {
     let i18n = expect_context::<I18nService>();
diff --git a/src/workbench/mod.rs b/src/workbench/mod.rs
index 95bd2c9..36e2b64 100644
--- a/src/workbench/mod.rs
+++ b/src/workbench/mod.rs
@@ -3,6 +3,7 @@ mod agent_accent;
 mod agent_context_handoff;
 mod agent_panel;
 mod agent_timeline;
+mod api_keys_pane;
 mod app_prefs;
 mod browser_tab;
 mod chat_markdown;
@@ -33,6 +34,7 @@ mod update_service;
 mod workspace_panel;
 
 pub use agent_panel::AgentPanelDock;
+pub use api_keys_pane::ApiKeysPane;
 pub use browser_tab::{BrowserTabDock, EmbeddedBrowserGlue};
 pub use memory_panel::MemoryPanel;
 pub use plans_panel::PlansPanel;

From 04601cfa220658f698497350c805b5ae04d60fcb Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 04:00:17 +0200
Subject: [PATCH 11/48] feat(i18n): add new API keys localization strings and
 update UI references

- Introduced new localization keys for API keys management, including subheadings, status messages, and hints in multiple languages.
- Updated UI components to utilize the new localization keys for better internationalization support in the API keys management pane.
---
 src/i18n/keys.rs                   | 15 +++++++
 src/i18n/locales/de_de.rs          | 15 +++++++
 src/i18n/locales/en_us.rs          | 15 +++++++
 src/i18n/locales/es_es.rs          | 15 +++++++
 src/i18n/locales/fr_fr.rs          | 15 +++++++
 src/i18n/locales/hu_hu.rs          | 15 +++++++
 src/i18n/locales/it_it.rs          | 15 +++++++
 src/i18n/locales/ja_jp.rs          | 15 +++++++
 src/i18n/locales/ko_kr.rs          | 15 +++++++
 src/i18n/locales/pl_pl.rs          | 15 +++++++
 src/i18n/locales/pt_br.rs          | 15 +++++++
 src/i18n/locales/ru_ru.rs          | 15 +++++++
 src/i18n/locales/zh_cn.rs          | 15 +++++++
 src/i18n/locales/zh_tw.rs          | 15 +++++++
 src/workbench/api_keys_pane/mod.rs | 65 +++++++++++++++++++-----------
 src/workbench/harness_ui.rs        |  4 +-
 16 files changed, 253 insertions(+), 26 deletions(-)

diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index 54977f7..3cb23a1 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -327,6 +327,21 @@ pub enum I18nKey {
     AppHeading,
     AppearanceHeading,
     ApiKeysHeading,
+    ApiKeysLlmSubhead,
+    ApiKeysSearchSubhead,
+    ApiKeysSaved,
+    ApiKeysDiscard,
+    ApiKeysUnsaved,
+    ApiKeysComingSoon,
+    ApiKeysWillBeRemoved,
+    ApiKeysViaEnv,
+    ApiKeysNotSet,
+    ApiKeysUndo,
+    ApiKeysRemove,
+    ApiKeysPending,
+    ApiKeysEnvFallback,
+    ApiKeysManageHint,
+    ApiKeysManageHintWeb,
     GenEulaStatus,
     AppLanguage,
     AppHooksHeading,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index 21947bb..31992ea 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -319,6 +319,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "App",
         I18nKey::AppearanceHeading => "Erscheinungsbild",
         I18nKey::ApiKeysHeading => "API-Schlüssel",
+        I18nKey::ApiKeysLlmSubhead => "LLM-Anbieter",
+        I18nKey::ApiKeysSearchSubhead => "Such-Anbieter",
+        I18nKey::ApiKeysSaved => "Gespeichert.",
+        I18nKey::ApiKeysDiscard => "Verwerfen",
+        I18nKey::ApiKeysUnsaved => "Nicht gespeicherte Änderungen",
+        I18nKey::ApiKeysComingSoon => "Demnächst",
+        I18nKey::ApiKeysWillBeRemoved => "Wird entfernt",
+        I18nKey::ApiKeysViaEnv => "über Umgebung",
+        I18nKey::ApiKeysNotSet => "Nicht gesetzt",
+        I18nKey::ApiKeysUndo => "Rückgängig",
+        I18nKey::ApiKeysRemove => "Entfernen",
+        I18nKey::ApiKeysPending => "Ausstehend — zum Übernehmen Speichern klicken.",
+        I18nKey::ApiKeysEnvFallback => "Umgebungs-Fallback: {var}",
+        I18nKey::ApiKeysManageHint => "API-Schlüssel unter Einstellungen → API-Schlüssel verwalten.",
+        I18nKey::ApiKeysManageHintWeb => "Tavily- oder Brave-Schlüssel unter Einstellungen → API-Schlüssel hinterlegen.",
         I18nKey::GenEulaStatus => "EULA-Status",
         I18nKey::AppLanguage => "UI-Sprache",
         I18nKey::AppHooksHeading => "Terminal-Hooks",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index 7e0fad6..224a538 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -357,6 +357,21 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::AppHeading => "App",
         I18nKey::AppearanceHeading => "Appearance",
         I18nKey::ApiKeysHeading => "API Keys",
+        I18nKey::ApiKeysLlmSubhead => "LLM Providers",
+        I18nKey::ApiKeysSearchSubhead => "Search Providers",
+        I18nKey::ApiKeysSaved => "Saved.",
+        I18nKey::ApiKeysDiscard => "Discard",
+        I18nKey::ApiKeysUnsaved => "Unsaved changes",
+        I18nKey::ApiKeysComingSoon => "Coming soon",
+        I18nKey::ApiKeysWillBeRemoved => "Will be removed",
+        I18nKey::ApiKeysViaEnv => "via env",
+        I18nKey::ApiKeysNotSet => "Not set",
+        I18nKey::ApiKeysUndo => "Undo",
+        I18nKey::ApiKeysRemove => "Remove",
+        I18nKey::ApiKeysPending => "Pending — press Save to apply.",
+        I18nKey::ApiKeysEnvFallback => "Env fallback: {var}",
+        I18nKey::ApiKeysManageHint => "Manage API keys in Settings → API Keys.",
+        I18nKey::ApiKeysManageHintWeb => "Set Tavily or Brave keys in Settings → API Keys.",
         I18nKey::GenEulaStatus => "EULA status",
         I18nKey::AppLanguage => "UI language",
         I18nKey::AppHooksHeading => "Terminal hooks",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index 324a31f..dfc349a 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -319,6 +319,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "Aplicación",
         I18nKey::AppearanceHeading => "Apariencia",
         I18nKey::ApiKeysHeading => "Claves API",
+        I18nKey::ApiKeysLlmSubhead => "Proveedores LLM",
+        I18nKey::ApiKeysSearchSubhead => "Proveedores de búsqueda",
+        I18nKey::ApiKeysSaved => "Guardado.",
+        I18nKey::ApiKeysDiscard => "Descartar",
+        I18nKey::ApiKeysUnsaved => "Cambios sin guardar",
+        I18nKey::ApiKeysComingSoon => "Próximamente",
+        I18nKey::ApiKeysWillBeRemoved => "Se eliminará",
+        I18nKey::ApiKeysViaEnv => "vía entorno",
+        I18nKey::ApiKeysNotSet => "No configurado",
+        I18nKey::ApiKeysUndo => "Deshacer",
+        I18nKey::ApiKeysRemove => "Eliminar",
+        I18nKey::ApiKeysPending => "Pendiente — pulsa Guardar para aplicar.",
+        I18nKey::ApiKeysEnvFallback => "Reserva de entorno: {var}",
+        I18nKey::ApiKeysManageHint => "Gestiona las claves API en Ajustes → Claves API.",
+        I18nKey::ApiKeysManageHintWeb => "Configura las claves Tavily o Brave en Ajustes → Claves API.",
         I18nKey::GenEulaStatus => "Estado del CLUF",
         I18nKey::AppLanguage => "Idioma de la interfaz de usuario",
         I18nKey::AppHooksHeading => "Ganchos terminales",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index a5fd698..24a9a6e 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -321,6 +321,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "Application",
         I18nKey::AppearanceHeading => "Apparence",
         I18nKey::ApiKeysHeading => "Clés API",
+        I18nKey::ApiKeysLlmSubhead => "Fournisseurs LLM",
+        I18nKey::ApiKeysSearchSubhead => "Fournisseurs de recherche",
+        I18nKey::ApiKeysSaved => "Enregistré.",
+        I18nKey::ApiKeysDiscard => "Annuler",
+        I18nKey::ApiKeysUnsaved => "Modifications non enregistrées",
+        I18nKey::ApiKeysComingSoon => "Bientôt disponible",
+        I18nKey::ApiKeysWillBeRemoved => "Sera supprimé",
+        I18nKey::ApiKeysViaEnv => "via env.",
+        I18nKey::ApiKeysNotSet => "Non défini",
+        I18nKey::ApiKeysUndo => "Annuler",
+        I18nKey::ApiKeysRemove => "Supprimer",
+        I18nKey::ApiKeysPending => "En attente — cliquez sur Enregistrer pour appliquer.",
+        I18nKey::ApiKeysEnvFallback => "Secours env. : {var}",
+        I18nKey::ApiKeysManageHint => "Gérez les clés API dans Paramètres → Clés API.",
+        I18nKey::ApiKeysManageHintWeb => "Définissez les clés Tavily ou Brave dans Paramètres → Clés API.",
         I18nKey::GenEulaStatus => "Statut du CLUF",
         I18nKey::AppLanguage => "Langue de l'interface utilisateur",
         I18nKey::AppHooksHeading => "Crochets de borne",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index 73e7b9c..ee9f45c 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -319,6 +319,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "App",
         I18nKey::AppearanceHeading => "Megjelenés",
         I18nKey::ApiKeysHeading => "API-kulcsok",
+        I18nKey::ApiKeysLlmSubhead => "LLM-szolgáltatók",
+        I18nKey::ApiKeysSearchSubhead => "Keresőszolgáltatók",
+        I18nKey::ApiKeysSaved => "Mentve.",
+        I18nKey::ApiKeysDiscard => "Elvetés",
+        I18nKey::ApiKeysUnsaved => "Nem mentett módosítások",
+        I18nKey::ApiKeysComingSoon => "Hamarosan",
+        I18nKey::ApiKeysWillBeRemoved => "Eltávolításra kerül",
+        I18nKey::ApiKeysViaEnv => "környezeti változón",
+        I18nKey::ApiKeysNotSet => "Nincs beállítva",
+        I18nKey::ApiKeysUndo => "Visszavonás",
+        I18nKey::ApiKeysRemove => "Eltávolítás",
+        I18nKey::ApiKeysPending => "Függőben — mentéshez kattints a Mentésre.",
+        I18nKey::ApiKeysEnvFallback => "Környezeti tartalék: {var}",
+        I18nKey::ApiKeysManageHint => "API-kulcsok: Beállítások → API-kulcsok.",
+        I18nKey::ApiKeysManageHintWeb => "Tavily vagy Brave kulcsok: Beállítások → API-kulcsok.",
         I18nKey::GenEulaStatus => "EULA állapot",
         I18nKey::AppLanguage => "UI nyelv",
         I18nKey::AppHooksHeading => "Terminál horgok",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index 3d0b3f1..114c680 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -319,6 +319,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "App",
         I18nKey::AppearanceHeading => "Aspetto",
         I18nKey::ApiKeysHeading => "Chiavi API",
+        I18nKey::ApiKeysLlmSubhead => "Provider LLM",
+        I18nKey::ApiKeysSearchSubhead => "Provider di ricerca",
+        I18nKey::ApiKeysSaved => "Salvato.",
+        I18nKey::ApiKeysDiscard => "Annulla modifiche",
+        I18nKey::ApiKeysUnsaved => "Modifiche non salvate",
+        I18nKey::ApiKeysComingSoon => "In arrivo",
+        I18nKey::ApiKeysWillBeRemoved => "Verrà rimosso",
+        I18nKey::ApiKeysViaEnv => "via env",
+        I18nKey::ApiKeysNotSet => "Non impostato",
+        I18nKey::ApiKeysUndo => "Annulla",
+        I18nKey::ApiKeysRemove => "Rimuovi",
+        I18nKey::ApiKeysPending => "In sospeso — premi Salva per applicare.",
+        I18nKey::ApiKeysEnvFallback => "Fallback env: {var}",
+        I18nKey::ApiKeysManageHint => "Gestisci le chiavi API in Impostazioni → Chiavi API.",
+        I18nKey::ApiKeysManageHintWeb => "Imposta le chiavi Tavily o Brave in Impostazioni → Chiavi API.",
         I18nKey::GenEulaStatus => "Stato dell'EULA",
         I18nKey::AppLanguage => "Lingua dell'interfaccia utente",
         I18nKey::AppHooksHeading => "Ganci terminali",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index 26002d7..bc4f3ac 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -313,6 +313,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "アプリ",
         I18nKey::AppearanceHeading => "外観",
         I18nKey::ApiKeysHeading => "APIキー",
+        I18nKey::ApiKeysLlmSubhead => "LLMプロバイダー",
+        I18nKey::ApiKeysSearchSubhead => "検索プロバイダー",
+        I18nKey::ApiKeysSaved => "保存しました。",
+        I18nKey::ApiKeysDiscard => "破棄",
+        I18nKey::ApiKeysUnsaved => "未保存の変更",
+        I18nKey::ApiKeysComingSoon => "近日公開",
+        I18nKey::ApiKeysWillBeRemoved => "削除予定",
+        I18nKey::ApiKeysViaEnv => "環境変数",
+        I18nKey::ApiKeysNotSet => "未設定",
+        I18nKey::ApiKeysUndo => "元に戻す",
+        I18nKey::ApiKeysRemove => "削除",
+        I18nKey::ApiKeysPending => "保留中 — 保存を押して適用してください。",
+        I18nKey::ApiKeysEnvFallback => "環境変数フォールバック: {var}",
+        I18nKey::ApiKeysManageHint => "APIキーは設定 → APIキーで管理します。",
+        I18nKey::ApiKeysManageHintWeb => "Tavily/Braveキーは設定 → APIキーで設定します。",
         I18nKey::GenEulaStatus => "EULAステータス",
         I18nKey::AppLanguage => "UI言語",
         I18nKey::AppHooksHeading => "端子フック",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index cd65704..add6d33 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -313,6 +313,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "앱",
         I18nKey::AppearanceHeading => "모양새",
         I18nKey::ApiKeysHeading => "API 키",
+        I18nKey::ApiKeysLlmSubhead => "LLM 제공업체",
+        I18nKey::ApiKeysSearchSubhead => "검색 제공업체",
+        I18nKey::ApiKeysSaved => "저장됨.",
+        I18nKey::ApiKeysDiscard => "취소",
+        I18nKey::ApiKeysUnsaved => "저장되지 않은 변경",
+        I18nKey::ApiKeysComingSoon => "곧 제공",
+        I18nKey::ApiKeysWillBeRemoved => "제거 예정",
+        I18nKey::ApiKeysViaEnv => "환경 변수",
+        I18nKey::ApiKeysNotSet => "설정 안 됨",
+        I18nKey::ApiKeysUndo => "실행 취소",
+        I18nKey::ApiKeysRemove => "제거",
+        I18nKey::ApiKeysPending => "대기 중 — 저장을 눌러 적용하세요.",
+        I18nKey::ApiKeysEnvFallback => "환경 변수 대체: {var}",
+        I18nKey::ApiKeysManageHint => "API 키는 설정 → API 키에서 관리합니다.",
+        I18nKey::ApiKeysManageHintWeb => "Tavily/Brave 키는 설정 → API 키에서 설정하세요.",
         I18nKey::GenEulaStatus => "EULA 상태",
         I18nKey::AppLanguage => "UI 언어",
         I18nKey::AppHooksHeading => "단자 후크",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index 0eab830..4f1787e 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -317,6 +317,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "Aplikacja",
         I18nKey::AppearanceHeading => "Wygląd",
         I18nKey::ApiKeysHeading => "Klucze API",
+        I18nKey::ApiKeysLlmSubhead => "Dostawcy LLM",
+        I18nKey::ApiKeysSearchSubhead => "Dostawcy wyszukiwania",
+        I18nKey::ApiKeysSaved => "Zapisano.",
+        I18nKey::ApiKeysDiscard => "Odrzuć",
+        I18nKey::ApiKeysUnsaved => "Niezapisane zmiany",
+        I18nKey::ApiKeysComingSoon => "Wkrótce",
+        I18nKey::ApiKeysWillBeRemoved => "Zostanie usunięty",
+        I18nKey::ApiKeysViaEnv => "przez env",
+        I18nKey::ApiKeysNotSet => "Nie ustawiono",
+        I18nKey::ApiKeysUndo => "Cofnij",
+        I18nKey::ApiKeysRemove => "Usuń",
+        I18nKey::ApiKeysPending => "Oczekuje — naciśnij Zapisz, aby zastosować.",
+        I18nKey::ApiKeysEnvFallback => "Rezerwa env: {var}",
+        I18nKey::ApiKeysManageHint => "Zarządzaj kluczami API w Ustawienia → Klucze API.",
+        I18nKey::ApiKeysManageHintWeb => "Ustaw klucze Tavily lub Brave w Ustawienia → Klucze API.",
         I18nKey::GenEulaStatus => "Stan EULA",
         I18nKey::AppLanguage => "Język interfejsu",
         I18nKey::AppHooksHeading => "Haki końcowe",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index 8bad670..d90ce69 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -319,6 +319,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "Aplicativo",
         I18nKey::AppearanceHeading => "Aparência",
         I18nKey::ApiKeysHeading => "Chaves de API",
+        I18nKey::ApiKeysLlmSubhead => "Provedores LLM",
+        I18nKey::ApiKeysSearchSubhead => "Provedores de busca",
+        I18nKey::ApiKeysSaved => "Salvo.",
+        I18nKey::ApiKeysDiscard => "Descartar",
+        I18nKey::ApiKeysUnsaved => "Alterações não salvas",
+        I18nKey::ApiKeysComingSoon => "Em breve",
+        I18nKey::ApiKeysWillBeRemoved => "Será removido",
+        I18nKey::ApiKeysViaEnv => "via ambiente",
+        I18nKey::ApiKeysNotSet => "Não definido",
+        I18nKey::ApiKeysUndo => "Desfazer",
+        I18nKey::ApiKeysRemove => "Remover",
+        I18nKey::ApiKeysPending => "Pendente — pressione Salvar para aplicar.",
+        I18nKey::ApiKeysEnvFallback => "Fallback de ambiente: {var}",
+        I18nKey::ApiKeysManageHint => "Gerencie chaves de API em Configurações → Chaves de API.",
+        I18nKey::ApiKeysManageHintWeb => "Defina chaves Tavily ou Brave em Configurações → Chaves de API.",
         I18nKey::GenEulaStatus => "Status do EULA",
         I18nKey::AppLanguage => "Idioma da IU",
         I18nKey::AppHooksHeading => "Ganchos terminais",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index 91735e8..230f763 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -317,6 +317,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "Приложение",
         I18nKey::AppearanceHeading => "Внешний вид",
         I18nKey::ApiKeysHeading => "API-ключи",
+        I18nKey::ApiKeysLlmSubhead => "Поставщики LLM",
+        I18nKey::ApiKeysSearchSubhead => "Поисковые поставщики",
+        I18nKey::ApiKeysSaved => "Сохранено.",
+        I18nKey::ApiKeysDiscard => "Отменить",
+        I18nKey::ApiKeysUnsaved => "Несохранённые изменения",
+        I18nKey::ApiKeysComingSoon => "Скоро",
+        I18nKey::ApiKeysWillBeRemoved => "Будет удалён",
+        I18nKey::ApiKeysViaEnv => "через env",
+        I18nKey::ApiKeysNotSet => "Не задан",
+        I18nKey::ApiKeysUndo => "Отменить",
+        I18nKey::ApiKeysRemove => "Удалить",
+        I18nKey::ApiKeysPending => "Ожидает — нажмите Сохранить для применения.",
+        I18nKey::ApiKeysEnvFallback => "Резерв env: {var}",
+        I18nKey::ApiKeysManageHint => "Управляйте API-ключами в Настройки → API-ключи.",
+        I18nKey::ApiKeysManageHintWeb => "Задайте ключи Tavily или Brave в Настройки → API-ключи.",
         I18nKey::GenEulaStatus => "Статус лицензионного соглашения",
         I18nKey::AppLanguage => "язык пользовательского интерфейса",
         I18nKey::AppHooksHeading => "Терминальные крючки",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index 9f0e57a..962c0db 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -311,6 +311,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "应用程序",
         I18nKey::AppearanceHeading => "外观",
         I18nKey::ApiKeysHeading => "API 密钥",
+        I18nKey::ApiKeysLlmSubhead => "LLM 提供商",
+        I18nKey::ApiKeysSearchSubhead => "搜索提供商",
+        I18nKey::ApiKeysSaved => "已保存。",
+        I18nKey::ApiKeysDiscard => "放弃",
+        I18nKey::ApiKeysUnsaved => "未保存的更改",
+        I18nKey::ApiKeysComingSoon => "即将推出",
+        I18nKey::ApiKeysWillBeRemoved => "将删除",
+        I18nKey::ApiKeysViaEnv => "环境变量",
+        I18nKey::ApiKeysNotSet => "未设置",
+        I18nKey::ApiKeysUndo => "撤销",
+        I18nKey::ApiKeysRemove => "移除",
+        I18nKey::ApiKeysPending => "待处理 — 按保存以应用。",
+        I18nKey::ApiKeysEnvFallback => "环境变量回退：{var}",
+        I18nKey::ApiKeysManageHint => "在设置 → API 密钥中管理 API 密钥。",
+        I18nKey::ApiKeysManageHintWeb => "在设置 → API 密钥中设置 Tavily 或 Brave 密钥。",
         I18nKey::GenEulaStatus => "EULA 状态",
         I18nKey::AppLanguage => "用户界面语言",
         I18nKey::AppHooksHeading => "端子挂钩",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index 73bc939..5c589b1 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -311,6 +311,21 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppHeading => "應用程式",
         I18nKey::AppearanceHeading => "外觀",
         I18nKey::ApiKeysHeading => "API 金鑰",
+        I18nKey::ApiKeysLlmSubhead => "LLM 供應商",
+        I18nKey::ApiKeysSearchSubhead => "搜尋供應商",
+        I18nKey::ApiKeysSaved => "已儲存。",
+        I18nKey::ApiKeysDiscard => "捨棄",
+        I18nKey::ApiKeysUnsaved => "未儲存的變更",
+        I18nKey::ApiKeysComingSoon => "即將推出",
+        I18nKey::ApiKeysWillBeRemoved => "將移除",
+        I18nKey::ApiKeysViaEnv => "環境變數",
+        I18nKey::ApiKeysNotSet => "未設定",
+        I18nKey::ApiKeysUndo => "復原",
+        I18nKey::ApiKeysRemove => "移除",
+        I18nKey::ApiKeysPending => "待處理 — 按儲存以套用。",
+        I18nKey::ApiKeysEnvFallback => "環境變數後援：{var}",
+        I18nKey::ApiKeysManageHint => "於設定 → API 金鑰管理 API 金鑰。",
+        I18nKey::ApiKeysManageHintWeb => "於設定 → API 金鑰設定 Tavily 或 Brave 金鑰。",
         I18nKey::GenEulaStatus => "EULA 狀態",
         I18nKey::AppLanguage => "使用者介面語言",
         I18nKey::AppHooksHeading => "端子掛鉤",
diff --git a/src/workbench/api_keys_pane/mod.rs b/src/workbench/api_keys_pane/mod.rs
index 87b2421..4cb519e 100644
--- a/src/workbench/api_keys_pane/mod.rs
+++ b/src/workbench/api_keys_pane/mod.rs
@@ -105,7 +105,7 @@ pub fn ApiKeysPane() -> impl IntoView {
                 Ok(s) => {
                     status.set(Some(s));
                     drafts.set(DraftMap::new());
-                    status_msg.set(Some("Saved.".into()));
+                    status_msg.set(Some(i18n.tr(I18nKey::ApiKeysSaved)()));
                 }
                 Err(err) => error_msg.set(Some(err)),
             }
@@ -158,7 +158,7 @@ pub fn ApiKeysPane() -> impl IntoView {
                     <span class="harness-pane-subhead__icon" aria-hidden="true">
                         <LxIcon icon=icondata::LuCpu width="0.9rem" height="0.9rem" />
                     </span>
-                    <span class="harness-pane-subhead__text">"LLM Providers"</span>
+                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::ApiKeysLlmSubhead)()}</span>
                 </h4>
                 <ApiKeyRows entries=llm_entries drafts=drafts />
             </section>
@@ -168,7 +168,7 @@ pub fn ApiKeysPane() -> impl IntoView {
                     <span class="harness-pane-subhead__icon" aria-hidden="true">
                         <LxIcon icon=icondata::LuGlobe width="0.9rem" height="0.9rem" />
                     </span>
-                    <span class="harness-pane-subhead__text">"Search Providers"</span>
+                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::ApiKeysSearchSubhead)()}</span>
                 </h4>
                 <ApiKeyRows entries=search_entries drafts=drafts />
             </section>
@@ -189,7 +189,7 @@ pub fn ApiKeysPane() -> impl IntoView {
                 >
                     <span class="harness-btn-inline">
                         <LxIcon icon=icondata::LuSave width="0.78rem" height="0.78rem" />
-                        <span>{move || i18n.tr(I18nKey::AgSaveProvider)()}</span>
+                        <span>{move || i18n.tr(I18nKey::BtnSave)()}</span>
                     </span>
                 </button>
                 <button
@@ -200,11 +200,11 @@ pub fn ApiKeysPane() -> impl IntoView {
                 >
                     <span class="harness-btn-inline">
                         <LxIcon icon=icondata::LuUndo2 width="0.78rem" height="0.78rem" />
-                        <span>"Discard"</span>
+                        <span>{move || i18n.tr(I18nKey::ApiKeysDiscard)()}</span>
                     </span>
                 </button>
                 <Show when=move || dirty.get()>
-                    <span class="api-keys-dirty harness-muted">"Unsaved changes"</span>
+                    <span class="api-keys-dirty harness-muted">{move || i18n.tr(I18nKey::ApiKeysUnsaved)()}</span>
                 </Show>
             </footer>
         </article>
@@ -228,6 +228,7 @@ fn ApiKeyRows(entries: Memo<Vec<ApiKeyEntry>>, drafts: RwSignal<DraftMap>) -> im
 
 #[component]
 fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
     let kind: std::sync::Arc<str> = std::sync::Arc::from(entry.kind.as_str());
     let coming_soon = entry.coming_soon;
     let configured = entry.configured;
@@ -235,15 +236,8 @@ fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
 
     let label = StoredValue::new(entry.label.clone());
     let masked = StoredValue::new(entry.masked_value.clone().unwrap_or_default());
-    let env_hint_text = StoredValue::new(
-        entry
-            .env_var
-            .clone()
-            .filter(|_| !configured || via_env)
-            .map(|v| format!("Env fallback: {v}"))
-            .unwrap_or_default(),
-    );
-    let has_env_hint = !env_hint_text.with_value(|s| s.is_empty());
+    let env_var = StoredValue::new(entry.env_var.clone());
+    let show_env_hint = !configured || via_env;
 
     let kind_for_draft = kind.clone();
     let draft_value = Signal::derive(move || {
@@ -302,15 +296,27 @@ fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
                 <span class="api-keys-row__label">{move || label.get_value()}</span>
                 {move || {
                     if coming_soon {
-                        view! { <span class="api-keys-row__badge">"Coming soon"</span> }.into_any()
+                        view! {
+                            <span class="api-keys-row__badge">{move || i18n.tr(I18nKey::ApiKeysComingSoon)()}</span>
+                        }.into_any()
                     } else if marked_delete.get() {
-                        view! { <span class="api-keys-row__badge api-keys-row__badge--warn">"Will be removed"</span> }.into_any()
+                        view! {
+                            <span class="api-keys-row__badge api-keys-row__badge--warn">
+                                {move || i18n.tr(I18nKey::ApiKeysWillBeRemoved)()}
+                            </span>
+                        }.into_any()
                     } else if configured && via_env {
-                        view! { <span class="api-keys-row__badge">"via env"</span> }.into_any()
+                        view! {
+                            <span class="api-keys-row__badge">{move || i18n.tr(I18nKey::ApiKeysViaEnv)()}</span>
+                        }.into_any()
                     } else if configured {
                         view! { <span class="api-keys-row__masked">{move || masked.get_value()}</span> }.into_any()
                     } else {
-                        view! { <span class="api-keys-row__badge api-keys-row__badge--muted">"Not set"</span> }.into_any()
+                        view! {
+                            <span class="api-keys-row__badge api-keys-row__badge--muted">
+                                {move || i18n.tr(I18nKey::ApiKeysNotSet)()}
+                            </span>
+                        }.into_any()
                     }
                 }}
             </div>
@@ -334,7 +340,7 @@ fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
                                     <button type="button" class="workbench-mini-btn" on:click=on_undo>
                                         <span class="harness-btn-inline">
                                             <LxIcon icon=icondata::LuUndo2 width="0.78rem" height="0.78rem" />
-                                            <span>"Undo"</span>
+                                            <span>{move || i18n.tr(I18nKey::ApiKeysUndo)()}</span>
                                         </span>
                                     </button>
                                 }.into_any()
@@ -344,7 +350,7 @@ fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
                                     <button type="button" class="workbench-mini-btn" on:click=on_remove>
                                         <span class="harness-btn-inline">
                                             <LxIcon icon=icondata::LuTrash2 width="0.78rem" height="0.78rem" />
-                                            <span>"Remove"</span>
+                                            <span>{move || i18n.tr(I18nKey::ApiKeysRemove)()}</span>
                                         </span>
                                     </button>
                                 }.into_any()
@@ -355,10 +361,21 @@ fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
                     }
                 </div>
                 <Show when=move || row_dirty.get() && !marked_delete.get()>
-                    <p class="harness-muted api-keys-row__hint">"Pending — press Save to apply."</p>
+                    <p class="harness-muted api-keys-row__hint">{move || i18n.tr(I18nKey::ApiKeysPending)()}</p>
                 </Show>
-                <Show when=move || has_env_hint>
-                    <p class="harness-muted api-keys-row__envhint">{move || env_hint_text.get_value()}</p>
+                <Show when=move || show_env_hint && env_var.with_value(|v| v.is_some())>
+                    <p class="harness-muted api-keys-row__envhint">
+                        {move || {
+                            env_var
+                                .with_value(|v| {
+                                    v.as_ref().map(|name| {
+                                        i18n.tr(I18nKey::ApiKeysEnvFallback)().replace("{var}", name)
+                                    })
+                                })
+                                .flatten()
+                                .unwrap_or_default()
+                        }}
+                    </p>
                 </Show>
             </Show>
         </li>
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index debd106..3076ac4 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -1891,7 +1891,7 @@ fn AgentProviderPane() -> impl IntoView {
                     </span>
                     <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgApiKeyField)()}</span>
                 </h4>
-                <p class="harness-muted">"Manage API keys in Settings → API Keys."</p>
+                <p class="harness-muted">{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</p>
                 <small class="harness-muted">
                     {move || {
                         settings
@@ -1958,7 +1958,7 @@ fn AgentProviderPane() -> impl IntoView {
                         <option value="brave">{move || i18n.tr(I18nKey::AgWebProviderBrave)()}</option>
                     </select>
                 </label>
-                <p class="harness-muted">"Manage Tavily / Brave keys in Settings → API Keys."</p>
+                <p class="harness-muted">{move || i18n.tr(I18nKey::ApiKeysManageHintWeb)()}</p>
                 <div class="harness-row-gap">
                     <button
                         type="button"

From dbda4055f50097012489bfab7b298f7fc2552993 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 04:00:52 +0200
Subject: [PATCH 12/48] fix(i18n): ensure status message is a string and
 improve environment variable handling

- Updated the status message in the API keys pane to ensure it is explicitly converted to a string.
- Refactored the environment variable handling in the API key row to improve readability and maintainability.
---
 src/workbench/api_keys_pane/mod.rs | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/workbench/api_keys_pane/mod.rs b/src/workbench/api_keys_pane/mod.rs
index 4cb519e..809216d 100644
--- a/src/workbench/api_keys_pane/mod.rs
+++ b/src/workbench/api_keys_pane/mod.rs
@@ -105,7 +105,7 @@ pub fn ApiKeysPane() -> impl IntoView {
                 Ok(s) => {
                     status.set(Some(s));
                     drafts.set(DraftMap::new());
-                    status_msg.set(Some(i18n.tr(I18nKey::ApiKeysSaved)()));
+                    status_msg.set(Some(i18n.tr(I18nKey::ApiKeysSaved)().to_string()));
                 }
                 Err(err) => error_msg.set(Some(err)),
             }
@@ -368,12 +368,12 @@ fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
                         {move || {
                             env_var
                                 .with_value(|v| {
-                                    v.as_ref().map(|name| {
-                                        i18n.tr(I18nKey::ApiKeysEnvFallback)().replace("{var}", name)
-                                    })
+                                    v.as_ref()
+                                        .map(|name| {
+                                            i18n.tr(I18nKey::ApiKeysEnvFallback)().replace("{var}", name)
+                                        })
+                                        .unwrap_or_default()
                                 })
-                                .flatten()
-                                .unwrap_or_default()
                         }}
                     </p>
                 </Show>

From d51031f53bedf23707a3b6740ee09fe596abaf88 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 04:12:57 +0200
Subject: [PATCH 13/48] feat(workspace): add workspace settings pane and
 localization support

- Introduced a new `WorkspaceSettingsPane` component for managing workspace settings, including project directory and sandbox root configurations.
- Added localization keys for workspace settings in multiple languages to enhance internationalization support.
- Updated the main application structure to include the new workspace settings pane and corresponding CSS styles for consistent UI design.
---
 index.html                                    |   1 +
 src/i18n/keys.rs                              |   2 +
 src/i18n/locales/de_de.rs                     |   2 +
 src/i18n/locales/en_us.rs                     |   2 +
 src/i18n/locales/es_es.rs                     |   2 +
 src/i18n/locales/fr_fr.rs                     |   2 +
 src/i18n/locales/hu_hu.rs                     |   2 +
 src/i18n/locales/it_it.rs                     |   2 +
 src/i18n/locales/ja_jp.rs                     |   2 +
 src/i18n/locales/ko_kr.rs                     |   2 +
 src/i18n/locales/pl_pl.rs                     |   2 +
 src/i18n/locales/pt_br.rs                     |   2 +
 src/i18n/locales/ru_ru.rs                     |   2 +
 src/i18n/locales/zh_cn.rs                     |   2 +
 src/i18n/locales/zh_tw.rs                     |   2 +
 src/workbench/api_keys_pane/api_keys_pane.css |  22 +-
 src/workbench/api_keys_pane/mod.rs            |   6 +-
 src/workbench/harness_ui.rs                   | 156 +----------
 src/workbench/mod.rs                          |   2 +
 src/workbench/workspace_settings_pane/mod.rs  | 248 ++++++++++++++++++
 .../workspace_settings_pane.css               |  38 +++
 21 files changed, 326 insertions(+), 175 deletions(-)
 create mode 100644 src/workbench/workspace_settings_pane/mod.rs
 create mode 100644 src/workbench/workspace_settings_pane/workspace_settings_pane.css

diff --git a/index.html b/index.html
index f0a4b6e..22a41ab 100644
--- a/index.html
+++ b/index.html
@@ -16,6 +16,7 @@
     <link data-trunk rel="css" href="src/workbench/update_dialog.css" />
     <link data-trunk rel="css" href="src/workbench/harness_image_pane/harness_image_pane.css" />
     <link data-trunk rel="css" href="src/workbench/api_keys_pane/api_keys_pane.css" />
+    <link data-trunk rel="css" href="src/workbench/workspace_settings_pane/workspace_settings_pane.css" />
     <link data-trunk rel="css" href="src/workbench/agent_panel/ask_user_card/ask_user_card.css" />
     <link data-trunk rel="css" href="src/workbench/agent_panel/turn_metrics_bar/turn_metrics_bar.css" />
     <link data-trunk rel="copy-dir" href="public" />
diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index 3cb23a1..f1cf78c 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -346,6 +346,8 @@ pub enum I18nKey {
     AppLanguage,
     AppHooksHeading,
     WsHeading,
+    WsSectionPaths,
+    WsSectionBrowser,
     LayBrowserUrl,
     WsBrowserDefault,
     WsRootLabel,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index 31992ea..350d656 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -338,6 +338,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "UI-Sprache",
         I18nKey::AppHooksHeading => "Terminal-Hooks",
         I18nKey::WsHeading => "Arbeitsplatz",
+        I18nKey::WsSectionPaths => "Pfade & Sandbox",
+        I18nKey::WsSectionBrowser => "Eingebetteter Browser",
         I18nKey::LayBrowserUrl => "Standard-URL des eingebetteten Browsers",
         I18nKey::WsBrowserDefault => "Voreinstellung:",
         I18nKey::WsRootLabel => "Arbeitsbereich/Sandbox-Root",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index 224a538..7e29725 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -376,6 +376,8 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::AppLanguage => "UI language",
         I18nKey::AppHooksHeading => "Terminal hooks",
         I18nKey::WsHeading => "Workspace",
+        I18nKey::WsSectionPaths => "Paths & sandbox",
+        I18nKey::WsSectionBrowser => "Embedded browser",
         I18nKey::LayBrowserUrl => "Default embedded browser URL",
         I18nKey::WsBrowserDefault => "Preset:",
         I18nKey::WsRootLabel => "Agent sandbox root",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index dfc349a..d5e79c3 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -338,6 +338,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "Idioma de la interfaz de usuario",
         I18nKey::AppHooksHeading => "Ganchos terminales",
         I18nKey::WsHeading => "Espacio de trabajo",
+        I18nKey::WsSectionPaths => "Rutas y sandbox",
+        I18nKey::WsSectionBrowser => "Navegador integrado",
         I18nKey::LayBrowserUrl => "URL del navegador integrado predeterminado",
         I18nKey::WsBrowserDefault => "Programar:",
         I18nKey::WsRootLabel => "Raíz del espacio de trabajo/zona de pruebas",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index 24a9a6e..6cd3c8d 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -340,6 +340,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "Langue de l'interface utilisateur",
         I18nKey::AppHooksHeading => "Crochets de borne",
         I18nKey::WsHeading => "Espace de travail",
+        I18nKey::WsSectionPaths => "Chemins et sandbox",
+        I18nKey::WsSectionBrowser => "Navigateur intégré",
         I18nKey::LayBrowserUrl => "URL du navigateur intégré par défaut",
         I18nKey::WsBrowserDefault => "Préréglage :",
         I18nKey::WsRootLabel => "Racine de l'espace de travail/bac à sable",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index ee9f45c..a146db6 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -338,6 +338,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "UI nyelv",
         I18nKey::AppHooksHeading => "Terminál horgok",
         I18nKey::WsHeading => "Munkaterület",
+        I18nKey::WsSectionPaths => "Útvonalak és sandbox",
+        I18nKey::WsSectionBrowser => "Beágyazott böngésző",
         I18nKey::LayBrowserUrl => "Alapértelmezett beágyazott böngésző URL",
         I18nKey::WsBrowserDefault => "Előre beállított:",
         I18nKey::WsRootLabel => "Munkaterület / sandbox gyökér",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index 114c680..5dc8d2d 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -338,6 +338,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "Lingua dell'interfaccia utente",
         I18nKey::AppHooksHeading => "Ganci terminali",
         I18nKey::WsHeading => "Spazio di lavoro",
+        I18nKey::WsSectionPaths => "Percorsi e sandbox",
+        I18nKey::WsSectionBrowser => "Browser incorporato",
         I18nKey::LayBrowserUrl => "URL del browser incorporato predefinito",
         I18nKey::WsBrowserDefault => "Preimpostazione:",
         I18nKey::WsRootLabel => "Radice dell'area di lavoro/sandbox",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index bc4f3ac..de5c825 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -332,6 +332,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "UI言語",
         I18nKey::AppHooksHeading => "端子フック",
         I18nKey::WsHeading => "ワークスペース",
+        I18nKey::WsSectionPaths => "パスとサンドボックス",
+        I18nKey::WsSectionBrowser => "埋め込みブラウザ",
         I18nKey::LayBrowserUrl => "デフォルトの埋め込みブラウザ URL",
         I18nKey::WsBrowserDefault => "プリセット：",
         I18nKey::WsRootLabel => "ワークスペース/サンドボックスのルート",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index add6d33..2265780 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -332,6 +332,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "UI 언어",
         I18nKey::AppHooksHeading => "단자 후크",
         I18nKey::WsHeading => "작업공간",
+        I18nKey::WsSectionPaths => "경로 및 샌드박스",
+        I18nKey::WsSectionBrowser => "내장 브라우저",
         I18nKey::LayBrowserUrl => "기본 내장 브라우저 URL",
         I18nKey::WsBrowserDefault => "사전 설정:",
         I18nKey::WsRootLabel => "작업공간/샌드박스 루트",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index 4f1787e..db362d3 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -336,6 +336,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "Język interfejsu",
         I18nKey::AppHooksHeading => "Haki końcowe",
         I18nKey::WsHeading => "Obszar roboczy",
+        I18nKey::WsSectionPaths => "Ścieżki i piaskownica",
+        I18nKey::WsSectionBrowser => "Wbudowana przeglądarka",
         I18nKey::LayBrowserUrl => "Domyślny adres URL wbudowanej przeglądarki",
         I18nKey::WsBrowserDefault => "Ustawienie wstępne:",
         I18nKey::WsRootLabel => "Katalog główny obszaru roboczego/piaskownicy",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index d90ce69..0fa019a 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -338,6 +338,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "Idioma da IU",
         I18nKey::AppHooksHeading => "Ganchos terminais",
         I18nKey::WsHeading => "Espaço de trabalho",
+        I18nKey::WsSectionPaths => "Caminhos e sandbox",
+        I18nKey::WsSectionBrowser => "Navegador incorporado",
         I18nKey::LayBrowserUrl => "URL do navegador incorporado padrão",
         I18nKey::WsBrowserDefault => "Predefinição:",
         I18nKey::WsRootLabel => "Raiz do espaço de trabalho/sandbox",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index 230f763..24990d3 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -336,6 +336,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "язык пользовательского интерфейса",
         I18nKey::AppHooksHeading => "Терминальные крючки",
         I18nKey::WsHeading => "Рабочая область",
+        I18nKey::WsSectionPaths => "Пути и песочница",
+        I18nKey::WsSectionBrowser => "Встроенный браузер",
         I18nKey::LayBrowserUrl => "URL-адрес встроенного браузера по умолчанию",
         I18nKey::WsBrowserDefault => "Предустановка:",
         I18nKey::WsRootLabel => "Корень рабочей области/песочницы",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index 962c0db..2b60b3d 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -330,6 +330,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "用户界面语言",
         I18nKey::AppHooksHeading => "端子挂钩",
         I18nKey::WsHeading => "工作空间",
+        I18nKey::WsSectionPaths => "路径与沙箱",
+        I18nKey::WsSectionBrowser => "嵌入式浏览器",
         I18nKey::LayBrowserUrl => "默认嵌入浏览器 URL",
         I18nKey::WsBrowserDefault => "预设：",
         I18nKey::WsRootLabel => "工作区/沙箱根目录",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index 5c589b1..4cc741e 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -330,6 +330,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AppLanguage => "使用者介面語言",
         I18nKey::AppHooksHeading => "端子掛鉤",
         I18nKey::WsHeading => "工作空間",
+        I18nKey::WsSectionPaths => "路徑與沙箱",
+        I18nKey::WsSectionBrowser => "嵌入式瀏覽器",
         I18nKey::LayBrowserUrl => "預設嵌入瀏覽器 URL",
         I18nKey::WsBrowserDefault => "預設：",
         I18nKey::WsRootLabel => "工作區/沙箱根目錄",
diff --git a/src/workbench/api_keys_pane/api_keys_pane.css b/src/workbench/api_keys_pane/api_keys_pane.css
index bfdfd83..87d19d3 100644
--- a/src/workbench/api_keys_pane/api_keys_pane.css
+++ b/src/workbench/api_keys_pane/api_keys_pane.css
@@ -10,15 +10,7 @@
     gap: 0.6rem;
 }
 
-.api-keys-row {
-    display: flex;
-    flex-direction: column;
-    gap: 0.35rem;
-    padding: 0.55rem 0.65rem;
-    border-radius: 6px;
-    background: rgba(255, 255, 255, 0.03);
-    border: 1px solid rgba(255, 255, 255, 0.06);
-}
+/* Card chrome: .settings-field-card in workspace_settings_pane.css */
 
 .api-keys-row--coming-soon {
     opacity: 0.55;
@@ -82,14 +74,8 @@
     font-size: 0.72rem;
 }
 
-.api-keys-footer {
-    margin-top: 0.85rem;
-    display: flex;
-    gap: 0.5rem;
-    align-items: center;
-}
+/* Footer/dirty: see workspace_settings_pane.css (.settings-pane-footer). */
 
-.api-keys-dirty {
-    margin-left: 0.35rem;
-    font-size: 0.75rem;
+.api-keys-pane .settings-pane-footer {
+    margin-top: 0.85rem;
 }
diff --git a/src/workbench/api_keys_pane/mod.rs b/src/workbench/api_keys_pane/mod.rs
index 809216d..dd93865 100644
--- a/src/workbench/api_keys_pane/mod.rs
+++ b/src/workbench/api_keys_pane/mod.rs
@@ -180,7 +180,7 @@ pub fn ApiKeysPane() -> impl IntoView {
                 <p class="harness-error">{move || error_msg.get().unwrap_or_default()}</p>
             </Show>
 
-            <footer class="api-keys-footer harness-row-gap">
+            <footer class="settings-pane-footer harness-row-gap">
                 <button
                     type="button"
                     class="workbench-mini-btn workbench-mini-btn--primary"
@@ -204,7 +204,7 @@ pub fn ApiKeysPane() -> impl IntoView {
                     </span>
                 </button>
                 <Show when=move || dirty.get()>
-                    <span class="api-keys-dirty harness-muted">{move || i18n.tr(I18nKey::ApiKeysUnsaved)()}</span>
+                    <span class="settings-pane-dirty harness-muted">{move || i18n.tr(I18nKey::ApiKeysUnsaved)()}</span>
                 </Show>
             </footer>
         </article>
@@ -288,7 +288,7 @@ fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
 
     view! {
         <li
-            class="api-keys-row"
+            class="settings-field-card api-keys-row"
             class:api-keys-row--coming-soon=move || coming_soon
             class:api-keys-row--marked-delete=move || marked_delete.get()
         >
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index 3076ac4..e67c324 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -712,7 +712,7 @@ pub fn SettingsDock(
                         <ApiKeysSettingsPane />
                     }.into_any(),
                     HarnessSettingsCategory::Workspace => view! {
-                        <WorkspaceSettingsPane ui=ui wb=wb embed=embed />
+                        <crate::workbench::WorkspaceSettingsPane wb=wb embed=embed />
                     }.into_any(),
                     HarnessSettingsCategory::AgentProvider => view! {
                         <AgentProviderPane />
@@ -942,7 +942,7 @@ fn AppSettingsPane() -> impl IntoView {
     let ui = expect_context::<HarnessUiService>();
     let updates = expect_context::<UpdateService>();
     view! {
-        <article class="harness-pane">
+        <article class="harness-pane app-settings-pane">
             <h3 class="harness-pane-title">
                 <span class="harness-pane-title__icon" aria-hidden="true">
                     <LxIcon icon=icondata::LuLayoutDashboard width="1.02rem" height="1.02rem" />
@@ -1295,138 +1295,6 @@ fn normalize_settings_color(raw: &str) -> String {
     }
 }
 
-#[component]
-fn WorkspaceSettingsPane(
-    ui: HarnessUiService,
-    wb: WorkbenchService,
-    embed: BrowserEmbedSurface,
-) -> impl IntoView {
-    let i18n = expect_context::<I18nService>();
-    view! {
-        <article class="harness-pane">
-            <h3 class="harness-pane-title">
-                <span class="harness-pane-title__icon" aria-hidden="true">
-                    <LxIcon icon=icondata::LuFolderOpen width="1.02rem" height="1.02rem" />
-                </span>
-                <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::WsHeading)()}</span>
-            </h3>
-            <label class="harness-stack">
-                <span class="harness-field-label">
-                    <span class="harness-field-label__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuFolderGit2 width="0.82rem" height="0.82rem" />
-                    </span>
-                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::WsDefaultProjectDirLabel)()}</span>
-                </span>
-                <input
-                    class="workbench-plain-input"
-                    type="text"
-                    placeholder=move || i18n.tr(I18nKey::WsDefaultProjectDirPlaceholder)()
-                    prop:value=move || wb.default_project_dir().get()
-                    on:input=move |ev| {
-                        if let Some(txt) = input_str(&ev) {
-                            wb.set_default_project_dir_text(txt);
-                        }
-                    }
-                />
-                <small class="harness-muted">
-                    {move || i18n.tr(I18nKey::WsDefaultProjectDirHint)()}
-                </small>
-            </label>
-            <div class="harness-row-gap">
-                <button
-                    type="button"
-                    class="workbench-mini-btn workbench-mini-btn--primary"
-                    on:click=move |_| {
-                        let trimmed = wb.default_project_dir().get_untracked().trim().to_owned();
-                        wb.persist_default_project_dir(trimmed);
-                    }
-                >
-                    <span class="harness-btn-inline">
-                        <LxIcon icon=icondata::LuSave width="0.78rem" height="0.78rem" />
-                        <span>{move || i18n.tr(I18nKey::BtnSave)()}</span>
-                    </span>
-                </button>
-            </div>
-            <label class="harness-stack">
-                <span class="harness-field-label">
-                    <span class="harness-field-label__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuFolderTree width="0.82rem" height="0.82rem" />
-                    </span>
-                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::WsRootLabel)()}</span>
-                </span>
-                <input
-                    class="workbench-plain-input"
-                    type="text"
-                    placeholder=move || i18n.tr(I18nKey::WsRootPlaceholder)()
-                    prop:value=move || wb.harness_workspace_root().get()
-                    on:input=move |ev| {
-                        if let Some(txt) = input_str(&ev) {
-                            wb.set_harness_workspace_root_text(txt);
-                        }
-                    }
-                />
-                <small class="harness-muted">
-                    {move || i18n.tr(I18nKey::WsRootHint)()}
-                </small>
-            </label>
-            <div class="harness-row-gap">
-                <button
-                    type="button"
-                    class="workbench-mini-btn workbench-mini-btn--primary"
-                    on:click=move |_| {
-                        let trimmed = wb.harness_workspace_root().get_untracked().trim().to_owned();
-                        wb.persist_harness_workspace_root(trimmed);
-                        let w = wb;
-                        let surf = embed;
-                        leptos::task::spawn_local(async move {
-                            TimeoutFuture::new(8).await;
-                            sync_embedded_browser_layer(w, surf).await;
-                        });
-                    }
-                >
-                    <span class="harness-btn-inline">
-                        <LxIcon icon=icondata::LuSave width="0.78rem" height="0.78rem" />
-                        <span>{move || i18n.tr(I18nKey::BtnSave)()}</span>
-                    </span>
-                </button>
-            </div>
-            <label class="harness-stack">
-                <span class="harness-field-label">
-                    <span class="harness-field-label__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuGlobe width="0.82rem" height="0.82rem" />
-                    </span>
-                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::LayBrowserUrl)()}</span>
-                </span>
-                <input
-                    class="workbench-plain-input"
-                    type="url"
-                    prop:value=move || wb.browser_url().get()
-                    on:input=move |ev| {
-                        if let Some(txt) = input_str(&ev) {
-                            wb.set_browser_url_text(txt);
-                        }
-                    }
-                />
-            </label>
-            <div class="harness-row-gap">
-                <button
-                    type="button"
-                    class="workbench-mini-btn workbench-mini-btn--primary"
-                    on:click=move |_| persist_browser_defaults(wb, ui, embed)
-                >
-                    <span class="harness-btn-inline">
-                        <LxIcon icon=icondata::LuCheck width="0.78rem" height="0.78rem" />
-                        <span>{move || i18n.tr(I18nKey::BtnApply)()}</span>
-                    </span>
-                </button>
-                <small class="harness-muted">
-                    {move || format!("{} {}", i18n.tr(I18nKey::WsBrowserDefault)(), HARNESS_BROWSER_DEFAULT_URL)}
-                </small>
-            </div>
-        </article>
-    }
-}
-
 fn provider_label(i18n: &I18nService, provider: AgentProviderKind) -> String {
     let key = match provider {
         AgentProviderKind::Openrouter => I18nKey::AgProviderOpenrouter,
@@ -2184,23 +2052,3 @@ fn AgentHooksPanel() -> impl IntoView {
         </section>
     }
 }
-
-fn persist_browser_defaults(
-    wb: WorkbenchService,
-    ui: HarnessUiService,
-    embed: BrowserEmbedSurface,
-) {
-    let mut trimmed = wb.browser_url().get_untracked().trim().to_owned();
-    if trimmed.is_empty() {
-        trimmed = HARNESS_BROWSER_DEFAULT_URL.into();
-    }
-    wb.persist_browser_url_from_input(trimmed.clone());
-    let wclone = wb;
-    let aid = wb.embedded_browser_active_id().get_untracked();
-    leptos::task::spawn_local(async move {
-        let _ = crate::tauri_bridge::browser_navigate(aid, trimmed.as_str()).await;
-        TimeoutFuture::new(12).await;
-        sync_embedded_browser_layer(wclone, embed).await;
-    });
-    ui.close_settings();
-}
diff --git a/src/workbench/mod.rs b/src/workbench/mod.rs
index 36e2b64..b601d25 100644
--- a/src/workbench/mod.rs
+++ b/src/workbench/mod.rs
@@ -4,6 +4,7 @@ mod agent_context_handoff;
 mod agent_panel;
 mod agent_timeline;
 mod api_keys_pane;
+mod workspace_settings_pane;
 mod app_prefs;
 mod browser_tab;
 mod chat_markdown;
@@ -35,6 +36,7 @@ mod workspace_panel;
 
 pub use agent_panel::AgentPanelDock;
 pub use api_keys_pane::ApiKeysPane;
+pub use workspace_settings_pane::WorkspaceSettingsPane;
 pub use browser_tab::{BrowserTabDock, EmbeddedBrowserGlue};
 pub use memory_panel::MemoryPanel;
 pub use plans_panel::PlansPanel;
diff --git a/src/workbench/workspace_settings_pane/mod.rs b/src/workbench/workspace_settings_pane/mod.rs
new file mode 100644
index 0000000..4fe96cc
--- /dev/null
+++ b/src/workbench/workspace_settings_pane/mod.rs
@@ -0,0 +1,248 @@
+//! Workspace settings pane — same harness layout as App / API Keys.
+
+use super::browser_tab::sync_embedded_browser_layer;
+use super::state::{BrowserEmbedSurface, WorkbenchService};
+use crate::config::HARNESS_BROWSER_DEFAULT_URL;
+use crate::i18n::I18nKey;
+use crate::service::I18nService;
+use gloo_timers::future::TimeoutFuture;
+use leptos::prelude::*;
+use leptos_icons::Icon as LxIcon;
+use wasm_bindgen::JsCast;
+
+#[derive(Clone, PartialEq, Eq)]
+struct WorkspaceBaseline {
+    project_dir: String,
+    sandbox_root: String,
+    browser_url: String,
+}
+
+fn input_str(ev: &web_sys::Event) -> Option<String> {
+    ev.target()?
+        .dyn_into::<web_sys::HtmlInputElement>()
+        .ok()
+        .map(|i| i.value())
+}
+
+fn snapshot_baseline(wb: &WorkbenchService) -> WorkspaceBaseline {
+    WorkspaceBaseline {
+        project_dir: wb.default_project_dir().get_untracked(),
+        sandbox_root: wb.harness_workspace_root().get_untracked(),
+        browser_url: wb.browser_url().get_untracked(),
+    }
+}
+
+fn apply_browser_url(wb: WorkbenchService, embed: BrowserEmbedSurface, url: String) {
+    let mut trimmed = url.trim().to_owned();
+    if trimmed.is_empty() {
+        trimmed = HARNESS_BROWSER_DEFAULT_URL.into();
+    }
+    wb.persist_browser_url_from_input(trimmed.clone());
+    let aid = wb.embedded_browser_active_id().get_untracked();
+    leptos::task::spawn_local(async move {
+        let _ = crate::tauri_bridge::browser_navigate(aid, trimmed.as_str()).await;
+        TimeoutFuture::new(12).await;
+        sync_embedded_browser_layer(wb, embed).await;
+    });
+}
+
+#[component]
+pub fn WorkspaceSettingsPane(
+    wb: WorkbenchService,
+    embed: BrowserEmbedSurface,
+) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let baseline = RwSignal::new(snapshot_baseline(&wb));
+    let status_msg = RwSignal::new(None::<String>);
+    let busy = RwSignal::new(false);
+
+    let dirty = Memo::new(move |_| {
+        let b = baseline.get();
+        wb.default_project_dir().get() != b.project_dir
+            || wb.harness_workspace_root().get() != b.sandbox_root
+            || wb.browser_url().get() != b.browser_url
+    });
+
+    let save = move || {
+        if !dirty.get_untracked() {
+            return;
+        }
+        busy.set(true);
+        status_msg.set(None);
+        let b = baseline.get_untracked();
+        let project = wb.default_project_dir().get_untracked().trim().to_owned();
+        let sandbox = wb.harness_workspace_root().get_untracked().trim().to_owned();
+        let browser = wb.browser_url().get_untracked();
+
+        if project != b.project_dir {
+            wb.persist_default_project_dir(project);
+        }
+        if sandbox != b.sandbox_root {
+            wb.persist_harness_workspace_root(sandbox);
+        }
+        if browser != b.browser_url {
+            apply_browser_url(wb, embed, browser);
+        } else if sandbox != b.sandbox_root {
+            let w = wb;
+            leptos::task::spawn_local(async move {
+                TimeoutFuture::new(8).await;
+                sync_embedded_browser_layer(w, embed).await;
+            });
+        }
+
+        baseline.set(snapshot_baseline(&wb));
+        status_msg.set(Some(i18n.tr(I18nKey::ApiKeysSaved)().to_string()));
+        busy.set(false);
+    };
+
+    let discard = move || {
+        let b = baseline.get_untracked();
+        wb.set_default_project_dir_text(b.project_dir);
+        wb.set_harness_workspace_root_text(b.sandbox_root);
+        wb.set_browser_url_text(b.browser_url);
+        status_msg.set(None);
+    };
+
+    view! {
+        <article class="harness-pane workspace-settings-pane">
+            <h3 class="harness-pane-title">
+                <span class="harness-pane-title__icon" aria-hidden="true">
+                    <LxIcon icon=icondata::LuFolderOpen width="1.02rem" height="1.02rem" />
+                </span>
+                <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::WsHeading)()}</span>
+            </h3>
+
+            <section class="harness-subpane">
+                <h4 class="harness-pane-subhead">
+                    <span class="harness-pane-subhead__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuFolderTree width="0.82rem" height="0.82rem" />
+                    </span>
+                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::WsSectionPaths)()}</span>
+                </h4>
+                <div class="settings-field-list">
+                    <div class="settings-field-card">
+                        <label class="harness-stack">
+                            <span class="harness-field-label">
+                                <span class="harness-field-label__icon" aria-hidden="true">
+                                    <LxIcon icon=icondata::LuFolderGit2 width="0.82rem" height="0.82rem" />
+                                </span>
+                                <span class="harness-field-label__text">
+                                    {move || i18n.tr(I18nKey::WsDefaultProjectDirLabel)()}
+                                </span>
+                            </span>
+                            <input
+                                class="workbench-plain-input settings-field-card__input"
+                                type="text"
+                                placeholder=move || i18n.tr(I18nKey::WsDefaultProjectDirPlaceholder)()
+                                prop:value=move || wb.default_project_dir().get()
+                                on:input=move |ev| {
+                                    if let Some(txt) = input_str(&ev) {
+                                        wb.set_default_project_dir_text(txt);
+                                    }
+                                }
+                            />
+                            <small class="harness-muted">
+                                {move || i18n.tr(I18nKey::WsDefaultProjectDirHint)()}
+                            </small>
+                        </label>
+                    </div>
+                    <div class="settings-field-card">
+                        <label class="harness-stack">
+                            <span class="harness-field-label">
+                                <span class="harness-field-label__icon" aria-hidden="true">
+                                    <LxIcon icon=icondata::LuShield width="0.82rem" height="0.82rem" />
+                                </span>
+                                <span class="harness-field-label__text">
+                                    {move || i18n.tr(I18nKey::WsRootLabel)()}
+                                </span>
+                            </span>
+                            <input
+                                class="workbench-plain-input settings-field-card__input"
+                                type="text"
+                                placeholder=move || i18n.tr(I18nKey::WsRootPlaceholder)()
+                                prop:value=move || wb.harness_workspace_root().get()
+                                on:input=move |ev| {
+                                    if let Some(txt) = input_str(&ev) {
+                                        wb.set_harness_workspace_root_text(txt);
+                                    }
+                                }
+                            />
+                            <small class="harness-muted">{move || i18n.tr(I18nKey::WsRootHint)()}</small>
+                        </label>
+                    </div>
+                </div>
+            </section>
+
+            <section class="harness-subpane">
+                <h4 class="harness-pane-subhead">
+                    <span class="harness-pane-subhead__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuGlobe width="0.82rem" height="0.82rem" />
+                    </span>
+                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::WsSectionBrowser)()}</span>
+                </h4>
+                <div class="settings-field-list">
+                    <div class="settings-field-card">
+                        <label class="harness-stack">
+                            <span class="harness-field-label">
+                                <span class="harness-field-label__text">
+                                    {move || i18n.tr(I18nKey::LayBrowserUrl)()}
+                                </span>
+                            </span>
+                            <input
+                                class="workbench-plain-input settings-field-card__input"
+                                type="url"
+                                prop:value=move || wb.browser_url().get()
+                                on:input=move |ev| {
+                                    if let Some(txt) = input_str(&ev) {
+                                        wb.set_browser_url_text(txt);
+                                    }
+                                }
+                            />
+                            <small class="harness-muted">
+                                {move || format!(
+                                    "{} {}",
+                                    i18n.tr(I18nKey::WsBrowserDefault)(),
+                                    HARNESS_BROWSER_DEFAULT_URL
+                                )}
+                            </small>
+                        </label>
+                    </div>
+                </div>
+            </section>
+
+            <Show when=move || status_msg.with(|m| m.is_some())>
+                <p class="harness-status">{move || status_msg.get().unwrap_or_default()}</p>
+            </Show>
+
+            <footer class="settings-pane-footer harness-row-gap">
+                <button
+                    type="button"
+                    class="workbench-mini-btn workbench-mini-btn--primary"
+                    prop:disabled=move || busy.get() || !dirty.get()
+                    on:click=move |_| save()
+                >
+                    <span class="harness-btn-inline">
+                        <LxIcon icon=icondata::LuSave width="0.78rem" height="0.78rem" />
+                        <span>{move || i18n.tr(I18nKey::BtnSave)()}</span>
+                    </span>
+                </button>
+                <button
+                    type="button"
+                    class="workbench-mini-btn"
+                    prop:disabled=move || busy.get() || !dirty.get()
+                    on:click=move |_| discard()
+                >
+                    <span class="harness-btn-inline">
+                        <LxIcon icon=icondata::LuUndo2 width="0.78rem" height="0.78rem" />
+                        <span>{move || i18n.tr(I18nKey::ApiKeysDiscard)()}</span>
+                    </span>
+                </button>
+                <Show when=move || dirty.get()>
+                    <span class="settings-pane-dirty harness-muted">
+                        {move || i18n.tr(I18nKey::ApiKeysUnsaved)()}
+                    </span>
+                </Show>
+            </footer>
+        </article>
+    }
+}
diff --git a/src/workbench/workspace_settings_pane/workspace_settings_pane.css b/src/workbench/workspace_settings_pane/workspace_settings_pane.css
new file mode 100644
index 0000000..00efb00
--- /dev/null
+++ b/src/workbench/workspace_settings_pane/workspace_settings_pane.css
@@ -0,0 +1,38 @@
+/* Workspace settings — shared field cards with API Keys pane. */
+
+.workspace-settings-pane .settings-field-list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 0.6rem;
+}
+
+.settings-field-card {
+  display: flex;
+  flex-direction: column;
+  gap: 0.35rem;
+  padding: 0.55rem 0.65rem;
+  border-radius: 6px;
+  background: rgba(255, 255, 255, 0.03);
+  border: 1px solid rgba(255, 255, 255, 0.06);
+}
+
+.settings-field-card__input {
+  font-family: var(--font-mono, ui-monospace, SFMono-Regular, monospace);
+  font-size: 0.82rem;
+}
+
+.settings-pane-footer {
+  margin-top: 0.85rem;
+  display: flex;
+  gap: 0.5rem;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.settings-pane-dirty {
+  margin-left: 0.35rem;
+  font-size: 0.75rem;
+}

From fa0fc3490d2d76d80a1cacb464970f5127d59bbf Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 04:15:52 +0200
Subject: [PATCH 14/48] feat(workspace): align workspace settings layout with
 API Keys pane

- Restructured the Workspace settings layout to mirror the API Keys pane, enhancing consistency in UI design.
- Implemented a shared footer for Save/Discard actions and updated localization keys for the new layout.
- Improved the organization of workspace settings, including project directory and sandbox root configurations.
---
 CHANGELOG.md                                 | 2 ++
 src/workbench/harness_ui.rs                  | 1 -
 src/workbench/workspace_settings_pane/mod.rs | 5 +++--
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8227fc6..34f7da5 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,11 +15,13 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - **GitHub Releases auto-updater**: BLXCode now wires Tauri v2's updater/process plugins with a signed GitHub Releases `latest.json` endpoint, desktop IPC for `app_version`, `updater_check`, `updater_install_start`, progress polling, and relaunch, plus a Leptos startup banner and themed update dialog with release notes, progress, speed, retry, and restart states. Settings -> App gains a persisted startup auto-check toggle and manual update check. Release automation now supports the hybrid flow: macOS/Windows artifacts are built in GitHub Actions, Linux artifacts can be built locally to save CI cost, `.deb`/`.rpm` stay manual download assets, and signed updater-capable payloads are merged into one canonical `latest.json`. Tauri updater signing is documented as separate from Apple/Microsoft installer certificates.
 - **Boot loading screen**: new branded loading experience that paints before the WASM bundle is ready and stays on screen until the workbench is mounted. `index.html` ships a static `#blx-static-boot` section (logo, eyebrow, faux workbench preview, animated rail) so the first paint happens immediately on Trunk-served HTML; once Leptos mounts, the static node is removed and `BootLoadingScreen` (`src/boot_loading.rs`) takes over with phased copy (`Starting BLXCode` → `Restoring workspace` → `Opening workbench`). 306 lines of dedicated CSS in `styles.css` add the radial-gradient backdrop, frame-enter / sheen / rail keyframes, and the sidebar/main/panel preview skeleton. The `App` boot fallback now renders `<BootLoadingScreen phase=app_boot_phase.get()/>` instead of the prior empty `app-shell--boot` div.
 - **Agent question card (`harness.ask_user`)**: new client-side tool that lets the coordinator agent ask a clarifying multiple-choice question and receive the user's answer as a structured tool result. Backend registers `harness.ask_user` (`src-tauri/src/agent/tools.rs`) with a JSON schema accepting `question`, optional `header` (≤12 chars), 2–4 `options` (label + optional description), `multiSelect`, and `allowOther`; the tool sits in the `CoordinatorHarness` group (subagents excluded) and the system prompt instructs the model to use it only when 2–4 distinct options would unblock progress. Frontend adds a new `TimelineItem::AskUser` variant and `ask_user_card/` component (Angular-style folder with co-located CSS) rendering a chat bubble with numbered option buttons, single- or multi-select mode, an optional free-text “Other” field, and a cancel button; the card submits via `agent_submit_tool_result` and transitions the row state to `Answered { selected, other }` or `Cancelled` so the bubble stays visible with disabled controls. Persistence drops `Open` ask-user rows from the saved timeline (the awaiting backend loop is dead after reload). Tool-result payload: `{ "selected": [...], "other": "...", "cancelled": false }`; on cancel: `ok=false` + `{ "cancelled": true }`. 8 new i18n keys (`AgAskUser*`) added in `en_us.rs` and `de_de.rs`; other locales receive English placeholders pending a `render_i18n_locales_from_en.py` pass.
+- **Centralized API Keys settings**: new **Settings → API Keys** pane (`src/workbench/api_keys_pane/`) replaces per-provider key inputs that previously lived under Settings → Agent. Backend module `src-tauri/src/api_keys.rs` exposes `api_keys_status` (catalog of LLM + search providers with masked values, env-var hints, and `comingSoon` placeholders for Google / Mistral / Groq) and `api_keys_apply` (batch `set` / `delete` actions). Active keys still use the existing OS keyring accounts (`agent:*`, `agent:web:*`) with optional `BLX_*` env fallback; resolve order is keyring-first so UI-saved secrets are not overridden by shell env. The pane uses draft state, a single **Save** / **Discard** footer, row-level remove/undo, and shared `settings-field-card` styling. Agent → Provider and Web Tools now show relocation hints (`ApiKeysManageHint` / `ApiKeysManageHintWeb`) instead of password fields. 15 new `ApiKeys*` i18n keys in all 13 locales.
 - **Per-turn chat metrics & session cost**: tokens, TTFT, decode speed and resolved USD cost are now reported per conversation row instead of as a single aggregated footer. Each provider round emits `TurnUsage { kind: ModelRound, .. }` and each tool dispatch emits `TurnUsage { kind: ToolExec, call_id, .. }`, in both the main agent (`openrouter.rs`, `anthropic.rs`) and `subagent_runner.rs`. OpenRouter requests opt into `usage: { include: true }` and parse the native `usage.cost` field; everything else (including Anthropic Direct) is priced locally via a new `agent/pricing.rs` module — `ProviderModelEntry` carries `Option<ModelPricing>` populated from OpenRouter `/v1/models`, and direct-provider model ids route through a static id-mapping table (`claude-opus-4-7` → `anthropic/claude-opus-4.7`, etc.). A monotonic `turn_generation` counter on `AgentEngineState`, bumped by `agent_clear_conversation`, lets the frontend drop late events from a cancelled turn instead of polluting the fresh chat. New `workbench/agent_panel/turn_metrics_bar/` component renders the per-row `in · out · tok/s · ttft · $cost` strip under Assistant, Tool, the new synthetic `ModelDecision` row (tool-only rounds), and per-tool inside subagent cards. Subagent cards show aggregated round metrics in the header. The chat header gains a `SessionCostChip` with the resolved USD total + turn count, replacing the retired `ChatUsageFooter`. `ToolGroup` bundling is gone — each tool is its own timeline row now. 14 new `I18nKey` variants (`AgMetricsIn/Out/Ttft/CostUnknown/TurnsOne/TurnsMany/Tooltip*`, `AgMetricsBarAria`, `AgMetricsModelRound`, `AgSessionCostAria`) added in all 12 locale files. Pricing module ships with 7 unit tests.
 
 ### Changed
 
 - **`ChatUsageStats` schema migrated**: `total_cost_usd: f64` and `current_turn_generation: u64` added; legacy `ttft_sum_ms` / `ttft_sample_count` fields removed (TTFT now lives per-row). Older `workbench.json` snapshots deserialize cleanly thanks to `#[serde(default)]` and rewrite without the removed fields on next save. `record_chat_turn_usage` signature changed to accept the new `turn_generation` and `cost_usd` and to return `bool` so callers can drop stale events.
+- **Workspace settings layout aligned with API Keys**: the Workspace pane moved into `src/workbench/workspace_settings_pane/` and now mirrors the App / API Keys harness pattern — `harness-subpane` sections (**Paths & sandbox**, **Embedded browser**), `settings-field-card` rows with monospace path inputs, and one footer **Save** / **Discard** that persists default project directory, agent sandbox root, and embedded-browser URL together (replacing three inline Save/Apply buttons). New i18n keys `WsSectionPaths` and `WsSectionBrowser` in all locales. Shared footer/field CSS lives in `workspace_settings_pane.css` and is reused by the API Keys pane (`settings-pane-footer`, `settings-pane-dirty`).
 - **Settings panel restructured**: `AppSettingsPane` (`src/workbench/harness_ui.rs`) now reads top-to-bottom as Language → Keyboard shortcuts → Notifications → **Terminal hooks** → **App updates** (updates moved below hooks to put install actions closer to the per-agent hook list). Keyboard shortcuts and Notifications switched from single-column lists to 2-column grids (new `.app-prefs-shortcut-modes--grid` and `.app-prefs-toggle-grid`). Current version no longer renders inside a readonly `<input>` — it's now a styled `<dl>` row, and a sibling **Available version** row only appears when `UpdateService::available_version` is `Some`. Terminal hooks list (`.harness-hooks__list--grid`) lays out as 3 columns on wide screens, collapsing to 2 / 1 below 900 px / 600 px; status badges dropped from pill (`border-radius: 999px`) to sm (`4px`) rounding. The EULA status row was removed from the App pane (acceptance is still gated at boot; the field added no actionable signal here). Workspace pane changed the agent sandbox `<textarea>` to a single-line `<input>` and gained a new **Default project directory** field above it: persisted to `blxcode_default_project_dir_v1` via new `WorkbenchService::default_project_dir` signal + setters/persist, seeded from the user's home directory through a new `harness_user_home_dir` Tauri command (`src-tauri/src/commands.rs`) on first run. Inline workspace configuration (`start_inline_configure` and snapshot hydration) now prefills new workspace `cwd` from `default_project_dir`, falling back to the agent sandbox root only when blank — sandbox path is reserved for BLXCode Agent sandbox actions. New i18n keys `AppUpdateAvailableVersion`, `WsRootHint`, `WsDefaultProjectDirLabel/Placeholder/Hint` added across all 13 locale files (English authored; other locales carry English placeholders until `scripts/tools/render_i18n_locales_from_en.py` runs).
 
 ### Fixed
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index e67c324..16ad78b 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -10,7 +10,6 @@ use super::state::{
     MemoryColorPreset, RecentWorkspaceItem, RightPanelTab, WorkbenchService,
 };
 use super::update_service::{UpdateService, UpdateUiStatus};
-use crate::config::HARNESS_BROWSER_DEFAULT_URL;
 use crate::i18n::{lookup, I18nKey, Locale, APP_LOCALES};
 use crate::service::I18nService;
 use crate::tauri_bridge::{
diff --git a/src/workbench/workspace_settings_pane/mod.rs b/src/workbench/workspace_settings_pane/mod.rs
index 4fe96cc..820ec6c 100644
--- a/src/workbench/workspace_settings_pane/mod.rs
+++ b/src/workbench/workspace_settings_pane/mod.rs
@@ -77,12 +77,13 @@ pub fn WorkspaceSettingsPane(
         if project != b.project_dir {
             wb.persist_default_project_dir(project);
         }
-        if sandbox != b.sandbox_root {
+        let sandbox_changed = sandbox != b.sandbox_root;
+        if sandbox_changed {
             wb.persist_harness_workspace_root(sandbox);
         }
         if browser != b.browser_url {
             apply_browser_url(wb, embed, browser);
-        } else if sandbox != b.sandbox_root {
+        } else if sandbox_changed {
             let w = wb;
             leptos::task::spawn_local(async move {
                 TimeoutFuture::new(8).await;

From 1b28bfbbd0ec1a4becb68e1423fa3c171c9c2f39 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 04:26:12 +0200
Subject: [PATCH 15/48] style(workspace): update CSS for workspace and API Keys
 panes

- Enhanced layout consistency between the Workspace settings and API Keys panes by adjusting spacing and padding.
- Improved visual hierarchy with updated margins and gaps for better user experience.
- Removed redundant CSS rules to streamline styles across both panes.
---
 src/workbench/api_keys_pane/api_keys_pane.css |  4 --
 .../workspace_settings_pane.css               | 46 ++++++++++++++-----
 2 files changed, 35 insertions(+), 15 deletions(-)

diff --git a/src/workbench/api_keys_pane/api_keys_pane.css b/src/workbench/api_keys_pane/api_keys_pane.css
index 87d19d3..365c5b0 100644
--- a/src/workbench/api_keys_pane/api_keys_pane.css
+++ b/src/workbench/api_keys_pane/api_keys_pane.css
@@ -7,7 +7,6 @@
     padding: 0;
     display: flex;
     flex-direction: column;
-    gap: 0.6rem;
 }
 
 /* Card chrome: .settings-field-card in workspace_settings_pane.css */
@@ -76,6 +75,3 @@
 
 /* Footer/dirty: see workspace_settings_pane.css (.settings-pane-footer). */
 
-.api-keys-pane .settings-pane-footer {
-    margin-top: 0.85rem;
-}
diff --git a/src/workbench/workspace_settings_pane/workspace_settings_pane.css b/src/workbench/workspace_settings_pane/workspace_settings_pane.css
index 00efb00..32923a2 100644
--- a/src/workbench/workspace_settings_pane/workspace_settings_pane.css
+++ b/src/workbench/workspace_settings_pane/workspace_settings_pane.css
@@ -1,31 +1,55 @@
-/* Workspace settings — shared field cards with API Keys pane. */
+/* Workspace + API Keys settings — shared field cards and vertical rhythm. */
 
-.workspace-settings-pane .settings-field-list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 0.6rem;
+.workspace-settings-pane.harness-pane,
+.api-keys-pane.harness-pane {
+  gap: 1.5rem;
+}
+
+.workspace-settings-pane .harness-subpane,
+.api-keys-pane .harness-subpane {
+  gap: 1rem;
+  padding: 1.2rem 1.15rem;
+}
+
+.workspace-settings-pane .harness-pane-subhead,
+.api-keys-pane .harness-pane-subhead {
+  margin: 0 0 0.85rem;
+}
+
+.workspace-settings-pane .settings-field-list,
+.api-keys-pane .api-keys-list {
+  gap: 0.9rem;
 }
 
 .settings-field-card {
   display: flex;
   flex-direction: column;
-  gap: 0.35rem;
-  padding: 0.55rem 0.65rem;
+  gap: 0.55rem;
+  padding: 0.85rem 0.9rem;
   border-radius: 6px;
   background: rgba(255, 255, 255, 0.03);
   border: 1px solid rgba(255, 255, 255, 0.06);
 }
 
+.workspace-settings-pane .settings-field-card .harness-stack,
+.api-keys-pane .api-keys-row .harness-stack {
+  gap: 0.6rem;
+}
+
+.workspace-settings-pane .settings-field-card .harness-muted,
+.api-keys-pane .api-keys-row .harness-muted {
+  margin-top: 0.1rem;
+  line-height: 1.45;
+}
+
 .settings-field-card__input {
   font-family: var(--font-mono, ui-monospace, SFMono-Regular, monospace);
   font-size: 0.82rem;
 }
 
 .settings-pane-footer {
-  margin-top: 0.85rem;
+  margin-top: 1.1rem;
+  padding-top: 0.25rem;
   display: flex;
   gap: 0.5rem;
   align-items: center;

From b27e6ba1552b8aecd50d66bde2aeb5d2ed4bfe3b Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 04:28:22 +0200
Subject: [PATCH 16/48] style(workspace): unify API Keys and Workspace settings
 layout

- Updated CSS for the Workspace settings pane to reuse styles from the API Keys pane, enhancing visual consistency.
- Refactored HTML structure to align with the API Keys layout, improving the user interface and experience.
- Removed redundant CSS rules to streamline styling across both panes.
---
 src/workbench/api_keys_pane/api_keys_pane.css |  13 +-
 src/workbench/workspace_settings_pane/mod.rs  | 125 +++++++++---------
 .../workspace_settings_pane.css               |  49 +------
 3 files changed, 74 insertions(+), 113 deletions(-)

diff --git a/src/workbench/api_keys_pane/api_keys_pane.css b/src/workbench/api_keys_pane/api_keys_pane.css
index 365c5b0..f092c6f 100644
--- a/src/workbench/api_keys_pane/api_keys_pane.css
+++ b/src/workbench/api_keys_pane/api_keys_pane.css
@@ -1,15 +1,24 @@
 /* Centralized API keys pane (Settings → API Keys). Layout only —
    global tokens live in the project-wide styles. */
 
-.api-keys-pane .api-keys-list {
+.api-keys-list {
     list-style: none;
     margin: 0;
     padding: 0;
     display: flex;
     flex-direction: column;
+    gap: 0.6rem;
 }
 
-/* Card chrome: .settings-field-card in workspace_settings_pane.css */
+.settings-field-card {
+    display: flex;
+    flex-direction: column;
+    gap: 0.35rem;
+    padding: 0.55rem 0.65rem;
+    border-radius: 6px;
+    background: rgba(255, 255, 255, 0.03);
+    border: 1px solid rgba(255, 255, 255, 0.06);
+}
 
 .api-keys-row--coming-soon {
     opacity: 0.55;
diff --git a/src/workbench/workspace_settings_pane/mod.rs b/src/workbench/workspace_settings_pane/mod.rs
index 820ec6c..9f154dc 100644
--- a/src/workbench/workspace_settings_pane/mod.rs
+++ b/src/workbench/workspace_settings_pane/mod.rs
@@ -1,4 +1,4 @@
-//! Workspace settings pane — same harness layout as App / API Keys.
+//! Workspace settings pane — same row/list layout as API Keys (`api-keys-row`).
 
 use super::browser_tab::sync_embedded_browser_layer;
 use super::state::{BrowserEmbedSurface, WorkbenchService};
@@ -104,6 +104,22 @@ pub fn WorkspaceSettingsPane(
         status_msg.set(None);
     };
 
+    let on_project_input = move |ev: web_sys::Event| {
+        if let Some(txt) = input_str(&ev) {
+            wb.set_default_project_dir_text(txt);
+        }
+    };
+    let on_sandbox_input = move |ev: web_sys::Event| {
+        if let Some(txt) = input_str(&ev) {
+            wb.set_harness_workspace_root_text(txt);
+        }
+    };
+    let on_browser_input = move |ev: web_sys::Event| {
+        if let Some(txt) = input_str(&ev) {
+            wb.set_browser_url_text(txt);
+        }
+    };
+
     view! {
         <article class="harness-pane workspace-settings-pane">
             <h3 class="harness-pane-title">
@@ -120,95 +136,74 @@ pub fn WorkspaceSettingsPane(
                     </span>
                     <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::WsSectionPaths)()}</span>
                 </h4>
-                <div class="settings-field-list">
-                    <div class="settings-field-card">
-                        <label class="harness-stack">
-                            <span class="harness-field-label">
-                                <span class="harness-field-label__icon" aria-hidden="true">
-                                    <LxIcon icon=icondata::LuFolderGit2 width="0.82rem" height="0.82rem" />
-                                </span>
-                                <span class="harness-field-label__text">
-                                    {move || i18n.tr(I18nKey::WsDefaultProjectDirLabel)()}
-                                </span>
-                            </span>
+                <ul class="api-keys-list">
+                    <li class="settings-field-card api-keys-row">
+                        <div class="api-keys-row__head">
+                            <span class="api-keys-row__label">{move || i18n.tr(I18nKey::WsDefaultProjectDirLabel)()}</span>
+                        </div>
+                        <div class="api-keys-row__body harness-row-gap">
                             <input
-                                class="workbench-plain-input settings-field-card__input"
+                                class="workbench-plain-input api-keys-row__input workspace-field-row__input"
                                 type="text"
                                 placeholder=move || i18n.tr(I18nKey::WsDefaultProjectDirPlaceholder)()
                                 prop:value=move || wb.default_project_dir().get()
-                                on:input=move |ev| {
-                                    if let Some(txt) = input_str(&ev) {
-                                        wb.set_default_project_dir_text(txt);
-                                    }
-                                }
+                                on:input=on_project_input
                             />
-                            <small class="harness-muted">
-                                {move || i18n.tr(I18nKey::WsDefaultProjectDirHint)()}
-                            </small>
-                        </label>
-                    </div>
-                    <div class="settings-field-card">
-                        <label class="harness-stack">
-                            <span class="harness-field-label">
-                                <span class="harness-field-label__icon" aria-hidden="true">
-                                    <LxIcon icon=icondata::LuShield width="0.82rem" height="0.82rem" />
-                                </span>
-                                <span class="harness-field-label__text">
-                                    {move || i18n.tr(I18nKey::WsRootLabel)()}
-                                </span>
-                            </span>
+                            <span></span>
+                        </div>
+                        <p class="harness-muted api-keys-row__hint">{move || i18n.tr(I18nKey::WsDefaultProjectDirHint)()}</p>
+                    </li>
+                    <li class="settings-field-card api-keys-row">
+                        <div class="api-keys-row__head">
+                            <span class="api-keys-row__label">{move || i18n.tr(I18nKey::WsRootLabel)()}</span>
+                        </div>
+                        <div class="api-keys-row__body harness-row-gap">
                             <input
-                                class="workbench-plain-input settings-field-card__input"
+                                class="workbench-plain-input api-keys-row__input workspace-field-row__input"
                                 type="text"
                                 placeholder=move || i18n.tr(I18nKey::WsRootPlaceholder)()
                                 prop:value=move || wb.harness_workspace_root().get()
-                                on:input=move |ev| {
-                                    if let Some(txt) = input_str(&ev) {
-                                        wb.set_harness_workspace_root_text(txt);
-                                    }
-                                }
+                                on:input=on_sandbox_input
                             />
-                            <small class="harness-muted">{move || i18n.tr(I18nKey::WsRootHint)()}</small>
-                        </label>
-                    </div>
-                </div>
+                            <span></span>
+                        </div>
+                        <p class="harness-muted api-keys-row__hint">{move || i18n.tr(I18nKey::WsRootHint)()}</p>
+                    </li>
+                </ul>
             </section>
 
             <section class="harness-subpane">
                 <h4 class="harness-pane-subhead">
                     <span class="harness-pane-subhead__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuGlobe width="0.82rem" height="0.82rem" />
+                        <LxIcon icon=icondata::LuGlobe width="0.9rem" height="0.9rem" />
                     </span>
                     <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::WsSectionBrowser)()}</span>
                 </h4>
-                <div class="settings-field-list">
-                    <div class="settings-field-card">
-                        <label class="harness-stack">
-                            <span class="harness-field-label">
-                                <span class="harness-field-label__text">
-                                    {move || i18n.tr(I18nKey::LayBrowserUrl)()}
-                                </span>
-                            </span>
+                <ul class="api-keys-list">
+                    <li class="settings-field-card api-keys-row">
+                        <div class="api-keys-row__head">
+                            <span class="api-keys-row__label">{move || i18n.tr(I18nKey::LayBrowserUrl)()}</span>
+                        </div>
+                        <div class="api-keys-row__body harness-row-gap">
                             <input
-                                class="workbench-plain-input settings-field-card__input"
+                                class="workbench-plain-input api-keys-row__input"
                                 type="url"
                                 prop:value=move || wb.browser_url().get()
-                                on:input=move |ev| {
-                                    if let Some(txt) = input_str(&ev) {
-                                        wb.set_browser_url_text(txt);
-                                    }
-                                }
+                                on:input=on_browser_input
                             />
-                            <small class="harness-muted">
-                                {move || format!(
+                            <span></span>
+                        </div>
+                        <p class="harness-muted api-keys-row__hint">
+                            {move || {
+                                format!(
                                     "{} {}",
                                     i18n.tr(I18nKey::WsBrowserDefault)(),
                                     HARNESS_BROWSER_DEFAULT_URL
-                                )}
-                            </small>
-                        </label>
-                    </div>
-                </div>
+                                )
+                            }}
+                        </p>
+                    </li>
+                </ul>
             </section>
 
             <Show when=move || status_msg.with(|m| m.is_some())>
diff --git a/src/workbench/workspace_settings_pane/workspace_settings_pane.css b/src/workbench/workspace_settings_pane/workspace_settings_pane.css
index 32923a2..8a88689 100644
--- a/src/workbench/workspace_settings_pane/workspace_settings_pane.css
+++ b/src/workbench/workspace_settings_pane/workspace_settings_pane.css
@@ -1,55 +1,12 @@
-/* Workspace + API Keys settings — shared field cards and vertical rhythm. */
+/* Workspace settings — reuses API Keys list/row chrome from api_keys_pane.css */
 
-.workspace-settings-pane.harness-pane,
-.api-keys-pane.harness-pane {
-  gap: 1.5rem;
-}
-
-.workspace-settings-pane .harness-subpane,
-.api-keys-pane .harness-subpane {
-  gap: 1rem;
-  padding: 1.2rem 1.15rem;
-}
-
-.workspace-settings-pane .harness-pane-subhead,
-.api-keys-pane .harness-pane-subhead {
-  margin: 0 0 0.85rem;
-}
-
-.workspace-settings-pane .settings-field-list,
-.api-keys-pane .api-keys-list {
-  gap: 0.9rem;
-}
-
-.settings-field-card {
-  display: flex;
-  flex-direction: column;
-  gap: 0.55rem;
-  padding: 0.85rem 0.9rem;
-  border-radius: 6px;
-  background: rgba(255, 255, 255, 0.03);
-  border: 1px solid rgba(255, 255, 255, 0.06);
-}
-
-.workspace-settings-pane .settings-field-card .harness-stack,
-.api-keys-pane .api-keys-row .harness-stack {
-  gap: 0.6rem;
-}
-
-.workspace-settings-pane .settings-field-card .harness-muted,
-.api-keys-pane .api-keys-row .harness-muted {
-  margin-top: 0.1rem;
-  line-height: 1.45;
-}
-
-.settings-field-card__input {
+.workspace-field-row__input {
   font-family: var(--font-mono, ui-monospace, SFMono-Regular, monospace);
   font-size: 0.82rem;
 }
 
 .settings-pane-footer {
-  margin-top: 1.1rem;
-  padding-top: 0.25rem;
+  margin-top: 0.85rem;
   display: flex;
   gap: 0.5rem;
   align-items: center;

From 201c7edbbdefe2353b68a82b03d6de9503132955 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 04:31:31 +0200
Subject: [PATCH 17/48] style(api_keys_pane): add margin to API keys row for
 improved spacing

- Added a margin-bottom to the API keys row to enhance visual separation between elements.
- This change contributes to a more consistent layout in the API keys pane.
---
 src/workbench/api_keys_pane/api_keys_pane.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/workbench/api_keys_pane/api_keys_pane.css b/src/workbench/api_keys_pane/api_keys_pane.css
index f092c6f..66eb877 100644
--- a/src/workbench/api_keys_pane/api_keys_pane.css
+++ b/src/workbench/api_keys_pane/api_keys_pane.css
@@ -34,6 +34,7 @@
     align-items: center;
     gap: 0.5rem;
     justify-content: space-between;
+    margin-bottom: 0.3rem;
 }
 
 .api-keys-row__label {

From 959c9db7173dfef4c73327cac6d5a02b3c508006 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 04:35:34 +0200
Subject: [PATCH 18/48] style(api_keys_pane): enhance API keys row layout with
 brand icons

- Added CSS styles for brand icons in the API keys row to improve visual representation.
- Implemented functions to retrieve brand SVG paths and fallback icons based on API key type.
- Updated the API key row structure to include brand icons alongside labels, enhancing the user interface.
---
 src/workbench/api_keys_pane/api_keys_pane.css | 29 +++++++++++
 src/workbench/api_keys_pane/mod.rs            | 48 ++++++++++++++++++-
 2 files changed, 76 insertions(+), 1 deletion(-)

diff --git a/src/workbench/api_keys_pane/api_keys_pane.css b/src/workbench/api_keys_pane/api_keys_pane.css
index 66eb877..71bca41 100644
--- a/src/workbench/api_keys_pane/api_keys_pane.css
+++ b/src/workbench/api_keys_pane/api_keys_pane.css
@@ -37,6 +37,35 @@
     margin-bottom: 0.3rem;
 }
 
+.api-keys-row__title {
+    display: flex;
+    align-items: center;
+    gap: 0.42rem;
+    min-width: 0;
+}
+
+.api-keys-row__brand {
+    width: 1.15rem;
+    height: 1.15rem;
+    flex: 0 0 1.15rem;
+    display: grid;
+    place-items: center;
+    border-radius: 999px;
+    background: rgba(255, 255, 255, 0.92);
+    overflow: hidden;
+}
+
+.api-keys-row__brand--fallback {
+    background: rgba(255, 255, 255, 0.08);
+    color: var(--text-muted, rgba(255, 255, 255, 0.65));
+}
+
+.api-keys-row__brand-img {
+    width: 0.72rem;
+    height: 0.72rem;
+    display: block;
+}
+
 .api-keys-row__label {
     font-weight: 600;
     font-size: 0.9rem;
diff --git a/src/workbench/api_keys_pane/mod.rs b/src/workbench/api_keys_pane/mod.rs
index dd93865..58e9632 100644
--- a/src/workbench/api_keys_pane/mod.rs
+++ b/src/workbench/api_keys_pane/mod.rs
@@ -26,6 +26,27 @@ enum DraftAction {
 
 type DraftMap = BTreeMap<String, DraftAction>;
 
+/// Brand SVG paths — same assets as Agent Provider picker (`harness_ui.rs`).
+fn api_key_brand_icon_url(kind: &str) -> Option<&'static str> {
+    match kind {
+        "openrouter" => Some("/public/brand-icons/openrouter.svg"),
+        "anthropic" => Some("/public/brand-icons/anthropic.svg"),
+        "openai" => Some("/public/brand-icons/openai.svg"),
+        "google" => Some("/public/brand-icons/gemini.svg"),
+        _ => None,
+    }
+}
+
+fn api_key_icon_fallback(kind: &str) -> icondata::Icon {
+    match kind {
+        "mistral" => icondata::LuSparkles,
+        "groq" => icondata::LuZap,
+        "tavily" => icondata::LuSearch,
+        "brave" => icondata::LuShield,
+        _ => icondata::LuKeyRound,
+    }
+}
+
 fn input_str(ev: &web_sys::Event) -> Option<String> {
     ev.target()?
         .dyn_into::<web_sys::HtmlInputElement>()
@@ -278,6 +299,7 @@ fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
         });
     };
 
+    let kind_for_icon = kind.clone();
     let kind_for_remove = kind.clone();
     let on_remove = move |_| {
         let k = kind_for_remove.to_string();
@@ -293,7 +315,31 @@ fn ApiKeyRow(entry: ApiKeyEntry, drafts: RwSignal<DraftMap>) -> impl IntoView {
             class:api-keys-row--marked-delete=move || marked_delete.get()
         >
             <div class="api-keys-row__head">
-                <span class="api-keys-row__label">{move || label.get_value()}</span>
+                <span class="api-keys-row__title">
+                    {move || {
+                        let k = kind_for_icon.as_ref();
+                        if let Some(url) = api_key_brand_icon_url(k) {
+                            view! {
+                                <span class="api-keys-row__brand" aria-hidden="true">
+                                    <img class="api-keys-row__brand-img" src=url alt="" />
+                                </span>
+                            }
+                            .into_any()
+                        } else {
+                            view! {
+                                <span class="api-keys-row__brand api-keys-row__brand--fallback" aria-hidden="true">
+                                    <LxIcon
+                                        icon=api_key_icon_fallback(k)
+                                        width="0.72rem"
+                                        height="0.72rem"
+                                    />
+                                </span>
+                            }
+                            .into_any()
+                        }
+                    }}
+                    <span class="api-keys-row__label">{move || label.get_value()}</span>
+                </span>
                 {move || {
                     if coming_soon {
                         view! {

From 23da52f0d9619445b358da23e89c4fcb3dcafb7f Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 04:36:02 +0200
Subject: [PATCH 19/48] style(workbench): improve disabled button styles and
 update button attributes

- Added new styles for disabled mini buttons to enhance visual feedback and user experience.
- Updated button attributes in the API Keys and Workspace Settings panes to use the standard `disabled` property for better accessibility and consistency.
---
 src/workbench/api_keys_pane/mod.rs           |  7 ++++--
 src/workbench/workspace_settings_pane/mod.rs |  7 ++++--
 styles.css                                   | 23 ++++++++++++++++++++
 3 files changed, 33 insertions(+), 4 deletions(-)

diff --git a/src/workbench/api_keys_pane/mod.rs b/src/workbench/api_keys_pane/mod.rs
index 58e9632..a1a7e48 100644
--- a/src/workbench/api_keys_pane/mod.rs
+++ b/src/workbench/api_keys_pane/mod.rs
@@ -135,6 +135,9 @@ pub fn ApiKeysPane() -> impl IntoView {
     };
 
     let discard = move || {
+        if !dirty.get_untracked() {
+            return;
+        }
         drafts.set(DraftMap::new());
         status_msg.set(None);
         error_msg.set(None);
@@ -205,7 +208,7 @@ pub fn ApiKeysPane() -> impl IntoView {
                 <button
                     type="button"
                     class="workbench-mini-btn workbench-mini-btn--primary"
-                    prop:disabled=move || busy.get() || !dirty.get() || !is_tauri_shell()
+                    disabled=move || busy.get() || !dirty.get() || !is_tauri_shell()
                     on:click=move |_| save()
                 >
                     <span class="harness-btn-inline">
@@ -216,7 +219,7 @@ pub fn ApiKeysPane() -> impl IntoView {
                 <button
                     type="button"
                     class="workbench-mini-btn"
-                    prop:disabled=move || busy.get() || !dirty.get()
+                    disabled=move || busy.get() || !dirty.get()
                     on:click=move |_| discard()
                 >
                     <span class="harness-btn-inline">
diff --git a/src/workbench/workspace_settings_pane/mod.rs b/src/workbench/workspace_settings_pane/mod.rs
index 9f154dc..33af6ab 100644
--- a/src/workbench/workspace_settings_pane/mod.rs
+++ b/src/workbench/workspace_settings_pane/mod.rs
@@ -97,6 +97,9 @@ pub fn WorkspaceSettingsPane(
     };
 
     let discard = move || {
+        if !dirty.get_untracked() {
+            return;
+        }
         let b = baseline.get_untracked();
         wb.set_default_project_dir_text(b.project_dir);
         wb.set_harness_workspace_root_text(b.sandbox_root);
@@ -214,7 +217,7 @@ pub fn WorkspaceSettingsPane(
                 <button
                     type="button"
                     class="workbench-mini-btn workbench-mini-btn--primary"
-                    prop:disabled=move || busy.get() || !dirty.get()
+                    disabled=move || busy.get() || !dirty.get()
                     on:click=move |_| save()
                 >
                     <span class="harness-btn-inline">
@@ -225,7 +228,7 @@ pub fn WorkspaceSettingsPane(
                 <button
                     type="button"
                     class="workbench-mini-btn"
-                    prop:disabled=move || busy.get() || !dirty.get()
+                    disabled=move || busy.get() || !dirty.get()
                     on:click=move |_| discard()
                 >
                     <span class="harness-btn-inline">
diff --git a/styles.css b/styles.css
index d7e77b5..66e679f 100644
--- a/styles.css
+++ b/styles.css
@@ -2647,6 +2647,29 @@ button.workbench-shortcut-row--action:focus-visible {
   background: var(--accent-hover);
 }
 
+.workbench-mini-btn:disabled {
+  opacity: 0.38;
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.workbench-mini-btn:disabled:hover {
+  border-color: var(--border);
+  color: var(--text-muted);
+  background: transparent;
+}
+
+.workbench-mini-btn--primary:disabled {
+  background: color-mix(in srgb, var(--accent) 42%, transparent);
+  border-color: color-mix(in srgb, var(--accent) 42%, transparent);
+  color: color-mix(in srgb, #101114 55%, transparent);
+}
+
+.workbench-mini-btn--primary:disabled:hover {
+  background: color-mix(in srgb, var(--accent) 42%, transparent);
+  border-color: color-mix(in srgb, var(--accent) 42%, transparent);
+}
+
 .workbench-agent-status {
   flex-shrink: 0;
   margin: 0;

From 379e149801f1857ded28cdbae3e5a9250b75914c Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 04:49:41 +0200
Subject: [PATCH 20/48] feat(api_keys_pane): add brand icons for various API
 services

- Introduced SVG icons for Brave, Google, Groq, Mistral, and Tavily to enhance visual representation in the API keys pane.
- Updated the API key brand icon retrieval function to include new icons, improving the user interface and experience.
---
 public/brand-icons/brave.svg       |  1 +
 public/brand-icons/google.svg      |  1 +
 public/brand-icons/groq.svg        |  1 +
 public/brand-icons/mistral.svg     |  1 +
 public/brand-icons/tavily.svg      |  1 +
 src/workbench/api_keys_pane/mod.rs | 16 +++++++---------
 6 files changed, 12 insertions(+), 9 deletions(-)
 create mode 100644 public/brand-icons/brave.svg
 create mode 100644 public/brand-icons/google.svg
 create mode 100644 public/brand-icons/groq.svg
 create mode 100644 public/brand-icons/mistral.svg
 create mode 100644 public/brand-icons/tavily.svg

diff --git a/public/brand-icons/brave.svg b/public/brand-icons/brave.svg
new file mode 100644
index 0000000..fa798a4
--- /dev/null
+++ b/public/brand-icons/brave.svg
@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Brave</title><path d="M15.68 0l2.096 2.38s1.84-.512 2.709.358c.868.87 1.584 1.638 1.584 1.638l-.562 1.381.715 2.047s-2.104 7.98-2.35 8.955c-.486 1.919-.818 2.66-2.198 3.633-1.38.972-3.884 2.66-4.293 2.916-.409.256-.92.692-1.38.692-.46 0-.97-.436-1.38-.692a185.796 185.796 0 01-4.293-2.916c-1.38-.973-1.712-1.714-2.197-3.633-.247-.975-2.351-8.955-2.351-8.955l.715-2.047-.562-1.381s.716-.768 1.585-1.638c.868-.87 2.708-.358 2.708-.358L8.321 0h7.36zm-3.679 14.936c-.14 0-1.038.317-1.758.69-.72.373-1.242.637-1.409.742-.167.104-.065.301.087.409.152.107 2.194 1.69 2.393 1.866.198.175.489.464.687.464.198 0 .49-.29.688-.464.198-.175 2.24-1.759 2.392-1.866.152-.108.254-.305.087-.41-.167-.104-.689-.368-1.41-.741-.72-.373-1.617-.69-1.757-.69zm0-11.278s-.409.001-1.022.206-1.278.46-1.584.46c-.307 0-2.581-.434-2.581-.434S4.119 7.152 4.119 7.849c0 .697.339.881.68 1.243l2.02 2.149c.192.203.59.511.356 1.066-.235.555-.58 1.26-.196 1.977.384.716 1.042 1.194 1.464 1.115.421-.08 1.412-.598 1.776-.834.364-.237 1.518-1.19 1.518-1.554 0-.365-1.193-1.02-1.413-1.168-.22-.15-1.226-.725-1.247-.95-.02-.227-.012-.293.284-.851.297-.559.831-1.304.742-1.8-.089-.495-.95-.753-1.565-.986-.615-.232-1.799-.671-1.947-.74-.148-.068-.11-.133.339-.175.448-.043 1.719-.212 2.292-.052.573.16 1.552.403 1.632.532.079.13.149.134.067.579-.081.445-.5 2.581-.541 2.96-.04.38-.12.63.288.724.409.094 1.097.256 1.333.256s.924-.162 1.333-.256c.408-.093.329-.344.288-.723-.04-.38-.46-2.516-.541-2.961-.082-.445-.012-.45.067-.579.08-.129 1.059-.372 1.632-.532.573-.16 1.845.009 2.292.052.449.042.487.107.339.175-.148.069-1.332.508-1.947.74-.615.233-1.476.49-1.565.986-.09.496.445 1.241.742 1.8.297.558.304.624.284.85-.02.226-1.026.802-1.247.95-.22.15-1.413.804-1.413 1.169 0 .364 1.154 1.317 1.518 1.554.364.236 1.355.755 1.776.834.422.079 1.08-.4 1.464-1.115.384-.716.039-1.422-.195-1.977-.235-.555.163-.863.355-1.066l2.02-2.149c.341-.362.68-.546.68-1.243 0-.697-2.695-3.96-2.695-3.96s-2.274.436-2.58.436c-.307 0-.972-.256-1.585-.461-.613-.205-1.022-.206-1.022-.206z"/></svg>
\ No newline at end of file
diff --git a/public/brand-icons/google.svg b/public/brand-icons/google.svg
new file mode 100644
index 0000000..c1dd27f
--- /dev/null
+++ b/public/brand-icons/google.svg
@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Google</title><path d="M23 12.245c0-.905-.075-1.565-.236-2.25h-10.54v4.083h6.186c-.124 1.014-.797 2.542-2.294 3.569l-.021.136 3.332 2.53.23.022C21.779 18.417 23 15.593 23 12.245z" fill="#4285F4"/><path d="M12.225 23c3.03 0 5.574-.978 7.433-2.665l-3.542-2.688c-.948.648-2.22 1.1-3.891 1.1a6.745 6.745 0 01-6.386-4.572l-.132.011-3.465 2.628-.045.124C4.043 20.531 7.835 23 12.225 23z" fill="#34A853"/><path d="M5.84 14.175A6.65 6.65 0 015.463 12c0-.758.138-1.491.361-2.175l-.006-.147-3.508-2.67-.115.054A10.831 10.831 0 001 12c0 1.772.436 3.447 1.197 4.938l3.642-2.763z" fill="#FBBC05"/><path d="M12.225 5.253c2.108 0 3.529.892 4.34 1.638l3.167-3.031C17.787 2.088 15.255 1 12.225 1 7.834 1 4.043 3.469 2.197 7.062l3.63 2.763a6.77 6.77 0 016.398-4.572z" fill="#EB4335"/></svg>
diff --git a/public/brand-icons/groq.svg b/public/brand-icons/groq.svg
new file mode 100644
index 0000000..b198baf
--- /dev/null
+++ b/public/brand-icons/groq.svg
@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 33 33" xmlns="http://www.w3.org/2000/svg"><title>Groq</title><path fill="#F43E01" d="M.54.39h32v32h-32z"/><path fill="#fff" d="m18.445 4.406-9.468 13.74 7.341.665-1.69 9.578 9.469-13.74-7.342-.664 1.69-9.579Z"/></svg>
diff --git a/public/brand-icons/mistral.svg b/public/brand-icons/mistral.svg
new file mode 100644
index 0000000..b26527f
--- /dev/null
+++ b/public/brand-icons/mistral.svg
@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Mistral</title><path d="M3.428 3.4h3.429v3.428H3.428V3.4zm13.714 0h3.43v3.428h-3.43V3.4z" fill="gold"/><path d="M3.428 6.828h6.857v3.429H3.429V6.828zm10.286 0h6.857v3.429h-6.857V6.828z" fill="#FFAF00"/><path d="M3.428 10.258h17.144v3.428H3.428v-3.428z" fill="#FF8205"/><path d="M3.428 13.686h3.429v3.428H3.428v-3.428zm6.858 0h3.429v3.428h-3.429v-3.428zm6.856 0h3.43v3.428h-3.43v-3.428z" fill="#FA500F"/><path d="M0 17.114h10.286v3.429H0v-3.429zm13.714 0H24v3.429H13.714v-3.429z" fill="#E10500"/></svg>
diff --git a/public/brand-icons/tavily.svg b/public/brand-icons/tavily.svg
new file mode 100644
index 0000000..1d6228f
--- /dev/null
+++ b/public/brand-icons/tavily.svg
@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Tavily</title><path d="M9.1.503l2.824 4.47a1.078 1.078 0 01-.911 1.655H9.858v6.692h-1.67a2.633 2.633 0 00-1.67.48V6.628H5.364c-.85 0-1.366-.936-.912-1.654z" fill="#8FBCFA"/><path d="M4.453 4.974L7.277.503A1.07 1.07 0 018.189 0v13.32a2.633 2.633 0 00-1.67.48V6.628H5.364c-.85 0-1.366-.936-.912-1.654z" fill="#468BFF"/><path d="M17.041 17.74h-7.028c.423-.457.67-1.049.7-1.67h12.956c0 .35-.168.7-.502.912l-4.472 2.823a1.078 1.078 0 01-1.654-.911v-1.155z" fill="#FDBB11"/><path d="M18.695 12.334l4.47 2.824c.336.212.503.562.503.912H10.713a2.65 2.65 0 00-.493-1.67h6.822v-1.154c0-.85.935-1.366 1.653-.912z" fill="#F6D785"/><path d="M4.394 19.605L.316 23.683a1.07 1.07 0 001 .29l5.158-1.165A1.078 1.078 0 007 20.994l-.816-.816 3.073-3.074a1.61 1.61 0 000-2.276l-.042-.043-4.82 4.82z" fill="#FF9A9D"/><path d="M3.822 17.817l3.073-3.074a1.61 1.61 0 012.277 0l.042.043-4.818 4.819-4.08 4.079a1.07 1.07 0 01-.289-1l1.165-5.158A1.078 1.078 0 013.006 17l.816.817z" fill="#FE363B"/></svg>
diff --git a/src/workbench/api_keys_pane/mod.rs b/src/workbench/api_keys_pane/mod.rs
index a1a7e48..6d9ce90 100644
--- a/src/workbench/api_keys_pane/mod.rs
+++ b/src/workbench/api_keys_pane/mod.rs
@@ -32,19 +32,17 @@ fn api_key_brand_icon_url(kind: &str) -> Option<&'static str> {
         "openrouter" => Some("/public/brand-icons/openrouter.svg"),
         "anthropic" => Some("/public/brand-icons/anthropic.svg"),
         "openai" => Some("/public/brand-icons/openai.svg"),
-        "google" => Some("/public/brand-icons/gemini.svg"),
+        "google" => Some("/public/brand-icons/google.svg"),
+        "mistral" => Some("/public/brand-icons/mistral.svg"),
+        "groq" => Some("/public/brand-icons/groq.svg"),
+        "tavily" => Some("/public/brand-icons/tavily.svg"),
+        "brave" => Some("/public/brand-icons/brave.svg"),
         _ => None,
     }
 }
 
-fn api_key_icon_fallback(kind: &str) -> icondata::Icon {
-    match kind {
-        "mistral" => icondata::LuSparkles,
-        "groq" => icondata::LuZap,
-        "tavily" => icondata::LuSearch,
-        "brave" => icondata::LuShield,
-        _ => icondata::LuKeyRound,
-    }
+fn api_key_icon_fallback(_kind: &str) -> icondata::Icon {
+    icondata::LuKeyRound
 }
 
 fn input_str(ev: &web_sys::Event) -> Option<String> {

From 3b60ecdbacc1ab3185350928c66cb1afb4f33782 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:02:41 +0200
Subject: [PATCH 21/48] feat(api_keys_pane): replace Groq icon with Grok and
 update styles

- Added a new SVG icon for Grok and removed the old Groq icon to enhance brand representation.
- Updated the API key brand icon retrieval function to reflect the new icon name.
- Improved layout styles in the harness hooks section for better alignment and spacing.
- Enhanced the display of agent names and statuses with a new title row structure.
---
 public/brand-icons/grok.svg        |  1 +
 public/brand-icons/groq.svg        |  1 -
 src-tauri/src/api_keys.rs          |  2 +-
 src/workbench/api_keys_pane/mod.rs |  4 ++--
 src/workbench/harness_ui.rs        | 32 +++++++++++++++++++-----------
 styles.css                         | 22 +++++++++++++++-----
 6 files changed, 41 insertions(+), 21 deletions(-)
 create mode 100644 public/brand-icons/grok.svg
 delete mode 100644 public/brand-icons/groq.svg

diff --git a/public/brand-icons/grok.svg b/public/brand-icons/grok.svg
new file mode 100644
index 0000000..28a3f4d
--- /dev/null
+++ b/public/brand-icons/grok.svg
@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Grok</title><path d="M9.27 15.29l7.978-5.897c.391-.29.95-.177 1.137.272.98 2.369.542 5.215-1.41 7.169-1.951 1.954-4.667 2.382-7.149 1.406l-2.711 1.257c3.889 2.661 8.611 2.003 11.562-.953 2.341-2.344 3.066-5.539 2.388-8.42l.006.007c-.983-4.232.242-5.924 2.75-9.383.06-.082.12-.164.179-.248l-3.301 3.305v-.01L9.267 15.292M7.623 16.723c-2.792-2.67-2.31-6.801.071-9.184 1.761-1.763 4.647-2.483 7.166-1.425l2.705-1.25a7.808 7.808 0 00-1.829-1A8.975 8.975 0 005.984 5.83c-2.533 2.536-3.33 6.436-1.962 9.764 1.022 2.487-.653 4.246-2.34 6.022-.599.63-1.199 1.259-1.682 1.925l7.62-6.815"/></svg>
diff --git a/public/brand-icons/groq.svg b/public/brand-icons/groq.svg
deleted file mode 100644
index b198baf..0000000
--- a/public/brand-icons/groq.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg role="img" viewBox="0 0 33 33" xmlns="http://www.w3.org/2000/svg"><title>Groq</title><path fill="#F43E01" d="M.54.39h32v32h-32z"/><path fill="#fff" d="m18.445 4.406-9.468 13.74 7.341.665-1.69 9.578 9.469-13.74-7.342-.664 1.69-9.579Z"/></svg>
diff --git a/src-tauri/src/api_keys.rs b/src-tauri/src/api_keys.rs
index 7321836..9a595c6 100644
--- a/src-tauri/src/api_keys.rs
+++ b/src-tauri/src/api_keys.rs
@@ -73,7 +73,7 @@ const SEARCH_KINDS: &[(WebKeyKind, &str, &str)] = &[
 const COMING_SOON_LLM: &[(&str, &str)] = &[
     ("google", "Google"),
     ("mistral", "Mistral"),
-    ("groq", "Groq"),
+    ("grok", "Grok xAI"),
 ];
 
 fn llm_provider_from_kind(kind: &str) -> Option<AgentProviderKind> {
diff --git a/src/workbench/api_keys_pane/mod.rs b/src/workbench/api_keys_pane/mod.rs
index 6d9ce90..6f70bdc 100644
--- a/src/workbench/api_keys_pane/mod.rs
+++ b/src/workbench/api_keys_pane/mod.rs
@@ -32,9 +32,9 @@ fn api_key_brand_icon_url(kind: &str) -> Option<&'static str> {
         "openrouter" => Some("/public/brand-icons/openrouter.svg"),
         "anthropic" => Some("/public/brand-icons/anthropic.svg"),
         "openai" => Some("/public/brand-icons/openai.svg"),
-        "google" => Some("/public/brand-icons/google.svg"),
+        "google" => Some("/public/brand-icons/gemini.svg"),
         "mistral" => Some("/public/brand-icons/mistral.svg"),
-        "groq" => Some("/public/brand-icons/groq.svg"),
+        "grok" => Some("/public/brand-icons/grok.svg"),
         "tavily" => Some("/public/brand-icons/tavily.svg"),
         "brave" => Some("/public/brand-icons/brave.svg"),
         _ => None,
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index 16ad78b..41fedf8 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -1965,6 +1965,7 @@ fn AgentHooksPanel() -> impl IntoView {
                                 let note = entry.note.unwrap_or_default();
                                 let has_note = !note.is_empty();
                                 let icon_url = hook_brand_icon(&entry.agent);
+                                let status_tip = status.clone();
                                 view! {
                                     <li class="harness-hooks__item">
                                         <div class="harness-hooks__main">
@@ -1985,23 +1986,30 @@ fn AgentHooksPanel() -> impl IntoView {
                                                 </Show>
                                             </span>
                                             <div class="harness-hooks__copy">
-                                                <strong class="harness-hooks__name">{entry.agent}</strong>
+                                                <div class="harness-hooks__title-row">
+                                                    <strong class="harness-hooks__name">{entry.agent}</strong>
+                                                    <span
+                                                        class="harness-hooks__status"
+                                                        class:harness-hooks__status--ok=entry.installed
+                                                        title=status_tip.clone()
+                                                        aria-label=status_tip
+                                                    >
+                                                        <LxIcon
+                                                            icon=if entry.installed {
+                                                                icondata::LuCheck
+                                                            } else {
+                                                                icondata::LuX
+                                                            }
+                                                            width="0.82rem"
+                                                            height="0.82rem"
+                                                        />
+                                                    </span>
+                                                </div>
                                                 <Show when=move || has_note>
                                                     <small class="harness-muted">{note.clone()}</small>
                                                 </Show>
                                             </div>
                                         </div>
-                                        <span
-                                            class="harness-hooks__status"
-                                            class:harness-hooks__status--ok=entry.installed
-                                        >
-                                            <LxIcon
-                                                icon=if entry.installed { icondata::LuCheck } else { icondata::LuX }
-                                                width="0.82rem"
-                                                height="0.82rem"
-                                            />
-                                            <span>{status}</span>
-                                        </span>
                                     </li>
                                 }
                                 .into_any()
diff --git a/styles.css b/styles.css
index 66e679f..15ea354 100644
--- a/styles.css
+++ b/styles.css
@@ -4494,8 +4494,8 @@ button.workbench-shortcut-row--action:focus-visible {
 .harness-hooks__item {
   display: flex;
   flex-direction: column;
-  align-items: flex-start;
-  gap: 0.55rem;
+  align-items: stretch;
+  gap: 0;
   padding: 0.7rem 0.8rem;
   border: 1px solid var(--border);
   border-radius: 0.6rem;
@@ -4509,9 +4509,10 @@ button.workbench-shortcut-row--action:focus-visible {
 }
 
 .harness-hooks__main {
+  width: 100%;
   min-width: 0;
   display: flex;
-  align-items: center;
+  align-items: flex-start;
   gap: 0.65rem;
 }
 
@@ -4540,14 +4541,24 @@ button.workbench-shortcut-row--action:focus-visible {
 }
 
 .harness-hooks__copy {
+  flex: 1 1 auto;
   min-width: 0;
   display: flex;
   flex-direction: column;
   gap: 0.12rem;
 }
 
+.harness-hooks__title-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.45rem;
+  width: 100%;
+}
+
 .harness-hooks__name {
   display: block;
+  min-width: 0;
   text-transform: lowercase;
   font-size: 0.88rem;
   font-weight: 600;
@@ -4558,9 +4569,10 @@ button.workbench-shortcut-row--action:focus-visible {
   flex: 0 0 auto;
   display: inline-flex;
   align-items: center;
-  gap: 0.42rem;
-  padding: 0.22rem 0.45rem;
+  justify-content: center;
+  padding: 0.2rem;
   border-radius: 4px;
+  cursor: default;
   border: 1px solid rgba(255, 122, 122, 0.32);
   color: #ff9a9a;
   background: rgba(255, 122, 122, 0.08);

From a0787bf27cccf73e2d86d3206927c4a8a0c0dd3b Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:11:31 +0200
Subject: [PATCH 22/48] feat(agent_provider_pane): add agent provider settings
 pane and localization support

- Introduced a new `AgentProviderPane` component for managing agent provider settings, including model selection and thinking levels.
- Added localization keys for the agent provider pane in multiple languages to enhance internationalization support.
- Updated the main application structure to include the new agent provider pane and corresponding CSS styles for consistent UI design.
- Enhanced the layout and styling of the agent provider settings for improved user experience.
---
 index.html                                    |   1 +
 src/i18n/keys.rs                              |   3 +
 src/i18n/locales/de_de.rs                     |   7 +-
 src/i18n/locales/en_us.rs                     |   7 +-
 src/i18n/locales/es_es.rs                     |   5 +-
 src/i18n/locales/fr_fr.rs                     |   5 +-
 src/i18n/locales/hu_hu.rs                     |   5 +-
 src/i18n/locales/it_it.rs                     |   5 +-
 src/i18n/locales/ja_jp.rs                     |   5 +-
 src/i18n/locales/ko_kr.rs                     |   5 +-
 src/i18n/locales/pl_pl.rs                     |   5 +-
 src/i18n/locales/pt_br.rs                     |   5 +-
 src/i18n/locales/ru_ru.rs                     |   5 +-
 src/i18n/locales/zh_cn.rs                     |   5 +-
 src/i18n/locales/zh_tw.rs                     |   5 +-
 .../agent_provider_pane.css                   |  87 ++
 src/workbench/agent_provider_pane/mod.rs      | 971 ++++++++++++++++++
 src/workbench/harness_ui.rs                   | 598 +----------
 src/workbench/mod.rs                          |   2 +
 19 files changed, 1121 insertions(+), 610 deletions(-)
 create mode 100644 src/workbench/agent_provider_pane/agent_provider_pane.css
 create mode 100644 src/workbench/agent_provider_pane/mod.rs

diff --git a/index.html b/index.html
index 22a41ab..cbe3717 100644
--- a/index.html
+++ b/index.html
@@ -17,6 +17,7 @@
     <link data-trunk rel="css" href="src/workbench/harness_image_pane/harness_image_pane.css" />
     <link data-trunk rel="css" href="src/workbench/api_keys_pane/api_keys_pane.css" />
     <link data-trunk rel="css" href="src/workbench/workspace_settings_pane/workspace_settings_pane.css" />
+    <link data-trunk rel="css" href="src/workbench/agent_provider_pane/agent_provider_pane.css" />
     <link data-trunk rel="css" href="src/workbench/agent_panel/ask_user_card/ask_user_card.css" />
     <link data-trunk rel="css" href="src/workbench/agent_panel/turn_metrics_bar/turn_metrics_bar.css" />
     <link data-trunk rel="copy-dir" href="public" />
diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index f1cf78c..22c3630 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -357,6 +357,9 @@ pub enum I18nKey {
     WsDefaultProjectDirHint,
     WsRootHint,
     AgProviderHeading,
+    AgSectionInference,
+    AgSectionModel,
+    AgModelMetaPricing,
     AgProviderField,
     AgProviderOpenrouter,
     AgProviderAnthropic,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index 350d656..c3a70d5 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -313,7 +313,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsCatAppearance => "Erscheinungsbild",
         I18nKey::HsCatApiKeys => "API-Schlüssel",
         I18nKey::HsCatWorkspace => "Arbeitsplatz",
-        I18nKey::HsCatProvider => "Agentenanbieter",
+        I18nKey::HsCatProvider => "BLXCode Agent",
         I18nKey::HsCatVoice => "Stimme",
         I18nKey::HsCatImage => "Bild",
         I18nKey::AppHeading => "App",
@@ -348,7 +348,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Standardprojektverzeichnis",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "Füllt das Arbeitsverzeichnis für neue Arbeitsbereiche vorab aus.",
-        I18nKey::AgProviderHeading => "BLXCode-Agent-Anbieter",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inferenz",
+        I18nKey::AgSectionModel => "Modell",
+        I18nKey::AgModelMetaPricing => "{in} Eingabe / {out} Ausgabe pro 1M Token",
         I18nKey::AgProviderField => "Anbieter",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
         I18nKey::AgProviderAnthropic => "Anthropisch",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index 7e29725..36afcea 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -351,7 +351,7 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::HsCatAppearance => "Appearance",
         I18nKey::HsCatApiKeys => "API Keys",
         I18nKey::HsCatWorkspace => "Workspace",
-        I18nKey::HsCatProvider => "Agent Provider",
+        I18nKey::HsCatProvider => "BLXCode Agent",
         I18nKey::HsCatVoice => "Voice",
         I18nKey::HsCatImage => "Image",
         I18nKey::AppHeading => "App",
@@ -386,7 +386,10 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::WsDefaultProjectDirLabel => "Default project directory",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "Pre-fills the working directory for new workspaces.",
-        I18nKey::AgProviderHeading => "BLXCode Agent Provider",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Provider",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
         I18nKey::AgProviderAnthropic => "Anthropic",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index d5e79c3..522ff58 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -348,7 +348,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Directorio de proyecto predeterminado",
         I18nKey::WsDefaultProjectDirPlaceholder => "$INICIO",
         I18nKey::WsDefaultProjectDirHint => "Rellena previamente el directorio de trabajo para nuevos espacios de trabajo.",
-        I18nKey::AgProviderHeading => "Proveedor de agentes BLXCode",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Proveedor",
         I18nKey::AgProviderOpenrouter => "enrutador abierto",
         I18nKey::AgProviderAnthropic => "antrópico",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index 6cd3c8d..e64017b 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -350,7 +350,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Répertoire du projet par défaut",
         I18nKey::WsDefaultProjectDirPlaceholder => "$ACCUEIL",
         I18nKey::WsDefaultProjectDirHint => "Pré-remplit le répertoire de travail pour les nouveaux espaces de travail.",
-        I18nKey::AgProviderHeading => "Fournisseur d'agents BLXCode",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Fournisseur",
         I18nKey::AgProviderOpenrouter => "OuvrirRouter",
         I18nKey::AgProviderAnthropic => "Anthropique",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index a146db6..694d913 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -348,7 +348,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Alapértelmezett projektkönyvtár",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "Előre kitölti a munkakönyvtárat az új munkaterületekhez.",
-        I18nKey::AgProviderHeading => "BLXCode ügynök szolgáltató",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Szolgáltató",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
         I18nKey::AgProviderAnthropic => "Antropikus",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index 5dc8d2d..eedbac6 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -348,7 +348,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Directory di progetto predefinita",
         I18nKey::WsDefaultProjectDirPlaceholder => "$CASA",
         I18nKey::WsDefaultProjectDirHint => "Precompila la directory di lavoro per i nuovi spazi di lavoro.",
-        I18nKey::AgProviderHeading => "Fornitore dell'agente BLXCode",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Fornitore",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
         I18nKey::AgProviderAnthropic => "Antropico",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index de5c825..de33713 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -342,7 +342,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "デフォルトのプロジェクトディレクトリ",
         I18nKey::WsDefaultProjectDirPlaceholder => "$ホーム",
         I18nKey::WsDefaultProjectDirHint => "新しいワークスペースの作業ディレクトリを事前に入力します。",
-        I18nKey::AgProviderHeading => "BLXCodeエージェントプロバイダー",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "プロバイダー",
         I18nKey::AgProviderOpenrouter => "オープンルーター",
         I18nKey::AgProviderAnthropic => "人間的",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index 2265780..f1f7ae0 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -342,7 +342,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "기본 프로젝트 디렉토리",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "새 작업공간에 대한 작업 디렉토리를 미리 채웁니다.",
-        I18nKey::AgProviderHeading => "BLXCode 에이전트 제공자",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "공급자",
         I18nKey::AgProviderOpenrouter => "오픈라우터",
         I18nKey::AgProviderAnthropic => "인류학",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index db362d3..8fc18d1 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -346,7 +346,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Domyślny katalog projektu",
         I18nKey::WsDefaultProjectDirPlaceholder => "$DOM",
         I18nKey::WsDefaultProjectDirHint => "Wstępnie wypełnia katalog roboczy dla nowych obszarów roboczych.",
-        I18nKey::AgProviderHeading => "Dostawca agenta BLXCode",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Dostawca",
         I18nKey::AgProviderOpenrouter => "OtwórzRouter",
         I18nKey::AgProviderAnthropic => "Antropiczny",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index 0fa019a..6dacd09 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -348,7 +348,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Diretório padrão do projeto",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "Preenche previamente o diretório de trabalho para novos espaços de trabalho.",
-        I18nKey::AgProviderHeading => "Provedor de agente BLXCode",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Provedor",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
         I18nKey::AgProviderAnthropic => "Antrópico",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index 24990d3..f713797 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -346,7 +346,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Каталог проекта по умолчанию",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "Предварительно заполняет рабочий каталог для новых рабочих пространств.",
-        I18nKey::AgProviderHeading => "Поставщик агента BLXCode",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Поставщик",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
         I18nKey::AgProviderAnthropic => "антропный",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index 2b60b3d..e42bd20 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -340,7 +340,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "默认项目目录",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "预填充新工作区的工作目录。",
-        I18nKey::AgProviderHeading => "BLXCode代理提供商",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "提供者",
         I18nKey::AgProviderOpenrouter => "开放路由器",
         I18nKey::AgProviderAnthropic => "人择",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index 4cc741e..e9ba746 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -340,7 +340,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "預設項目目錄",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "預填新工作區的工作目錄。",
-        I18nKey::AgProviderHeading => "BLXCode代理提供者",
+        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgSectionModel => "Model",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "提供者",
         I18nKey::AgProviderOpenrouter => "開放路由器",
         I18nKey::AgProviderAnthropic => "人擇",
diff --git a/src/workbench/agent_provider_pane/agent_provider_pane.css b/src/workbench/agent_provider_pane/agent_provider_pane.css
new file mode 100644
index 0000000..3eb13f9
--- /dev/null
+++ b/src/workbench/agent_provider_pane/agent_provider_pane.css
@@ -0,0 +1,87 @@
+/* BLXCode Agent settings pane */
+
+.agent-provider-pane__picker-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
+  gap: 0.75rem;
+}
+
+.agent-provider-pane__field {
+  display: flex;
+  flex-direction: column;
+  gap: 0.45rem;
+  min-width: 0;
+}
+
+.agent-model-picker {
+  display: flex;
+  flex-direction: column;
+  gap: 0.45rem;
+  min-width: 0;
+}
+
+.agent-model-picker__menu {
+  max-height: 16rem;
+  overflow-y: auto;
+}
+
+.agent-model-option {
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 0.12rem;
+}
+
+.agent-model-option__title {
+  font-weight: 600;
+  font-size: 0.82rem;
+}
+
+.agent-model-option__meta {
+  font-size: 0.72rem;
+  color: var(--text-muted);
+  line-height: 1.35;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.agent-model-picker__detail {
+  margin: 0;
+  padding: 0.5rem 0.6rem;
+  border-radius: 6px;
+  border: 1px solid rgba(255, 255, 255, 0.06);
+  background: rgba(255, 255, 255, 0.03);
+  font-size: 0.74rem;
+  line-height: 1.45;
+}
+
+.agent-model-picker__detail-title {
+  display: block;
+  font-weight: 600;
+  color: var(--text);
+  margin-bottom: 0.2rem;
+}
+
+.agent-model-picker__detail-line + .agent-model-picker__detail-line {
+  margin-top: 0.18rem;
+}
+
+.agent-provider-pane__key-row {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  gap: 0.35rem 0.65rem;
+}
+
+.agent-provider-pane__key-status {
+  font-family: var(--font-mono);
+  font-size: 0.74rem;
+}
+
+.agent-provider-pane__actions {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.45rem;
+}
diff --git a/src/workbench/agent_provider_pane/mod.rs b/src/workbench/agent_provider_pane/mod.rs
new file mode 100644
index 0000000..aa00ff7
--- /dev/null
+++ b/src/workbench/agent_provider_pane/mod.rs
@@ -0,0 +1,971 @@
+//! Settings → BLXCode Agent — provider, model, thinking, web tools.
+
+use crate::i18n::I18nKey;
+use crate::service::I18nService;
+use crate::tauri_bridge::{
+    agent_provider_models, agent_settings_get, agent_settings_save, agent_web_settings_get,
+    agent_web_settings_save, is_tauri_shell, AgentProviderKind, AgentProviderSettingsView,
+    AgentWebSettingsView, ProviderModelEntry, ProviderModelsResponse, ThinkingLevel,
+    WebProviderKind,
+};
+use gloo_timers::future::TimeoutFuture;
+use leptos::prelude::*;
+use leptos_icons::Icon as LxIcon;
+use wasm_bindgen::JsCast;
+
+#[derive(Clone, PartialEq, Eq)]
+struct AgentSettingsBaseline {
+    provider: AgentProviderKind,
+    model_id: String,
+    thinking: ThinkingLevel,
+    web_provider: WebProviderKind,
+}
+
+fn input_str(ev: &web_sys::Event) -> Option<String> {
+    ev.target()?
+        .dyn_into::<web_sys::HtmlInputElement>()
+        .ok()
+        .map(|i| i.value())
+}
+
+fn select_str(ev: &web_sys::Event) -> Option<String> {
+    ev.target()?
+        .dyn_into::<web_sys::HtmlSelectElement>()
+        .ok()
+        .map(|s| s.value())
+}
+
+fn provider_label(i18n: &I18nService, provider: AgentProviderKind) -> String {
+    let key = match provider {
+        AgentProviderKind::Openrouter => I18nKey::AgProviderOpenrouter,
+        AgentProviderKind::Anthropic => I18nKey::AgProviderAnthropic,
+        AgentProviderKind::Openai => I18nKey::AgProviderOpenai,
+    };
+    i18n.tr(key)().to_string()
+}
+
+fn provider_icon_url(provider: AgentProviderKind) -> &'static str {
+    match provider {
+        AgentProviderKind::Openrouter => "/public/brand-icons/openrouter.svg",
+        AgentProviderKind::Anthropic => "/public/brand-icons/anthropic.svg",
+        AgentProviderKind::Openai => "/public/brand-icons/openai.svg",
+    }
+}
+
+fn thinking_levels() -> [ThinkingLevel; 5] {
+    [
+        ThinkingLevel::Off,
+        ThinkingLevel::Low,
+        ThinkingLevel::Medium,
+        ThinkingLevel::High,
+        ThinkingLevel::Max,
+    ]
+}
+
+fn thinking_label(i18n: &I18nService, level: ThinkingLevel) -> String {
+    let key = match level {
+        ThinkingLevel::Off => I18nKey::AgThinkingOff,
+        ThinkingLevel::Low => I18nKey::AgThinkingLow,
+        ThinkingLevel::Medium => I18nKey::AgThinkingMedium,
+        ThinkingLevel::High => I18nKey::AgThinkingHigh,
+        ThinkingLevel::Max => I18nKey::AgThinkingMax,
+    };
+    i18n.tr(key)().to_string()
+}
+
+fn thinking_icon(level: ThinkingLevel) -> icondata::Icon {
+    match level {
+        ThinkingLevel::Off => icondata::LuCircleOff,
+        ThinkingLevel::Low => icondata::LuGauge,
+        ThinkingLevel::Medium => icondata::LuActivity,
+        ThinkingLevel::High => icondata::LuFlame,
+        ThinkingLevel::Max => icondata::LuZap,
+    }
+}
+
+fn provider_key_status_text(
+    i18n: &I18nService,
+    view: &AgentProviderSettingsView,
+    provider: AgentProviderKind,
+) -> String {
+    let configured = view
+        .key_statuses
+        .iter()
+        .find(|s| s.provider == provider)
+        .map(|s| s.configured)
+        .unwrap_or(false);
+    if configured {
+        let mask = view
+            .key_statuses
+            .iter()
+            .find(|s| s.provider == provider)
+            .and_then(|s| s.masked_value.clone());
+        if let Some(mask) = mask {
+            format!("{} ({mask})", i18n.tr(I18nKey::AgApiKeyConfigured)())
+        } else {
+            i18n.tr(I18nKey::AgApiKeyConfigured)().to_string()
+        }
+    } else {
+        i18n.tr(I18nKey::AgApiKeyMissing)().to_string()
+    }
+}
+
+fn provider_cache(view: &AgentProviderSettingsView, provider: AgentProviderKind) -> Vec<ProviderModelEntry> {
+    match provider {
+        AgentProviderKind::Openrouter => view.model_cache_openrouter.clone(),
+        AgentProviderKind::Anthropic => view.model_cache_anthropic.clone(),
+        AgentProviderKind::Openai => view.model_cache_openai.clone(),
+    }
+}
+
+fn price_per_million(usd_per_token: f64) -> String {
+    format!("${:.2}", usd_per_token * 1_000_000.0)
+}
+
+fn model_row_meta(i18n: &I18nService, entry: &ProviderModelEntry) -> Option<String> {
+    if let Some(p) = entry.pricing {
+        Some(
+            i18n.tr(I18nKey::AgModelMetaPricing)()
+                .replace("{in}", &price_per_million(p.prompt))
+                .replace("{out}", &price_per_million(p.completion)),
+        )
+    } else {
+        entry.description.as_ref().and_then(|d| {
+            let t = d.trim();
+            if t.is_empty() {
+                None
+            } else {
+                Some(if t.len() > 88 {
+                    format!("{}…", &t[..88])
+                } else {
+                    t.to_string()
+                })
+            }
+        })
+    }
+}
+
+fn find_model_entry(entries: &[ProviderModelEntry], id: &str) -> Option<ProviderModelEntry> {
+    entries.iter().find(|e| e.id == id).cloned()
+}
+
+fn model_trigger_label(entries: &[ProviderModelEntry], id: &str) -> String {
+    find_model_entry(entries, id)
+        .map(|e| {
+            if e.label.trim().is_empty() {
+                e.id
+            } else {
+                e.label
+            }
+        })
+        .unwrap_or_else(|| id.to_string())
+}
+
+fn focus_provider_option(provider: AgentProviderKind) {
+    let id = format!("provider-option-{}", provider.as_str());
+    focus_by_id(&id);
+}
+
+fn focus_thinking_option(level: ThinkingLevel) {
+    let id = format!("thinking-option-{:?}", level).to_ascii_lowercase();
+    focus_by_id(&id);
+}
+
+fn focus_model_option(model_id: &str) {
+    let id = model_option_dom_id(model_id);
+    focus_by_id(&id);
+}
+
+fn focus_by_id(id: &str) {
+    let Some(doc) = web_sys::window().and_then(|w| w.document()) else {
+        return;
+    };
+    let Some(el) = doc.get_element_by_id(id) else {
+        return;
+    };
+    let Ok(button) = el.dyn_into::<web_sys::HtmlElement>() else {
+        return;
+    };
+    let _ = button.focus();
+}
+
+fn model_option_dom_id(model_id: &str) -> String {
+    let slug: String = model_id
+        .chars()
+        .map(|c| {
+            if c.is_ascii_alphanumeric() {
+                c
+            } else {
+                '-'
+            }
+        })
+        .collect();
+    format!("model-option-{slug}")
+}
+
+fn next_provider(provider: AgentProviderKind) -> AgentProviderKind {
+    match provider {
+        AgentProviderKind::Openrouter => AgentProviderKind::Anthropic,
+        AgentProviderKind::Anthropic => AgentProviderKind::Openai,
+        AgentProviderKind::Openai => AgentProviderKind::Openrouter,
+    }
+}
+
+fn prev_provider(provider: AgentProviderKind) -> AgentProviderKind {
+    match provider {
+        AgentProviderKind::Openrouter => AgentProviderKind::Openai,
+        AgentProviderKind::Anthropic => AgentProviderKind::Openrouter,
+        AgentProviderKind::Openai => AgentProviderKind::Anthropic,
+    }
+}
+
+fn next_thinking(level: ThinkingLevel) -> ThinkingLevel {
+    let levels = thinking_levels();
+    let idx = levels.iter().position(|l| *l == level).unwrap_or(2);
+    levels[(idx + 1) % levels.len()]
+}
+
+fn prev_thinking(level: ThinkingLevel) -> ThinkingLevel {
+    let levels = thinking_levels();
+    let idx = levels.iter().position(|l| *l == level).unwrap_or(2);
+    levels[(idx + levels.len() - 1) % levels.len()]
+}
+
+#[component]
+fn ProviderPicker(
+    selected_provider: RwSignal<AgentProviderKind>,
+    settings: RwSignal<Option<AgentProviderSettingsView>>,
+    model_entries: RwSignal<Vec<ProviderModelEntry>>,
+    provider_refresh_request: RwSignal<Option<AgentProviderKind>>,
+) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let open = RwSignal::new(false);
+
+    let choose = move |provider: AgentProviderKind| {
+        selected_provider.set(provider);
+        if let Some(view) = settings.get_untracked() {
+            model_entries.set(provider_cache(&view, provider));
+        }
+        open.set(false);
+        provider_refresh_request.set(Some(provider));
+    };
+
+    view! {
+        <div class="harness-provider-picker">
+            <button
+                type="button"
+                class="harness-provider-trigger"
+                aria-haspopup="listbox"
+                aria-expanded=move || if open.get() { "true" } else { "false" }
+                on:click=move |_| {
+                    let next = !open.get_untracked();
+                    open.set(next);
+                    if next {
+                        let provider = selected_provider.get_untracked();
+                        leptos::task::spawn_local(async move {
+                            TimeoutFuture::new(0).await;
+                            focus_provider_option(provider);
+                        });
+                    }
+                }
+                on:keydown=move |ev: web_sys::KeyboardEvent| {
+                    match ev.key().as_str() {
+                        "ArrowDown" | "Enter" | " " => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let provider = selected_provider.get_untracked();
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_provider_option(provider);
+                            });
+                        }
+                        "ArrowUp" => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let provider = prev_provider(selected_provider.get_untracked());
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_provider_option(provider);
+                            });
+                        }
+                        "Escape" => open.set(false),
+                        _ => {}
+                    }
+                }
+            >
+                <span class="harness-provider-trigger__main">
+                    <span class="harness-provider-trigger__brand">
+                        <img
+                            class="harness-provider-trigger__img"
+                            src=move || provider_icon_url(selected_provider.get())
+                            alt=""
+                        />
+                    </span>
+                    <span>{move || provider_label(&i18n, selected_provider.get())}</span>
+                </span>
+                <span class="harness-provider-trigger__caret">"▾"</span>
+            </button>
+
+            <Show when=move || open.get()>
+                <div class="harness-provider-menu" role="listbox">
+                    {move || {
+                        [
+                            AgentProviderKind::Openrouter,
+                            AgentProviderKind::Anthropic,
+                            AgentProviderKind::Openai,
+                        ]
+                        .into_iter()
+                        .map(|provider| {
+                            view! {
+                                <button
+                                    id=format!("provider-option-{}", provider.as_str())
+                                    type="button"
+                                    role="option"
+                                    class="harness-provider-option"
+                                    class:harness-provider-option--active=move || selected_provider.get() == provider
+                                    aria-selected=move || if selected_provider.get() == provider {
+                                        "true"
+                                    } else {
+                                        "false"
+                                    }
+                                    on:click=move |_| choose(provider)
+                                    on:keydown=move |ev: web_sys::KeyboardEvent| {
+                                        match ev.key().as_str() {
+                                            "ArrowDown" => {
+                                                ev.prevent_default();
+                                                focus_provider_option(next_provider(provider));
+                                            }
+                                            "ArrowUp" => {
+                                                ev.prevent_default();
+                                                focus_provider_option(prev_provider(provider));
+                                            }
+                                            "Enter" | " " => {
+                                                ev.prevent_default();
+                                                choose(provider);
+                                            }
+                                            "Escape" => {
+                                                ev.prevent_default();
+                                                open.set(false);
+                                            }
+                                            _ => {}
+                                        }
+                                    }
+                                >
+                                    <span class="harness-provider-option__brand">
+                                        <img class="harness-provider-option__img" src=provider_icon_url(provider) alt="" />
+                                    </span>
+                                    <span>{provider_label(&i18n, provider)}</span>
+                                </button>
+                            }
+                        })
+                        .collect_view()
+                    }}
+                </div>
+            </Show>
+        </div>
+    }
+}
+
+#[component]
+fn ThinkingLevelPicker(selected: RwSignal<ThinkingLevel>) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let open = RwSignal::new(false);
+
+    let choose = move |level: ThinkingLevel| {
+        selected.set(level);
+        open.set(false);
+    };
+
+    view! {
+        <div class="harness-provider-picker">
+            <button
+                type="button"
+                class="harness-provider-trigger"
+                aria-haspopup="listbox"
+                aria-expanded=move || if open.get() { "true" } else { "false" }
+                on:click=move |_| {
+                    let next = !open.get_untracked();
+                    open.set(next);
+                    if next {
+                        let level = selected.get_untracked();
+                        leptos::task::spawn_local(async move {
+                            TimeoutFuture::new(0).await;
+                            focus_thinking_option(level);
+                        });
+                    }
+                }
+                on:keydown=move |ev: web_sys::KeyboardEvent| {
+                    match ev.key().as_str() {
+                        "ArrowDown" | "Enter" | " " => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let level = selected.get_untracked();
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_thinking_option(level);
+                            });
+                        }
+                        "ArrowUp" => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let level = prev_thinking(selected.get_untracked());
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_thinking_option(level);
+                            });
+                        }
+                        "Escape" => open.set(false),
+                        _ => {}
+                    }
+                }
+            >
+                <span class="harness-provider-trigger__main">
+                    <span class="harness-provider-trigger__brand">
+                        <LxIcon
+                            icon=move || thinking_icon(selected.get())
+                            width="0.76rem"
+                            height="0.76rem"
+                        />
+                    </span>
+                    <span>{move || thinking_label(&i18n, selected.get())}</span>
+                </span>
+                <span class="harness-provider-trigger__caret">"▾"</span>
+            </button>
+
+            <Show when=move || open.get()>
+                <div class="harness-provider-menu" role="listbox">
+                    {move || {
+                        thinking_levels()
+                            .into_iter()
+                            .map(|level| {
+                                view! {
+                                    <button
+                                        id=format!("thinking-option-{:?}", level).to_ascii_lowercase()
+                                        type="button"
+                                        role="option"
+                                        class="harness-provider-option"
+                                        class:harness-provider-option--active=move || selected.get() == level
+                                        aria-selected=move || if selected.get() == level {
+                                            "true"
+                                        } else {
+                                            "false"
+                                        }
+                                        on:click=move |_| choose(level)
+                                        on:keydown=move |ev: web_sys::KeyboardEvent| {
+                                            match ev.key().as_str() {
+                                                "ArrowDown" => {
+                                                    ev.prevent_default();
+                                                    focus_thinking_option(next_thinking(level));
+                                                }
+                                                "ArrowUp" => {
+                                                    ev.prevent_default();
+                                                    focus_thinking_option(prev_thinking(level));
+                                                }
+                                                "Enter" | " " => {
+                                                    ev.prevent_default();
+                                                    choose(level);
+                                                }
+                                                "Escape" => {
+                                                    ev.prevent_default();
+                                                    open.set(false);
+                                                }
+                                                _ => {}
+                                            }
+                                        }
+                                    >
+                                        <span class="harness-provider-option__brand">
+                                            <LxIcon icon=thinking_icon(level) width="0.76rem" height="0.76rem" />
+                                        </span>
+                                        <span>{thinking_label(&i18n, level)}</span>
+                                    </button>
+                                }
+                            })
+                            .collect_view()
+                    }}
+                </div>
+            </Show>
+        </div>
+    }
+}
+
+#[component]
+fn AgentModelPicker(
+    model_id: RwSignal<String>,
+    model_entries: RwSignal<Vec<ProviderModelEntry>>,
+    loading_models: RwSignal<bool>,
+) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let open = RwSignal::new(false);
+
+    let selected_entry = Memo::new(move |_| find_model_entry(&model_entries.get(), &model_id.get()));
+
+    let choose = move |id: String| {
+        model_id.set(id);
+        open.set(false);
+    };
+
+    view! {
+        <div class="agent-model-picker">
+            <div class="harness-provider-picker">
+                <button
+                    type="button"
+                    class="harness-provider-trigger"
+                    aria-haspopup="listbox"
+                    aria-expanded=move || if open.get() { "true" } else { "false" }
+                    prop:disabled=move || loading_models.get()
+                    on:click=move |_| {
+                        let next = !open.get_untracked();
+                        open.set(next);
+                        if next {
+                            let id = model_id.get_untracked();
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_model_option(&id);
+                            });
+                        }
+                    }
+                >
+                    <span class="harness-provider-trigger__main">
+                        <span class="harness-provider-trigger__brand">
+                            <LxIcon icon=icondata::LuPackage2 width="0.76rem" height="0.76rem" />
+                        </span>
+                        <span class="agent-model-picker__trigger-label">
+                            {move || model_trigger_label(&model_entries.get(), &model_id.get())}
+                        </span>
+                    </span>
+                    <span class="harness-provider-trigger__caret">"▾"</span>
+                </button>
+
+                <Show when=move || open.get()>
+                    <div class="harness-provider-menu agent-model-picker__menu" role="listbox">
+                        {move || {
+                            let entries = model_entries.get();
+                            if entries.is_empty() {
+                                view! {
+                                    <p class="harness-muted" style="padding:0.45rem 0.5rem;margin:0;">
+                                        {move || i18n.tr(I18nKey::AgModelsUnavailable)()}
+                                    </p>
+                                }
+                                .into_any()
+                            } else {
+                                entries
+                                    .into_iter()
+                                    .map(|entry| {
+                                        let id = entry.id.clone();
+                                        let meta = model_row_meta(&i18n, &entry);
+                                        let title = if entry.label.trim().is_empty() {
+                                            entry.id.clone()
+                                        } else {
+                                            entry.label.clone()
+                                        };
+                                        view! {
+                                            <button
+                                                id=model_option_dom_id(&id)
+                                                type="button"
+                                                role="option"
+                                                class="harness-provider-option agent-model-option"
+                                                class:harness-provider-option--active=move || model_id.get() == id
+                                                aria-selected=move || if model_id.get() == id {
+                                                    "true"
+                                                } else {
+                                                    "false"
+                                                }
+                                                on:click={
+                                                    let id = id.clone();
+                                                    move |_| choose(id.clone())
+                                                }
+                                                on:keydown=move |ev: web_sys::KeyboardEvent| {
+                                                    match ev.key().as_str() {
+                                                        "Enter" | " " => {
+                                                            ev.prevent_default();
+                                                            choose(id.clone());
+                                                        }
+                                                        "Escape" => {
+                                                            ev.prevent_default();
+                                                            open.set(false);
+                                                        }
+                                                        _ => {}
+                                                    }
+                                                }
+                                            >
+                                                <span class="agent-model-option__title">{title}</span>
+                                                {meta.map(|line| view! {
+                                                    <span class="agent-model-option__meta">{line}</span>
+                                                })}
+                                            </button>
+                                        }
+                                        .into_any()
+                                    })
+                                    .collect_view()
+                                    .into_any()
+                            }
+                        }}
+                    </div>
+                </Show>
+            </div>
+
+            <input
+                class="workbench-plain-input"
+                type="text"
+                placeholder=move || i18n.tr(I18nKey::AgModelCustomField)()
+                prop:value=move || model_id.get()
+                on:input=move |ev| {
+                    if let Some(value) = input_str(&ev) {
+                        model_id.set(value);
+                    }
+                }
+            />
+
+            {move || {
+                let Some(entry) = selected_entry.get() else {
+                    return ().into_any();
+                };
+                let mut lines = Vec::new();
+                if entry.id != entry.label && !entry.label.trim().is_empty() {
+                    lines.push(entry.id.clone());
+                }
+                if let Some(desc) = entry.description.as_ref().filter(|d| !d.trim().is_empty()) {
+                    lines.push(desc.trim().to_string());
+                }
+                if let Some(p) = entry.pricing {
+                    lines.push(
+                        i18n.tr(I18nKey::AgModelMetaPricing)()
+                            .replace("{in}", &price_per_million(p.prompt))
+                            .replace("{out}", &price_per_million(p.completion)),
+                    );
+                }
+                if lines.is_empty() {
+                    return ().into_any();
+                }
+                let title = if entry.label.trim().is_empty() {
+                    entry.id.clone()
+                } else {
+                    entry.label.clone()
+                };
+                view! {
+                    <div class="agent-model-picker__detail harness-muted" aria-live="polite">
+                        <span class="agent-model-picker__detail-title">{title}</span>
+                        {lines.into_iter().map(|line| view! {
+                            <span class="agent-model-picker__detail-line">{line}</span>
+                        }).collect_view()}
+                    </div>
+                }
+                .into_any()
+            }}
+        </div>
+    }
+}
+
+#[component]
+pub fn AgentProviderPane() -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let settings: RwSignal<Option<AgentProviderSettingsView>> = RwSignal::new(None);
+    let selected_provider = RwSignal::new(AgentProviderKind::Openrouter);
+    let custom_model = RwSignal::new(String::new());
+    let thinking_level = RwSignal::new(ThinkingLevel::Medium);
+    let model_entries: RwSignal<Vec<ProviderModelEntry>> = RwSignal::new(Vec::new());
+    let models_source = RwSignal::new(String::new());
+    let models_message: RwSignal<Option<String>> = RwSignal::new(None);
+    let busy = RwSignal::new(false);
+    let loading_models = RwSignal::new(false);
+    let status_msg: RwSignal<Option<String>> = RwSignal::new(None);
+    let error_msg: RwSignal<Option<String>> = RwSignal::new(None);
+    let provider_refresh_request: RwSignal<Option<AgentProviderKind>> = RwSignal::new(None);
+    let web_provider = RwSignal::new(WebProviderKind::None);
+    let baseline = RwSignal::new(AgentSettingsBaseline {
+        provider: AgentProviderKind::Openrouter,
+        model_id: String::new(),
+        thinking: ThinkingLevel::Medium,
+        web_provider: WebProviderKind::None,
+    });
+
+    let dirty = Memo::new(move |_| {
+        let b = baseline.get();
+        selected_provider.get() != b.provider
+            || custom_model.get() != b.model_id
+            || thinking_level.get() != b.thinking
+            || web_provider.get() != b.web_provider
+    });
+
+    let snapshot_baseline = move || AgentSettingsBaseline {
+        provider: selected_provider.get_untracked(),
+        model_id: custom_model.get_untracked(),
+        thinking: thinking_level.get_untracked(),
+        web_provider: web_provider.get_untracked(),
+    };
+
+    let apply_settings = move |view: AgentProviderSettingsView| {
+        selected_provider.set(view.provider);
+        custom_model.set(view.model_id.clone());
+        thinking_level.set(view.thinking_level);
+        model_entries.set(provider_cache(&view, view.provider));
+        settings.set(Some(view));
+        baseline.update(|b| {
+            b.provider = selected_provider.get_untracked();
+            b.model_id = custom_model.get_untracked();
+            b.thinking = thinking_level.get_untracked();
+        });
+    };
+
+    let apply_web = move |view: AgentWebSettingsView| {
+        web_provider.set(view.settings.provider);
+        baseline.update(|b| {
+            b.web_provider = web_provider.get_untracked();
+        });
+    };
+
+    Effect::new(move |_| {
+        if !is_tauri_shell() {
+            return;
+        }
+        leptos::task::spawn_local(async move {
+            match agent_settings_get().await {
+                Ok(view) => {
+                    error_msg.set(None);
+                    apply_settings(view);
+                }
+                Err(err) => error_msg.set(Some(err)),
+            }
+            match agent_web_settings_get().await {
+                Ok(view) => apply_web(view),
+                Err(err) => error_msg.set(Some(err)),
+            }
+        });
+    });
+
+    let refresh_models = move |provider: AgentProviderKind| {
+        loading_models.set(true);
+        models_message.set(None);
+        leptos::task::spawn_local(async move {
+            match agent_provider_models(provider).await {
+                Ok(ProviderModelsResponse {
+                    entries,
+                    source,
+                    used_fallback,
+                    message,
+                    ..
+                }) => {
+                    model_entries.set(entries);
+                    models_source.set(source);
+                    models_message.set(message.or_else(|| {
+                        if used_fallback {
+                            Some(i18n.tr(I18nKey::AgModelsFallback)().to_string())
+                        } else {
+                            None
+                        }
+                    }));
+                }
+                Err(err) => error_msg.set(Some(err)),
+            }
+            loading_models.set(false);
+        });
+    };
+
+    Effect::new(move |_| {
+        let Some(provider) = provider_refresh_request.get() else {
+            return;
+        };
+        provider_refresh_request.set(None);
+        refresh_models(provider);
+    });
+
+    let save = move || {
+        if !dirty.get_untracked() || busy.get_untracked() {
+            return;
+        }
+        busy.set(true);
+        error_msg.set(None);
+        status_msg.set(None);
+        let provider = selected_provider.get_untracked();
+        let model_id = custom_model.get_untracked();
+        let level = thinking_level.get_untracked();
+        let web = web_provider.get_untracked();
+        leptos::task::spawn_local(async move {
+            let mut err: Option<String> = None;
+            match agent_settings_save(provider, model_id, level).await {
+                Ok(view) => apply_settings(view),
+                Err(e) => err = Some(e),
+            }
+            match agent_web_settings_save(web).await {
+                Ok(view) => apply_web(view),
+                Err(e) => err = err.or(Some(e)),
+            }
+            if let Some(e) = err {
+                error_msg.set(Some(e));
+            } else {
+                baseline.set(snapshot_baseline());
+                status_msg.set(Some(i18n.tr(I18nKey::AgSaveProviderDone)().to_string()));
+            }
+            busy.set(false);
+        });
+    };
+
+    view! {
+        <article class="harness-pane agent-provider-pane">
+            <h3 class="harness-pane-title">
+                <span class="harness-pane-title__icon" aria-hidden="true">
+                    <LxIcon icon=icondata::LuCpu width="1.02rem" height="1.02rem" />
+                </span>
+                <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::AgProviderHeading)()}</span>
+            </h3>
+
+            <section class="harness-subpane">
+                <h4 class="harness-pane-subhead">
+                    <span class="harness-pane-subhead__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuPlug width="0.82rem" height="0.82rem" />
+                    </span>
+                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgSectionInference)()}</span>
+                </h4>
+                <div class="agent-provider-pane__picker-grid">
+                    <label class="agent-provider-pane__field">
+                        <span class="harness-field-label">
+                            <span class="harness-field-label__icon" aria-hidden="true">
+                                <LxIcon icon=icondata::LuPlug width="0.82rem" height="0.82rem" />
+                            </span>
+                            <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgProviderField)()}</span>
+                        </span>
+                        <ProviderPicker
+                            selected_provider=selected_provider
+                            settings=settings
+                            model_entries=model_entries
+                            provider_refresh_request=provider_refresh_request
+                        />
+                    </label>
+                    <label class="agent-provider-pane__field">
+                        <span class="harness-field-label">
+                            <span class="harness-field-label__icon" aria-hidden="true">
+                                <LxIcon icon=icondata::LuGauge width="0.82rem" height="0.82rem" />
+                            </span>
+                            <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgThinkingField)()}</span>
+                        </span>
+                        <ThinkingLevelPicker selected=thinking_level />
+                    </label>
+                </div>
+                <div class="agent-provider-pane__key-row harness-muted">
+                    <span>{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</span>
+                    <span class="agent-provider-pane__key-status">
+                        {move || {
+                            settings
+                                .get()
+                                .map(|view| provider_key_status_text(&i18n, &view, selected_provider.get()))
+                                .unwrap_or_else(|| i18n.tr(I18nKey::AgApiKeyMissing)().to_string())
+                        }}
+                    </span>
+                </div>
+            </section>
+
+            <section class="harness-subpane">
+                <h4 class="harness-pane-subhead">
+                    <span class="harness-pane-subhead__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuPackage2 width="0.82rem" height="0.82rem" />
+                    </span>
+                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgSectionModel)()}</span>
+                </h4>
+                <label class="harness-stack">
+                    <span class="harness-field-label">
+                        <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgModelField)()}</span>
+                    </span>
+                    <AgentModelPicker
+                        model_id=custom_model
+                        model_entries=model_entries
+                        loading_models=loading_models
+                    />
+                </label>
+                <div class="agent-provider-pane__actions">
+                    <button
+                        type="button"
+                        class="workbench-mini-btn"
+                        disabled=move || loading_models.get() || !is_tauri_shell()
+                        on:click=move |_| refresh_models(selected_provider.get_untracked())
+                    >
+                        <span class="harness-btn-inline">
+                            <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
+                            <span>{move || if loading_models.get() {
+                                i18n.tr(I18nKey::AgModelsLoading)().to_string()
+                            } else {
+                                i18n.tr(I18nKey::AgModelsRefresh)().to_string()
+                            }}</span>
+                        </span>
+                    </button>
+                    <small class="harness-muted">
+                        {move || match models_source.get().as_str() {
+                            "live" => i18n.tr(I18nKey::AgModelsSourceLive)().to_string(),
+                            "cache" => i18n.tr(I18nKey::AgModelsSourceCache)().to_string(),
+                            "curated" | "fallback" => i18n.tr(I18nKey::AgModelsSourceCurated)().to_string(),
+                            _ => String::new(),
+                        }}
+                    </small>
+                </div>
+                <Show when=move || models_message.get().is_some()>
+                    <p class="harness-muted">{move || models_message.get().unwrap_or_default()}</p>
+                </Show>
+            </section>
+
+            <section class="harness-subpane">
+                <h4 class="harness-pane-subhead">
+                    <span class="harness-pane-subhead__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuGlobe width="0.9rem" height="0.9rem" />
+                    </span>
+                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgWebToolsHeading)()}</span>
+                </h4>
+                <div class="app-prefs-toggle-grid">
+                    <div class="app-prefs-toggle-cell">
+                        <label class="app-prefs-radio">
+                            <input
+                                type="radio"
+                                name="agent-web-provider"
+                                prop:checked=move || web_provider.get() == WebProviderKind::None
+                                on:change=move |_| web_provider.set(WebProviderKind::None)
+                            />
+                            <span>{move || i18n.tr(I18nKey::AgWebProviderNone)()}</span>
+                        </label>
+                    </div>
+                    <div class="app-prefs-toggle-cell">
+                        <label class="app-prefs-radio">
+                            <input
+                                type="radio"
+                                name="agent-web-provider"
+                                prop:checked=move || web_provider.get() == WebProviderKind::Tavily
+                                on:change=move |_| web_provider.set(WebProviderKind::Tavily)
+                            />
+                            <span>{move || i18n.tr(I18nKey::AgWebProviderTavily)()}</span>
+                        </label>
+                    </div>
+                    <div class="app-prefs-toggle-cell">
+                        <label class="app-prefs-radio">
+                            <input
+                                type="radio"
+                                name="agent-web-provider"
+                                prop:checked=move || web_provider.get() == WebProviderKind::Brave
+                                on:change=move |_| web_provider.set(WebProviderKind::Brave)
+                            />
+                            <span>{move || i18n.tr(I18nKey::AgWebProviderBrave)()}</span>
+                        </label>
+                    </div>
+                </div>
+                <p class="app-prefs-hint">{move || i18n.tr(I18nKey::ApiKeysManageHintWeb)()}</p>
+            </section>
+
+            <Show when=move || status_msg.with(|m| m.is_some())>
+                <p class="harness-status">{move || status_msg.get().unwrap_or_default()}</p>
+            </Show>
+            <Show when=move || error_msg.with(|m| m.is_some())>
+                <p class="harness-error-text">{move || error_msg.get().unwrap_or_default()}</p>
+            </Show>
+
+            <footer class="settings-pane-footer harness-row-gap">
+                <button
+                    type="button"
+                    class="workbench-mini-btn workbench-mini-btn--primary"
+                    disabled=move || busy.get() || !dirty.get() || !is_tauri_shell()
+                    on:click=move |_| save()
+                >
+                    <span class="harness-btn-inline">
+                        <LxIcon icon=icondata::LuSave width="0.78rem" height="0.78rem" />
+                        <span>{move || i18n.tr(I18nKey::BtnSave)()}</span>
+                    </span>
+                </button>
+            </footer>
+        </article>
+    }
+}
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index 41fedf8..4bfcb00 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -13,11 +13,8 @@ use super::update_service::{UpdateService, UpdateUiStatus};
 use crate::i18n::{lookup, I18nKey, Locale, APP_LOCALES};
 use crate::service::I18nService;
 use crate::tauri_bridge::{
-    agent_hooks_status, agent_provider_models, agent_settings_get, agent_settings_save,
-    agent_web_settings_get, agent_web_settings_save, install_agent_hooks, is_tauri_shell,
-    uninstall_agent_hooks, AgentHooksReport, AgentProviderKind, AgentProviderSettingsView,
-    AgentWebSettingsView, ProviderModelEntry, ProviderModelsResponse, ThinkingLevel,
-    WebProviderKind,
+    agent_hooks_status, install_agent_hooks, is_tauri_shell, uninstall_agent_hooks,
+    AgentHooksReport,
 };
 use gloo_timers::future::TimeoutFuture;
 use js_sys::Date;
@@ -714,7 +711,7 @@ pub fn SettingsDock(
                         <crate::workbench::WorkspaceSettingsPane wb=wb embed=embed />
                     }.into_any(),
                     HarnessSettingsCategory::AgentProvider => view! {
-                        <AgentProviderPane />
+                        <crate::workbench::AgentProviderPane />
                     }.into_any(),
                     HarnessSettingsCategory::Memory => view! {
                         <MemorySettingsPane wb=wb />
@@ -1294,595 +1291,6 @@ fn normalize_settings_color(raw: &str) -> String {
     }
 }
 
-fn provider_label(i18n: &I18nService, provider: AgentProviderKind) -> String {
-    let key = match provider {
-        AgentProviderKind::Openrouter => I18nKey::AgProviderOpenrouter,
-        AgentProviderKind::Anthropic => I18nKey::AgProviderAnthropic,
-        AgentProviderKind::Openai => I18nKey::AgProviderOpenai,
-    };
-    i18n.tr(key)().to_string()
-}
-
-fn provider_icon_url(provider: AgentProviderKind) -> &'static str {
-    match provider {
-        AgentProviderKind::Openrouter => "/public/brand-icons/openrouter.svg",
-        AgentProviderKind::Anthropic => "/public/brand-icons/anthropic.svg",
-        AgentProviderKind::Openai => "/public/brand-icons/openai.svg",
-    }
-}
-
-fn thinking_levels() -> [ThinkingLevel; 5] {
-    [
-        ThinkingLevel::Off,
-        ThinkingLevel::Low,
-        ThinkingLevel::Medium,
-        ThinkingLevel::High,
-        ThinkingLevel::Max,
-    ]
-}
-
-fn thinking_label(i18n: &I18nService, level: ThinkingLevel) -> String {
-    let key = match level {
-        ThinkingLevel::Off => I18nKey::AgThinkingOff,
-        ThinkingLevel::Low => I18nKey::AgThinkingLow,
-        ThinkingLevel::Medium => I18nKey::AgThinkingMedium,
-        ThinkingLevel::High => I18nKey::AgThinkingHigh,
-        ThinkingLevel::Max => I18nKey::AgThinkingMax,
-    };
-    i18n.tr(key)().to_string()
-}
-
-fn provider_key_configured(view: &AgentProviderSettingsView, provider: AgentProviderKind) -> bool {
-    view.key_statuses
-        .iter()
-        .find(|status| status.provider == provider)
-        .map(|status| status.configured)
-        .unwrap_or(false)
-}
-
-fn provider_key_mask(
-    view: &AgentProviderSettingsView,
-    provider: AgentProviderKind,
-) -> Option<String> {
-    view.key_statuses
-        .iter()
-        .find(|status| status.provider == provider)
-        .and_then(|status| status.masked_value.clone())
-}
-
-fn provider_key_status_text(
-    i18n: &I18nService,
-    view: &AgentProviderSettingsView,
-    provider: AgentProviderKind,
-) -> String {
-    if provider_key_configured(view, provider) {
-        if let Some(mask) = provider_key_mask(view, provider) {
-            format!("{} ({mask})", i18n.tr(I18nKey::AgApiKeyConfigured)())
-        } else {
-            i18n.tr(I18nKey::AgApiKeyConfigured)().to_string()
-        }
-    } else {
-        i18n.tr(I18nKey::AgApiKeyMissing)().to_string()
-    }
-}
-
-fn provider_cache(
-    view: &AgentProviderSettingsView,
-    provider: AgentProviderKind,
-) -> Vec<ProviderModelEntry> {
-    match provider {
-        AgentProviderKind::Openrouter => view.model_cache_openrouter.clone(),
-        AgentProviderKind::Anthropic => view.model_cache_anthropic.clone(),
-        AgentProviderKind::Openai => view.model_cache_openai.clone(),
-    }
-}
-
-fn hook_brand_icon(agent: &str) -> Option<&'static str> {
-    match agent {
-        "claude" => Some("/public/brand-icons/anthropic.svg"),
-        "codex" => Some("/public/brand-icons/openai.svg"),
-        "gemini" => Some("/public/brand-icons/gemini.svg"),
-        "cursor" => Some("/public/brand-icons/cursor.svg"),
-        _ => None,
-    }
-}
-
-fn focus_provider_option(provider: AgentProviderKind) {
-    let id = format!("provider-option-{}", provider.as_str());
-    let Some(doc) = web_sys::window().and_then(|w| w.document()) else {
-        return;
-    };
-    let Some(el) = doc.get_element_by_id(&id) else {
-        return;
-    };
-    let Ok(button) = el.dyn_into::<web_sys::HtmlElement>() else {
-        return;
-    };
-    let _ = button.focus();
-}
-
-fn next_provider(provider: AgentProviderKind) -> AgentProviderKind {
-    match provider {
-        AgentProviderKind::Openrouter => AgentProviderKind::Anthropic,
-        AgentProviderKind::Anthropic => AgentProviderKind::Openai,
-        AgentProviderKind::Openai => AgentProviderKind::Openrouter,
-    }
-}
-
-fn prev_provider(provider: AgentProviderKind) -> AgentProviderKind {
-    match provider {
-        AgentProviderKind::Openrouter => AgentProviderKind::Openai,
-        AgentProviderKind::Anthropic => AgentProviderKind::Openrouter,
-        AgentProviderKind::Openai => AgentProviderKind::Anthropic,
-    }
-}
-
-#[component]
-fn ProviderPicker(
-    selected_provider: RwSignal<AgentProviderKind>,
-    settings: RwSignal<Option<AgentProviderSettingsView>>,
-    model_entries: RwSignal<Vec<ProviderModelEntry>>,
-    provider_refresh_request: RwSignal<Option<AgentProviderKind>>,
-) -> impl IntoView {
-    let i18n = expect_context::<I18nService>();
-    let open = RwSignal::new(false);
-
-    let choose = move |provider: AgentProviderKind| {
-        selected_provider.set(provider);
-        if let Some(view) = settings.get_untracked() {
-            model_entries.set(provider_cache(&view, provider));
-        }
-        open.set(false);
-        provider_refresh_request.set(Some(provider));
-    };
-
-    view! {
-        <div class="harness-provider-picker">
-            <button
-                type="button"
-                class="harness-provider-trigger"
-                aria-haspopup="listbox"
-                aria-expanded=move || if open.get() { "true" } else { "false" }
-                on:click=move |_| {
-                    let next = !open.get_untracked();
-                    open.set(next);
-                    if next {
-                        let provider = selected_provider.get_untracked();
-                        leptos::task::spawn_local(async move {
-                            TimeoutFuture::new(0).await;
-                            focus_provider_option(provider);
-                        });
-                    }
-                }
-                on:keydown=move |ev: web_sys::KeyboardEvent| {
-                    match ev.key().as_str() {
-                        "ArrowDown" | "Enter" | " " => {
-                            ev.prevent_default();
-                            open.set(true);
-                            let provider = selected_provider.get_untracked();
-                            leptos::task::spawn_local(async move {
-                                TimeoutFuture::new(0).await;
-                                focus_provider_option(provider);
-                            });
-                        }
-                        "ArrowUp" => {
-                            ev.prevent_default();
-                            open.set(true);
-                            let provider = prev_provider(selected_provider.get_untracked());
-                            leptos::task::spawn_local(async move {
-                                TimeoutFuture::new(0).await;
-                                focus_provider_option(provider);
-                            });
-                        }
-                        "Escape" => open.set(false),
-                        _ => {}
-                    }
-                }
-            >
-                <span class="harness-provider-trigger__main">
-                    <span class="harness-provider-trigger__brand">
-                        <img class="harness-provider-trigger__img" src=move || provider_icon_url(selected_provider.get()) alt="" />
-                    </span>
-                    <span>{move || provider_label(&i18n, selected_provider.get())}</span>
-                </span>
-                <span class="harness-provider-trigger__caret">"▾"</span>
-            </button>
-
-            <Show when=move || open.get()>
-                <div class="harness-provider-menu" role="listbox">
-                    {move || {
-                        [AgentProviderKind::Openrouter, AgentProviderKind::Anthropic, AgentProviderKind::Openai]
-                            .into_iter()
-                            .map(|provider| {
-                                view! {
-                                    <button
-                                        id=format!("provider-option-{}", provider.as_str())
-                                        type="button"
-                                        role="option"
-                                        class="harness-provider-option"
-                                        class:harness-provider-option--active=move || selected_provider.get() == provider
-                                        aria-selected=move || if selected_provider.get() == provider { "true" } else { "false" }
-                                        on:click=move |_| choose(provider)
-                                        on:keydown=move |ev: web_sys::KeyboardEvent| {
-                                            match ev.key().as_str() {
-                                                "ArrowDown" => {
-                                                    ev.prevent_default();
-                                                    focus_provider_option(next_provider(provider));
-                                                }
-                                                "ArrowUp" => {
-                                                    ev.prevent_default();
-                                                    focus_provider_option(prev_provider(provider));
-                                                }
-                                                "Enter" | " " => {
-                                                    ev.prevent_default();
-                                                    choose(provider);
-                                                }
-                                                "Escape" => {
-                                                    ev.prevent_default();
-                                                    open.set(false);
-                                                }
-                                                _ => {}
-                                            }
-                                        }
-                                    >
-                                        <span class="harness-provider-option__brand">
-                                            <img class="harness-provider-option__img" src=provider_icon_url(provider) alt="" />
-                                        </span>
-                                        <span>{provider_label(&i18n, provider)}</span>
-                                    </button>
-                                }
-                            })
-                            .collect_view()
-                    }}
-                </div>
-            </Show>
-        </div>
-    }
-}
-
-#[component]
-fn AgentProviderPane() -> impl IntoView {
-    let i18n = expect_context::<I18nService>();
-    let settings: RwSignal<Option<AgentProviderSettingsView>> = RwSignal::new(None);
-    let selected_provider = RwSignal::new(AgentProviderKind::Openrouter);
-    let custom_model = RwSignal::new(String::new());
-    let thinking_level = RwSignal::new(ThinkingLevel::Medium);
-    let model_entries: RwSignal<Vec<ProviderModelEntry>> = RwSignal::new(Vec::new());
-    let models_source = RwSignal::new(String::new());
-    let models_message: RwSignal<Option<String>> = RwSignal::new(None);
-    let busy = RwSignal::new(false);
-    let loading_models = RwSignal::new(false);
-    let status_msg: RwSignal<Option<String>> = RwSignal::new(None);
-    let error_msg: RwSignal<Option<String>> = RwSignal::new(None);
-    let provider_refresh_request: RwSignal<Option<AgentProviderKind>> = RwSignal::new(None);
-    let web_settings: RwSignal<Option<AgentWebSettingsView>> = RwSignal::new(None);
-    let web_provider = RwSignal::new(WebProviderKind::None);
-    let web_status_msg: RwSignal<Option<String>> = RwSignal::new(None);
-
-    let apply_web_settings = move |view: AgentWebSettingsView| {
-        web_provider.set(view.settings.provider);
-        web_settings.set(Some(view));
-    };
-
-    let apply_settings = move |view: AgentProviderSettingsView| {
-        selected_provider.set(view.provider);
-        custom_model.set(view.model_id.clone());
-        thinking_level.set(view.thinking_level);
-        model_entries.set(provider_cache(&view, view.provider));
-        settings.set(Some(view));
-    };
-
-    Effect::new(move |_| {
-        if !is_tauri_shell() {
-            return;
-        }
-        leptos::task::spawn_local(async move {
-            match agent_settings_get().await {
-                Ok(view) => {
-                    error_msg.set(None);
-                    status_msg.set(None);
-                    apply_settings(view);
-                }
-                Err(err) => error_msg.set(Some(err)),
-            }
-            match agent_web_settings_get().await {
-                Ok(view) => {
-                    web_status_msg.set(None);
-                    apply_web_settings(view);
-                }
-                Err(err) => error_msg.set(Some(err)),
-            }
-        });
-    });
-
-    let refresh_models = move |provider: AgentProviderKind| {
-        loading_models.set(true);
-        models_message.set(None);
-        error_msg.set(None);
-        leptos::task::spawn_local(async move {
-            match agent_provider_models(provider).await {
-                Ok(ProviderModelsResponse {
-                    provider: _,
-                    entries,
-                    source,
-                    used_fallback,
-                    message,
-                }) => {
-                    model_entries.set(entries);
-                    models_source.set(source);
-                    models_message.set(message.or_else(|| {
-                        if used_fallback {
-                            Some(i18n.tr(I18nKey::AgModelsFallback)().to_string())
-                        } else {
-                            None
-                        }
-                    }));
-                }
-                Err(err) => error_msg.set(Some(err)),
-            }
-            loading_models.set(false);
-        });
-    };
-
-    Effect::new(move |_| {
-        let Some(provider) = provider_refresh_request.get() else {
-            return;
-        };
-        provider_refresh_request.set(None);
-        refresh_models(provider);
-    });
-
-    view! {
-        <article class="harness-pane">
-            <h3 class="harness-pane-title">
-                <span class="harness-pane-title__icon" aria-hidden="true">
-                    <LxIcon icon=icondata::LuCpu width="1.02rem" height="1.02rem" />
-                </span>
-                <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::AgProviderHeading)()}</span>
-            </h3>
-            <div class="harness-provider-grid">
-                <div class="harness-stack">
-                    <span class="harness-field-label">
-                        <span class="harness-field-label__icon" aria-hidden="true">
-                            <LxIcon icon=icondata::LuPlug width="0.82rem" height="0.82rem" />
-                        </span>
-                        <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgProviderField)()}</span>
-                    </span>
-                    <ProviderPicker
-                        selected_provider=selected_provider
-                        settings=settings
-                        model_entries=model_entries
-                        provider_refresh_request=provider_refresh_request
-                    />
-                </div>
-
-                <label class="harness-stack">
-                    <span class="harness-field-label">
-                        <span class="harness-field-label__icon" aria-hidden="true">
-                            <LxIcon icon=icondata::LuGauge width="0.82rem" height="0.82rem" />
-                        </span>
-                        <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgThinkingField)()}</span>
-                    </span>
-                    <select
-                        class="workbench-plain-input"
-                        prop:value=move || format!("{:?}", thinking_level.get()).to_ascii_lowercase()
-                        on:change=move |ev| {
-                            if let Some(value) = select_str(&ev) {
-                                let level = match value.as_str() {
-                                    "off" => ThinkingLevel::Off,
-                                    "low" => ThinkingLevel::Low,
-                                    "high" => ThinkingLevel::High,
-                                    "max" => ThinkingLevel::Max,
-                                    _ => ThinkingLevel::Medium,
-                                };
-                                thinking_level.set(level);
-                            }
-                        }
-                    >
-                        {move || {
-                            thinking_levels()
-                                .into_iter()
-                                .map(|level| {
-                                    let value = format!("{:?}", level).to_ascii_lowercase();
-                                    view! { <option value=value>{thinking_label(&i18n, level)}</option> }
-                                })
-                                .collect_view()
-                        }}
-                    </select>
-                </label>
-            </div>
-
-            <label class="harness-stack">
-                <span class="harness-field-label">
-                    <span class="harness-field-label__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuPackage2 width="0.82rem" height="0.82rem" />
-                    </span>
-                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgModelField)()}</span>
-                </span>
-                <input
-                    class="workbench-plain-input"
-                    type="text"
-                    list="blxcode-agent-models"
-                    prop:value=move || custom_model.get()
-                    on:input=move |ev| {
-                        if let Some(value) = input_str(&ev) {
-                            custom_model.set(value);
-                        }
-                    }
-                />
-                <datalist id="blxcode-agent-models">
-                    {move || {
-                        model_entries
-                            .get()
-                            .into_iter()
-                            .map(|entry| view! { <option value=entry.id.clone()></option> })
-                            .collect_view()
-                    }}
-                </datalist>
-            </label>
-
-            <div class="harness-row-gap">
-                <button
-                    type="button"
-                    class="workbench-mini-btn"
-                    prop:disabled=move || loading_models.get() || !is_tauri_shell()
-                    on:click=move |_| refresh_models(selected_provider.get_untracked())
-                >
-                    <span class="harness-btn-inline">
-                        <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
-                        <span>{move || if loading_models.get() {
-                            i18n.tr(I18nKey::AgModelsLoading)().to_string()
-                        } else {
-                            i18n.tr(I18nKey::AgModelsRefresh)().to_string()
-                        }}</span>
-                    </span>
-                </button>
-                <small class="harness-muted">
-                    {move || match models_source.get().as_str() {
-                        "live" => i18n.tr(I18nKey::AgModelsSourceLive)().to_string(),
-                        "cache" => i18n.tr(I18nKey::AgModelsSourceCache)().to_string(),
-                        "curated" | "fallback" => i18n.tr(I18nKey::AgModelsSourceCurated)().to_string(),
-                        _ => String::new(),
-                    }}
-                </small>
-            </div>
-
-            <Show when=move || models_message.get().is_some()>
-                <p class="harness-muted">{move || models_message.get().unwrap_or_default()}</p>
-            </Show>
-
-            <section class="harness-subpane">
-                <h4 class="harness-pane-subhead">
-                    <span class="harness-pane-subhead__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuKeyRound width="0.9rem" height="0.9rem" />
-                    </span>
-                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgApiKeyField)()}</span>
-                </h4>
-                <p class="harness-muted">{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</p>
-                <small class="harness-muted">
-                    {move || {
-                        settings
-                            .get()
-                            .map(|view| provider_key_status_text(&i18n, &view, selected_provider.get()))
-                            .unwrap_or_else(|| i18n.tr(I18nKey::AgApiKeyMissing)().to_string())
-                    }}
-                </small>
-            </section>
-
-            <div class="harness-row-gap">
-                <button
-                    type="button"
-                    class="workbench-mini-btn workbench-mini-btn--primary"
-                    prop:disabled=move || busy.get() || !is_tauri_shell()
-                    on:click=move |_| {
-                        let provider = selected_provider.get_untracked();
-                        let model_id = custom_model.get_untracked();
-                        let level = thinking_level.get_untracked();
-                        busy.set(true);
-                        error_msg.set(None);
-                        leptos::task::spawn_local(async move {
-                            match agent_settings_save(provider, model_id, level).await {
-                                Ok(view) => {
-                                    status_msg.set(Some(i18n.tr(I18nKey::AgSaveProviderDone)().to_string()));
-                                    apply_settings(view);
-                                }
-                                Err(err) => error_msg.set(Some(err)),
-                            }
-                            busy.set(false);
-                        });
-                    }
-                >
-                    <span class="harness-btn-inline">
-                        <LxIcon icon=icondata::LuSave width="0.78rem" height="0.78rem" />
-                        <span>{move || i18n.tr(I18nKey::AgSaveProvider)()}</span>
-                    </span>
-                </button>
-            </div>
-
-            <section class="harness-subpane">
-                <h4 class="harness-pane-subhead">
-                    <span class="harness-pane-subhead__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuGlobe width="0.9rem" height="0.9rem" />
-                    </span>
-                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgWebToolsHeading)()}</span>
-                </h4>
-                <p class="harness-muted">{move || i18n.tr(I18nKey::AgWebToolsDescription)()}</p>
-                <label class="harness-stack">
-                    <span class="harness-field-label">
-                        <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgWebProviderField)()}</span>
-                    </span>
-                    <select
-                        class="workbench-plain-input"
-                        prop:value=move || web_provider_kind_value(web_provider.get())
-                        on:change=move |ev| {
-                            if let Some(value) = select_str(&ev) {
-                                web_provider.set(web_provider_from_value(&value));
-                            }
-                        }
-                    >
-                        <option value="none">{move || i18n.tr(I18nKey::AgWebProviderNone)()}</option>
-                        <option value="tavily">{move || i18n.tr(I18nKey::AgWebProviderTavily)()}</option>
-                        <option value="brave">{move || i18n.tr(I18nKey::AgWebProviderBrave)()}</option>
-                    </select>
-                </label>
-                <p class="harness-muted">{move || i18n.tr(I18nKey::ApiKeysManageHintWeb)()}</p>
-                <div class="harness-row-gap">
-                    <button
-                        type="button"
-                        class="workbench-mini-btn workbench-mini-btn--primary"
-                        prop:disabled=move || busy.get() || !is_tauri_shell()
-                        on:click=move |_| {
-                            let provider = web_provider.get_untracked();
-                            busy.set(true);
-                            leptos::task::spawn_local(async move {
-                                match agent_web_settings_save(provider).await {
-                                    Ok(view) => {
-                                        web_status_msg.set(Some(i18n.tr(I18nKey::AgWebSaveDone)().to_string()));
-                                        apply_web_settings(view);
-                                    }
-                                    Err(err) => error_msg.set(Some(err)),
-                                }
-                                busy.set(false);
-                            });
-                        }
-                    >
-                        <span class="harness-btn-inline">
-                            <LxIcon icon=icondata::LuSave width="0.78rem" height="0.78rem" />
-                            <span>{move || i18n.tr(I18nKey::AgSaveProvider)()}</span>
-                        </span>
-                    </button>
-                </div>
-            </section>
-
-            <Show when=move || web_status_msg.get().is_some()>
-                <p class="harness-muted">{move || web_status_msg.get().unwrap_or_default()}</p>
-            </Show>
-            <Show when=move || status_msg.get().is_some()>
-                <p class="harness-muted">{move || status_msg.get().unwrap_or_default()}</p>
-            </Show>
-            <Show when=move || error_msg.get().is_some()>
-                <p class="harness-error-text">{move || error_msg.get().unwrap_or_default()}</p>
-            </Show>
-        </article>
-    }
-}
-
-fn web_provider_kind_value(kind: WebProviderKind) -> &'static str {
-    match kind {
-        WebProviderKind::None => "none",
-        WebProviderKind::Tavily => "tavily",
-        WebProviderKind::Brave => "brave",
-    }
-}
-
-fn web_provider_from_value(value: &str) -> WebProviderKind {
-    match value {
-        "tavily" => WebProviderKind::Tavily,
-        "brave" => WebProviderKind::Brave,
-        _ => WebProviderKind::None,
-    }
-}
-
 #[component]
 fn AgentHooksPanel() -> impl IntoView {
     let i18n = expect_context::<I18nService>();
diff --git a/src/workbench/mod.rs b/src/workbench/mod.rs
index b601d25..4b7feb8 100644
--- a/src/workbench/mod.rs
+++ b/src/workbench/mod.rs
@@ -3,6 +3,7 @@ mod agent_accent;
 mod agent_context_handoff;
 mod agent_panel;
 mod agent_timeline;
+mod agent_provider_pane;
 mod api_keys_pane;
 mod workspace_settings_pane;
 mod app_prefs;
@@ -35,6 +36,7 @@ mod update_service;
 mod workspace_panel;
 
 pub use agent_panel::AgentPanelDock;
+pub use agent_provider_pane::AgentProviderPane;
 pub use api_keys_pane::ApiKeysPane;
 pub use workspace_settings_pane::WorkspaceSettingsPane;
 pub use browser_tab::{BrowserTabDock, EmbeddedBrowserGlue};

From 3b8125d7c23a65922e9826754f32cb4d3531e840 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:11:54 +0200
Subject: [PATCH 23/48] feat(tauri_bridge, harness_ui, agent_provider_pane):
 enhance data structures and UI components

- Added `PartialEq` derive to `ProviderModelEntry` and `ModelPricing` structs for improved equality checks.
- Introduced a new function `hook_brand_icon` in `harness_ui.rs` to map agent names to their corresponding brand icons.
- Updated `AgentModelPicker` to use `Signal::derive` for selected entry, improving reactivity in the agent provider pane.
---
 src/tauri_bridge.rs                      |  2 ++
 src/workbench/agent_provider_pane/mod.rs |  3 ++-
 src/workbench/harness_ui.rs              | 10 ++++++++++
 3 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/tauri_bridge.rs b/src/tauri_bridge.rs
index c1c7ac6..23127af 100644
--- a/src/tauri_bridge.rs
+++ b/src/tauri_bridge.rs
@@ -334,6 +334,7 @@ pub enum ThinkingLevel {
 #[allow(dead_code)]
 #[derive(Clone, Debug, serde::Deserialize)]
 #[serde(rename_all = "camelCase")]
+#[derive(PartialEq)]
 pub struct ProviderModelEntry {
     pub id: String,
     pub label: String,
@@ -348,6 +349,7 @@ pub struct ProviderModelEntry {
 #[allow(dead_code)]
 #[derive(Clone, Copy, Debug, serde::Deserialize)]
 #[serde(rename_all = "camelCase")]
+#[derive(PartialEq)]
 pub struct ModelPricing {
     pub prompt: f64,
     pub completion: f64,
diff --git a/src/workbench/agent_provider_pane/mod.rs b/src/workbench/agent_provider_pane/mod.rs
index aa00ff7..e34a2ce 100644
--- a/src/workbench/agent_provider_pane/mod.rs
+++ b/src/workbench/agent_provider_pane/mod.rs
@@ -497,7 +497,8 @@ fn AgentModelPicker(
     let i18n = expect_context::<I18nService>();
     let open = RwSignal::new(false);
 
-    let selected_entry = Memo::new(move |_| find_model_entry(&model_entries.get(), &model_id.get()));
+    let selected_entry =
+        Signal::derive(move || find_model_entry(&model_entries.get(), &model_id.get()));
 
     let choose = move |id: String| {
         model_id.set(id);
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index 4bfcb00..a98852c 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -1291,6 +1291,16 @@ fn normalize_settings_color(raw: &str) -> String {
     }
 }
 
+fn hook_brand_icon(agent: &str) -> Option<&'static str> {
+    match agent {
+        "claude" => Some("/public/brand-icons/anthropic.svg"),
+        "codex" => Some("/public/brand-icons/openai.svg"),
+        "gemini" => Some("/public/brand-icons/gemini.svg"),
+        "cursor" => Some("/public/brand-icons/cursor.svg"),
+        _ => None,
+    }
+}
+
 #[component]
 fn AgentHooksPanel() -> impl IntoView {
     let i18n = expect_context::<I18nService>();

From 7df4ecde0fd9006e4d48a82b556f00e58e0b07bd Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:12:24 +0200
Subject: [PATCH 24/48] refactor(agent_provider_pane): simplify event handling
 in AgentModelPicker

- Removed the unused `select_str` function to clean up the codebase.
- Updated event handling in `AgentModelPicker` to use cloned identifiers for improved clarity and maintainability.
- Enhanced the reactivity of the component by ensuring consistent usage of cloned variables for event actions.
---
 src/workbench/agent_provider_pane/mod.rs | 21 +++++++--------------
 1 file changed, 7 insertions(+), 14 deletions(-)

diff --git a/src/workbench/agent_provider_pane/mod.rs b/src/workbench/agent_provider_pane/mod.rs
index e34a2ce..4b73452 100644
--- a/src/workbench/agent_provider_pane/mod.rs
+++ b/src/workbench/agent_provider_pane/mod.rs
@@ -28,13 +28,6 @@ fn input_str(ev: &web_sys::Event) -> Option<String> {
         .map(|i| i.value())
 }
 
-fn select_str(ev: &web_sys::Event) -> Option<String> {
-    ev.target()?
-        .dyn_into::<web_sys::HtmlSelectElement>()
-        .ok()
-        .map(|s| s.value())
-}
-
 fn provider_label(i18n: &I18nService, provider: AgentProviderKind) -> String {
     let key = match provider {
         AgentProviderKind::Openrouter => I18nKey::AgProviderOpenrouter,
@@ -553,6 +546,9 @@ fn AgentModelPicker(
                                     .into_iter()
                                     .map(|entry| {
                                         let id = entry.id.clone();
+                                        let id_active = id.clone();
+                                        let id_click = id.clone();
+                                        let id_key = id.clone();
                                         let meta = model_row_meta(&i18n, &entry);
                                         let title = if entry.label.trim().is_empty() {
                                             entry.id.clone()
@@ -565,21 +561,18 @@ fn AgentModelPicker(
                                                 type="button"
                                                 role="option"
                                                 class="harness-provider-option agent-model-option"
-                                                class:harness-provider-option--active=move || model_id.get() == id
-                                                aria-selected=move || if model_id.get() == id {
+                                                class:harness-provider-option--active=move || model_id.get() == id_active
+                                                aria-selected=move || if model_id.get() == id_active {
                                                     "true"
                                                 } else {
                                                     "false"
                                                 }
-                                                on:click={
-                                                    let id = id.clone();
-                                                    move |_| choose(id.clone())
-                                                }
+                                                on:click=move |_| choose(id_click.clone())
                                                 on:keydown=move |ev: web_sys::KeyboardEvent| {
                                                     match ev.key().as_str() {
                                                         "Enter" | " " => {
                                                             ev.prevent_default();
-                                                            choose(id.clone());
+                                                            choose(id_key.clone());
                                                         }
                                                         "Escape" => {
                                                             ev.prevent_default();

From 5e4824e210bad01f9b8e46ffb0ef4c0ab111a1e8 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:13:41 +0200
Subject: [PATCH 25/48] refactor(agent_provider_pane): streamline identifier
 usage in AgentModelPicker

- Replaced multiple cloned identifiers with a single `entry_id` variable for improved clarity.
- Enhanced event handling by ensuring consistent usage of cloned variables for button actions and keyboard events.
- Simplified the code structure to improve maintainability and readability.
---
 src/workbench/agent_provider_pane/mod.rs | 31 +++++++++++++++---------
 1 file changed, 19 insertions(+), 12 deletions(-)

diff --git a/src/workbench/agent_provider_pane/mod.rs b/src/workbench/agent_provider_pane/mod.rs
index 4b73452..c71a49f 100644
--- a/src/workbench/agent_provider_pane/mod.rs
+++ b/src/workbench/agent_provider_pane/mod.rs
@@ -545,10 +545,7 @@ fn AgentModelPicker(
                                 entries
                                     .into_iter()
                                     .map(|entry| {
-                                        let id = entry.id.clone();
-                                        let id_active = id.clone();
-                                        let id_click = id.clone();
-                                        let id_key = id.clone();
+                                        let entry_id = entry.id.clone();
                                         let meta = model_row_meta(&i18n, &entry);
                                         let title = if entry.label.trim().is_empty() {
                                             entry.id.clone()
@@ -557,22 +554,32 @@ fn AgentModelPicker(
                                         };
                                         view! {
                                             <button
-                                                id=model_option_dom_id(&id)
+                                                id=model_option_dom_id(&entry_id)
                                                 type="button"
                                                 role="option"
                                                 class="harness-provider-option agent-model-option"
-                                                class:harness-provider-option--active=move || model_id.get() == id_active
-                                                aria-selected=move || if model_id.get() == id_active {
-                                                    "true"
-                                                } else {
-                                                    "false"
+                                                class:harness-provider-option--active={
+                                                    let v = entry_id.clone();
+                                                    move || model_id.get() == v
+                                                }
+                                                aria-selected={
+                                                    let v = entry_id.clone();
+                                                    move || if model_id.get() == v {
+                                                        "true"
+                                                    } else {
+                                                        "false"
+                                                    }
+                                                }
+                                                on:click={
+                                                    let v = entry_id.clone();
+                                                    move |_| choose(v)
                                                 }
-                                                on:click=move |_| choose(id_click.clone())
                                                 on:keydown=move |ev: web_sys::KeyboardEvent| {
+                                                    let v = entry_id.clone();
                                                     match ev.key().as_str() {
                                                         "Enter" | " " => {
                                                             ev.prevent_default();
-                                                            choose(id_key.clone());
+                                                            choose(v);
                                                         }
                                                         "Escape" => {
                                                             ev.prevent_default();

From 23084bc0cbe31b7fe5ac38a44a8f345dba545e4a Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:15:15 +0200
Subject: [PATCH 26/48] refactor(agent_provider_pane): optimize identifier
 handling in AgentModelPicker

- Consolidated cloned identifiers for improved clarity and reduced redundancy.
- Enhanced event handling by ensuring consistent usage of identifiers for button actions and keyboard events.
- Streamlined the code structure to improve maintainability and readability.
---
 src/workbench/agent_provider_pane/mod.rs | 28 ++++++++++--------------
 1 file changed, 11 insertions(+), 17 deletions(-)

diff --git a/src/workbench/agent_provider_pane/mod.rs b/src/workbench/agent_provider_pane/mod.rs
index c71a49f..3323af0 100644
--- a/src/workbench/agent_provider_pane/mod.rs
+++ b/src/workbench/agent_provider_pane/mod.rs
@@ -546,6 +546,10 @@ fn AgentModelPicker(
                                     .into_iter()
                                     .map(|entry| {
                                         let entry_id = entry.id.clone();
+                                        let id_active = entry_id.clone();
+                                        let id_aria = entry_id.clone();
+                                        let id_click = entry_id.clone();
+                                        let id_key = entry_id.clone();
                                         let meta = model_row_meta(&i18n, &entry);
                                         let title = if entry.label.trim().is_empty() {
                                             entry.id.clone()
@@ -558,28 +562,18 @@ fn AgentModelPicker(
                                                 type="button"
                                                 role="option"
                                                 class="harness-provider-option agent-model-option"
-                                                class:harness-provider-option--active={
-                                                    let v = entry_id.clone();
-                                                    move || model_id.get() == v
-                                                }
-                                                aria-selected={
-                                                    let v = entry_id.clone();
-                                                    move || if model_id.get() == v {
-                                                        "true"
-                                                    } else {
-                                                        "false"
-                                                    }
-                                                }
-                                                on:click={
-                                                    let v = entry_id.clone();
-                                                    move |_| choose(v)
+                                                class:harness-provider-option--active=move || model_id.get() == id_active
+                                                aria-selected=move || if model_id.get() == id_aria {
+                                                    "true"
+                                                } else {
+                                                    "false"
                                                 }
+                                                on:click=move |_| choose(id_click.clone())
                                                 on:keydown=move |ev: web_sys::KeyboardEvent| {
-                                                    let v = entry_id.clone();
                                                     match ev.key().as_str() {
                                                         "Enter" | " " => {
                                                             ev.prevent_default();
-                                                            choose(v);
+                                                            choose(id_key.clone());
                                                         }
                                                         "Escape" => {
                                                             ev.prevent_default();

From 83a8a96fe7f0cc838bf6461898c1615b7061c5f3 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:27:26 +0200
Subject: [PATCH 27/48] feat(i18n): add new localization keys for agent
 provider settings

- Introduced new keys for AgColumnText, AgColumnImage, AgColumnVoice, and AgColumnVoiceSoon in multiple languages to enhance internationalization support.
- Updated the I18nKey enum and corresponding localization files for German, English, Spanish, French, Hungarian, Italian, Japanese, Korean, Polish, Portuguese, Russian, Chinese (Simplified and Traditional) to include these new keys.
- Improved the user experience by providing localized text for new agent provider settings in the UI.
---
 CHANGELOG.md                                  |   9 +-
 src/i18n/keys.rs                              |   4 +
 src/i18n/locales/de_de.rs                     |   4 +
 src/i18n/locales/en_us.rs                     |   4 +
 src/i18n/locales/es_es.rs                     |   4 +
 src/i18n/locales/fr_fr.rs                     |   4 +
 src/i18n/locales/hu_hu.rs                     |   4 +
 src/i18n/locales/it_it.rs                     |   4 +
 src/i18n/locales/ja_jp.rs                     |   4 +
 src/i18n/locales/ko_kr.rs                     |   4 +
 src/i18n/locales/pl_pl.rs                     |   4 +
 src/i18n/locales/pt_br.rs                     |   4 +
 src/i18n/locales/ru_ru.rs                     |   4 +
 src/i18n/locales/zh_cn.rs                     |   4 +
 src/i18n/locales/zh_tw.rs                     |   4 +
 .../agent_provider_pane.css                   |  36 ++++
 src/workbench/agent_provider_pane/mod.rs      | 167 +++++++++---------
 src/workbench/harness_image_pane/mod.rs       |  41 +++--
 src/workbench/harness_ui.rs                   |   5 +-
 19 files changed, 217 insertions(+), 97 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 34f7da5..ef34fc3 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,14 +15,15 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - **GitHub Releases auto-updater**: BLXCode now wires Tauri v2's updater/process plugins with a signed GitHub Releases `latest.json` endpoint, desktop IPC for `app_version`, `updater_check`, `updater_install_start`, progress polling, and relaunch, plus a Leptos startup banner and themed update dialog with release notes, progress, speed, retry, and restart states. Settings -> App gains a persisted startup auto-check toggle and manual update check. Release automation now supports the hybrid flow: macOS/Windows artifacts are built in GitHub Actions, Linux artifacts can be built locally to save CI cost, `.deb`/`.rpm` stay manual download assets, and signed updater-capable payloads are merged into one canonical `latest.json`. Tauri updater signing is documented as separate from Apple/Microsoft installer certificates.
 - **Boot loading screen**: new branded loading experience that paints before the WASM bundle is ready and stays on screen until the workbench is mounted. `index.html` ships a static `#blx-static-boot` section (logo, eyebrow, faux workbench preview, animated rail) so the first paint happens immediately on Trunk-served HTML; once Leptos mounts, the static node is removed and `BootLoadingScreen` (`src/boot_loading.rs`) takes over with phased copy (`Starting BLXCode` → `Restoring workspace` → `Opening workbench`). 306 lines of dedicated CSS in `styles.css` add the radial-gradient backdrop, frame-enter / sheen / rail keyframes, and the sidebar/main/panel preview skeleton. The `App` boot fallback now renders `<BootLoadingScreen phase=app_boot_phase.get()/>` instead of the prior empty `app-shell--boot` div.
 - **Agent question card (`harness.ask_user`)**: new client-side tool that lets the coordinator agent ask a clarifying multiple-choice question and receive the user's answer as a structured tool result. Backend registers `harness.ask_user` (`src-tauri/src/agent/tools.rs`) with a JSON schema accepting `question`, optional `header` (≤12 chars), 2–4 `options` (label + optional description), `multiSelect`, and `allowOther`; the tool sits in the `CoordinatorHarness` group (subagents excluded) and the system prompt instructs the model to use it only when 2–4 distinct options would unblock progress. Frontend adds a new `TimelineItem::AskUser` variant and `ask_user_card/` component (Angular-style folder with co-located CSS) rendering a chat bubble with numbered option buttons, single- or multi-select mode, an optional free-text “Other” field, and a cancel button; the card submits via `agent_submit_tool_result` and transitions the row state to `Answered { selected, other }` or `Cancelled` so the bubble stays visible with disabled controls. Persistence drops `Open` ask-user rows from the saved timeline (the awaiting backend loop is dead after reload). Tool-result payload: `{ "selected": [...], "other": "...", "cancelled": false }`; on cancel: `ok=false` + `{ "cancelled": true }`. 8 new i18n keys (`AgAskUser*`) added in `en_us.rs` and `de_de.rs`; other locales receive English placeholders pending a `render_i18n_locales_from_en.py` pass.
-- **Centralized API Keys settings**: new **Settings → API Keys** pane (`src/workbench/api_keys_pane/`) replaces per-provider key inputs that previously lived under Settings → Agent. Backend module `src-tauri/src/api_keys.rs` exposes `api_keys_status` (catalog of LLM + search providers with masked values, env-var hints, and `comingSoon` placeholders for Google / Mistral / Groq) and `api_keys_apply` (batch `set` / `delete` actions). Active keys still use the existing OS keyring accounts (`agent:*`, `agent:web:*`) with optional `BLX_*` env fallback; resolve order is keyring-first so UI-saved secrets are not overridden by shell env. The pane uses draft state, a single **Save** / **Discard** footer, row-level remove/undo, and shared `settings-field-card` styling. Agent → Provider and Web Tools now show relocation hints (`ApiKeysManageHint` / `ApiKeysManageHintWeb`) instead of password fields. 15 new `ApiKeys*` i18n keys in all 13 locales.
+- **Centralized API Keys settings**: new **Settings → API Keys** pane (`src/workbench/api_keys_pane/`) replaces per-provider key inputs that previously lived under Settings → Agent. Backend module `src-tauri/src/api_keys.rs` exposes `api_keys_status` (catalog of LLM + search providers with masked values, env-var hints, and `comingSoon` placeholders for Google / Mistral / **Grok xAI**) and `api_keys_apply` (batch `set` / `delete` actions). Active keys still use the existing OS keyring accounts (`agent:*`, `agent:web:*`) with optional `BLX_*` env fallback; resolve order is keyring-first so UI-saved secrets are not overridden by shell env. The pane uses draft state, a single **Save** / **Discard** footer, row-level remove/undo, and shared `settings-field-card` / `api-keys-row` styling with brand icons (`public/brand-icons/`: OpenRouter, Anthropic, OpenAI, Google/Gemini, Mistral, Groq, Tavily, Brave). 15 new `ApiKeys*` i18n keys in all 13 locales.
+- **BLXCode Agent settings (3-column grid)**: Settings → **BLXCode Agent** (renamed from Agent Provider; sidebar `HsCatProvider` → “BLXCode Agent”) is implemented in `src/workbench/agent_provider_pane/` with a responsive 3-column layout. **Text** (column 1): provider + thinking pickers (shared `harness-provider-trigger` dropdown chrome), API-key status line pointing at API Keys, rich model picker (menu rows show description or OpenRouter pricing; detail sub-row under selection; custom model-id field), refresh + source hint. **Image** (column 2): former Settings → Image pane extracted as `AgentImageColumn` in `harness_image_pane` (provider chips + `ModelPicker`, auto-save on change). **Voice** (column 3): placeholder copy until voice settings migrate here (full Voice tab remains for now). Web Tools sit below the grid as a 3-option radio grid (App-style); one **Save** / **Discard** footer persists text provider settings and web backend together. New i18n: `AgColumnText`, `AgColumnImage`, `AgColumnVoice`, `AgColumnVoiceSoon`, `AgSectionInference`, `AgSectionModel`, `AgModelMetaPricing`. Dedicated CSS: `agent_provider_pane.css`.
 - **Per-turn chat metrics & session cost**: tokens, TTFT, decode speed and resolved USD cost are now reported per conversation row instead of as a single aggregated footer. Each provider round emits `TurnUsage { kind: ModelRound, .. }` and each tool dispatch emits `TurnUsage { kind: ToolExec, call_id, .. }`, in both the main agent (`openrouter.rs`, `anthropic.rs`) and `subagent_runner.rs`. OpenRouter requests opt into `usage: { include: true }` and parse the native `usage.cost` field; everything else (including Anthropic Direct) is priced locally via a new `agent/pricing.rs` module — `ProviderModelEntry` carries `Option<ModelPricing>` populated from OpenRouter `/v1/models`, and direct-provider model ids route through a static id-mapping table (`claude-opus-4-7` → `anthropic/claude-opus-4.7`, etc.). A monotonic `turn_generation` counter on `AgentEngineState`, bumped by `agent_clear_conversation`, lets the frontend drop late events from a cancelled turn instead of polluting the fresh chat. New `workbench/agent_panel/turn_metrics_bar/` component renders the per-row `in · out · tok/s · ttft · $cost` strip under Assistant, Tool, the new synthetic `ModelDecision` row (tool-only rounds), and per-tool inside subagent cards. Subagent cards show aggregated round metrics in the header. The chat header gains a `SessionCostChip` with the resolved USD total + turn count, replacing the retired `ChatUsageFooter`. `ToolGroup` bundling is gone — each tool is its own timeline row now. 14 new `I18nKey` variants (`AgMetricsIn/Out/Ttft/CostUnknown/TurnsOne/TurnsMany/Tooltip*`, `AgMetricsBarAria`, `AgMetricsModelRound`, `AgSessionCostAria`) added in all 12 locale files. Pricing module ships with 7 unit tests.
 
 ### Changed
 
 - **`ChatUsageStats` schema migrated**: `total_cost_usd: f64` and `current_turn_generation: u64` added; legacy `ttft_sum_ms` / `ttft_sample_count` fields removed (TTFT now lives per-row). Older `workbench.json` snapshots deserialize cleanly thanks to `#[serde(default)]` and rewrite without the removed fields on next save. `record_chat_turn_usage` signature changed to accept the new `turn_generation` and `cost_usd` and to return `bool` so callers can drop stale events.
-- **Workspace settings layout aligned with API Keys**: the Workspace pane moved into `src/workbench/workspace_settings_pane/` and now mirrors the App / API Keys harness pattern — `harness-subpane` sections (**Paths & sandbox**, **Embedded browser**), `settings-field-card` rows with monospace path inputs, and one footer **Save** / **Discard** that persists default project directory, agent sandbox root, and embedded-browser URL together (replacing three inline Save/Apply buttons). New i18n keys `WsSectionPaths` and `WsSectionBrowser` in all locales. Shared footer/field CSS lives in `workspace_settings_pane.css` and is reused by the API Keys pane (`settings-pane-footer`, `settings-pane-dirty`).
-- **Settings panel restructured**: `AppSettingsPane` (`src/workbench/harness_ui.rs`) now reads top-to-bottom as Language → Keyboard shortcuts → Notifications → **Terminal hooks** → **App updates** (updates moved below hooks to put install actions closer to the per-agent hook list). Keyboard shortcuts and Notifications switched from single-column lists to 2-column grids (new `.app-prefs-shortcut-modes--grid` and `.app-prefs-toggle-grid`). Current version no longer renders inside a readonly `<input>` — it's now a styled `<dl>` row, and a sibling **Available version** row only appears when `UpdateService::available_version` is `Some`. Terminal hooks list (`.harness-hooks__list--grid`) lays out as 3 columns on wide screens, collapsing to 2 / 1 below 900 px / 600 px; status badges dropped from pill (`border-radius: 999px`) to sm (`4px`) rounding. The EULA status row was removed from the App pane (acceptance is still gated at boot; the field added no actionable signal here). Workspace pane changed the agent sandbox `<textarea>` to a single-line `<input>` and gained a new **Default project directory** field above it: persisted to `blxcode_default_project_dir_v1` via new `WorkbenchService::default_project_dir` signal + setters/persist, seeded from the user's home directory through a new `harness_user_home_dir` Tauri command (`src-tauri/src/commands.rs`) on first run. Inline workspace configuration (`start_inline_configure` and snapshot hydration) now prefills new workspace `cwd` from `default_project_dir`, falling back to the agent sandbox root only when blank — sandbox path is reserved for BLXCode Agent sandbox actions. New i18n keys `AppUpdateAvailableVersion`, `WsRootHint`, `WsDefaultProjectDirLabel/Placeholder/Hint` added across all 13 locale files (English authored; other locales carry English placeholders until `scripts/tools/render_i18n_locales_from_en.py` runs).
+- **Workspace settings layout aligned with API Keys**: the Workspace pane moved into `src/workbench/workspace_settings_pane/` and now mirrors the App / API Keys harness pattern — `harness-subpane` sections (**Paths & sandbox**, **Embedded browser**), `api-keys-list` / `api-keys-row` field cards with monospace path inputs, label→input spacing on `.api-keys-row__head`, and one footer **Save** / **Discard** (native `disabled` + `.workbench-mini-btn:disabled` styling) that persists default project directory, agent sandbox root, and embedded-browser URL together (replacing three inline Save/Apply buttons). New i18n keys `WsSectionPaths` and `WsSectionBrowser` in all locales. Shared footer/field CSS lives in `workspace_settings_pane.css` and `api_keys_pane.css` (`.settings-pane-footer`, `.settings-field-card`).
+- **Settings panel restructured**: `AppSettingsPane` (`src/workbench/harness_ui.rs`) now reads top-to-bottom as Language → Keyboard shortcuts → Notifications → **Terminal hooks** → **App updates** (updates moved below hooks to put install actions closer to the per-agent hook list). Keyboard shortcuts and Notifications switched from single-column lists to 2-column grids (new `.app-prefs-shortcut-modes--grid` and `.app-prefs-toggle-grid`). Current version no longer renders inside a readonly `<input>` — it's now a styled `<dl>` row, and a sibling **Available version** row only appears when `UpdateService::available_version` is `Some`. Terminal hooks list (`.harness-hooks__list--grid`) lays out as 3 columns on wide screens, collapsing to 2 / 1 below 900 px / 600 px; per-agent **status is icon-only** (check / X) with full text in `title` + `aria-label`, aligned to the end of the title row. The EULA status row was removed from the App pane (acceptance is still gated at boot; the field added no actionable signal here). Workspace pane changed the agent sandbox `<textarea>` to a single-line `<input>` and gained a new **Default project directory** field above it: persisted to `blxcode_default_project_dir_v1` via new `WorkbenchService::default_project_dir` signal + setters/persist, seeded from the user's home directory through a new `harness_user_home_dir` Tauri command (`src-tauri/src/commands.rs`) on first run. Inline workspace configuration (`start_inline_configure` and snapshot hydration) now prefills new workspace `cwd` from `default_project_dir`, falling back to the agent sandbox root only when blank — sandbox path is reserved for BLXCode Agent sandbox actions. New i18n keys `AppUpdateAvailableVersion`, `WsRootHint`, `WsDefaultProjectDirLabel/Placeholder/Hint` added across all 13 locale files (English authored; other locales carry English placeholders until `scripts/tools/render_i18n_locales_from_en.py` runs).
 
 ### Fixed
 
@@ -30,8 +31,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Removed
 
+- **Settings → Image sidebar entry**: image model configuration now lives in the middle column of **Settings → BLXCode Agent**; the dedicated Image category button was removed from the settings nav (legacy `HarnessSettingsCategory::Image` still routes to BLXCode Agent for old snapshots).
 - **Global `ChatUsageFooter`**: superseded by the per-row `TurnMetricsBar` + chat-header `SessionCostChip`.
 - **`compact_timeline` tool bundling**: `DisplayTimelineItem::ToolGroup`, `merge_consecutive_tools` and `aggregate_status` retired — each tool now renders as its own row carrying its own metrics bar.
+- **Per-provider API key fields in Agent settings**: keys are managed only under Settings → API Keys; the old Agent Provider password rows and duplicate Web Tools description were dropped in favour of short relocation hints.
 
 
 ## [0.2.1] - 2026-05-21
diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index 22c3630..6955c12 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -359,6 +359,10 @@ pub enum I18nKey {
     AgProviderHeading,
     AgSectionInference,
     AgSectionModel,
+    AgColumnText,
+    AgColumnImage,
+    AgColumnVoice,
+    AgColumnVoiceSoon,
     AgModelMetaPricing,
     AgProviderField,
     AgProviderOpenrouter,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index c3a70d5..e758cfc 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -351,6 +351,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inferenz",
         I18nKey::AgSectionModel => "Modell",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Bild",
+        I18nKey::AgColumnVoice => "Stimme",
+        I18nKey::AgColumnVoiceSoon => "Stimm-Einstellungen kommen hierher. Bis dahin: Tab „Stimme“.",
         I18nKey::AgModelMetaPricing => "{in} Eingabe / {out} Ausgabe pro 1M Token",
         I18nKey::AgProviderField => "Anbieter",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index 36afcea..52cdc6c 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -389,6 +389,10 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Provider",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index 522ff58..77b8eef 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -351,6 +351,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Proveedor",
         I18nKey::AgProviderOpenrouter => "enrutador abierto",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index e64017b..372d4ed 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -353,6 +353,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Fournisseur",
         I18nKey::AgProviderOpenrouter => "OuvrirRouter",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index 694d913..1e51575 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -351,6 +351,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Szolgáltató",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index eedbac6..634c21c 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -351,6 +351,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Fornitore",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index de33713..14d6cf9 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -345,6 +345,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "プロバイダー",
         I18nKey::AgProviderOpenrouter => "オープンルーター",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index f1f7ae0..786dc83 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -345,6 +345,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "공급자",
         I18nKey::AgProviderOpenrouter => "오픈라우터",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index 8fc18d1..0858ac0 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -349,6 +349,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Dostawca",
         I18nKey::AgProviderOpenrouter => "OtwórzRouter",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index 6dacd09..a22433e 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -351,6 +351,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Provedor",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index f713797..bfb158e 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -349,6 +349,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "Поставщик",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index e42bd20..facc593 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -343,6 +343,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "提供者",
         I18nKey::AgProviderOpenrouter => "开放路由器",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index e9ba746..03fec59 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -343,6 +343,10 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgProviderHeading => "BLXCode Agent",
         I18nKey::AgSectionInference => "Inference",
         I18nKey::AgSectionModel => "Model",
+        I18nKey::AgColumnText => "Text",
+        I18nKey::AgColumnImage => "Image",
+        I18nKey::AgColumnVoice => "Voice",
+        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
         I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
         I18nKey::AgProviderField => "提供者",
         I18nKey::AgProviderOpenrouter => "開放路由器",
diff --git a/src/workbench/agent_provider_pane/agent_provider_pane.css b/src/workbench/agent_provider_pane/agent_provider_pane.css
index 3eb13f9..8d83f6a 100644
--- a/src/workbench/agent_provider_pane/agent_provider_pane.css
+++ b/src/workbench/agent_provider_pane/agent_provider_pane.css
@@ -1,5 +1,41 @@
 /* BLXCode Agent settings pane */
 
+.agent-provider-pane__grid {
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 0.75rem;
+    align-items: stretch;
+}
+
+@media (max-width: 1100px) {
+    .agent-provider-pane__grid {
+        grid-template-columns: 1fr;
+    }
+}
+
+.agent-provider-pane__col {
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 0.55rem;
+    padding: 0.7rem 0.75rem;
+    border: 1px solid var(--border);
+    border-radius: 0.6rem;
+    background: var(--bg-panel);
+}
+
+.agent-provider-pane__col--placeholder {
+    opacity: 0.82;
+}
+
+.agent-provider-pane__col-title {
+    margin: 0 0 0.15rem;
+}
+
+.agent-provider-pane__picker-grid--stacked {
+    grid-template-columns: 1fr;
+}
+
 .agent-provider-pane__picker-grid {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
diff --git a/src/workbench/agent_provider_pane/mod.rs b/src/workbench/agent_provider_pane/mod.rs
index 3323af0..05977eb 100644
--- a/src/workbench/agent_provider_pane/mod.rs
+++ b/src/workbench/agent_provider_pane/mod.rs
@@ -804,97 +804,104 @@ pub fn AgentProviderPane() -> impl IntoView {
                 <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::AgProviderHeading)()}</span>
             </h3>
 
-            <section class="harness-subpane">
-                <h4 class="harness-pane-subhead">
-                    <span class="harness-pane-subhead__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuPlug width="0.82rem" height="0.82rem" />
-                    </span>
-                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgSectionInference)()}</span>
-                </h4>
-                <div class="agent-provider-pane__picker-grid">
-                    <label class="agent-provider-pane__field">
-                        <span class="harness-field-label">
-                            <span class="harness-field-label__icon" aria-hidden="true">
-                                <LxIcon icon=icondata::LuPlug width="0.82rem" height="0.82rem" />
+            <div class="agent-provider-pane__grid">
+                <div class="agent-provider-pane__col">
+                    <h4 class="harness-pane-subhead agent-provider-pane__col-title">
+                        <span class="harness-pane-subhead__icon" aria-hidden="true">
+                            <LxIcon icon=icondata::LuMessageSquare width="0.82rem" height="0.82rem" />
+                        </span>
+                        <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgColumnText)()}</span>
+                    </h4>
+                    <div class="agent-provider-pane__picker-grid agent-provider-pane__picker-grid--stacked">
+                        <label class="agent-provider-pane__field">
+                            <span class="harness-field-label">
+                                <span class="harness-field-label__icon" aria-hidden="true">
+                                    <LxIcon icon=icondata::LuPlug width="0.82rem" height="0.82rem" />
+                                </span>
+                                <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgProviderField)()}</span>
+                            </span>
+                            <ProviderPicker
+                                selected_provider=selected_provider
+                                settings=settings
+                                model_entries=model_entries
+                                provider_refresh_request=provider_refresh_request
+                            />
+                        </label>
+                        <label class="agent-provider-pane__field">
+                            <span class="harness-field-label">
+                                <span class="harness-field-label__icon" aria-hidden="true">
+                                    <LxIcon icon=icondata::LuGauge width="0.82rem" height="0.82rem" />
+                                </span>
+                                <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgThinkingField)()}</span>
                             </span>
-                            <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgProviderField)()}</span>
+                            <ThinkingLevelPicker selected=thinking_level />
+                        </label>
+                    </div>
+                    <div class="agent-provider-pane__key-row harness-muted">
+                        <span>{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</span>
+                        <span class="agent-provider-pane__key-status">
+                            {move || {
+                                settings
+                                    .get()
+                                    .map(|view| provider_key_status_text(&i18n, &view, selected_provider.get()))
+                                    .unwrap_or_else(|| i18n.tr(I18nKey::AgApiKeyMissing)().to_string())
+                            }}
                         </span>
-                        <ProviderPicker
-                            selected_provider=selected_provider
-                            settings=settings
+                    </div>
+                    <label class="harness-stack">
+                        <span class="harness-field-label">
+                            <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgModelField)()}</span>
+                        </span>
+                        <AgentModelPicker
+                            model_id=custom_model
                             model_entries=model_entries
-                            provider_refresh_request=provider_refresh_request
+                            loading_models=loading_models
                         />
                     </label>
-                    <label class="agent-provider-pane__field">
-                        <span class="harness-field-label">
-                            <span class="harness-field-label__icon" aria-hidden="true">
-                                <LxIcon icon=icondata::LuGauge width="0.82rem" height="0.82rem" />
+                    <div class="agent-provider-pane__actions">
+                        <button
+                            type="button"
+                            class="workbench-mini-btn"
+                            disabled=move || loading_models.get() || !is_tauri_shell()
+                            on:click=move |_| refresh_models(selected_provider.get_untracked())
+                        >
+                            <span class="harness-btn-inline">
+                                <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
+                                <span>{move || if loading_models.get() {
+                                    i18n.tr(I18nKey::AgModelsLoading)().to_string()
+                                } else {
+                                    i18n.tr(I18nKey::AgModelsRefresh)().to_string()
+                                }}</span>
                             </span>
-                            <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgThinkingField)()}</span>
-                        </span>
-                        <ThinkingLevelPicker selected=thinking_level />
-                    </label>
+                        </button>
+                        <small class="harness-muted">
+                            {move || match models_source.get().as_str() {
+                                "live" => i18n.tr(I18nKey::AgModelsSourceLive)().to_string(),
+                                "cache" => i18n.tr(I18nKey::AgModelsSourceCache)().to_string(),
+                                "curated" | "fallback" => i18n.tr(I18nKey::AgModelsSourceCurated)().to_string(),
+                                _ => String::new(),
+                            }}
+                        </small>
+                    </div>
+                    <Show when=move || models_message.get().is_some()>
+                        <p class="harness-muted">{move || models_message.get().unwrap_or_default()}</p>
+                    </Show>
                 </div>
-                <div class="agent-provider-pane__key-row harness-muted">
-                    <span>{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</span>
-                    <span class="agent-provider-pane__key-status">
-                        {move || {
-                            settings
-                                .get()
-                                .map(|view| provider_key_status_text(&i18n, &view, selected_provider.get()))
-                                .unwrap_or_else(|| i18n.tr(I18nKey::AgApiKeyMissing)().to_string())
-                        }}
-                    </span>
+
+                <div class="agent-provider-pane__col">
+                    <crate::workbench::harness_image_pane::AgentImageColumn />
                 </div>
-            </section>
 
-            <section class="harness-subpane">
-                <h4 class="harness-pane-subhead">
-                    <span class="harness-pane-subhead__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuPackage2 width="0.82rem" height="0.82rem" />
-                    </span>
-                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgSectionModel)()}</span>
-                </h4>
-                <label class="harness-stack">
-                    <span class="harness-field-label">
-                        <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgModelField)()}</span>
-                    </span>
-                    <AgentModelPicker
-                        model_id=custom_model
-                        model_entries=model_entries
-                        loading_models=loading_models
-                    />
-                </label>
-                <div class="agent-provider-pane__actions">
-                    <button
-                        type="button"
-                        class="workbench-mini-btn"
-                        disabled=move || loading_models.get() || !is_tauri_shell()
-                        on:click=move |_| refresh_models(selected_provider.get_untracked())
-                    >
-                        <span class="harness-btn-inline">
-                            <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
-                            <span>{move || if loading_models.get() {
-                                i18n.tr(I18nKey::AgModelsLoading)().to_string()
-                            } else {
-                                i18n.tr(I18nKey::AgModelsRefresh)().to_string()
-                            }}</span>
+                <div class="agent-provider-pane__col agent-provider-pane__col--placeholder">
+                    <h4 class="harness-pane-subhead agent-provider-pane__col-title">
+                        <span class="harness-pane-subhead__icon" aria-hidden="true">
+                            <LxIcon icon=icondata::LuMic width="0.82rem" height="0.82rem" />
                         </span>
-                    </button>
-                    <small class="harness-muted">
-                        {move || match models_source.get().as_str() {
-                            "live" => i18n.tr(I18nKey::AgModelsSourceLive)().to_string(),
-                            "cache" => i18n.tr(I18nKey::AgModelsSourceCache)().to_string(),
-                            "curated" | "fallback" => i18n.tr(I18nKey::AgModelsSourceCurated)().to_string(),
-                            _ => String::new(),
-                        }}
-                    </small>
+                        <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgColumnVoice)()}</span>
+                    </h4>
+                    <p class="app-prefs-hint">{move || i18n.tr(I18nKey::AgColumnVoiceSoon)()}</p>
                 </div>
-                <Show when=move || models_message.get().is_some()>
-                    <p class="harness-muted">{move || models_message.get().unwrap_or_default()}</p>
-                </Show>
-            </section>
+            </div>
 
             <section class="harness-subpane">
                 <h4 class="harness-pane-subhead">
diff --git a/src/workbench/harness_image_pane/mod.rs b/src/workbench/harness_image_pane/mod.rs
index 82a1f1e..c7ac676 100644
--- a/src/workbench/harness_image_pane/mod.rs
+++ b/src/workbench/harness_image_pane/mod.rs
@@ -54,8 +54,9 @@ async fn fetch_image_models(
     out.set(entries);
 }
 
+/// Image model settings column (BLXCode Agent grid, middle).
 #[component]
-pub fn ImagePane() -> impl IntoView {
+pub fn AgentImageColumn() -> impl IntoView {
     let i18n = expect_context::<I18nService>();
     let settings = RwSignal::new(Option::<ImageSettings>::None);
     let status = RwSignal::new(Option::<String>::None);
@@ -79,7 +80,7 @@ pub fn ImagePane() -> impl IntoView {
             match image_settings_save(patch).await {
                 Ok(s) => {
                     settings.set(Some(s));
-                    status.set(Some("saved".into()));
+                    status.set(Some(i18n.tr(I18nKey::ApiKeysSaved)().to_string()));
                 }
                 Err(e) => status.set(Some(e)),
             }
@@ -93,14 +94,14 @@ pub fn ImagePane() -> impl IntoView {
     };
 
     view! {
-        <section class="harness-settings-pane image-pane" aria-labelledby="image-pane-title">
-            <header class="harness-settings-pane__head">
-                <h2 id="image-pane-title">
-                    <LxIcon icon=icondata::LuImage width="1.1rem" height="1.1rem" />
-                    <span>{move || i18n.tr(I18nKey::ImagePaneTitle)()}</span>
-                </h2>
-                <p class="image-pane__lede">{move || i18n.tr(I18nKey::ImagePaneDescription)()}</p>
-            </header>
+        <>
+            <h4 class="harness-pane-subhead agent-provider-pane__col-title">
+                <span class="harness-pane-subhead__icon" aria-hidden="true">
+                    <LxIcon icon=icondata::LuImage width="0.82rem" height="0.82rem" />
+                </span>
+                <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgColumnImage)()}</span>
+            </h4>
+            <p class="app-prefs-hint">{move || i18n.tr(I18nKey::ImagePaneDescription)()}</p>
 
             <Show
                 when=move || settings.get().is_some()
@@ -176,7 +177,25 @@ pub fn ImagePane() -> impl IntoView {
             <Show when=move || status.get().is_some()>
                 <p class="image-pane__status">{move || status.get().unwrap_or_default()}</p>
             </Show>
-        </section>
+        </>
+    }
+}
+
+#[component]
+pub fn ImagePane() -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    view! {
+        <article class="harness-pane image-pane-standalone">
+            <h3 class="harness-pane-title">
+                <span class="harness-pane-title__icon" aria-hidden="true">
+                    <LxIcon icon=icondata::LuImage width="1.02rem" height="1.02rem" />
+                </span>
+                <span class="harness-pane-title__text">{move || i18n.tr(I18nKey::ImagePaneTitle)()}</span>
+            </h3>
+            <div class="agent-provider-pane__col agent-provider-pane__col--standalone">
+                <AgentImageColumn />
+            </div>
+        </article>
     }
 }
 
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index a98852c..2d0c99e 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -693,7 +693,6 @@ pub fn SettingsDock(
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::AgentProvider label=I18nKey::HsCatProvider />
                 <HarnessCatStaticBtn ui=ui cat=HarnessSettingsCategory::Memory label="Memory" />
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Voice label=I18nKey::HsCatVoice />
-                <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Image label=I18nKey::HsCatImage />
             </nav>
 
             <div class="harness-settings-detail">
@@ -720,8 +719,8 @@ pub fn SettingsDock(
                         <crate::workbench::harness_voice_pane::VoicePane />
                     }.into_any(),
                     HarnessSettingsCategory::Image => view! {
-                        <crate::workbench::harness_image_pane::ImagePane />
-                    }.into_any(),
+                        <crate::workbench::AgentProviderPane />
+                    }.into_any(), // legacy category → BLXCode Agent
                 }}
             </div>
         </div>

From 3e89f87a290e007a43fae6b0c1b8c56d706117ac Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:33:43 +0200
Subject: [PATCH 28/48] feat(agent_model_picker): add AgentModelPicker
 component for model selection

- Introduced a new `AgentModelPicker` component to facilitate model selection with a dropdown interface, enhancing user experience in the agent settings.
- Integrated the `AgentModelPicker` into the `AgentProviderPane` and `AgentImageColumn` components, replacing the previous model picker implementation.
- Improved reactivity and event handling for model selection, ensuring a seamless interaction for users.
- Updated relevant imports and removed deprecated code related to the old model picker.
---
 src/workbench/agent_model_picker/mod.rs  | 276 +++++++++++++++++++++++
 src/workbench/agent_provider_pane/mod.rs | 241 +-------------------
 src/workbench/harness_image_pane/mod.rs  |  91 +++++---
 src/workbench/mod.rs                     |   1 +
 4 files changed, 335 insertions(+), 274 deletions(-)
 create mode 100644 src/workbench/agent_model_picker/mod.rs

diff --git a/src/workbench/agent_model_picker/mod.rs b/src/workbench/agent_model_picker/mod.rs
new file mode 100644
index 0000000..22313a9
--- /dev/null
+++ b/src/workbench/agent_model_picker/mod.rs
@@ -0,0 +1,276 @@
+//! Shared agent model dropdown (Text + Image columns in BLXCode Agent settings).
+
+use crate::i18n::I18nKey;
+use crate::service::I18nService;
+use crate::tauri_bridge::ProviderModelEntry;
+use gloo_timers::future::TimeoutFuture;
+use leptos::prelude::*;
+use leptos_icons::Icon as LxIcon;
+use wasm_bindgen::JsCast;
+
+fn input_str(ev: &web_sys::Event) -> Option<String> {
+    ev.target()?
+        .dyn_into::<web_sys::HtmlInputElement>()
+        .ok()
+        .map(|i| i.value())
+}
+
+fn price_per_million(usd_per_token: f64) -> String {
+    format!("${:.2}", usd_per_token * 1_000_000.0)
+}
+
+fn model_row_meta(i18n: &I18nService, entry: &ProviderModelEntry) -> Option<String> {
+    if let Some(p) = entry.pricing {
+        Some(
+            i18n.tr(I18nKey::AgModelMetaPricing)()
+                .replace("{in}", &price_per_million(p.prompt))
+                .replace("{out}", &price_per_million(p.completion)),
+        )
+    } else {
+        entry.description.as_ref().and_then(|d| {
+            let t = d.trim();
+            if t.is_empty() {
+                None
+            } else {
+                Some(if t.len() > 88 {
+                    format!("{}…", &t[..88])
+                } else {
+                    t.to_string()
+                })
+            }
+        })
+    }
+}
+
+fn find_model_entry(entries: &[ProviderModelEntry], id: &str) -> Option<ProviderModelEntry> {
+    entries.iter().find(|e| e.id == id).cloned()
+}
+
+fn model_trigger_label(entries: &[ProviderModelEntry], id: &str) -> String {
+    find_model_entry(entries, id)
+        .map(|e| {
+            if e.label.trim().is_empty() {
+                e.id
+            } else {
+                e.label
+            }
+        })
+        .unwrap_or_else(|| id.to_string())
+}
+
+fn focus_model_option(prefix: &str, model_id: &str) {
+    focus_by_id(&model_option_dom_id(prefix, model_id));
+}
+
+fn focus_by_id(id: &str) {
+    let Some(doc) = web_sys::window().and_then(|w| w.document()) else {
+        return;
+    };
+    let Some(el) = doc.get_element_by_id(id) else {
+        return;
+    };
+    let Ok(button) = el.dyn_into::<web_sys::HtmlElement>() else {
+        return;
+    };
+    let _ = button.focus();
+}
+
+fn model_option_dom_id(prefix: &str, model_id: &str) -> String {
+    let slug: String = model_id
+        .chars()
+        .map(|c| {
+            if c.is_ascii_alphanumeric() {
+                c
+            } else {
+                '-'
+            }
+        })
+        .collect();
+    format!("{prefix}-option-{slug}")
+}
+
+#[component]
+pub fn AgentModelPicker(
+    model_id: RwSignal<String>,
+    model_entries: RwSignal<Vec<ProviderModelEntry>>,
+    loading_models: RwSignal<bool>,
+    #[prop(default = "agent-model")]
+    option_id_prefix: &'static str,
+    #[prop(optional)] on_change: Option<Callback<String>>,
+) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let open = RwSignal::new(false);
+    let prefix = option_id_prefix;
+
+    let selected_entry =
+        Signal::derive(move || find_model_entry(&model_entries.get(), &model_id.get()));
+
+    view! {
+        <div class="agent-model-picker">
+            <div class="harness-provider-picker">
+                <button
+                    type="button"
+                    class="harness-provider-trigger"
+                    aria-haspopup="listbox"
+                    aria-expanded=move || if open.get() { "true" } else { "false" }
+                    disabled=move || loading_models.get()
+                    on:click=move |_| {
+                        let next = !open.get_untracked();
+                        open.set(next);
+                        if next {
+                            let id = model_id.get_untracked();
+                            let prefix = prefix;
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_model_option(prefix, &id);
+                            });
+                        }
+                    }
+                >
+                    <span class="harness-provider-trigger__main">
+                        <span class="harness-provider-trigger__brand">
+                            <LxIcon icon=icondata::LuPackage2 width="0.76rem" height="0.76rem" />
+                        </span>
+                        <span class="agent-model-picker__trigger-label">
+                            {move || model_trigger_label(&model_entries.get(), &model_id.get())}
+                        </span>
+                    </span>
+                    <span class="harness-provider-trigger__caret">"▾"</span>
+                </button>
+
+                <Show when=move || open.get()>
+                    <div class="harness-provider-menu agent-model-picker__menu" role="listbox">
+                        {move || {
+                            let entries = model_entries.get();
+                            if entries.is_empty() {
+                                view! {
+                                    <p class="harness-muted" style="padding:0.45rem 0.5rem;margin:0;">
+                                        {move || i18n.tr(I18nKey::AgModelsUnavailable)()}
+                                    </p>
+                                }
+                                .into_any()
+                            } else {
+                                entries
+                                    .into_iter()
+                                    .map(|entry| {
+                                        let entry_id = entry.id.clone();
+                                        let id_active = entry_id.clone();
+                                        let id_aria = entry_id.clone();
+                                        let id_click = entry_id.clone();
+                                        let id_key = entry_id.clone();
+                                        let meta = model_row_meta(&i18n, &entry);
+                                        let title = if entry.label.trim().is_empty() {
+                                            entry.id.clone()
+                                        } else {
+                                            entry.label.clone()
+                                        };
+                                        let dom_id = model_option_dom_id(prefix, &entry_id);
+                                        view! {
+                                            <button
+                                                id=dom_id
+                                                type="button"
+                                                role="option"
+                                                class="harness-provider-option agent-model-option"
+                                                class:harness-provider-option--active=move || model_id.get() == id_active
+                                                aria-selected=move || if model_id.get() == id_aria {
+                                                    "true"
+                                                } else {
+                                                    "false"
+                                                }
+                                                on:click=move |_| {
+                                                    let id = id_click.clone();
+                                                    model_id.set(id.clone());
+                                                    if let Some(cb) = on_change.as_ref() {
+                                                        cb.run(id);
+                                                    }
+                                                    open.set(false);
+                                                }
+                                                on:keydown=move |ev: web_sys::KeyboardEvent| {
+                                                    match ev.key().as_str() {
+                                                        "Enter" | " " => {
+                                                            ev.prevent_default();
+                                                            let id = id_key.clone();
+                                                            model_id.set(id.clone());
+                                                            if let Some(cb) = on_change.as_ref() {
+                                                                cb.run(id);
+                                                            }
+                                                            open.set(false);
+                                                        }
+                                                        "Escape" => {
+                                                            ev.prevent_default();
+                                                            open.set(false);
+                                                        }
+                                                        _ => {}
+                                                    }
+                                                }
+                                            >
+                                                <span class="agent-model-option__title">{title}</span>
+                                                {meta.map(|line| view! {
+                                                    <span class="agent-model-option__meta">{line}</span>
+                                                })}
+                                            </button>
+                                        }
+                                        .into_any()
+                                    })
+                                    .collect_view()
+                                    .into_any()
+                            }
+                        }}
+                    </div>
+                </Show>
+            </div>
+
+            <input
+                class="workbench-plain-input"
+                type="text"
+                placeholder=move || i18n.tr(I18nKey::AgModelCustomField)()
+                prop:value=move || model_id.get()
+                on:input=move |ev| {
+                    if let Some(value) = input_str(&ev) {
+                        model_id.set(value.clone());
+                        if let Some(cb) = on_change.as_ref() {
+                            cb.run(value);
+                        }
+                    }
+                }
+            />
+
+            {move || {
+                let Some(entry) = selected_entry.get() else {
+                    return ().into_any();
+                };
+                let mut lines = Vec::new();
+                if entry.id != entry.label && !entry.label.trim().is_empty() {
+                    lines.push(entry.id.clone());
+                }
+                if let Some(desc) = entry.description.as_ref().filter(|d| !d.trim().is_empty()) {
+                    lines.push(desc.trim().to_string());
+                }
+                if let Some(p) = entry.pricing {
+                    lines.push(
+                        i18n.tr(I18nKey::AgModelMetaPricing)()
+                            .replace("{in}", &price_per_million(p.prompt))
+                            .replace("{out}", &price_per_million(p.completion)),
+                    );
+                }
+                if lines.is_empty() {
+                    return ().into_any();
+                }
+                let title = if entry.label.trim().is_empty() {
+                    entry.id.clone()
+                } else {
+                    entry.label.clone()
+                };
+                view! {
+                    <div class="agent-model-picker__detail harness-muted" aria-live="polite">
+                        <span class="agent-model-picker__detail-title">{title}</span>
+                        {lines.into_iter().map(|line| view! {
+                            <span class="agent-model-picker__detail-line">{line}</span>
+                        }).collect_view()}
+                    </div>
+                }
+                .into_any()
+            }}
+        </div>
+    }
+}
diff --git a/src/workbench/agent_provider_pane/mod.rs b/src/workbench/agent_provider_pane/mod.rs
index 05977eb..44aeffa 100644
--- a/src/workbench/agent_provider_pane/mod.rs
+++ b/src/workbench/agent_provider_pane/mod.rs
@@ -8,6 +8,7 @@ use crate::tauri_bridge::{
     AgentWebSettingsView, ProviderModelEntry, ProviderModelsResponse, ThinkingLevel,
     WebProviderKind,
 };
+use crate::workbench::agent_model_picker::AgentModelPicker;
 use gloo_timers::future::TimeoutFuture;
 use leptos::prelude::*;
 use leptos_icons::Icon as LxIcon;
@@ -21,13 +22,6 @@ struct AgentSettingsBaseline {
     web_provider: WebProviderKind,
 }
 
-fn input_str(ev: &web_sys::Event) -> Option<String> {
-    ev.target()?
-        .dyn_into::<web_sys::HtmlInputElement>()
-        .ok()
-        .map(|i| i.value())
-}
-
 fn provider_label(i18n: &I18nService, provider: AgentProviderKind) -> String {
     let key = match provider {
         AgentProviderKind::Openrouter => I18nKey::AgProviderOpenrouter,
@@ -111,49 +105,6 @@ fn provider_cache(view: &AgentProviderSettingsView, provider: AgentProviderKind)
     }
 }
 
-fn price_per_million(usd_per_token: f64) -> String {
-    format!("${:.2}", usd_per_token * 1_000_000.0)
-}
-
-fn model_row_meta(i18n: &I18nService, entry: &ProviderModelEntry) -> Option<String> {
-    if let Some(p) = entry.pricing {
-        Some(
-            i18n.tr(I18nKey::AgModelMetaPricing)()
-                .replace("{in}", &price_per_million(p.prompt))
-                .replace("{out}", &price_per_million(p.completion)),
-        )
-    } else {
-        entry.description.as_ref().and_then(|d| {
-            let t = d.trim();
-            if t.is_empty() {
-                None
-            } else {
-                Some(if t.len() > 88 {
-                    format!("{}…", &t[..88])
-                } else {
-                    t.to_string()
-                })
-            }
-        })
-    }
-}
-
-fn find_model_entry(entries: &[ProviderModelEntry], id: &str) -> Option<ProviderModelEntry> {
-    entries.iter().find(|e| e.id == id).cloned()
-}
-
-fn model_trigger_label(entries: &[ProviderModelEntry], id: &str) -> String {
-    find_model_entry(entries, id)
-        .map(|e| {
-            if e.label.trim().is_empty() {
-                e.id
-            } else {
-                e.label
-            }
-        })
-        .unwrap_or_else(|| id.to_string())
-}
-
 fn focus_provider_option(provider: AgentProviderKind) {
     let id = format!("provider-option-{}", provider.as_str());
     focus_by_id(&id);
@@ -164,11 +115,6 @@ fn focus_thinking_option(level: ThinkingLevel) {
     focus_by_id(&id);
 }
 
-fn focus_model_option(model_id: &str) {
-    let id = model_option_dom_id(model_id);
-    focus_by_id(&id);
-}
-
 fn focus_by_id(id: &str) {
     let Some(doc) = web_sys::window().and_then(|w| w.document()) else {
         return;
@@ -182,20 +128,6 @@ fn focus_by_id(id: &str) {
     let _ = button.focus();
 }
 
-fn model_option_dom_id(model_id: &str) -> String {
-    let slug: String = model_id
-        .chars()
-        .map(|c| {
-            if c.is_ascii_alphanumeric() {
-                c
-            } else {
-                '-'
-            }
-        })
-        .collect();
-    format!("model-option-{slug}")
-}
-
 fn next_provider(provider: AgentProviderKind) -> AgentProviderKind {
     match provider {
         AgentProviderKind::Openrouter => AgentProviderKind::Anthropic,
@@ -481,176 +413,6 @@ fn ThinkingLevelPicker(selected: RwSignal<ThinkingLevel>) -> impl IntoView {
     }
 }
 
-#[component]
-fn AgentModelPicker(
-    model_id: RwSignal<String>,
-    model_entries: RwSignal<Vec<ProviderModelEntry>>,
-    loading_models: RwSignal<bool>,
-) -> impl IntoView {
-    let i18n = expect_context::<I18nService>();
-    let open = RwSignal::new(false);
-
-    let selected_entry =
-        Signal::derive(move || find_model_entry(&model_entries.get(), &model_id.get()));
-
-    let choose = move |id: String| {
-        model_id.set(id);
-        open.set(false);
-    };
-
-    view! {
-        <div class="agent-model-picker">
-            <div class="harness-provider-picker">
-                <button
-                    type="button"
-                    class="harness-provider-trigger"
-                    aria-haspopup="listbox"
-                    aria-expanded=move || if open.get() { "true" } else { "false" }
-                    prop:disabled=move || loading_models.get()
-                    on:click=move |_| {
-                        let next = !open.get_untracked();
-                        open.set(next);
-                        if next {
-                            let id = model_id.get_untracked();
-                            leptos::task::spawn_local(async move {
-                                TimeoutFuture::new(0).await;
-                                focus_model_option(&id);
-                            });
-                        }
-                    }
-                >
-                    <span class="harness-provider-trigger__main">
-                        <span class="harness-provider-trigger__brand">
-                            <LxIcon icon=icondata::LuPackage2 width="0.76rem" height="0.76rem" />
-                        </span>
-                        <span class="agent-model-picker__trigger-label">
-                            {move || model_trigger_label(&model_entries.get(), &model_id.get())}
-                        </span>
-                    </span>
-                    <span class="harness-provider-trigger__caret">"▾"</span>
-                </button>
-
-                <Show when=move || open.get()>
-                    <div class="harness-provider-menu agent-model-picker__menu" role="listbox">
-                        {move || {
-                            let entries = model_entries.get();
-                            if entries.is_empty() {
-                                view! {
-                                    <p class="harness-muted" style="padding:0.45rem 0.5rem;margin:0;">
-                                        {move || i18n.tr(I18nKey::AgModelsUnavailable)()}
-                                    </p>
-                                }
-                                .into_any()
-                            } else {
-                                entries
-                                    .into_iter()
-                                    .map(|entry| {
-                                        let entry_id = entry.id.clone();
-                                        let id_active = entry_id.clone();
-                                        let id_aria = entry_id.clone();
-                                        let id_click = entry_id.clone();
-                                        let id_key = entry_id.clone();
-                                        let meta = model_row_meta(&i18n, &entry);
-                                        let title = if entry.label.trim().is_empty() {
-                                            entry.id.clone()
-                                        } else {
-                                            entry.label.clone()
-                                        };
-                                        view! {
-                                            <button
-                                                id=model_option_dom_id(&entry_id)
-                                                type="button"
-                                                role="option"
-                                                class="harness-provider-option agent-model-option"
-                                                class:harness-provider-option--active=move || model_id.get() == id_active
-                                                aria-selected=move || if model_id.get() == id_aria {
-                                                    "true"
-                                                } else {
-                                                    "false"
-                                                }
-                                                on:click=move |_| choose(id_click.clone())
-                                                on:keydown=move |ev: web_sys::KeyboardEvent| {
-                                                    match ev.key().as_str() {
-                                                        "Enter" | " " => {
-                                                            ev.prevent_default();
-                                                            choose(id_key.clone());
-                                                        }
-                                                        "Escape" => {
-                                                            ev.prevent_default();
-                                                            open.set(false);
-                                                        }
-                                                        _ => {}
-                                                    }
-                                                }
-                                            >
-                                                <span class="agent-model-option__title">{title}</span>
-                                                {meta.map(|line| view! {
-                                                    <span class="agent-model-option__meta">{line}</span>
-                                                })}
-                                            </button>
-                                        }
-                                        .into_any()
-                                    })
-                                    .collect_view()
-                                    .into_any()
-                            }
-                        }}
-                    </div>
-                </Show>
-            </div>
-
-            <input
-                class="workbench-plain-input"
-                type="text"
-                placeholder=move || i18n.tr(I18nKey::AgModelCustomField)()
-                prop:value=move || model_id.get()
-                on:input=move |ev| {
-                    if let Some(value) = input_str(&ev) {
-                        model_id.set(value);
-                    }
-                }
-            />
-
-            {move || {
-                let Some(entry) = selected_entry.get() else {
-                    return ().into_any();
-                };
-                let mut lines = Vec::new();
-                if entry.id != entry.label && !entry.label.trim().is_empty() {
-                    lines.push(entry.id.clone());
-                }
-                if let Some(desc) = entry.description.as_ref().filter(|d| !d.trim().is_empty()) {
-                    lines.push(desc.trim().to_string());
-                }
-                if let Some(p) = entry.pricing {
-                    lines.push(
-                        i18n.tr(I18nKey::AgModelMetaPricing)()
-                            .replace("{in}", &price_per_million(p.prompt))
-                            .replace("{out}", &price_per_million(p.completion)),
-                    );
-                }
-                if lines.is_empty() {
-                    return ().into_any();
-                }
-                let title = if entry.label.trim().is_empty() {
-                    entry.id.clone()
-                } else {
-                    entry.label.clone()
-                };
-                view! {
-                    <div class="agent-model-picker__detail harness-muted" aria-live="polite">
-                        <span class="agent-model-picker__detail-title">{title}</span>
-                        {lines.into_iter().map(|line| view! {
-                            <span class="agent-model-picker__detail-line">{line}</span>
-                        }).collect_view()}
-                    </div>
-                }
-                .into_any()
-            }}
-        </div>
-    }
-}
-
 #[component]
 pub fn AgentProviderPane() -> impl IntoView {
     let i18n = expect_context::<I18nService>();
@@ -856,6 +618,7 @@ pub fn AgentProviderPane() -> impl IntoView {
                             model_id=custom_model
                             model_entries=model_entries
                             loading_models=loading_models
+                            option_id_prefix="agent-text-model"
                         />
                     </label>
                     <div class="agent-provider-pane__actions">
diff --git a/src/workbench/harness_image_pane/mod.rs b/src/workbench/harness_image_pane/mod.rs
index c7ac676..3b39252 100644
--- a/src/workbench/harness_image_pane/mod.rs
+++ b/src/workbench/harness_image_pane/mod.rs
@@ -1,7 +1,4 @@
-//! Image-mode settings tab: provider buttons + shared `ModelPicker`.
-//!
-//! Mirrors the smaller flow of `harness_voice_pane` (no voice catalogue,
-//! no PTT). Persists via the `image_settings_save` Tauri command.
+//! Image-mode settings: provider buttons + shared `AgentModelPicker` dropdown.
 
 use crate::i18n::I18nKey;
 use crate::service::I18nService;
@@ -9,7 +6,7 @@ use crate::tauri_bridge::{
     agent_provider_models, image_settings_get, image_settings_save, is_tauri_shell,
     AgentProviderKind, ImageProviderKind, ImageSettings, ProviderModelEntry,
 };
-use crate::workbench::model_picker::ModelPicker;
+use crate::workbench::agent_model_picker::AgentModelPicker;
 use leptos::prelude::*;
 use leptos_icons::Icon as LxIcon;
 
@@ -20,9 +17,6 @@ fn image_to_agent_provider(p: ImageProviderKind) -> AgentProviderKind {
     }
 }
 
-/// Cheap heuristic mirroring `looks_like_image_model` in the backend —
-/// catches `dall-e`, `gpt-image`, `flux`, `stable-diffusion`, `imagen`,
-/// `gemini-2.5-flash-image` and anything that just says "image".
 fn looks_like_image_model(id: &str) -> bool {
     let l = id.to_ascii_lowercase();
     l.contains("image")
@@ -60,12 +54,15 @@ pub fn AgentImageColumn() -> impl IntoView {
     let i18n = expect_context::<I18nService>();
     let settings = RwSignal::new(Option::<ImageSettings>::None);
     let status = RwSignal::new(Option::<String>::None);
-    let models = RwSignal::new(Vec::<ProviderModelEntry>::new());
+    let model_entries = RwSignal::new(Vec::<ProviderModelEntry>::new());
+    let model_id = RwSignal::new(String::new());
+    let loading_models = RwSignal::new(false);
 
     if is_tauri_shell() {
         leptos::task::spawn_local(async move {
             if let Ok(s) = image_settings_get().await {
-                fetch_image_models(s.provider, models).await;
+                model_id.set(s.model_id.clone());
+                fetch_image_models(s.provider, model_entries).await;
                 settings.set(Some(s));
             }
         });
@@ -73,12 +70,14 @@ pub fn AgentImageColumn() -> impl IntoView {
 
     let save = move |patch: ImageSettings| {
         if !is_tauri_shell() {
+            model_id.set(patch.model_id.clone());
             settings.set(Some(patch));
             return;
         }
         leptos::task::spawn_local(async move {
             match image_settings_save(patch).await {
                 Ok(s) => {
+                    model_id.set(s.model_id.clone());
                     settings.set(Some(s));
                     status.set(Some(i18n.tr(I18nKey::ApiKeysSaved)().to_string()));
                 }
@@ -88,11 +87,22 @@ pub fn AgentImageColumn() -> impl IntoView {
     };
 
     let reload_models = move |provider: ImageProviderKind| {
+        loading_models.set(true);
         leptos::task::spawn_local(async move {
-            fetch_image_models(provider, models).await;
+            fetch_image_models(provider, model_entries).await;
+            loading_models.set(false);
         });
     };
 
+    let on_model_change = Callback::new(move |m: String| {
+        let Some(current) = settings.get_untracked() else {
+            return;
+        };
+        let mut next = current;
+        next.model_id = m;
+        save(next);
+    });
+
     view! {
         <>
             <h4 class="harness-pane-subhead agent-provider-pane__col-title">
@@ -114,7 +124,6 @@ pub fn AgentImageColumn() -> impl IntoView {
                         return view! { <></> }.into_any();
                     };
                     let provider = current.provider;
-                    let model_id = current.model_id.clone();
 
                     let on_provider = {
                         let current = current.clone();
@@ -125,14 +134,6 @@ pub fn AgentImageColumn() -> impl IntoView {
                             reload_models(p);
                         }
                     };
-                    let on_model = {
-                        let current = current.clone();
-                        move |m: String| {
-                            let mut next = current.clone();
-                            next.model_id = m;
-                            save(next);
-                        }
-                    };
 
                     view! {
                         <div class="image-pane__field">
@@ -142,34 +143,52 @@ pub fn AgentImageColumn() -> impl IntoView {
                                     label="OpenAI"
                                     target=ImageProviderKind::Openai
                                     active=provider
-                                    on:click={
+                                    on_select=Callback::new({
                                         let on_provider = on_provider.clone();
                                         move |_| on_provider(ImageProviderKind::Openai)
-                                    }
+                                    })
                                 />
                                 <ProviderBtn
                                     label="OpenRouter"
                                     target=ImageProviderKind::Openrouter
                                     active=provider
-                                    on:click={
+                                    on_select=Callback::new({
                                         let on_provider = on_provider.clone();
                                         move |_| on_provider(ImageProviderKind::Openrouter)
-                                    }
+                                    })
                                 />
                             </div>
                         </div>
 
-                        <ModelPicker
-                            label_key=I18nKey::ImageModelField
-                            datalist_id="blxcode-image-models"
-                            current=model_id.clone()
-                            models=models
-                            on_change=on_model.clone()
-                            on_refresh={
-                                let provider = provider;
-                                move || reload_models(provider)
-                            }
-                        />
+                        <label class="harness-stack">
+                            <span class="harness-field-label">
+                                <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgModelField)()}</span>
+                            </span>
+                            <AgentModelPicker
+                                model_id=model_id
+                                model_entries=model_entries
+                                loading_models=loading_models
+                                option_id_prefix="agent-image-model"
+                                on_change=on_model_change
+                            />
+                        </label>
+                        <div class="agent-provider-pane__actions">
+                            <button
+                                type="button"
+                                class="workbench-mini-btn"
+                                disabled=move || loading_models.get() || !is_tauri_shell()
+                                on:click=move |_| reload_models(provider)
+                            >
+                                <span class="harness-btn-inline">
+                                    <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
+                                    <span>{move || if loading_models.get() {
+                                        i18n.tr(I18nKey::AgModelsLoading)().to_string()
+                                    } else {
+                                        i18n.tr(I18nKey::AgModelsRefresh)().to_string()
+                                    }}</span>
+                                </span>
+                            </button>
+                        </div>
                     }.into_any()
                 }}
             </Show>
@@ -204,6 +223,7 @@ fn ProviderBtn(
     label: &'static str,
     target: ImageProviderKind,
     active: ImageProviderKind,
+    on_select: Callback<()>,
 ) -> impl IntoView {
     let is_active = move || target == active;
     view! {
@@ -211,6 +231,7 @@ fn ProviderBtn(
             type="button"
             class="image-pane__choice"
             class:image-pane__choice--active=is_active
+            on:click=move |_| on_select.run(())
         >
             {label}
         </button>
diff --git a/src/workbench/mod.rs b/src/workbench/mod.rs
index 4b7feb8..3f92bdb 100644
--- a/src/workbench/mod.rs
+++ b/src/workbench/mod.rs
@@ -3,6 +3,7 @@ mod agent_accent;
 mod agent_context_handoff;
 mod agent_panel;
 mod agent_timeline;
+mod agent_model_picker;
 mod agent_provider_pane;
 mod api_keys_pane;
 mod workspace_settings_pane;

From b12d6a479c10a2572dbc1949e34d4266c753a604 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:34:49 +0200
Subject: [PATCH 29/48] refactor(harness_image_pane): simplify CSS and enhance
 image provider functionality

- Removed outdated CSS styles related to the image settings tab, streamlining the stylesheet for better maintainability.
- Updated the Rust module to include new functions for managing image providers, enhancing the user interface with improved dropdown functionality.
- Introduced a new `ImageProviderPicker` component for selecting image providers, improving user interaction and accessibility.
- Enhanced localization support by integrating internationalization keys for image provider labels and statuses.
---
 .../harness_image_pane/harness_image_pane.css |  51 +--
 src/workbench/harness_image_pane/mod.rs       | 381 +++++++++++++-----
 2 files changed, 283 insertions(+), 149 deletions(-)

diff --git a/src/workbench/harness_image_pane/harness_image_pane.css b/src/workbench/harness_image_pane/harness_image_pane.css
index f89acd3..9712a3f 100644
--- a/src/workbench/harness_image_pane/harness_image_pane.css
+++ b/src/workbench/harness_image_pane/harness_image_pane.css
@@ -1,53 +1,4 @@
-/* Image settings tab — mirrors voice-pane layout vocabulary. Globals
-   (harness-settings-pane, harness-settings-pane__head) come from styles.css. */
-
-.image-pane__lede {
-    font-size: 0.82rem;
-    color: var(--text-muted, #9aa);
-    margin: 0.2rem 0 0.8rem;
-}
-
-.image-pane__field {
-    display: flex;
-    flex-direction: column;
-    gap: 0.4rem;
-    margin-bottom: 0.8rem;
-}
-
-.image-pane__field > label {
-    font-size: 0.78rem;
-    font-weight: 600;
-    color: var(--text-muted, #9aa);
-    letter-spacing: 0.02em;
-    text-transform: uppercase;
-}
-
-.image-pane__provider-row {
-    display: flex;
-    gap: 0.4rem;
-    flex-wrap: wrap;
-}
-
-.image-pane__choice {
-    border: 1px solid var(--border, #2a2a2a);
-    background: transparent;
-    color: var(--text, #d6d6d6);
-    padding: 0.3rem 0.7rem;
-    border-radius: 6px;
-    font-size: 0.8rem;
-    cursor: pointer;
-    transition: background 120ms ease, border-color 120ms ease;
-}
-
-.image-pane__choice:hover {
-    border-color: var(--accent, #4ea1ff);
-}
-
-.image-pane__choice--active {
-    background: var(--accent-soft, rgba(78, 161, 255, 0.18));
-    border-color: var(--accent, #4ea1ff);
-    color: var(--text, #fff);
-}
+/* Image settings — layout shared with agent-provider-pane (globals in styles.css). */
 
 .image-pane__loading,
 .image-pane__status {
diff --git a/src/workbench/harness_image_pane/mod.rs b/src/workbench/harness_image_pane/mod.rs
index 3b39252..bbb1261 100644
--- a/src/workbench/harness_image_pane/mod.rs
+++ b/src/workbench/harness_image_pane/mod.rs
@@ -1,14 +1,21 @@
-//! Image-mode settings: provider buttons + shared `AgentModelPicker` dropdown.
+//! Image-mode settings: provider dropdown + shared `AgentModelPicker`.
 
 use crate::i18n::I18nKey;
 use crate::service::I18nService;
 use crate::tauri_bridge::{
-    agent_provider_models, image_settings_get, image_settings_save, is_tauri_shell,
-    AgentProviderKind, ImageProviderKind, ImageSettings, ProviderModelEntry,
+    agent_provider_models, agent_settings_get, image_settings_get, image_settings_save,
+    is_tauri_shell, AgentProviderKind, AgentProviderSettingsView, ImageProviderKind,
+    ImageSettings, ProviderModelEntry,
 };
 use crate::workbench::agent_model_picker::AgentModelPicker;
+use gloo_timers::future::TimeoutFuture;
 use leptos::prelude::*;
 use leptos_icons::Icon as LxIcon;
+use wasm_bindgen::JsCast;
+
+fn image_providers() -> [ImageProviderKind; 2] {
+    [ImageProviderKind::Openrouter, ImageProviderKind::Openai]
+}
 
 fn image_to_agent_provider(p: ImageProviderKind) -> AgentProviderKind {
     match p {
@@ -17,6 +24,77 @@ fn image_to_agent_provider(p: ImageProviderKind) -> AgentProviderKind {
     }
 }
 
+fn image_provider_label(i18n: &I18nService, provider: ImageProviderKind) -> String {
+    let key = match provider {
+        ImageProviderKind::Openrouter => I18nKey::AgProviderOpenrouter,
+        ImageProviderKind::Openai => I18nKey::AgProviderOpenai,
+    };
+    i18n.tr(key)().to_string()
+}
+
+fn image_provider_icon_url(provider: ImageProviderKind) -> &'static str {
+    match provider {
+        ImageProviderKind::Openrouter => "/public/brand-icons/openrouter.svg",
+        ImageProviderKind::Openai => "/public/brand-icons/openai.svg",
+    }
+}
+
+fn image_provider_key_status(
+    i18n: &I18nService,
+    view: &AgentProviderSettingsView,
+    provider: ImageProviderKind,
+) -> String {
+    let agent = image_to_agent_provider(provider);
+    let configured = view
+        .key_statuses
+        .iter()
+        .find(|s| s.provider == agent)
+        .map(|s| s.configured)
+        .unwrap_or(false);
+    if configured {
+        let mask = view
+            .key_statuses
+            .iter()
+            .find(|s| s.provider == agent)
+            .and_then(|s| s.masked_value.clone());
+        if let Some(mask) = mask {
+            format!("{} ({mask})", i18n.tr(I18nKey::AgApiKeyConfigured)())
+        } else {
+            i18n.tr(I18nKey::AgApiKeyConfigured)().to_string()
+        }
+    } else {
+        i18n.tr(I18nKey::AgApiKeyMissing)().to_string()
+    }
+}
+
+fn focus_by_id(id: &str) {
+    let Some(doc) = web_sys::window().and_then(|w| w.document()) else {
+        return;
+    };
+    let Some(el) = doc.get_element_by_id(id) else {
+        return;
+    };
+    let Ok(button) = el.dyn_into::<web_sys::HtmlElement>() else {
+        return;
+    };
+    let _ = button.focus();
+}
+
+fn focus_image_provider_option(provider: ImageProviderKind) {
+    focus_by_id(&format!("image-provider-option-{}", provider.as_str()));
+}
+
+fn next_image_provider(provider: ImageProviderKind) -> ImageProviderKind {
+    match provider {
+        ImageProviderKind::Openrouter => ImageProviderKind::Openai,
+        ImageProviderKind::Openai => ImageProviderKind::Openrouter,
+    }
+}
+
+fn prev_image_provider(provider: ImageProviderKind) -> ImageProviderKind {
+    next_image_provider(provider)
+}
+
 fn looks_like_image_model(id: &str) -> bool {
     let l = id.to_ascii_lowercase();
     l.contains("image")
@@ -48,19 +126,155 @@ async fn fetch_image_models(
     out.set(entries);
 }
 
+#[component]
+fn ImageProviderPicker(
+    selected_provider: RwSignal<ImageProviderKind>,
+    on_select: Callback<ImageProviderKind>,
+) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let open = RwSignal::new(false);
+
+    let choose = move |provider: ImageProviderKind| {
+        selected_provider.set(provider);
+        open.set(false);
+        on_select.run(provider);
+    };
+
+    view! {
+        <div class="harness-provider-picker">
+            <button
+                type="button"
+                class="harness-provider-trigger"
+                aria-haspopup="listbox"
+                aria-expanded=move || if open.get() { "true" } else { "false" }
+                on:click=move |_| {
+                    let next = !open.get_untracked();
+                    open.set(next);
+                    if next {
+                        let provider = selected_provider.get_untracked();
+                        leptos::task::spawn_local(async move {
+                            TimeoutFuture::new(0).await;
+                            focus_image_provider_option(provider);
+                        });
+                    }
+                }
+                on:keydown=move |ev: web_sys::KeyboardEvent| {
+                    match ev.key().as_str() {
+                        "ArrowDown" | "Enter" | " " => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let provider = selected_provider.get_untracked();
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_image_provider_option(provider);
+                            });
+                        }
+                        "ArrowUp" => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let provider = prev_image_provider(selected_provider.get_untracked());
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_image_provider_option(provider);
+                            });
+                        }
+                        "Escape" => open.set(false),
+                        _ => {}
+                    }
+                }
+            >
+                <span class="harness-provider-trigger__main">
+                    <span class="harness-provider-trigger__brand">
+                        <img
+                            class="harness-provider-trigger__img"
+                            src=move || image_provider_icon_url(selected_provider.get())
+                            alt=""
+                        />
+                    </span>
+                    <span>{move || image_provider_label(&i18n, selected_provider.get())}</span>
+                </span>
+                <span class="harness-provider-trigger__caret">"▾"</span>
+            </button>
+
+            <Show when=move || open.get()>
+                <div class="harness-provider-menu" role="listbox">
+                    {move || {
+                        image_providers()
+                            .into_iter()
+                            .map(|provider| {
+                                view! {
+                                    <button
+                                        id=format!("image-provider-option-{}", provider.as_str())
+                                        type="button"
+                                        role="option"
+                                        class="harness-provider-option"
+                                        class:harness-provider-option--active=move || selected_provider.get() == provider
+                                        aria-selected=move || if selected_provider.get() == provider {
+                                            "true"
+                                        } else {
+                                            "false"
+                                        }
+                                        on:click=move |_| choose(provider)
+                                        on:keydown=move |ev: web_sys::KeyboardEvent| {
+                                            match ev.key().as_str() {
+                                                "ArrowDown" => {
+                                                    ev.prevent_default();
+                                                    focus_image_provider_option(next_image_provider(provider));
+                                                }
+                                                "ArrowUp" => {
+                                                    ev.prevent_default();
+                                                    focus_image_provider_option(prev_image_provider(provider));
+                                                }
+                                                "Enter" | " " => {
+                                                    ev.prevent_default();
+                                                    choose(provider);
+                                                }
+                                                "Escape" => {
+                                                    ev.prevent_default();
+                                                    open.set(false);
+                                                }
+                                                _ => {}
+                                            }
+                                        }
+                                    >
+                                        <span class="harness-provider-option__brand">
+                                            <img
+                                                class="harness-provider-option__img"
+                                                src=image_provider_icon_url(provider)
+                                                alt=""
+                                            />
+                                        </span>
+                                        <span>{image_provider_label(&i18n, provider)}</span>
+                                    </button>
+                                }
+                            })
+                            .collect_view()
+                    }}
+                </div>
+            </Show>
+        </div>
+    }
+}
+
 /// Image model settings column (BLXCode Agent grid, middle).
 #[component]
 pub fn AgentImageColumn() -> impl IntoView {
     let i18n = expect_context::<I18nService>();
     let settings = RwSignal::new(Option::<ImageSettings>::None);
+    let agent_settings = RwSignal::new(Option::<AgentProviderSettingsView>::None);
     let status = RwSignal::new(Option::<String>::None);
+    let selected_provider = RwSignal::new(ImageProviderKind::Openai);
     let model_entries = RwSignal::new(Vec::<ProviderModelEntry>::new());
     let model_id = RwSignal::new(String::new());
     let loading_models = RwSignal::new(false);
 
     if is_tauri_shell() {
         leptos::task::spawn_local(async move {
+            if let Ok(view) = agent_settings_get().await {
+                agent_settings.set(Some(view));
+            }
             if let Ok(s) = image_settings_get().await {
+                selected_provider.set(s.provider);
                 model_id.set(s.model_id.clone());
                 fetch_image_models(s.provider, model_entries).await;
                 settings.set(Some(s));
@@ -70,6 +284,7 @@ pub fn AgentImageColumn() -> impl IntoView {
 
     let save = move |patch: ImageSettings| {
         if !is_tauri_shell() {
+            selected_provider.set(patch.provider);
             model_id.set(patch.model_id.clone());
             settings.set(Some(patch));
             return;
@@ -77,6 +292,7 @@ pub fn AgentImageColumn() -> impl IntoView {
         leptos::task::spawn_local(async move {
             match image_settings_save(patch).await {
                 Ok(s) => {
+                    selected_provider.set(s.provider);
                     model_id.set(s.model_id.clone());
                     settings.set(Some(s));
                     status.set(Some(i18n.tr(I18nKey::ApiKeysSaved)().to_string()));
@@ -94,11 +310,15 @@ pub fn AgentImageColumn() -> impl IntoView {
         });
     };
 
+    let on_provider_select = Callback::new(move |p: ImageProviderKind| {
+        let mut next = settings.get_untracked().unwrap_or_default();
+        next.provider = p;
+        save(next);
+        reload_models(p);
+    });
+
     let on_model_change = Callback::new(move |m: String| {
-        let Some(current) = settings.get_untracked() else {
-            return;
-        };
-        let mut next = current;
+        let mut next = settings.get_untracked().unwrap_or_default();
         next.model_id = m;
         save(next);
     });
@@ -111,7 +331,6 @@ pub fn AgentImageColumn() -> impl IntoView {
                 </span>
                 <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgColumnImage)()}</span>
             </h4>
-            <p class="app-prefs-hint">{move || i18n.tr(I18nKey::ImagePaneDescription)()}</p>
 
             <Show
                 when=move || settings.get().is_some()
@@ -119,78 +338,62 @@ pub fn AgentImageColumn() -> impl IntoView {
                     <p class="image-pane__loading">{move || i18n.tr(I18nKey::BlxLoading)()}</p>
                 }
             >
-                {move || {
-                    let Some(current) = settings.get() else {
-                        return view! { <></> }.into_any();
-                    };
-                    let provider = current.provider;
-
-                    let on_provider = {
-                        let current = current.clone();
-                        move |p: ImageProviderKind| {
-                            let mut next = current.clone();
-                            next.provider = p;
-                            save(next);
-                            reload_models(p);
-                        }
-                    };
-
-                    view! {
-                        <div class="image-pane__field">
-                            <label>{move || i18n.tr(I18nKey::ImageProviderField)()}</label>
-                            <div class="image-pane__provider-row">
-                                <ProviderBtn
-                                    label="OpenAI"
-                                    target=ImageProviderKind::Openai
-                                    active=provider
-                                    on_select=Callback::new({
-                                        let on_provider = on_provider.clone();
-                                        move |_| on_provider(ImageProviderKind::Openai)
-                                    })
-                                />
-                                <ProviderBtn
-                                    label="OpenRouter"
-                                    target=ImageProviderKind::Openrouter
-                                    active=provider
-                                    on_select=Callback::new({
-                                        let on_provider = on_provider.clone();
-                                        move |_| on_provider(ImageProviderKind::Openrouter)
-                                    })
-                                />
-                            </div>
-                        </div>
-
-                        <label class="harness-stack">
-                            <span class="harness-field-label">
-                                <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgModelField)()}</span>
+                <div class="agent-provider-pane__picker-grid agent-provider-pane__picker-grid--stacked">
+                    <label class="agent-provider-pane__field">
+                        <span class="harness-field-label">
+                            <span class="harness-field-label__icon" aria-hidden="true">
+                                <LxIcon icon=icondata::LuPlug width="0.82rem" height="0.82rem" />
                             </span>
-                            <AgentModelPicker
-                                model_id=model_id
-                                model_entries=model_entries
-                                loading_models=loading_models
-                                option_id_prefix="agent-image-model"
-                                on_change=on_model_change
-                            />
-                        </label>
-                        <div class="agent-provider-pane__actions">
-                            <button
-                                type="button"
-                                class="workbench-mini-btn"
-                                disabled=move || loading_models.get() || !is_tauri_shell()
-                                on:click=move |_| reload_models(provider)
-                            >
-                                <span class="harness-btn-inline">
-                                    <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
-                                    <span>{move || if loading_models.get() {
-                                        i18n.tr(I18nKey::AgModelsLoading)().to_string()
-                                    } else {
-                                        i18n.tr(I18nKey::AgModelsRefresh)().to_string()
-                                    }}</span>
-                                </span>
-                            </button>
-                        </div>
-                    }.into_any()
-                }}
+                            <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgProviderField)()}</span>
+                        </span>
+                        <ImageProviderPicker
+                            selected_provider=selected_provider
+                            on_select=on_provider_select
+                        />
+                    </label>
+                </div>
+                <div class="agent-provider-pane__key-row harness-muted">
+                    <span>{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</span>
+                    <span class="agent-provider-pane__key-status">
+                        {move || {
+                            agent_settings
+                                .get()
+                                .map(|view| {
+                                    image_provider_key_status(&i18n, &view, selected_provider.get())
+                                })
+                                .unwrap_or_else(|| i18n.tr(I18nKey::AgApiKeyMissing)().to_string())
+                        }}
+                    </span>
+                </div>
+                <label class="harness-stack">
+                    <span class="harness-field-label">
+                        <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgModelField)()}</span>
+                    </span>
+                    <AgentModelPicker
+                        model_id=model_id
+                        model_entries=model_entries
+                        loading_models=loading_models
+                        option_id_prefix="agent-image-model"
+                        on_change=on_model_change
+                    />
+                </label>
+                <div class="agent-provider-pane__actions">
+                    <button
+                        type="button"
+                        class="workbench-mini-btn"
+                        disabled=move || loading_models.get() || !is_tauri_shell()
+                        on:click=move |_| reload_models(selected_provider.get_untracked())
+                    >
+                        <span class="harness-btn-inline">
+                            <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
+                            <span>{move || if loading_models.get() {
+                                i18n.tr(I18nKey::AgModelsLoading)().to_string()
+                            } else {
+                                i18n.tr(I18nKey::AgModelsRefresh)().to_string()
+                            }}</span>
+                        </span>
+                    </button>
+                </div>
             </Show>
 
             <Show when=move || status.get().is_some()>
@@ -217,23 +420,3 @@ pub fn ImagePane() -> impl IntoView {
         </article>
     }
 }
-
-#[component]
-fn ProviderBtn(
-    label: &'static str,
-    target: ImageProviderKind,
-    active: ImageProviderKind,
-    on_select: Callback<()>,
-) -> impl IntoView {
-    let is_active = move || target == active;
-    view! {
-        <button
-            type="button"
-            class="image-pane__choice"
-            class:image-pane__choice--active=is_active
-            on:click=move |_| on_select.run(())
-        >
-            {label}
-        </button>
-    }
-}

From aab35271f6025426b184abf977a86e72c58600fc Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:37:29 +0200
Subject: [PATCH 30/48] feat(image_settings): introduce image quality level
 feature and localization support

- Added a new `ImageQualityLevel` enum to define various quality tiers for image generation, with a default set to Medium.
- Updated `ImageSettings` to include a quality field, enhancing the configuration options for image generation.
- Integrated localization keys for image quality levels in multiple languages, improving internationalization support across the application.
- Enhanced image generation functions to utilize the new quality settings, ensuring better control over output resolution and quality.
---
 src-tauri/src/image/generate.rs         |  68 ++++++--
 src-tauri/src/image/mod.rs              |   2 +-
 src-tauri/src/image/settings.rs         |  62 ++++++++
 src/i18n/keys.rs                        |   5 +
 src/i18n/locales/de_de.rs               |   5 +
 src/i18n/locales/en_us.rs               |   5 +
 src/i18n/locales/es_es.rs               |   5 +
 src/i18n/locales/fr_fr.rs               |   5 +
 src/i18n/locales/hu_hu.rs               |   5 +
 src/i18n/locales/it_it.rs               |   5 +
 src/i18n/locales/ja_jp.rs               |   5 +
 src/i18n/locales/ko_kr.rs               |   5 +
 src/i18n/locales/pl_pl.rs               |   5 +
 src/i18n/locales/pt_br.rs               |   5 +
 src/i18n/locales/ru_ru.rs               |   5 +
 src/i18n/locales/zh_cn.rs               |   5 +
 src/i18n/locales/zh_tw.rs               |   5 +
 src/tauri_bridge.rs                     |  18 +++
 src/workbench/harness_image_pane/mod.rs | 197 +++++++++++++++++++++++-
 19 files changed, 404 insertions(+), 13 deletions(-)

diff --git a/src-tauri/src/image/generate.rs b/src-tauri/src/image/generate.rs
index 933067e..74e5a22 100644
--- a/src-tauri/src/image/generate.rs
+++ b/src-tauri/src/image/generate.rs
@@ -21,7 +21,7 @@ use std::time::Duration;
 
 use crate::agent::protocol::AgentImageContextItem;
 use crate::agent::state::AgentEngineState;
-use crate::image::settings::{ImageProviderKind, ImageSettings};
+use crate::image::settings::{ImageProviderKind, ImageQualityLevel, ImageSettings};
 
 /// Hard ceilings: align with the chat-side limits (see `commands.rs`).
 const MAX_REF_IMAGES: usize = 4;
@@ -125,10 +125,26 @@ pub async fn generate(
 
     let res = match settings.provider {
         ImageProviderKind::Openai => {
-            generate_openai(&client, &settings.model_id, api_key, prompt, refs).await
+            generate_openai(
+                &client,
+                &settings.model_id,
+                settings.quality,
+                api_key,
+                prompt,
+                refs,
+            )
+            .await
         }
         ImageProviderKind::Openrouter => {
-            generate_openrouter(&client, &settings.model_id, api_key, prompt, refs).await
+            generate_openrouter(
+                &client,
+                &settings.model_id,
+                settings.quality,
+                api_key,
+                prompt,
+                refs,
+            )
+            .await
         }
     };
 
@@ -164,31 +180,48 @@ struct OpenaiError {
     message: Option<String>,
 }
 
+fn openai_image_request_body(model: &str, prompt: &str, quality: ImageQualityLevel) -> Value {
+    let model_lc = model.to_ascii_lowercase();
+    let mut body = json!({
+        "model": model,
+        "prompt": prompt,
+        "n": 1,
+        "size": quality.openai_size(),
+    });
+    let quality_param = if model_lc.contains("dall-e") || model_lc.contains("dalle") {
+        quality.openai_dalle_quality()
+    } else {
+        quality.openai_gpt_quality()
+    };
+    if let Some(obj) = body.as_object_mut() {
+        obj.insert("quality".into(), json!(quality_param));
+    }
+    body
+}
+
 async fn generate_openai(
     client: &reqwest::Client,
     model: &str,
+    quality: ImageQualityLevel,
     api_key: &str,
     prompt: &str,
     refs: &[AgentImageContextItem],
 ) -> Result<GeneratedImage, GenerateError> {
     if refs.is_empty() {
-        generate_openai_text(client, model, api_key, prompt).await
+        generate_openai_text(client, model, quality, api_key, prompt).await
     } else {
-        generate_openai_edit(client, model, api_key, prompt, refs).await
+        generate_openai_edit(client, model, quality, api_key, prompt, refs).await
     }
 }
 
 async fn generate_openai_text(
     client: &reqwest::Client,
     model: &str,
+    quality: ImageQualityLevel,
     api_key: &str,
     prompt: &str,
 ) -> Result<GeneratedImage, GenerateError> {
-    let body = json!({
-        "model": model,
-        "prompt": prompt,
-        "n": 1,
-    });
+    let body = openai_image_request_body(model, prompt, quality);
     let res = client
         .post("https://api.openai.com/v1/images/generations")
         .bearer_auth(api_key)
@@ -211,14 +244,23 @@ async fn generate_openai_text(
 async fn generate_openai_edit(
     client: &reqwest::Client,
     model: &str,
+    quality: ImageQualityLevel,
     api_key: &str,
     prompt: &str,
     refs: &[AgentImageContextItem],
 ) -> Result<GeneratedImage, GenerateError> {
+    let model_lc = model.to_ascii_lowercase();
+    let quality_param = if model_lc.contains("dall-e") || model_lc.contains("dalle") {
+        quality.openai_dalle_quality()
+    } else {
+        quality.openai_gpt_quality()
+    };
     let mut form = reqwest::multipart::Form::new()
         .text("model", model.to_owned())
         .text("prompt", prompt.to_owned())
-        .text("n", "1");
+        .text("n", "1")
+        .text("size", quality.openai_size().to_owned())
+        .text("quality", quality_param.to_owned());
     for (idx, item) in refs.iter().enumerate() {
         let bytes = BASE64
             .decode(item.bytes_b64.as_bytes())
@@ -346,6 +388,7 @@ struct OpenrouterError {
 async fn generate_openrouter(
     client: &reqwest::Client,
     model: &str,
+    quality: ImageQualityLevel,
     api_key: &str,
     prompt: &str,
     refs: &[AgentImageContextItem],
@@ -356,6 +399,9 @@ async fn generate_openrouter(
         "modalities": ["image", "text"],
         "messages": [{ "role": "user", "content": content }],
         "stream": false,
+        "image_config": {
+            "quality": quality.openrouter_image_quality(),
+        },
     });
     let res = client
         .post("https://openrouter.ai/api/v1/chat/completions")
diff --git a/src-tauri/src/image/mod.rs b/src-tauri/src/image/mod.rs
index 81dd374..688e554 100644
--- a/src-tauri/src/image/mod.rs
+++ b/src-tauri/src/image/mod.rs
@@ -14,4 +14,4 @@ pub mod settings;
 
 pub use commands::*;
 #[allow(unused_imports)]
-pub use settings::{ImageProviderKind, ImageSettings};
+pub use settings::{ImageProviderKind, ImageQualityLevel, ImageSettings};
diff --git a/src-tauri/src/image/settings.rs b/src-tauri/src/image/settings.rs
index 703455c..94bc9d2 100644
--- a/src-tauri/src/image/settings.rs
+++ b/src-tauri/src/image/settings.rs
@@ -29,11 +29,64 @@ impl Default for ImageProviderKind {
     }
 }
 
+/// Output quality / resolution tier for image generation (UI: parallel to text
+/// `ThinkingLevel`, without an "off" step).
+#[derive(Clone, Copy, Debug, PartialEq, Eq, Serialize, Deserialize, Default)]
+#[serde(rename_all = "camelCase")]
+pub enum ImageQualityLevel {
+    Low,
+    #[default]
+    Medium,
+    High,
+    Max,
+}
+
+impl ImageQualityLevel {
+    /// OpenAI `quality` for GPT Image / similar (`low` | `medium` | `high`).
+    pub fn openai_gpt_quality(self) -> &'static str {
+        match self {
+            Self::Low => "low",
+            Self::Medium => "medium",
+            Self::High | Self::Max => "high",
+        }
+    }
+
+    /// OpenAI DALL·E 3 `quality` (`standard` | `hd`).
+    pub fn openai_dalle_quality(self) -> &'static str {
+        match self {
+            Self::Low | Self::Medium => "standard",
+            Self::High | Self::Max => "hd",
+        }
+    }
+
+    /// OpenAI `size` for generations / edits.
+    pub fn openai_size(self) -> &'static str {
+        match self {
+            Self::Low => "1024x1024",
+            Self::Medium => "1024x1024",
+            Self::High => "1536x1024",
+            Self::Max => "1792x1024",
+        }
+    }
+
+    /// OpenRouter `image_config.quality` hint when supported by the model.
+    pub fn openrouter_image_quality(self) -> &'static str {
+        match self {
+            Self::Low => "low",
+            Self::Medium => "medium",
+            Self::High => "high",
+            Self::Max => "ultra",
+        }
+    }
+}
+
 #[derive(Clone, Debug, Serialize, Deserialize)]
 #[serde(rename_all = "camelCase")]
 pub struct ImageSettings {
     pub provider: ImageProviderKind,
     pub model_id: String,
+    #[serde(default)]
+    pub quality: ImageQualityLevel,
 }
 
 impl Default for ImageSettings {
@@ -41,6 +94,7 @@ impl Default for ImageSettings {
         Self {
             provider: ImageProviderKind::Openai,
             model_id: "gpt-image-1".into(),
+            quality: ImageQualityLevel::Medium,
         }
     }
 }
@@ -152,5 +206,13 @@ mod tests {
         let s = ImageSettings::default();
         assert!(matches!(s.provider, ImageProviderKind::Openai));
         assert_eq!(s.model_id, "gpt-image-1");
+        assert_eq!(s.quality, ImageQualityLevel::Medium);
+    }
+
+    #[test]
+    fn quality_maps_openai_tiers() {
+        assert_eq!(ImageQualityLevel::Low.openai_gpt_quality(), "low");
+        assert_eq!(ImageQualityLevel::Max.openai_dalle_quality(), "hd");
+        assert_eq!(ImageQualityLevel::High.openai_size(), "1536x1024");
     }
 }
diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index 6955c12..3dd423c 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -376,6 +376,11 @@ pub enum I18nKey {
     AgThinkingMedium,
     AgThinkingHigh,
     AgThinkingMax,
+    AgImageQualityField,
+    AgImageQualityLow,
+    AgImageQualityMedium,
+    AgImageQualityHigh,
+    AgImageQualityMax,
     AgApiKeyField,
     AgApiKeyHint,
     AgApiKeySet,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index e758cfc..2bbe805 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -368,6 +368,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "Mittel",
         I18nKey::AgThinkingHigh => "Hoch",
         I18nKey::AgThinkingMax => "Max",
+        I18nKey::AgImageQualityField => "Qualitätsstufe",
+        I18nKey::AgImageQualityLow => "Niedrig",
+        I18nKey::AgImageQualityMedium => "Mittel",
+        I18nKey::AgImageQualityHigh => "Hoch",
+        I18nKey::AgImageQualityMax => "Max",
         I18nKey::AgApiKeyField => "API-Schlüssel",
         I18nKey::AgApiKeyHint => "Secrets werden im Schlüsselbund des Betriebssystems gespeichert, niemals im Browserspeicher.",
         I18nKey::AgApiKeySet => "API-Schlüssel speichern",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index 52cdc6c..da93c19 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -406,6 +406,11 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::AgThinkingMedium => "Medium",
         I18nKey::AgThinkingHigh => "High",
         I18nKey::AgThinkingMax => "Max",
+        I18nKey::AgImageQualityField => "Quality level",
+        I18nKey::AgImageQualityLow => "Low",
+        I18nKey::AgImageQualityMedium => "Medium",
+        I18nKey::AgImageQualityHigh => "High",
+        I18nKey::AgImageQualityMax => "Max",
         I18nKey::AgApiKeyField => "API key",
         I18nKey::AgApiKeyHint => "Secrets are stored in the OS keychain, never in browser storage.",
         I18nKey::AgApiKeySet => "Save API key",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index 77b8eef..a6488e3 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -368,6 +368,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "Medio",
         I18nKey::AgThinkingHigh => "Alto",
         I18nKey::AgThinkingMax => "máx.",
+        I18nKey::AgImageQualityField => "Nivel de calidad",
+        I18nKey::AgImageQualityLow => "Bajo",
+        I18nKey::AgImageQualityMedium => "Medio",
+        I18nKey::AgImageQualityHigh => "Alto",
+        I18nKey::AgImageQualityMax => "Máx.",
         I18nKey::AgApiKeyField => "clave API",
         I18nKey::AgApiKeyHint => {
             "Los secretos se almacenan en el llavero del sistema operativo, nunca en el almacenamiento del navegador."
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index 372d4ed..f2f320b 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -370,6 +370,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "Moyen",
         I18nKey::AgThinkingHigh => "Haut",
         I18nKey::AgThinkingMax => "Max.",
+        I18nKey::AgImageQualityField => "Niveau de qualité",
+        I18nKey::AgImageQualityLow => "Faible",
+        I18nKey::AgImageQualityMedium => "Moyen",
+        I18nKey::AgImageQualityHigh => "Élevé",
+        I18nKey::AgImageQualityMax => "Max.",
         I18nKey::AgApiKeyField => "Clé API",
         I18nKey::AgApiKeyHint => {
             "Les secrets sont stockés dans le trousseau du système d’exploitation, jamais dans le stockage du navigateur."
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index 1e51575..32847cd 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -368,6 +368,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "Közepes",
         I18nKey::AgThinkingHigh => "Magas",
         I18nKey::AgThinkingMax => "Max",
+        I18nKey::AgImageQualityField => "Minőségi szint",
+        I18nKey::AgImageQualityLow => "Alacsony",
+        I18nKey::AgImageQualityMedium => "Közepes",
+        I18nKey::AgImageQualityHigh => "Magas",
+        I18nKey::AgImageQualityMax => "Max",
         I18nKey::AgApiKeyField => "API kulcs",
         I18nKey::AgApiKeyHint => "A titkok az operációs rendszer kulcstartójában tárolódnak, soha nem a böngésző tárhelyén.",
         I18nKey::AgApiKeySet => "API kulcs mentése",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index 634c21c..a8340bb 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -368,6 +368,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "Medio",
         I18nKey::AgThinkingHigh => "Alto",
         I18nKey::AgThinkingMax => "Massimo",
+        I18nKey::AgImageQualityField => "Livello di qualità",
+        I18nKey::AgImageQualityLow => "Basso",
+        I18nKey::AgImageQualityMedium => "Medio",
+        I18nKey::AgImageQualityHigh => "Alto",
+        I18nKey::AgImageQualityMax => "Massimo",
         I18nKey::AgApiKeyField => "Chiave API",
         I18nKey::AgApiKeyHint => "I segreti vengono archiviati nel portachiavi del sistema operativo, mai nella memoria del browser.",
         I18nKey::AgApiKeySet => "Salva la chiave API",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index 14d6cf9..f230872 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -362,6 +362,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "中くらい",
         I18nKey::AgThinkingHigh => "高い",
         I18nKey::AgThinkingMax => "マックス",
+        I18nKey::AgImageQualityField => "品質レベル",
+        I18nKey::AgImageQualityLow => "低い",
+        I18nKey::AgImageQualityMedium => "中くらい",
+        I18nKey::AgImageQualityHigh => "高い",
+        I18nKey::AgImageQualityMax => "マックス",
         I18nKey::AgApiKeyField => "APIキー",
         I18nKey::AgApiKeyHint => "シークレットは OS キーチェーンに保存され、ブラウザーのストレージには決して保存されません。",
         I18nKey::AgApiKeySet => "APIキーを保存する",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index 786dc83..3278ed9 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -362,6 +362,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "중간",
         I18nKey::AgThinkingHigh => "높은",
         I18nKey::AgThinkingMax => "맥스",
+        I18nKey::AgImageQualityField => "품질 수준",
+        I18nKey::AgImageQualityLow => "낮은",
+        I18nKey::AgImageQualityMedium => "중간",
+        I18nKey::AgImageQualityHigh => "높은",
+        I18nKey::AgImageQualityMax => "맥스",
         I18nKey::AgApiKeyField => "API 키",
         I18nKey::AgApiKeyHint => "비밀은 OS 키체인에 저장되며 브라우저 저장소에는 저장되지 않습니다.",
         I18nKey::AgApiKeySet => "API 키 저장",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index 0858ac0..e20211e 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -366,6 +366,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "Średni",
         I18nKey::AgThinkingHigh => "Wysoki",
         I18nKey::AgThinkingMax => "Maks",
+        I18nKey::AgImageQualityField => "Poziom jakości",
+        I18nKey::AgImageQualityLow => "Niski",
+        I18nKey::AgImageQualityMedium => "Średni",
+        I18nKey::AgImageQualityHigh => "Wysoki",
+        I18nKey::AgImageQualityMax => "Maks",
         I18nKey::AgApiKeyField => "Klucz API",
         I18nKey::AgApiKeyHint => "Sekrety są przechowywane w pęku kluczy systemu operacyjnego, nigdy w pamięci przeglądarki.",
         I18nKey::AgApiKeySet => "Zapisz klucz API",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index a22433e..dcfc6c4 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -368,6 +368,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "Médio",
         I18nKey::AgThinkingHigh => "Alto",
         I18nKey::AgThinkingMax => "Máx.",
+        I18nKey::AgImageQualityField => "Nível de qualidade",
+        I18nKey::AgImageQualityLow => "Baixo",
+        I18nKey::AgImageQualityMedium => "Médio",
+        I18nKey::AgImageQualityHigh => "Alto",
+        I18nKey::AgImageQualityMax => "Máx.",
         I18nKey::AgApiKeyField => "Chave de API",
         I18nKey::AgApiKeyHint => "Os segredos são armazenados nas chaves do sistema operacional, nunca no armazenamento do navegador.",
         I18nKey::AgApiKeySet => "Salvar chave de API",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index bfb158e..eb1e0d8 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -366,6 +366,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "Середина",
         I18nKey::AgThinkingHigh => "Высокий",
         I18nKey::AgThinkingMax => "Макс",
+        I18nKey::AgImageQualityField => "Уровень качества",
+        I18nKey::AgImageQualityLow => "Низкий",
+        I18nKey::AgImageQualityMedium => "Середина",
+        I18nKey::AgImageQualityHigh => "Высокий",
+        I18nKey::AgImageQualityMax => "Макс",
         I18nKey::AgApiKeyField => "API-ключ",
         I18nKey::AgApiKeyHint => "Секреты хранятся в цепочке ключей ОС, а не в хранилище браузера.",
         I18nKey::AgApiKeySet => "Сохранить ключ API",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index facc593..d5672d3 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -360,6 +360,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "中等的",
         I18nKey::AgThinkingHigh => "高的",
         I18nKey::AgThinkingMax => "最大限度",
+        I18nKey::AgImageQualityField => "质量级别",
+        I18nKey::AgImageQualityLow => "低的",
+        I18nKey::AgImageQualityMedium => "中等的",
+        I18nKey::AgImageQualityHigh => "高的",
+        I18nKey::AgImageQualityMax => "最大限度",
         I18nKey::AgApiKeyField => "API密钥",
         I18nKey::AgApiKeyHint => "秘密存储在操作系统钥匙串中，而不是存储在浏览器存储中。",
         I18nKey::AgApiKeySet => "保存 API 密钥",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index 03fec59..bcd7624 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -360,6 +360,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::AgThinkingMedium => "中等的",
         I18nKey::AgThinkingHigh => "高的",
         I18nKey::AgThinkingMax => "最大限度",
+        I18nKey::AgImageQualityField => "品質級別",
+        I18nKey::AgImageQualityLow => "低的",
+        I18nKey::AgImageQualityMedium => "中等的",
+        I18nKey::AgImageQualityHigh => "高的",
+        I18nKey::AgImageQualityMax => "最大限度",
         I18nKey::AgApiKeyField => "API金鑰",
         I18nKey::AgApiKeyHint => "秘密儲存在作業系統鑰匙圈中，而不是儲存在瀏覽器儲存中。",
         I18nKey::AgApiKeySet => "保存 API 金鑰",
diff --git a/src/tauri_bridge.rs b/src/tauri_bridge.rs
index 23127af..1372b4c 100644
--- a/src/tauri_bridge.rs
+++ b/src/tauri_bridge.rs
@@ -2065,11 +2065,28 @@ impl ImageProviderKind {
     }
 }
 
+#[derive(Clone, Copy, Debug, PartialEq, Eq, serde::Serialize, serde::Deserialize)]
+#[serde(rename_all = "camelCase")]
+pub enum ImageQualityLevel {
+    Low,
+    Medium,
+    High,
+    Max,
+}
+
+impl Default for ImageQualityLevel {
+    fn default() -> Self {
+        Self::Medium
+    }
+}
+
 #[derive(Clone, Debug, serde::Serialize, serde::Deserialize)]
 #[serde(rename_all = "camelCase")]
 pub struct ImageSettings {
     pub provider: ImageProviderKind,
     pub model_id: String,
+    #[serde(default)]
+    pub quality: ImageQualityLevel,
 }
 
 impl Default for ImageSettings {
@@ -2077,6 +2094,7 @@ impl Default for ImageSettings {
         Self {
             provider: ImageProviderKind::Openai,
             model_id: "gpt-image-1".into(),
+            quality: ImageQualityLevel::Medium,
         }
     }
 }
diff --git a/src/workbench/harness_image_pane/mod.rs b/src/workbench/harness_image_pane/mod.rs
index bbb1261..bead293 100644
--- a/src/workbench/harness_image_pane/mod.rs
+++ b/src/workbench/harness_image_pane/mod.rs
@@ -5,7 +5,7 @@ use crate::service::I18nService;
 use crate::tauri_bridge::{
     agent_provider_models, agent_settings_get, image_settings_get, image_settings_save,
     is_tauri_shell, AgentProviderKind, AgentProviderSettingsView, ImageProviderKind,
-    ImageSettings, ProviderModelEntry,
+    ImageQualityLevel, ImageSettings, ProviderModelEntry,
 };
 use crate::workbench::agent_model_picker::AgentModelPicker;
 use gloo_timers::future::TimeoutFuture;
@@ -95,6 +95,51 @@ fn prev_image_provider(provider: ImageProviderKind) -> ImageProviderKind {
     next_image_provider(provider)
 }
 
+fn image_quality_levels() -> [ImageQualityLevel; 4] {
+    [
+        ImageQualityLevel::Low,
+        ImageQualityLevel::Medium,
+        ImageQualityLevel::High,
+        ImageQualityLevel::Max,
+    ]
+}
+
+fn image_quality_label(i18n: &I18nService, level: ImageQualityLevel) -> String {
+    let key = match level {
+        ImageQualityLevel::Low => I18nKey::AgImageQualityLow,
+        ImageQualityLevel::Medium => I18nKey::AgImageQualityMedium,
+        ImageQualityLevel::High => I18nKey::AgImageQualityHigh,
+        ImageQualityLevel::Max => I18nKey::AgImageQualityMax,
+    };
+    i18n.tr(key)().to_string()
+}
+
+fn image_quality_icon(level: ImageQualityLevel) -> icondata::Icon {
+    match level {
+        ImageQualityLevel::Low => icondata::LuGauge,
+        ImageQualityLevel::Medium => icondata::LuImage,
+        ImageQualityLevel::High => icondata::LuSparkles,
+        ImageQualityLevel::Max => icondata::LuZap,
+    }
+}
+
+fn focus_image_quality_option(level: ImageQualityLevel) {
+    let id = format!("image-quality-option-{level:?}").to_ascii_lowercase();
+    focus_by_id(&id);
+}
+
+fn next_image_quality(level: ImageQualityLevel) -> ImageQualityLevel {
+    let levels = image_quality_levels();
+    let idx = levels.iter().position(|l| *l == level).unwrap_or(1);
+    levels[(idx + 1) % levels.len()]
+}
+
+fn prev_image_quality(level: ImageQualityLevel) -> ImageQualityLevel {
+    let levels = image_quality_levels();
+    let idx = levels.iter().position(|l| *l == level).unwrap_or(1);
+    levels[(idx + levels.len() - 1) % levels.len()]
+}
+
 fn looks_like_image_model(id: &str) -> bool {
     let l = id.to_ascii_lowercase();
     l.contains("image")
@@ -256,6 +301,132 @@ fn ImageProviderPicker(
     }
 }
 
+#[component]
+fn ImageQualityLevelPicker(
+    selected: RwSignal<ImageQualityLevel>,
+    on_select: Callback<ImageQualityLevel>,
+) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let open = RwSignal::new(false);
+
+    let choose = move |level: ImageQualityLevel| {
+        selected.set(level);
+        open.set(false);
+        on_select.run(level);
+    };
+
+    view! {
+        <div class="harness-provider-picker">
+            <button
+                type="button"
+                class="harness-provider-trigger"
+                aria-haspopup="listbox"
+                aria-expanded=move || if open.get() { "true" } else { "false" }
+                on:click=move |_| {
+                    let next = !open.get_untracked();
+                    open.set(next);
+                    if next {
+                        let level = selected.get_untracked();
+                        leptos::task::spawn_local(async move {
+                            TimeoutFuture::new(0).await;
+                            focus_image_quality_option(level);
+                        });
+                    }
+                }
+                on:keydown=move |ev: web_sys::KeyboardEvent| {
+                    match ev.key().as_str() {
+                        "ArrowDown" | "Enter" | " " => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let level = selected.get_untracked();
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_image_quality_option(level);
+                            });
+                        }
+                        "ArrowUp" => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let level = prev_image_quality(selected.get_untracked());
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_image_quality_option(level);
+                            });
+                        }
+                        "Escape" => open.set(false),
+                        _ => {}
+                    }
+                }
+            >
+                <span class="harness-provider-trigger__main">
+                    <span class="harness-provider-trigger__brand">
+                        <LxIcon
+                            icon=move || image_quality_icon(selected.get())
+                            width="0.76rem"
+                            height="0.76rem"
+                        />
+                    </span>
+                    <span>{move || image_quality_label(&i18n, selected.get())}</span>
+                </span>
+                <span class="harness-provider-trigger__caret">"▾"</span>
+            </button>
+
+            <Show when=move || open.get()>
+                <div class="harness-provider-menu" role="listbox">
+                    {move || {
+                        image_quality_levels()
+                            .into_iter()
+                            .map(|level| {
+                                view! {
+                                    <button
+                                        id=format!("image-quality-option-{level:?}").to_ascii_lowercase()
+                                        type="button"
+                                        role="option"
+                                        class="harness-provider-option"
+                                        class:harness-provider-option--active=move || selected.get() == level
+                                        aria-selected=move || if selected.get() == level {
+                                            "true"
+                                        } else {
+                                            "false"
+                                        }
+                                        on:click=move |_| choose(level)
+                                        on:keydown=move |ev: web_sys::KeyboardEvent| {
+                                            match ev.key().as_str() {
+                                                "ArrowDown" => {
+                                                    ev.prevent_default();
+                                                    focus_image_quality_option(next_image_quality(level));
+                                                }
+                                                "ArrowUp" => {
+                                                    ev.prevent_default();
+                                                    focus_image_quality_option(prev_image_quality(level));
+                                                }
+                                                "Enter" | " " => {
+                                                    ev.prevent_default();
+                                                    choose(level);
+                                                }
+                                                "Escape" => {
+                                                    ev.prevent_default();
+                                                    open.set(false);
+                                                }
+                                                _ => {}
+                                            }
+                                        }
+                                    >
+                                        <span class="harness-provider-option__brand">
+                                            <LxIcon icon=image_quality_icon(level) width="0.76rem" height="0.76rem" />
+                                        </span>
+                                        <span>{image_quality_label(&i18n, level)}</span>
+                                    </button>
+                                }
+                            })
+                            .collect_view()
+                    }}
+                </div>
+            </Show>
+        </div>
+    }
+}
+
 /// Image model settings column (BLXCode Agent grid, middle).
 #[component]
 pub fn AgentImageColumn() -> impl IntoView {
@@ -264,6 +435,7 @@ pub fn AgentImageColumn() -> impl IntoView {
     let agent_settings = RwSignal::new(Option::<AgentProviderSettingsView>::None);
     let status = RwSignal::new(Option::<String>::None);
     let selected_provider = RwSignal::new(ImageProviderKind::Openai);
+    let quality_level = RwSignal::new(ImageQualityLevel::Medium);
     let model_entries = RwSignal::new(Vec::<ProviderModelEntry>::new());
     let model_id = RwSignal::new(String::new());
     let loading_models = RwSignal::new(false);
@@ -275,6 +447,7 @@ pub fn AgentImageColumn() -> impl IntoView {
             }
             if let Ok(s) = image_settings_get().await {
                 selected_provider.set(s.provider);
+                quality_level.set(s.quality);
                 model_id.set(s.model_id.clone());
                 fetch_image_models(s.provider, model_entries).await;
                 settings.set(Some(s));
@@ -285,6 +458,7 @@ pub fn AgentImageColumn() -> impl IntoView {
     let save = move |patch: ImageSettings| {
         if !is_tauri_shell() {
             selected_provider.set(patch.provider);
+            quality_level.set(patch.quality);
             model_id.set(patch.model_id.clone());
             settings.set(Some(patch));
             return;
@@ -293,6 +467,7 @@ pub fn AgentImageColumn() -> impl IntoView {
             match image_settings_save(patch).await {
                 Ok(s) => {
                     selected_provider.set(s.provider);
+                    quality_level.set(s.quality);
                     model_id.set(s.model_id.clone());
                     settings.set(Some(s));
                     status.set(Some(i18n.tr(I18nKey::ApiKeysSaved)().to_string()));
@@ -313,13 +488,21 @@ pub fn AgentImageColumn() -> impl IntoView {
     let on_provider_select = Callback::new(move |p: ImageProviderKind| {
         let mut next = settings.get_untracked().unwrap_or_default();
         next.provider = p;
+        next.quality = quality_level.get_untracked();
         save(next);
         reload_models(p);
     });
 
+    let on_quality_select = Callback::new(move |q: ImageQualityLevel| {
+        let mut next = settings.get_untracked().unwrap_or_default();
+        next.quality = q;
+        save(next);
+    });
+
     let on_model_change = Callback::new(move |m: String| {
         let mut next = settings.get_untracked().unwrap_or_default();
         next.model_id = m;
+        next.quality = quality_level.get_untracked();
         save(next);
     });
 
@@ -351,6 +534,18 @@ pub fn AgentImageColumn() -> impl IntoView {
                             on_select=on_provider_select
                         />
                     </label>
+                    <label class="agent-provider-pane__field">
+                        <span class="harness-field-label">
+                            <span class="harness-field-label__icon" aria-hidden="true">
+                                <LxIcon icon=icondata::LuSlidersHorizontal width="0.82rem" height="0.82rem" />
+                            </span>
+                            <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgImageQualityField)()}</span>
+                        </span>
+                        <ImageQualityLevelPicker
+                            selected=quality_level
+                            on_select=on_quality_select
+                        />
+                    </label>
                 </div>
                 <div class="agent-provider-pane__key-row harness-muted">
                     <span>{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</span>

From cf1f0e25495605e5db86b51f97c10c354a7e2084 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:45:53 +0200
Subject: [PATCH 31/48] feat(api_keys, image): add support for fal.ai and AWS
 Polly API keys

- Introduced new SVG icons for fal.ai and AWS Polly, enhancing brand representation in the application.
- Updated the API key management system to include a new category for ImageVideo, allowing users to manage keys for image and voice media providers.
- Enhanced localization support by adding new keys for fal.ai and ImageVideo in multiple languages, improving internationalization across the application.
- Updated image generation functionality to support fal.ai, integrating it into the existing image provider framework for seamless user experience.
---
 public/brand-icons/aws.svg              |   1 +
 public/brand-icons/fal.svg              |   1 +
 src-tauri/src/api_keys.rs               |  32 +++++-
 src-tauri/src/image/generate.rs         | 139 +++++++++++++++++++++--
 src-tauri/src/image/settings.rs         |  50 ++++++++-
 src-tauri/src/lib.rs                    |   1 +
 src-tauri/src/media_keys.rs             | 141 ++++++++++++++++++++++++
 src/i18n/keys.rs                        |   2 +
 src/i18n/locales/de_de.rs               |   2 +
 src/i18n/locales/en_us.rs               |   2 +
 src/i18n/locales/es_es.rs               |   2 +
 src/i18n/locales/fr_fr.rs               |   2 +
 src/i18n/locales/hu_hu.rs               |   2 +
 src/i18n/locales/it_it.rs               |   2 +
 src/i18n/locales/ja_jp.rs               |   2 +
 src/i18n/locales/ko_kr.rs               |   2 +
 src/i18n/locales/pl_pl.rs               |   2 +
 src/i18n/locales/pt_br.rs               |   2 +
 src/i18n/locales/ru_ru.rs               |   2 +
 src/i18n/locales/zh_cn.rs               |   2 +
 src/i18n/locales/zh_tw.rs               |   2 +
 src/tauri_bridge.rs                     |   5 +-
 src/workbench/api_keys_pane/mod.rs      |  23 ++++
 src/workbench/harness_image_pane/mod.rs | 123 +++++++++++++++------
 24 files changed, 492 insertions(+), 52 deletions(-)
 create mode 100644 public/brand-icons/aws.svg
 create mode 100644 public/brand-icons/fal.svg
 create mode 100644 src-tauri/src/media_keys.rs

diff --git a/public/brand-icons/aws.svg b/public/brand-icons/aws.svg
new file mode 100644
index 0000000..2f0a306
--- /dev/null
+++ b/public/brand-icons/aws.svg
@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Amazon Web Services</title><path fill="#FF9900" d="M6.5 10.2c0 .7.6 1.2 1.4 1.2.5 0 1-.2 1.4-.5l.3.4c-.5.4-1.1.7-1.8.7-1.2 0-2.1-.8-2.1-2 0-1.2 1-2 2.3-2 .7 0 1.3.2 1.7.5l-.3.5c-.4-.3-.9-.5-1.4-.5-.7 0-1.2.4-1.2 1.1zm8.2-2.1c1.1 0 1.8.7 1.8 1.8v2.8h-.8v-.7c-.4.5-1 .8-1.7.8-1 0-1.6-.6-1.6-1.4 0-.9.7-1.4 2-1.4h1.2v-.2c0-.6-.4-1-1.2-1-.6 0-1.1.2-1.5.5l-.3-.5c.5-.4 1.1-.7 2-.7zm-1.2 3.5v-.2h-1.1c-.9 0-1.3.3-1.3.8 0 .5.4.8 1 .8.7 0 1.4-.5 1.4-1.4zM4 18.5c3.5 2.2 8.1 3.4 12.8 3.4 2.5 0 5-.4 7.4-1.2.4-.1.7.2.3.5-2 1.8-4.7 2.9-7.7 2.9-3.7 0-7-1.5-9.5-3.9-.3-.3 0-.8.4-.7h.3z"/><path fill="#FF9900" d="M3.3 16.8c4.3 3.3 10.7 5.4 16.1 5.4 3 0 5.9-.6 8.7-1.8.4-.2.8.3.4.6-2.3 2-5.4 3.2-8.7 3.2-4.1 0-7.7-1.7-10.5-4.4-.4-.3 0-.9.5-.7l-.5.7z"/></svg>
diff --git a/public/brand-icons/fal.svg b/public/brand-icons/fal.svg
new file mode 100644
index 0000000..6cb6994
--- /dev/null
+++ b/public/brand-icons/fal.svg
@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>fal.ai</title><path fill="#fff" d="M6 4h12v3H6V4zm0 5h9v3H6V9zm0 5h12v3H6v-3zm0 5h7v3H6v-3z"/></svg>
diff --git a/src-tauri/src/api_keys.rs b/src-tauri/src/api_keys.rs
index 9a595c6..2bccc34 100644
--- a/src-tauri/src/api_keys.rs
+++ b/src-tauri/src/api_keys.rs
@@ -11,6 +11,7 @@ use serde::{Deserialize, Serialize};
 use tauri::AppHandle;
 
 use crate::agent::web_settings::{self, WebKeyKind};
+use crate::media_keys::{self, MediaKeyKind};
 use crate::agent_settings::{
     self, delete_provider_key_secret, provider_env_var, provider_key_with_source,
     set_provider_key_secret, AgentProviderKind, KeySource,
@@ -21,6 +22,7 @@ use crate::agent_settings::{
 pub enum ApiKeyCategory {
     Llm,
     Search,
+    ImageVideo,
 }
 
 /// One row in the API-keys pane. `kind` is the stable identifier the UI
@@ -90,8 +92,14 @@ fn search_kind_from_kind(kind: &str) -> Option<WebKeyKind> {
         .map(|(k, _, _)| *k)
 }
 
+fn media_kind_from_kind(kind: &str) -> Option<MediaKeyKind> {
+    media_keys::kind_from_id(kind)
+}
+
 fn build_status(app: &AppHandle) -> Result<ApiKeysStatus, String> {
-    let mut entries = Vec::with_capacity(LLM_KINDS.len() + SEARCH_KINDS.len() + COMING_SOON_LLM.len());
+    let mut entries = Vec::with_capacity(
+        LLM_KINDS.len() + SEARCH_KINDS.len() + COMING_SOON_LLM.len() + media_keys::MEDIA_KEY_KINDS.len(),
+    );
 
     for (provider, kind, label) in LLM_KINDS {
         let (masked, source) = provider_key_with_source(app, *provider)?;
@@ -134,6 +142,20 @@ fn build_status(app: &AppHandle) -> Result<ApiKeysStatus, String> {
         });
     }
 
+    for media_kind in media_keys::MEDIA_KEY_KINDS {
+        let row = media_keys::catalog_entry(media_kind)?;
+        entries.push(ApiKeyEntry {
+            kind: row.kind,
+            label: row.label,
+            category: ApiKeyCategory::ImageVideo,
+            configured: row.configured,
+            masked_value: row.masked_value,
+            via_env: row.via_env,
+            env_var: Some(row.env_var),
+            coming_soon: false,
+        });
+    }
+
     Ok(ApiKeysStatus { entries })
 }
 
@@ -148,6 +170,10 @@ fn apply_one(app: &AppHandle, action: &ApiKeyAction) -> Result<(), String> {
                 web_settings::set_key(app, search_kind, value.clone())?;
                 return Ok(());
             }
+            if let Some(media_kind) = media_kind_from_kind(kind) {
+                media_keys::set_key(app, media_kind, value)?;
+                return Ok(());
+            }
             Err(format!("unknown api key kind: {kind}"))
         }
         ApiKeyAction::Delete { kind } => {
@@ -159,6 +185,10 @@ fn apply_one(app: &AppHandle, action: &ApiKeyAction) -> Result<(), String> {
                 web_settings::delete_key(app, search_kind)?;
                 return Ok(());
             }
+            if let Some(media_kind) = media_kind_from_kind(kind) {
+                media_keys::delete_key(app, media_kind)?;
+                return Ok(());
+            }
             Err(format!("unknown api key kind: {kind}"))
         }
     }
diff --git a/src-tauri/src/image/generate.rs b/src-tauri/src/image/generate.rs
index 74e5a22..fc0d0e7 100644
--- a/src-tauri/src/image/generate.rs
+++ b/src-tauri/src/image/generate.rs
@@ -146,6 +146,16 @@ pub async fn generate(
             )
             .await
         }
+        ImageProviderKind::Fal => {
+            generate_fal(
+                &client,
+                &settings.model_id,
+                settings.quality,
+                api_key,
+                prompt,
+            )
+            .await
+        }
     };
 
     if state.cancelled() {
@@ -238,7 +248,7 @@ async fn generate_openai_text(
     if !status.is_success() {
         return Err(provider_error_from_openai(&text, status.as_u16()));
     }
-    parse_openai_envelope(&text)
+    parse_openai_envelope(client, &text).await
 }
 
 async fn generate_openai_edit(
@@ -295,10 +305,13 @@ async fn generate_openai_edit(
     if !status.is_success() {
         return Err(provider_error_from_openai(&text, status.as_u16()));
     }
-    parse_openai_envelope(&text)
+    parse_openai_envelope(client, &text).await
 }
 
-fn parse_openai_envelope(body: &str) -> Result<GeneratedImage, GenerateError> {
+async fn parse_openai_envelope(
+    client: &reqwest::Client,
+    body: &str,
+) -> Result<GeneratedImage, GenerateError> {
     let env: OpenaiImageEnvelope = serde_json::from_str(body)
         .map_err(|e| GenerateError::Parse(format!("openai json: {e}")))?;
     let first = env
@@ -316,8 +329,9 @@ fn parse_openai_envelope(body: &str) -> Result<GeneratedImage, GenerateError> {
         });
     }
     if let Some(url) = first.url {
-        // OpenAI may return a URL only — we fetch it once and inline.
-        return fetch_url_bytes(&url).map_err(|e| GenerateError::Http(format!("openai url: {e}")));
+        return download_image_url(client, &url)
+            .await
+            .map_err(|e| GenerateError::Http(format!("openai url: {e}")));
     }
     Err(GenerateError::Provider(
         "openai response had neither b64_json nor url".into(),
@@ -333,12 +347,115 @@ fn provider_error_from_openai(body: &str, status: u16) -> GenerateError {
     GenerateError::Provider(format!("openai {status}: {}", truncate(body, 240)))
 }
 
-fn fetch_url_bytes(_url: &str) -> Result<GeneratedImage, String> {
-    // Reachable when OpenAI returns a hosted URL. We do not chase URLs in
-    // v1 — the model defaults are configured to return b64_json. If a
-    // provider unexpectedly returns a URL, surface a clear error so the
-    // user can switch models.
-    Err("provider returned a hosted URL; configure a model that emits b64_json".into())
+async fn download_image_url(
+    client: &reqwest::Client,
+    url: &str,
+) -> Result<GeneratedImage, GenerateError> {
+    let res = client
+        .get(url)
+        .send()
+        .await
+        .map_err(|e| GenerateError::Http(format!("download image: {e}")))?;
+    if !res.status().is_success() {
+        return Err(GenerateError::Http(format!(
+            "download image: HTTP {}",
+            res.status()
+        )));
+    }
+    let bytes = res
+        .bytes()
+        .await
+        .map_err(|e| GenerateError::Http(format!("download body: {e}")))?
+        .to_vec();
+    Ok(GeneratedImage {
+        mime: detect_image_mime(&bytes).unwrap_or("image/png").to_owned(),
+        bytes,
+    })
+}
+
+// ---------------------------------------------------------------------------
+// fal.ai
+// ---------------------------------------------------------------------------
+
+#[derive(Deserialize)]
+struct FalImageEnvelope {
+    #[serde(default)]
+    images: Vec<FalImageItem>,
+    #[serde(default)]
+    image: Option<FalImageItem>,
+    #[serde(default)]
+    detail: Option<String>,
+}
+
+#[derive(Deserialize)]
+struct FalImageItem {
+    #[serde(default)]
+    url: Option<String>,
+    #[serde(default)]
+    content_type: Option<String>,
+}
+
+async fn generate_fal(
+    client: &reqwest::Client,
+    model: &str,
+    quality: ImageQualityLevel,
+    api_key: &str,
+    prompt: &str,
+) -> Result<GeneratedImage, GenerateError> {
+    let endpoint = format!("https://fal.run/{model}");
+    let body = json!({
+        "prompt": prompt,
+        "image_size": quality.fal_image_size(),
+        "num_images": 1,
+        "output_format": "png",
+    });
+    let res = client
+        .post(&endpoint)
+        .header("Authorization", format!("Key {api_key}"))
+        .header("Content-Type", "application/json")
+        .json(&body)
+        .send()
+        .await
+        .map_err(|e| GenerateError::Http(format!("fal: {e}")))?;
+    let status = res.status();
+    let text = res
+        .text()
+        .await
+        .map_err(|e| GenerateError::Http(format!("fal body: {e}")))?;
+    if !status.is_success() {
+        return Err(GenerateError::Provider(format!(
+            "fal {status}: {}",
+            truncate(&text, 240)
+        )));
+    }
+    parse_fal_envelope(client, &text).await
+}
+
+async fn parse_fal_envelope(
+    client: &reqwest::Client,
+    body: &str,
+) -> Result<GeneratedImage, GenerateError> {
+    let env: FalImageEnvelope = serde_json::from_str(body)
+        .map_err(|e| GenerateError::Parse(format!("fal json: {e}")))?;
+    let item = env
+        .images
+        .into_iter()
+        .next()
+        .or(env.image)
+        .ok_or_else(|| {
+            GenerateError::Provider(
+                env.detail
+                    .unwrap_or_else(|| "fal returned no images".into()),
+            )
+        })?;
+    let url = item
+        .url
+        .ok_or_else(|| GenerateError::Provider("fal image had no url".into()))?;
+    let mut generated = download_image_url(client, &url).await?;
+    if let Some(mime) = item.content_type.filter(|m| m.starts_with("image/")) {
+        generated.mime = mime;
+    }
+    Ok(generated)
 }
 
 // ---------------------------------------------------------------------------
diff --git a/src-tauri/src/image/settings.rs b/src-tauri/src/image/settings.rs
index 94bc9d2..4f78d0e 100644
--- a/src-tauri/src/image/settings.rs
+++ b/src-tauri/src/image/settings.rs
@@ -12,6 +12,7 @@ use crate::agent_settings;
 pub enum ImageProviderKind {
     Openai,
     Openrouter,
+    Fal,
 }
 
 impl ImageProviderKind {
@@ -19,6 +20,7 @@ impl ImageProviderKind {
         match self {
             Self::Openai => "openai",
             Self::Openrouter => "openrouter",
+            Self::Fal => "fal",
         }
     }
 }
@@ -78,6 +80,16 @@ impl ImageQualityLevel {
             Self::Max => "ultra",
         }
     }
+
+    /// fal.ai `image_size` preset.
+    pub fn fal_image_size(self) -> &'static str {
+        match self {
+            Self::Low => "square",
+            Self::Medium => "square_hd",
+            Self::High => "landscape_4_3",
+            Self::Max => "landscape_16_9",
+        }
+    }
 }
 
 #[derive(Clone, Debug, Serialize, Deserialize)]
@@ -122,11 +134,21 @@ pub fn save(app: &AppHandle, settings: &ImageSettings) -> Result<ImageSettings,
 /// Resolve the API key used for an image provider, piggybacking on the
 /// existing agent provider keyring entries.
 pub fn provider_key(app: &AppHandle, provider: ImageProviderKind) -> Result<String, String> {
-    let agent_provider = match provider {
-        ImageProviderKind::Openai => agent_settings::AgentProviderKind::Openai,
-        ImageProviderKind::Openrouter => agent_settings::AgentProviderKind::Openrouter,
-    };
-    agent_settings::provider_key_pub(app, agent_provider)
+    match provider {
+        ImageProviderKind::Openai => {
+            agent_settings::provider_key_pub(app, agent_settings::AgentProviderKind::Openai)
+        }
+        ImageProviderKind::Openrouter => {
+            agent_settings::provider_key_pub(app, agent_settings::AgentProviderKind::Openrouter)
+        }
+        ImageProviderKind::Fal => crate::media_keys::resolve_key(crate::media_keys::MediaKeyKind::Fal)
+            .ok_or_else(|| {
+                format!(
+                    "fal.ai API key missing — set it in Settings → API Keys (env: {})",
+                    crate::media_keys::MediaKeyKind::Fal.env_var()
+                )
+            }),
+    }
 }
 
 /// Curated fallback model lists per provider, used when the live model
@@ -153,6 +175,24 @@ pub fn curated_image_models(provider: ImageProviderKind) -> Vec<CuratedImageMode
                 label: "GPT Image 1 (via OpenRouter)".into(),
             },
         ],
+        ImageProviderKind::Fal => vec![
+            CuratedImageModel {
+                id: "fal-ai/flux/schnell".into(),
+                label: "FLUX Schnell".into(),
+            },
+            CuratedImageModel {
+                id: "fal-ai/flux/dev".into(),
+                label: "FLUX.1 [dev]".into(),
+            },
+            CuratedImageModel {
+                id: "fal-ai/nano-banana-2".into(),
+                label: "Nano Banana 2".into(),
+            },
+            CuratedImageModel {
+                id: "fal-ai/gpt-image-1.5".into(),
+                label: "GPT Image 1.5".into(),
+            },
+        ],
     }
 }
 
diff --git a/src-tauri/src/lib.rs b/src-tauri/src/lib.rs
index c3550c7..63c9e97 100644
--- a/src-tauri/src/lib.rs
+++ b/src-tauri/src/lib.rs
@@ -10,6 +10,7 @@ mod git_graph;
 mod git_info;
 mod gitignore;
 mod image;
+mod media_keys;
 mod memory;
 mod plans;
 mod pty_host;
diff --git a/src-tauri/src/media_keys.rs b/src-tauri/src/media_keys.rs
new file mode 100644
index 0000000..f132b1e
--- /dev/null
+++ b/src-tauri/src/media_keys.rs
@@ -0,0 +1,141 @@
+//! Keyring-backed API keys for image/video and voice media providers (fal.ai,
+//! Amazon Polly). Surfaced in Settings → API Keys and consumed by the image
+//! and (future) voice subsystems.
+
+use serde::Serialize;
+use tauri::AppHandle;
+
+use crate::agent_settings;
+
+const KEYRING_SERVICE: &str = "BLXCode";
+
+const KEY_FAL: &str = "agent:media:fal";
+const KEY_POLLY: &str = "agent:media:polly";
+
+#[derive(Clone, Copy, Debug, PartialEq, Eq)]
+pub enum MediaKeyKind {
+    Fal,
+    AwsPolly,
+}
+
+impl MediaKeyKind {
+    pub fn kind_id(self) -> &'static str {
+        match self {
+            Self::Fal => "fal",
+            Self::AwsPolly => "aws_polly",
+        }
+    }
+
+    pub fn label(self) -> &'static str {
+        match self {
+            Self::Fal => "fal.ai",
+            Self::AwsPolly => "Amazon Polly (TTS/STT)",
+        }
+    }
+
+    fn account(self) -> &'static str {
+        match self {
+            Self::Fal => KEY_FAL,
+            Self::AwsPolly => KEY_POLLY,
+        }
+    }
+
+    pub fn env_var(self) -> &'static str {
+        match self {
+            Self::Fal => "BLX_FAL_API_KEY",
+            Self::AwsPolly => "BLX_AWS_POLLY_API_KEY",
+        }
+    }
+}
+
+pub const MEDIA_KEY_KINDS: [MediaKeyKind; 2] = [MediaKeyKind::Fal, MediaKeyKind::AwsPolly];
+
+pub fn kind_from_id(kind: &str) -> Option<MediaKeyKind> {
+    MEDIA_KEY_KINDS
+        .iter()
+        .copied()
+        .find(|k| k.kind_id() == kind)
+}
+
+fn keyring_entry(kind: MediaKeyKind) -> Result<keyring_core::Entry, String> {
+    keyring_core::Entry::new(KEYRING_SERVICE, kind.account())
+        .map_err(|e| format!("keyring init {}: {e}", kind.account()))
+}
+
+fn env_key(kind: MediaKeyKind) -> Option<String> {
+    std::env::var(kind.env_var())
+        .ok()
+        .filter(|s| !s.trim().is_empty())
+}
+
+/// (masked_value, via_env). Order: keyring → env.
+pub fn key_with_source(kind: MediaKeyKind) -> Result<(Option<String>, bool), String> {
+    let entry = keyring_entry(kind)?;
+    match entry.get_password() {
+        Ok(secret) if !secret.trim().is_empty() => {
+            Ok((agent_settings::mask_secret_pub(&secret), false))
+        }
+        Ok(_) | Err(keyring_core::Error::NoEntry) => match env_key(kind) {
+            Some(secret) => Ok((agent_settings::mask_secret_pub(&secret), true)),
+            None => Ok((None, false)),
+        },
+        Err(_) if cfg!(target_os = "linux") => match env_key(kind) {
+            Some(secret) => Ok((agent_settings::mask_secret_pub(&secret), true)),
+            None => Ok((None, false)),
+        },
+        Err(e) => Err(format!("keyring get {}: {e}", kind.account())),
+    }
+}
+
+pub fn resolve_key(kind: MediaKeyKind) -> Option<String> {
+    env_key(kind).or_else(|| {
+        keyring_entry(kind)
+            .ok()?
+            .get_password()
+            .ok()
+            .filter(|s| !s.trim().is_empty())
+    })
+}
+
+pub fn set_key(_app: &AppHandle, kind: MediaKeyKind, api_key: &str) -> Result<(), String> {
+    let secret = api_key.trim();
+    if secret.is_empty() {
+        return Err("API key is empty".into());
+    }
+    let entry = keyring_entry(kind)?;
+    entry
+        .set_password(secret)
+        .map_err(|e| format!("keyring set {}: {e}", kind.account()))
+}
+
+pub fn delete_key(_app: &AppHandle, kind: MediaKeyKind) -> Result<(), String> {
+    let entry = keyring_entry(kind)?;
+    match entry.delete_credential() {
+        Ok(()) | Err(keyring_core::Error::NoEntry) => Ok(()),
+        Err(e) => Err(format!("keyring delete {}: {e}", kind.account())),
+    }
+}
+
+#[derive(Clone, Debug, Serialize)]
+#[serde(rename_all = "camelCase")]
+pub struct MediaKeyCatalogEntry {
+    pub kind: String,
+    pub label: String,
+    pub configured: bool,
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub masked_value: Option<String>,
+    pub via_env: bool,
+    pub env_var: String,
+}
+
+pub fn catalog_entry(kind: MediaKeyKind) -> Result<MediaKeyCatalogEntry, String> {
+    let (masked, via_env) = key_with_source(kind)?;
+    Ok(MediaKeyCatalogEntry {
+        kind: kind.kind_id().into(),
+        label: kind.label().into(),
+        configured: masked.is_some(),
+        masked_value: masked,
+        via_env,
+        env_var: kind.env_var().into(),
+    })
+}
diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index 3dd423c..2c5d2b0 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -329,6 +329,7 @@ pub enum I18nKey {
     ApiKeysHeading,
     ApiKeysLlmSubhead,
     ApiKeysSearchSubhead,
+    ApiKeysImageVideoSubhead,
     ApiKeysSaved,
     ApiKeysDiscard,
     ApiKeysUnsaved,
@@ -368,6 +369,7 @@ pub enum I18nKey {
     AgProviderOpenrouter,
     AgProviderAnthropic,
     AgProviderOpenai,
+    AgProviderFal,
     AgModelField,
     AgModelCustomField,
     AgThinkingField,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index 2bbe805..76fa082 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -321,6 +321,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API-Schlüssel",
         I18nKey::ApiKeysLlmSubhead => "LLM-Anbieter",
         I18nKey::ApiKeysSearchSubhead => "Such-Anbieter",
+        I18nKey::ApiKeysImageVideoSubhead => "Bild / Video & Sprache",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "Gespeichert.",
         I18nKey::ApiKeysDiscard => "Verwerfen",
         I18nKey::ApiKeysUnsaved => "Nicht gespeicherte Änderungen",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index da93c19..773686f 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -359,6 +359,8 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::ApiKeysHeading => "API Keys",
         I18nKey::ApiKeysLlmSubhead => "LLM Providers",
         I18nKey::ApiKeysSearchSubhead => "Search Providers",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "Saved.",
         I18nKey::ApiKeysDiscard => "Discard",
         I18nKey::ApiKeysUnsaved => "Unsaved changes",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index a6488e3..9c8128f 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -321,6 +321,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "Claves API",
         I18nKey::ApiKeysLlmSubhead => "Proveedores LLM",
         I18nKey::ApiKeysSearchSubhead => "Proveedores de búsqueda",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "Guardado.",
         I18nKey::ApiKeysDiscard => "Descartar",
         I18nKey::ApiKeysUnsaved => "Cambios sin guardar",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index f2f320b..bac6bfe 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -323,6 +323,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "Clés API",
         I18nKey::ApiKeysLlmSubhead => "Fournisseurs LLM",
         I18nKey::ApiKeysSearchSubhead => "Fournisseurs de recherche",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "Enregistré.",
         I18nKey::ApiKeysDiscard => "Annuler",
         I18nKey::ApiKeysUnsaved => "Modifications non enregistrées",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index 32847cd..f3d2bb6 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -321,6 +321,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API-kulcsok",
         I18nKey::ApiKeysLlmSubhead => "LLM-szolgáltatók",
         I18nKey::ApiKeysSearchSubhead => "Keresőszolgáltatók",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "Mentve.",
         I18nKey::ApiKeysDiscard => "Elvetés",
         I18nKey::ApiKeysUnsaved => "Nem mentett módosítások",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index a8340bb..e2472e1 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -321,6 +321,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "Chiavi API",
         I18nKey::ApiKeysLlmSubhead => "Provider LLM",
         I18nKey::ApiKeysSearchSubhead => "Provider di ricerca",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "Salvato.",
         I18nKey::ApiKeysDiscard => "Annulla modifiche",
         I18nKey::ApiKeysUnsaved => "Modifiche non salvate",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index f230872..6c611ca 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -315,6 +315,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "APIキー",
         I18nKey::ApiKeysLlmSubhead => "LLMプロバイダー",
         I18nKey::ApiKeysSearchSubhead => "検索プロバイダー",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "保存しました。",
         I18nKey::ApiKeysDiscard => "破棄",
         I18nKey::ApiKeysUnsaved => "未保存の変更",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index 3278ed9..d36d57a 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -315,6 +315,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API 키",
         I18nKey::ApiKeysLlmSubhead => "LLM 제공업체",
         I18nKey::ApiKeysSearchSubhead => "검색 제공업체",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "저장됨.",
         I18nKey::ApiKeysDiscard => "취소",
         I18nKey::ApiKeysUnsaved => "저장되지 않은 변경",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index e20211e..c3d5de5 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -319,6 +319,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "Klucze API",
         I18nKey::ApiKeysLlmSubhead => "Dostawcy LLM",
         I18nKey::ApiKeysSearchSubhead => "Dostawcy wyszukiwania",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "Zapisano.",
         I18nKey::ApiKeysDiscard => "Odrzuć",
         I18nKey::ApiKeysUnsaved => "Niezapisane zmiany",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index dcfc6c4..d7c91c2 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -321,6 +321,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "Chaves de API",
         I18nKey::ApiKeysLlmSubhead => "Provedores LLM",
         I18nKey::ApiKeysSearchSubhead => "Provedores de busca",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "Salvo.",
         I18nKey::ApiKeysDiscard => "Descartar",
         I18nKey::ApiKeysUnsaved => "Alterações não salvas",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index eb1e0d8..729ce6e 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -319,6 +319,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API-ключи",
         I18nKey::ApiKeysLlmSubhead => "Поставщики LLM",
         I18nKey::ApiKeysSearchSubhead => "Поисковые поставщики",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "Сохранено.",
         I18nKey::ApiKeysDiscard => "Отменить",
         I18nKey::ApiKeysUnsaved => "Несохранённые изменения",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index d5672d3..d6348ad 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -313,6 +313,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API 密钥",
         I18nKey::ApiKeysLlmSubhead => "LLM 提供商",
         I18nKey::ApiKeysSearchSubhead => "搜索提供商",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "已保存。",
         I18nKey::ApiKeysDiscard => "放弃",
         I18nKey::ApiKeysUnsaved => "未保存的更改",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index bcd7624..f3e4312 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -313,6 +313,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API 金鑰",
         I18nKey::ApiKeysLlmSubhead => "LLM 供應商",
         I18nKey::ApiKeysSearchSubhead => "搜尋供應商",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::AgProviderFal => "fal.ai",
         I18nKey::ApiKeysSaved => "已儲存。",
         I18nKey::ApiKeysDiscard => "捨棄",
         I18nKey::ApiKeysUnsaved => "未儲存的變更",
diff --git a/src/tauri_bridge.rs b/src/tauri_bridge.rs
index 1372b4c..5c34d58 100644
--- a/src/tauri_bridge.rs
+++ b/src/tauri_bridge.rs
@@ -394,6 +394,7 @@ pub struct ProviderModelsResponse {
 pub enum ApiKeyCategory {
     Llm,
     Search,
+    ImageVideo,
 }
 
 #[allow(dead_code)]
@@ -2053,14 +2054,15 @@ pub async fn voice_tts_preview(
 pub enum ImageProviderKind {
     Openai,
     Openrouter,
+    Fal,
 }
 
 impl ImageProviderKind {
-    #[allow(dead_code)]
     pub fn as_str(self) -> &'static str {
         match self {
             Self::Openai => "openai",
             Self::Openrouter => "openrouter",
+            Self::Fal => "fal",
         }
     }
 }
@@ -2135,7 +2137,6 @@ pub async fn image_settings_save(patch: ImageSettings) -> Result<ImageSettings,
     invoke_typed("image_settings_save", Args { patch }).await
 }
 
-#[allow(dead_code)]
 pub async fn image_curated_models(
     provider: ImageProviderKind,
 ) -> Result<ImageModelsResponse, String> {
diff --git a/src/workbench/api_keys_pane/mod.rs b/src/workbench/api_keys_pane/mod.rs
index 6f70bdc..0b2ea80 100644
--- a/src/workbench/api_keys_pane/mod.rs
+++ b/src/workbench/api_keys_pane/mod.rs
@@ -37,6 +37,8 @@ fn api_key_brand_icon_url(kind: &str) -> Option<&'static str> {
         "grok" => Some("/public/brand-icons/grok.svg"),
         "tavily" => Some("/public/brand-icons/tavily.svg"),
         "brave" => Some("/public/brand-icons/brave.svg"),
+        "fal" => Some("/public/brand-icons/fal.svg"),
+        "aws_polly" => Some("/public/brand-icons/aws.svg"),
         _ => None,
     }
 }
@@ -163,6 +165,17 @@ pub fn ApiKeysPane() -> impl IntoView {
             })
             .unwrap_or_default()
     });
+    let image_video_entries = Memo::new(move |_| {
+        status
+            .get()
+            .map(|s| {
+                s.entries
+                    .into_iter()
+                    .filter(|e| matches!(e.category, ApiKeyCategory::ImageVideo))
+                    .collect::<Vec<_>>()
+            })
+            .unwrap_or_default()
+    });
 
     view! {
         <article class="harness-pane api-keys-pane">
@@ -195,6 +208,16 @@ pub fn ApiKeysPane() -> impl IntoView {
                 <ApiKeyRows entries=search_entries drafts=drafts />
             </section>
 
+            <section class="harness-subpane">
+                <h4 class="harness-pane-subhead">
+                    <span class="harness-pane-subhead__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuImage width="0.9rem" height="0.9rem" />
+                    </span>
+                    <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::ApiKeysImageVideoSubhead)()}</span>
+                </h4>
+                <ApiKeyRows entries=image_video_entries drafts=drafts />
+            </section>
+
             <Show when=move || status_msg.with(|m| m.is_some())>
                 <p class="harness-status">{move || status_msg.get().unwrap_or_default()}</p>
             </Show>
diff --git a/src/workbench/harness_image_pane/mod.rs b/src/workbench/harness_image_pane/mod.rs
index bead293..6052b2f 100644
--- a/src/workbench/harness_image_pane/mod.rs
+++ b/src/workbench/harness_image_pane/mod.rs
@@ -3,9 +3,10 @@
 use crate::i18n::I18nKey;
 use crate::service::I18nService;
 use crate::tauri_bridge::{
-    agent_provider_models, agent_settings_get, image_settings_get, image_settings_save,
-    is_tauri_shell, AgentProviderKind, AgentProviderSettingsView, ImageProviderKind,
-    ImageQualityLevel, ImageSettings, ProviderModelEntry,
+    agent_provider_models, agent_settings_get, api_keys_status, image_curated_models,
+    image_settings_get, image_settings_save, is_tauri_shell, AgentProviderKind,
+    AgentProviderSettingsView, ApiKeyEntry, ApiKeysStatus, ImageProviderKind, ImageQualityLevel,
+    ImageSettings, ProviderModelEntry,
 };
 use crate::workbench::agent_model_picker::AgentModelPicker;
 use gloo_timers::future::TimeoutFuture;
@@ -13,14 +14,19 @@ use leptos::prelude::*;
 use leptos_icons::Icon as LxIcon;
 use wasm_bindgen::JsCast;
 
-fn image_providers() -> [ImageProviderKind; 2] {
-    [ImageProviderKind::Openrouter, ImageProviderKind::Openai]
+fn image_providers() -> [ImageProviderKind; 3] {
+    [
+        ImageProviderKind::Openrouter,
+        ImageProviderKind::Openai,
+        ImageProviderKind::Fal,
+    ]
 }
 
-fn image_to_agent_provider(p: ImageProviderKind) -> AgentProviderKind {
+fn image_to_agent_provider(p: ImageProviderKind) -> Option<AgentProviderKind> {
     match p {
-        ImageProviderKind::Openai => AgentProviderKind::Openai,
-        ImageProviderKind::Openrouter => AgentProviderKind::Openrouter,
+        ImageProviderKind::Openai => Some(AgentProviderKind::Openai),
+        ImageProviderKind::Openrouter => Some(AgentProviderKind::Openrouter),
+        ImageProviderKind::Fal => None,
     }
 }
 
@@ -28,6 +34,7 @@ fn image_provider_label(i18n: &I18nService, provider: ImageProviderKind) -> Stri
     let key = match provider {
         ImageProviderKind::Openrouter => I18nKey::AgProviderOpenrouter,
         ImageProviderKind::Openai => I18nKey::AgProviderOpenai,
+        ImageProviderKind::Fal => I18nKey::AgProviderFal,
     };
     i18n.tr(key)().to_string()
 }
@@ -36,31 +43,53 @@ fn image_provider_icon_url(provider: ImageProviderKind) -> &'static str {
     match provider {
         ImageProviderKind::Openrouter => "/public/brand-icons/openrouter.svg",
         ImageProviderKind::Openai => "/public/brand-icons/openai.svg",
+        ImageProviderKind::Fal => "/public/brand-icons/fal.svg",
     }
 }
 
+fn media_key_entry<'a>(api_keys: &'a ApiKeysStatus, kind: &str) -> Option<&'a ApiKeyEntry> {
+    api_keys.entries.iter().find(|e| e.kind == kind)
+}
+
 fn image_provider_key_status(
     i18n: &I18nService,
-    view: &AgentProviderSettingsView,
+    agent_settings: Option<&AgentProviderSettingsView>,
+    api_keys: Option<&ApiKeysStatus>,
     provider: ImageProviderKind,
 ) -> String {
-    let agent = image_to_agent_provider(provider);
-    let configured = view
-        .key_statuses
-        .iter()
-        .find(|s| s.provider == agent)
-        .map(|s| s.configured)
-        .unwrap_or(false);
-    if configured {
-        let mask = view
+    if provider == ImageProviderKind::Fal {
+        let Some(entry) = api_keys.and_then(|s| media_key_entry(s, "fal")) else {
+            return i18n.tr(I18nKey::AgApiKeyMissing)().to_string();
+        };
+        if entry.configured {
+            if let Some(mask) = entry.masked_value.as_ref() {
+                format!("{} ({mask})", i18n.tr(I18nKey::AgApiKeyConfigured)())
+            } else {
+                i18n.tr(I18nKey::AgApiKeyConfigured)().to_string()
+            }
+        } else {
+            i18n.tr(I18nKey::AgApiKeyMissing)().to_string()
+        }
+    } else if let (Some(view), Some(agent)) = (agent_settings, image_to_agent_provider(provider)) {
+        let configured = view
             .key_statuses
             .iter()
             .find(|s| s.provider == agent)
-            .and_then(|s| s.masked_value.clone());
-        if let Some(mask) = mask {
-            format!("{} ({mask})", i18n.tr(I18nKey::AgApiKeyConfigured)())
+            .map(|s| s.configured)
+            .unwrap_or(false);
+        if configured {
+            let mask = view
+                .key_statuses
+                .iter()
+                .find(|s| s.provider == agent)
+                .and_then(|s| s.masked_value.clone());
+            if let Some(mask) = mask {
+                format!("{} ({mask})", i18n.tr(I18nKey::AgApiKeyConfigured)())
+            } else {
+                i18n.tr(I18nKey::AgApiKeyConfigured)().to_string()
+            }
         } else {
-            i18n.tr(I18nKey::AgApiKeyConfigured)().to_string()
+            i18n.tr(I18nKey::AgApiKeyMissing)().to_string()
         }
     } else {
         i18n.tr(I18nKey::AgApiKeyMissing)().to_string()
@@ -85,10 +114,9 @@ fn focus_image_provider_option(provider: ImageProviderKind) {
 }
 
 fn next_image_provider(provider: ImageProviderKind) -> ImageProviderKind {
-    match provider {
-        ImageProviderKind::Openrouter => ImageProviderKind::Openai,
-        ImageProviderKind::Openai => ImageProviderKind::Openrouter,
-    }
+    let levels = image_providers();
+    let idx = levels.iter().position(|p| *p == provider).unwrap_or(0);
+    levels[(idx + 1) % levels.len()]
 }
 
 fn prev_image_provider(provider: ImageProviderKind) -> ImageProviderKind {
@@ -156,7 +184,25 @@ async fn fetch_image_models(
     provider: ImageProviderKind,
     out: RwSignal<Vec<ProviderModelEntry>>,
 ) {
-    let agent_provider = image_to_agent_provider(provider);
+    if provider == ImageProviderKind::Fal {
+        if let Ok(resp) = image_curated_models(provider).await {
+            let entries = resp
+                .entries
+                .into_iter()
+                .map(|m| ProviderModelEntry {
+                    id: m.id,
+                    label: m.label,
+                    description: None,
+                    pricing: None,
+                })
+                .collect();
+            out.set(entries);
+        }
+        return;
+    }
+    let Some(agent_provider) = image_to_agent_provider(provider) else {
+        return;
+    };
     let all = match agent_provider_models(agent_provider).await {
         Ok(resp) => resp.entries,
         Err(_) => Vec::new(),
@@ -433,6 +479,7 @@ pub fn AgentImageColumn() -> impl IntoView {
     let i18n = expect_context::<I18nService>();
     let settings = RwSignal::new(Option::<ImageSettings>::None);
     let agent_settings = RwSignal::new(Option::<AgentProviderSettingsView>::None);
+    let api_keys = RwSignal::new(Option::<ApiKeysStatus>::None);
     let status = RwSignal::new(Option::<String>::None);
     let selected_provider = RwSignal::new(ImageProviderKind::Openai);
     let quality_level = RwSignal::new(ImageQualityLevel::Medium);
@@ -445,6 +492,9 @@ pub fn AgentImageColumn() -> impl IntoView {
             if let Ok(view) = agent_settings_get().await {
                 agent_settings.set(Some(view));
             }
+            if let Ok(keys) = api_keys_status().await {
+                api_keys.set(Some(keys));
+            }
             if let Ok(s) = image_settings_get().await {
                 selected_provider.set(s.provider);
                 quality_level.set(s.quality);
@@ -489,6 +539,13 @@ pub fn AgentImageColumn() -> impl IntoView {
         let mut next = settings.get_untracked().unwrap_or_default();
         next.provider = p;
         next.quality = quality_level.get_untracked();
+        if p == ImageProviderKind::Fal && !next.model_id.contains("fal-ai/") {
+            next.model_id = "fal-ai/flux/schnell".into();
+            model_id.set(next.model_id.clone());
+        } else if p != ImageProviderKind::Fal && next.model_id.contains("fal-ai/") {
+            next.model_id = "gpt-image-1".into();
+            model_id.set(next.model_id.clone());
+        }
         save(next);
         reload_models(p);
     });
@@ -551,12 +608,12 @@ pub fn AgentImageColumn() -> impl IntoView {
                     <span>{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</span>
                     <span class="agent-provider-pane__key-status">
                         {move || {
-                            agent_settings
-                                .get()
-                                .map(|view| {
-                                    image_provider_key_status(&i18n, &view, selected_provider.get())
-                                })
-                                .unwrap_or_else(|| i18n.tr(I18nKey::AgApiKeyMissing)().to_string())
+                            image_provider_key_status(
+                                &i18n,
+                                agent_settings.get().as_ref(),
+                                api_keys.get().as_ref(),
+                                selected_provider.get(),
+                            )
                         }}
                     </span>
                 </div>

From c0ba446bb7db0c9f532f8230b852a8f012c69300 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 05:58:48 +0200
Subject: [PATCH 32/48] feat(voice_settings): integrate voice STT language and
 push-to-talk controls

- Added new `VoiceSttLanguageControls` and `VoicePttControls` components for managing speech-to-text language settings and push-to-talk functionality within the app settings.
- Updated the `AppSettingsPane` to include these new components, enhancing user interaction for voice settings.
- Introduced responsive CSS styles for the new controls, ensuring a consistent layout across different screen sizes.
- Refactored existing voice settings code to streamline functionality and improve maintainability.
---
 src/workbench/harness_ui.rs             |  32 ++-
 src/workbench/harness_voice_pane/mod.rs | 241 +----------------------
 src/workbench/mod.rs                    |   1 +
 src/workbench/voice_app_controls/mod.rs | 250 ++++++++++++++++++++++++
 styles.css                              |  27 +++
 5 files changed, 311 insertions(+), 240 deletions(-)
 create mode 100644 src/workbench/voice_app_controls/mod.rs

diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index 2d0c99e..0bf1019 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -3,6 +3,7 @@
 //! Tastenkürzel (tmux-Standard: `Ctrl+b` + zweite Taste; Legacy in App-Einstellungen)
 //! sind im Haupt-Webview gebunden ([`HarnessHost`] → [`super::harness_chords`]).
 use super::app_prefs::{AppPrefsService, ShortcutMode};
+use super::voice_app_controls::{VoicePttControls, VoiceSttLanguageControls};
 use super::browser_tab::sync_embedded_browser_layer;
 use super::harness_chords::handle_harness_keydown;
 use super::state::{
@@ -14,7 +15,7 @@ use crate::i18n::{lookup, I18nKey, Locale, APP_LOCALES};
 use crate::service::I18nService;
 use crate::tauri_bridge::{
     agent_hooks_status, install_agent_hooks, is_tauri_shell, uninstall_agent_hooks,
-    AgentHooksReport,
+    voice_settings_get, voice_settings_save, AgentHooksReport, VoiceSettings,
 };
 use gloo_timers::future::TimeoutFuture;
 use js_sys::Date;
@@ -936,6 +937,29 @@ fn AppSettingsPane() -> impl IntoView {
     let prefs = expect_context::<AppPrefsService>();
     let ui = expect_context::<HarnessUiService>();
     let updates = expect_context::<UpdateService>();
+    let voice_settings = RwSignal::new(Option::<VoiceSettings>::None);
+    let ptt_recording = RwSignal::new(false);
+
+    if is_tauri_shell() {
+        leptos::task::spawn_local(async move {
+            if let Ok(v) = voice_settings_get().await {
+                voice_settings.set(Some(v));
+            }
+        });
+    }
+
+    let save_voice = move |patch: VoiceSettings| {
+        if !is_tauri_shell() {
+            voice_settings.set(Some(patch));
+            return;
+        }
+        leptos::task::spawn_local(async move {
+            if let Ok(v) = voice_settings_save(patch).await {
+                voice_settings.set(Some(v));
+            }
+        });
+    };
+
     view! {
         <article class="harness-pane app-settings-pane">
             <h3 class="harness-pane-title">
@@ -952,6 +976,7 @@ fn AppSettingsPane() -> impl IntoView {
                     <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AppLanguage)()}</span>
                 </span>
                 <LocalePicker />
+                <VoiceSttLanguageControls settings=voice_settings save=save_voice />
             </label>
             <section class="harness-subpane">
                 <h4 class="harness-pane-subhead">
@@ -991,6 +1016,11 @@ fn AppSettingsPane() -> impl IntoView {
                     </div>
                 </div>
                 <p class="app-prefs-hint">{move || i18n.tr(I18nKey::AppShortcutModeHint)()}</p>
+                <VoicePttControls
+                    settings=voice_settings
+                    recording=ptt_recording
+                    save=save_voice
+                />
             </section>
             <section class="harness-subpane">
                 <h4 class="harness-pane-subhead">
diff --git a/src/workbench/harness_voice_pane/mod.rs b/src/workbench/harness_voice_pane/mod.rs
index d8d4b22..1872fb2 100644
--- a/src/workbench/harness_voice_pane/mod.rs
+++ b/src/workbench/harness_voice_pane/mod.rs
@@ -1,12 +1,12 @@
 //! Voice settings tab: STT/TTS provider+model, voice with gender filter,
-//! recording quality, post-STT behaviour, STT language, push-to-talk hotkey.
+//! recording quality, post-STT behaviour. STT language + PTT live under App.
 
 use crate::i18n::I18nKey;
 use crate::service::I18nService;
 use crate::tauri_bridge::{
     agent_provider_models, is_tauri_shell, voice_provider_voices, voice_settings_get,
     voice_settings_save, voice_tts_preview, AgentProviderKind, PostSttFlow, ProviderModelEntry,
-    PttHotkey, SttLanguageMode, SttSettings, TtsSettings, VoiceEntry, VoiceGender,
+    SttSettings, TtsSettings, VoiceEntry, VoiceGender,
     VoiceProviderKind, VoiceSettings,
 };
 use crate::workbench::model_picker::ModelPicker;
@@ -90,7 +90,6 @@ pub fn VoicePane() -> impl IntoView {
     let voices = RwSignal::new(Vec::<VoiceEntry>::new());
     let gender_filter = RwSignal::new(GenderFilter::All);
     let status = RwSignal::new(Option::<String>::None);
-    let recording_hotkey = RwSignal::new(false);
     let stt_models = RwSignal::new(Vec::<ProviderModelEntry>::new());
     let tts_models = RwSignal::new(Vec::<ProviderModelEntry>::new());
 
@@ -166,8 +165,6 @@ pub fn VoicePane() -> impl IntoView {
                     let sample_rate = current.stt.sample_rate_hz;
                     let voice_id = current.tts.voice.clone();
                     let post_flow = current.post_stt_flow;
-                    let stt_lang = current.stt_language.clone();
-                    let ptt = current.ptt_hotkey.clone();
                     let tts_enabled = current.tts.enabled;
 
                     view! {
@@ -197,17 +194,6 @@ pub fn VoicePane() -> impl IntoView {
                             post_flow=post_flow
                             save=save
                         />
-                        <LanguageSection
-                            current=current.clone()
-                            stt_lang=stt_lang.clone()
-                            save=save
-                        />
-                        <PttSection
-                            current=current.clone()
-                            ptt=ptt.clone()
-                            recording=recording_hotkey
-                            save=save
-                        />
                     }.into_any()
                 }}
             </Show>
@@ -645,229 +631,6 @@ where
     }
 }
 
-// ---------------------------------------------------------------------------
-// Language section
-// ---------------------------------------------------------------------------
-
-#[component]
-fn LanguageSection<F>(current: VoiceSettings, stt_lang: SttLanguageMode, save: F) -> impl IntoView
-where
-    F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
-{
-    let i18n = expect_context::<I18nService>();
-    let on_mode = {
-        let current = current.clone();
-        move |mode: SttLanguageMode| {
-            let mut next = current.clone();
-            next.stt_language = mode;
-            save(next);
-        }
-    };
-
-    let is_follow = matches!(stt_lang, SttLanguageMode::FollowApp);
-    let is_auto = matches!(stt_lang, SttLanguageMode::AutoDetect);
-    let is_manual = matches!(stt_lang, SttLanguageMode::Manual { .. });
-    let manual_code = if let SttLanguageMode::Manual { ref code } = stt_lang {
-        code.clone()
-    } else {
-        String::new()
-    };
-
-    view! {
-        <section class="voice-pane__section">
-            <h3>{move || i18n.tr(I18nKey::VoiceLanguageSection)()}</h3>
-            <div class="voice-pane__field">
-                <label>{move || i18n.tr(I18nKey::VoiceSttLangMode)()}</label>
-                <div class="voice-pane__radio-row">
-                    <button
-                        type="button"
-                        class="voice-pane__choice"
-                        class:voice-pane__choice--active=move || is_follow
-                        on:click={
-                            let on_mode = on_mode.clone();
-                            move |_| on_mode(SttLanguageMode::FollowApp)
-                        }
-                    >
-                        {move || i18n.tr(I18nKey::VoiceSttLangFollowApp)()}
-                    </button>
-                    <button
-                        type="button"
-                        class="voice-pane__choice"
-                        class:voice-pane__choice--active=move || is_auto
-                        on:click={
-                            let on_mode = on_mode.clone();
-                            move |_| on_mode(SttLanguageMode::AutoDetect)
-                        }
-                    >
-                        {move || i18n.tr(I18nKey::VoiceSttLangAutoDetect)()}
-                    </button>
-                    <button
-                        type="button"
-                        class="voice-pane__choice"
-                        class:voice-pane__choice--active=move || is_manual
-                        on:click={
-                            let on_mode = on_mode.clone();
-                            let manual_code = manual_code.clone();
-                            move |_| on_mode(SttLanguageMode::Manual { code: manual_code.clone() })
-                        }
-                    >
-                        {move || i18n.tr(I18nKey::VoiceSttLangManual)()}
-                    </button>
-                </div>
-                <Show when=move || is_manual>
-                    <input
-                        type="text"
-                        class="voice-pane__input"
-                        placeholder="ISO-639-1 (e.g. de, en, ja)"
-                        prop:value=manual_code.clone()
-                        on:change={
-                            let on_mode = on_mode.clone();
-                            move |ev| {
-                                if let Some(t) = ev.target() {
-                                    if let Ok(inp) = t.dyn_into::<web_sys::HtmlInputElement>() {
-                                        on_mode(SttLanguageMode::Manual { code: inp.value() });
-                                    }
-                                }
-                            }
-                        }
-                    />
-                </Show>
-            </div>
-        </section>
-    }
-}
-
-// ---------------------------------------------------------------------------
-// PTT hotkey section
-// ---------------------------------------------------------------------------
-
-#[component]
-fn PttSection<F>(
-    current: VoiceSettings,
-    ptt: PttHotkey,
-    recording: RwSignal<bool>,
-    save: F,
-) -> impl IntoView
-where
-    F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
-{
-    let i18n = expect_context::<I18nService>();
-    let on_enabled = {
-        let current = current.clone();
-        move |v: bool| {
-            let mut next = current.clone();
-            next.ptt_hotkey.enabled = v;
-            save(next);
-        }
-    };
-    let begin_capture = move || recording.set(true);
-    let capture_keydown = {
-        let current = current.clone();
-        move |ev: web_sys::KeyboardEvent| {
-            if !recording.get_untracked() {
-                return;
-            }
-            ev.prevent_default();
-            if ev.key() == "Escape" {
-                recording.set(false);
-                return;
-            }
-            if matches!(
-                ev.code().as_str(),
-                "ControlLeft"
-                    | "ControlRight"
-                    | "ShiftLeft"
-                    | "ShiftRight"
-                    | "AltLeft"
-                    | "AltRight"
-                    | "MetaLeft"
-                    | "MetaRight"
-            ) {
-                return;
-            }
-            let mut next = current.clone();
-            next.ptt_hotkey = PttHotkey {
-                enabled: next.ptt_hotkey.enabled,
-                code: ev.code(),
-                ctrl: ev.ctrl_key(),
-                shift: ev.shift_key(),
-                alt: ev.alt_key(),
-                meta: ev.meta_key(),
-            };
-            save(next);
-            recording.set(false);
-        }
-    };
-
-    let display = format_hotkey(&ptt);
-    let enabled = ptt.enabled;
-
-    view! {
-        <section class="voice-pane__section">
-            <h3>{move || i18n.tr(I18nKey::VoicePttSection)()}</h3>
-            <div class="voice-pane__field">
-                <label class="voice-pane__toggle">
-                    <input
-                        type="checkbox"
-                        prop:checked=enabled
-                        on:change={
-                            let on_enabled = on_enabled.clone();
-                            move |ev| {
-                                if let Some(t) = ev.target() {
-                                    if let Ok(inp) = t.dyn_into::<web_sys::HtmlInputElement>() {
-                                        on_enabled(inp.checked());
-                                    }
-                                }
-                            }
-                        }
-                    />
-                    <span>{move || i18n.tr(I18nKey::VoicePttEnabled)()}</span>
-                </label>
-            </div>
-            <div class="voice-pane__field">
-                <label>{move || i18n.tr(I18nKey::VoicePttHotkey)()}</label>
-                <button
-                    type="button"
-                    class="voice-pane__hotkey-capture"
-                    class:voice-pane__hotkey-capture--recording=move || recording.get()
-                    on:click=move |_| begin_capture()
-                    on:keydown=capture_keydown
-                    tabindex="0"
-                >
-                    {move || if recording.get() {
-                        i18n.tr(I18nKey::VoicePttRecorderHint)().to_string()
-                    } else {
-                        display.clone()
-                    }}
-                </button>
-            </div>
-        </section>
-    }
-}
-
-fn format_hotkey(spec: &PttHotkey) -> String {
-    let mut parts: Vec<&'static str> = Vec::new();
-    if spec.ctrl {
-        parts.push("Ctrl");
-    }
-    if spec.shift {
-        parts.push("Shift");
-    }
-    if spec.alt {
-        parts.push("Alt");
-    }
-    if spec.meta {
-        parts.push("Meta");
-    }
-    let mut out = parts.join("+");
-    if !out.is_empty() {
-        out.push('+');
-    }
-    let key = spec.code.strip_prefix("Key").unwrap_or(&spec.code);
-    out.push_str(key);
-    out
-}
-
 // Convince the compiler we still need these types (referenced via trait bounds only).
 #[allow(dead_code)]
 fn _ensure_types(_s: SttSettings, _t: TtsSettings) {}
diff --git a/src/workbench/mod.rs b/src/workbench/mod.rs
index 3f92bdb..3cdcb5c 100644
--- a/src/workbench/mod.rs
+++ b/src/workbench/mod.rs
@@ -29,6 +29,7 @@ mod sidebar_resizer;
 mod sidebar_view_section;
 pub mod skills_rules_panel;
 pub mod state;
+mod voice_app_controls;
 mod terminal_cell;
 mod terminal_glue;
 mod toast;
diff --git a/src/workbench/voice_app_controls/mod.rs b/src/workbench/voice_app_controls/mod.rs
new file mode 100644
index 0000000..b08097c
--- /dev/null
+++ b/src/workbench/voice_app_controls/mod.rs
@@ -0,0 +1,250 @@
+//! Voice STT language + push-to-talk controls styled for Settings → App.
+
+use crate::i18n::I18nKey;
+use crate::service::I18nService;
+use crate::tauri_bridge::{PttHotkey, SttLanguageMode, VoiceSettings};
+use leptos::prelude::*;
+use wasm_bindgen::JsCast;
+
+fn format_hotkey(spec: &PttHotkey) -> String {
+    let mut parts: Vec<&'static str> = Vec::new();
+    if spec.ctrl {
+        parts.push("Ctrl");
+    }
+    if spec.shift {
+        parts.push("Shift");
+    }
+    if spec.alt {
+        parts.push("Alt");
+    }
+    if spec.meta {
+        parts.push("Meta");
+    }
+    let mut out = parts.join("+");
+    if !out.is_empty() {
+        out.push('+');
+    }
+    let key = spec.code.strip_prefix("Key").unwrap_or(&spec.code);
+    out.push_str(key);
+    out
+}
+
+fn checkbox_checked(ev: &web_sys::Event) -> Option<bool> {
+    ev.target()?
+        .dyn_into::<web_sys::HtmlInputElement>()
+        .ok()
+        .map(|i| i.checked())
+}
+
+/// STT input language (nested under App → Language).
+#[component]
+pub fn VoiceSttLanguageControls<F>(settings: RwSignal<Option<VoiceSettings>>, save: F) -> impl IntoView
+where
+    F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
+{
+    let i18n = expect_context::<I18nService>();
+
+    view! {
+        <Show
+            when=move || settings.get().is_some()
+            fallback=|| ()
+        >
+            {move || {
+                let Some(current) = settings.get() else {
+                    return ().into_any();
+                };
+                let stt_lang = current.stt_language.clone();
+                let is_follow = matches!(stt_lang, SttLanguageMode::FollowApp);
+                let is_auto = matches!(stt_lang, SttLanguageMode::AutoDetect);
+                let is_manual = matches!(stt_lang, SttLanguageMode::Manual { .. });
+                let manual_code = if let SttLanguageMode::Manual { ref code } = stt_lang {
+                    code.clone()
+                } else {
+                    String::new()
+                };
+
+                view! {
+                    <label class="harness-stack app-voice-stt-lang">
+                        <span class="harness-field-label">
+                            <span class="harness-field-label__text">{move || i18n.tr(I18nKey::VoiceSttLangMode)()}</span>
+                        </span>
+                        <div class="app-prefs-toggle-grid app-prefs-toggle-grid--triple">
+                            <div class="app-prefs-toggle-cell">
+                                <label class="app-prefs-radio">
+                                    <input
+                                        type="radio"
+                                        name="stt-lang-mode"
+                                        prop:checked=move || is_follow
+                                        on:change=move |_| {
+                                            let Some(mut next) = settings.get_untracked() else { return };
+                                            next.stt_language = SttLanguageMode::FollowApp;
+                                            save(next);
+                                        }
+                                    />
+                                    <span>{move || i18n.tr(I18nKey::VoiceSttLangFollowApp)()}</span>
+                                </label>
+                            </div>
+                            <div class="app-prefs-toggle-cell">
+                                <label class="app-prefs-radio">
+                                    <input
+                                        type="radio"
+                                        name="stt-lang-mode"
+                                        prop:checked=move || is_auto
+                                        on:change=move |_| {
+                                            let Some(mut next) = settings.get_untracked() else { return };
+                                            next.stt_language = SttLanguageMode::AutoDetect;
+                                            save(next);
+                                        }
+                                    />
+                                    <span>{move || i18n.tr(I18nKey::VoiceSttLangAutoDetect)()}</span>
+                                </label>
+                            </div>
+                            <div class="app-prefs-toggle-cell">
+                                <label class="app-prefs-radio">
+                                    <input
+                                        type="radio"
+                                        name="stt-lang-mode"
+                                        prop:checked=move || is_manual
+                                        on:change={
+                                            let manual_code = manual_code.clone();
+                                            move |_| {
+                                                let Some(mut next) = settings.get_untracked() else { return };
+                                                next.stt_language =
+                                                    SttLanguageMode::Manual { code: manual_code.clone() };
+                                                save(next);
+                                            }
+                                        }
+                                    />
+                                    <span>{move || i18n.tr(I18nKey::VoiceSttLangManual)()}</span>
+                                </label>
+                            </div>
+                        </div>
+                        <Show when=move || is_manual>
+                            <input
+                                type="text"
+                                class="workbench-plain-input"
+                                placeholder="ISO-639-1 (e.g. de, en, ja)"
+                                prop:value=manual_code.clone()
+                                on:change=move |ev| {
+                                    if let Some(t) = ev.target() {
+                                        if let Ok(inp) = t.dyn_into::<web_sys::HtmlInputElement>() {
+                                            let Some(mut next) = settings.get_untracked() else { return };
+                                            next.stt_language =
+                                                SttLanguageMode::Manual { code: inp.value() };
+                                            save(next);
+                                        }
+                                    }
+                                }
+                            />
+                        </Show>
+                    </label>
+                }
+                .into_any()
+            }}
+        </Show>
+    }
+}
+
+/// Push-to-talk hotkey (nested under App → Keyboard shortcuts).
+#[component]
+pub fn VoicePttControls<F>(
+    settings: RwSignal<Option<VoiceSettings>>,
+    recording: RwSignal<bool>,
+    save: F,
+) -> impl IntoView
+where
+    F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
+{
+    let i18n = expect_context::<I18nService>();
+
+    view! {
+        <Show
+            when=move || settings.get().is_some()
+            fallback=|| ()
+        >
+            {move || {
+                let Some(current) = settings.get() else {
+                    return ().into_any();
+                };
+                let ptt = current.ptt_hotkey.clone();
+                let begin_capture = move || recording.set(true);
+                let capture_keydown = move |ev: web_sys::KeyboardEvent| {
+                    if !recording.get_untracked() {
+                        return;
+                    }
+                    ev.prevent_default();
+                    if ev.key() == "Escape" {
+                        recording.set(false);
+                        return;
+                    }
+                    if matches!(
+                        ev.code().as_str(),
+                        "ControlLeft"
+                            | "ControlRight"
+                            | "ShiftLeft"
+                            | "ShiftRight"
+                            | "AltLeft"
+                            | "AltRight"
+                            | "MetaLeft"
+                            | "MetaRight"
+                    ) {
+                        return;
+                    }
+                    let Some(mut next) = settings.get_untracked() else {
+                        return;
+                    };
+                    next.ptt_hotkey = PttHotkey {
+                        enabled: next.ptt_hotkey.enabled,
+                        code: ev.code(),
+                        ctrl: ev.ctrl_key(),
+                        shift: ev.shift_key(),
+                        alt: ev.alt_key(),
+                        meta: ev.meta_key(),
+                    };
+                    save(next);
+                    recording.set(false);
+                };
+                let display = format_hotkey(&ptt);
+                let enabled = ptt.enabled;
+
+                view! {
+                    <div class="app-voice-ptt">
+                        <label class="app-prefs-toggle">
+                            <input
+                                type="checkbox"
+                                prop:checked=enabled
+                                on:change=move |ev| {
+                                    if let Some(checked) = checkbox_checked(&ev) {
+                                        let Some(mut next) = settings.get_untracked() else { return };
+                                        next.ptt_hotkey.enabled = checked;
+                                        save(next);
+                                    }
+                                }
+                            />
+                            <span>{move || i18n.tr(I18nKey::VoicePttEnabled)()}</span>
+                        </label>
+                        <label class="harness-stack">
+                            <span class="harness-field-label">
+                                <span class="harness-field-label__text">{move || i18n.tr(I18nKey::VoicePttHotkey)()}</span>
+                            </span>
+                            <button
+                                type="button"
+                                class="workbench-plain-input app-prefs-hotkey-capture"
+                                class:app-prefs-hotkey-capture--recording=move || recording.get()
+                                on:click=move |_| begin_capture()
+                                on:keydown=capture_keydown
+                            >
+                                {move || if recording.get() {
+                                    i18n.tr(I18nKey::VoicePttRecorderHint)().to_string()
+                                } else {
+                                    display.clone()
+                                }}
+                            </button>
+                        </label>
+                    </div>
+                }
+                .into_any()
+            }}
+        </Show>
+    }
+}
diff --git a/styles.css b/styles.css
index 15ea354..876de23 100644
--- a/styles.css
+++ b/styles.css
@@ -1570,6 +1570,33 @@ button.workbench-shortcut-row--action:focus-visible {
   color: rgba(218, 221, 232, 0.9);
 }
 
+.app-prefs-toggle-grid--triple {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+@media (max-width: 720px) {
+    .app-prefs-toggle-grid--triple {
+        grid-template-columns: 1fr;
+    }
+}
+.app-voice-stt-lang {
+    margin-top: 0.65rem;
+}
+.app-voice-ptt {
+    display: flex;
+    flex-direction: column;
+    gap: 0.65rem;
+    margin-top: 0.75rem;
+}
+.app-prefs-hotkey-capture {
+    width: 100%;
+    text-align: left;
+    cursor: pointer;
+    font-family: inherit;
+}
+.app-prefs-hotkey-capture--recording {
+    border-color: var(--accent, #4ea1ff);
+    background: rgba(78, 161, 255, 0.08);
+}
 .app-prefs-radio input {
   accent-color: var(--accent);
 }

From 37ee5c20d984493c35a3b374b1c5daae1818ad33 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 06:06:19 +0200
Subject: [PATCH 33/48] feat(locale): add ISO-639-1 mapping and locale picker
 for STT settings

- Implemented `from_iso639_1` function to map ISO-639-1 codes to built-in UI locales, enhancing localization support.
- Added `SttManualLocalePicker` component for selecting STT languages, improving user interaction in voice settings.
- Introduced helper functions for navigating locale options and focusing on selected elements, streamlining the user experience.
- Enhanced unit tests to verify the new locale mapping functionality.
---
 src/i18n/locale.rs                      |  26 +++
 src/workbench/voice_app_controls/mod.rs | 216 +++++++++++++++++++++---
 2 files changed, 219 insertions(+), 23 deletions(-)

diff --git a/src/i18n/locale.rs b/src/i18n/locale.rs
index c4fa895..b8bb617 100644
--- a/src/i18n/locale.rs
+++ b/src/i18n/locale.rs
@@ -83,6 +83,25 @@ impl Locale {
         }
     }
 
+    /// Map a stored STT manual code (ISO-639-1 or BCP-47) to a built-in UI locale.
+    #[must_use]
+    pub fn from_iso639_1(code: &str) -> Self {
+        let trimmed = code.trim();
+        if trimmed.is_empty() {
+            return Self::default();
+        }
+        if let Some(loc) = Self::parse_bcp47(trimmed) {
+            return loc;
+        }
+        let lower = trimmed.to_ascii_lowercase();
+        for (loc, _) in APP_LOCALES {
+            if loc.iso639_1() == lower {
+                return *loc;
+            }
+        }
+        Self::default()
+    }
+
     /// Parse persisted or `<option>` BCP-47 tags (ASCII case-insensitive).
     #[must_use]
     pub fn parse_bcp47(raw: &str) -> Option<Self> {
@@ -220,6 +239,13 @@ mod tests {
         assert_eq!(Locale::parse_bcp47("hu"), Some(Locale::HuHu));
     }
 
+    #[test]
+    fn from_iso639_1_maps_builtin_codes() {
+        assert_eq!(Locale::from_iso639_1("de"), Locale::DeDe);
+        assert_eq!(Locale::from_iso639_1("ja"), Locale::JaJp);
+        assert_eq!(Locale::from_iso639_1("zh-TW"), Locale::ZhTw);
+    }
+
     #[test]
     fn default_is_english() {
         assert_eq!(Locale::default(), Locale::EnUs);
diff --git a/src/workbench/voice_app_controls/mod.rs b/src/workbench/voice_app_controls/mod.rs
index b08097c..739c12c 100644
--- a/src/workbench/voice_app_controls/mod.rs
+++ b/src/workbench/voice_app_controls/mod.rs
@@ -1,8 +1,10 @@
 //! Voice STT language + push-to-talk controls styled for Settings → App.
 
+use crate::i18n::{Locale, APP_LOCALES};
 use crate::i18n::I18nKey;
 use crate::service::I18nService;
 use crate::tauri_bridge::{PttHotkey, SttLanguageMode, VoiceSettings};
+use gloo_timers::future::TimeoutFuture;
 use leptos::prelude::*;
 use wasm_bindgen::JsCast;
 
@@ -36,6 +38,183 @@ fn checkbox_checked(ev: &web_sys::Event) -> Option<bool> {
         .map(|i| i.checked())
 }
 
+fn focus_by_id(id: &str) {
+    let Some(doc) = web_sys::window().and_then(|w| w.document()) else {
+        return;
+    };
+    let Some(el) = doc.get_element_by_id(id) else {
+        return;
+    };
+    let Ok(button) = el.dyn_into::<web_sys::HtmlElement>() else {
+        return;
+    };
+    let _ = button.focus();
+}
+
+fn focus_stt_locale_option(loc: Locale) {
+    focus_by_id(&format!("stt-locale-option-{}", loc.as_str()));
+}
+
+fn next_stt_locale(loc: Locale) -> Locale {
+    let n = APP_LOCALES.len();
+    let idx = APP_LOCALES.iter().position(|(l, _)| *l == loc).unwrap_or(0);
+    APP_LOCALES[(idx + 1) % n].0
+}
+
+fn prev_stt_locale(loc: Locale) -> Locale {
+    let n = APP_LOCALES.len();
+    let idx = APP_LOCALES.iter().position(|(l, _)| *l == loc).unwrap_or(0);
+    APP_LOCALES[(idx + n - 1) % n].0
+}
+
+fn app_locale_native_label(loc: Locale) -> &'static str {
+    APP_LOCALES
+        .iter()
+        .find(|(l, _)| *l == loc)
+        .map(|(_, label)| *label)
+        .unwrap_or("?")
+}
+
+fn default_manual_iso639_1(i18n: &I18nService) -> String {
+    i18n.locale().get_untracked().iso639_1().to_string()
+}
+
+/// Built-in locale dropdown for manual STT language (same chrome as UI language picker).
+#[component]
+fn SttManualLocalePicker<F>(
+    settings: RwSignal<Option<VoiceSettings>>,
+    selected: Locale,
+    save: F,
+) -> impl IntoView
+where
+    F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
+{
+    let open = RwSignal::new(false);
+
+    let choose = move |loc: Locale| {
+        let Some(mut next) = settings.get_untracked() else {
+            return;
+        };
+        next.stt_language = SttLanguageMode::Manual {
+            code: loc.iso639_1().to_string(),
+        };
+        save(next);
+        open.set(false);
+    };
+
+    view! {
+        <div class="harness-provider-picker harness-locale-picker">
+            <button
+                type="button"
+                class="harness-provider-trigger"
+                aria-haspopup="listbox"
+                aria-expanded=move || if open.get() { "true" } else { "false" }
+                on:click=move |_| {
+                    let next = !open.get_untracked();
+                    open.set(next);
+                    if next {
+                        leptos::task::spawn_local(async move {
+                            TimeoutFuture::new(0).await;
+                            focus_stt_locale_option(selected);
+                        });
+                    }
+                }
+                on:keydown=move |ev: web_sys::KeyboardEvent| {
+                    match ev.key().as_str() {
+                        "ArrowDown" | "Enter" | " " => {
+                            ev.prevent_default();
+                            open.set(true);
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_stt_locale_option(selected);
+                            });
+                        }
+                        "ArrowUp" => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let loc = prev_stt_locale(selected);
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_stt_locale_option(loc);
+                            });
+                        }
+                        "Escape" => open.set(false),
+                        _ => {}
+                    }
+                }
+            >
+                <span class="harness-provider-trigger__main">
+                    <span class="harness-provider-trigger__brand">
+                        <img
+                            class="harness-provider-trigger__img"
+                            src=selected.flag_icon_url()
+                            alt=""
+                        />
+                    </span>
+                    <span>{app_locale_native_label(selected)}</span>
+                </span>
+                <span class="harness-provider-trigger__caret">"▾"</span>
+            </button>
+
+            <Show when=move || open.get()>
+                <div class="harness-provider-menu" role="listbox">
+                    {move || {
+                        let active = selected;
+                        APP_LOCALES
+                            .iter()
+                            .copied()
+                            .map(|(loc, label)| {
+                                view! {
+                                    <button
+                                        id=format!("stt-locale-option-{}", loc.as_str())
+                                        type="button"
+                                        role="option"
+                                        class="harness-provider-option"
+                                        class:harness-provider-option--active=move || active == loc
+                                        aria-selected=move || if active == loc { "true" } else { "false" }
+                                        on:click=move |_| choose(loc)
+                                        on:keydown=move |ev: web_sys::KeyboardEvent| {
+                                            match ev.key().as_str() {
+                                                "ArrowDown" => {
+                                                    ev.prevent_default();
+                                                    focus_stt_locale_option(next_stt_locale(loc));
+                                                }
+                                                "ArrowUp" => {
+                                                    ev.prevent_default();
+                                                    focus_stt_locale_option(prev_stt_locale(loc));
+                                                }
+                                                "Enter" | " " => {
+                                                    ev.prevent_default();
+                                                    choose(loc);
+                                                }
+                                                "Escape" => {
+                                                    ev.prevent_default();
+                                                    open.set(false);
+                                                }
+                                                _ => {}
+                                            }
+                                        }
+                                    >
+                                        <span class="harness-provider-option__brand">
+                                            <img
+                                                class="harness-provider-option__img"
+                                                src=loc.flag_icon_url()
+                                                alt=""
+                                                loading="lazy"
+                                            />
+                                        </span>
+                                        <span>{label}</span>
+                                    </button>
+                                }
+                            })
+                            .collect_view()
+                    }}
+                </div>
+            </Show>
+        </div>
+    }
+}
+
 /// STT input language (nested under App → Language).
 #[component]
 pub fn VoiceSttLanguageControls<F>(settings: RwSignal<Option<VoiceSettings>>, save: F) -> impl IntoView
@@ -62,6 +241,7 @@ where
                 } else {
                     String::new()
                 };
+                let manual_locale = Locale::from_iso639_1(&manual_code);
 
                 view! {
                     <label class="harness-stack app-voice-stt-lang">
@@ -105,14 +285,15 @@ where
                                         type="radio"
                                         name="stt-lang-mode"
                                         prop:checked=move || is_manual
-                                        on:change={
-                                            let manual_code = manual_code.clone();
-                                            move |_| {
-                                                let Some(mut next) = settings.get_untracked() else { return };
-                                                next.stt_language =
-                                                    SttLanguageMode::Manual { code: manual_code.clone() };
-                                                save(next);
-                                            }
+                                        on:change=move |_| {
+                                            let Some(mut next) = settings.get_untracked() else { return };
+                                            let code = if manual_code.trim().is_empty() {
+                                                default_manual_iso639_1(&i18n)
+                                            } else {
+                                                manual_code.clone()
+                                            };
+                                            next.stt_language = SttLanguageMode::Manual { code };
+                                            save(next);
                                         }
                                     />
                                     <span>{move || i18n.tr(I18nKey::VoiceSttLangManual)()}</span>
@@ -120,21 +301,10 @@ where
                             </div>
                         </div>
                         <Show when=move || is_manual>
-                            <input
-                                type="text"
-                                class="workbench-plain-input"
-                                placeholder="ISO-639-1 (e.g. de, en, ja)"
-                                prop:value=manual_code.clone()
-                                on:change=move |ev| {
-                                    if let Some(t) = ev.target() {
-                                        if let Ok(inp) = t.dyn_into::<web_sys::HtmlInputElement>() {
-                                            let Some(mut next) = settings.get_untracked() else { return };
-                                            next.stt_language =
-                                                SttLanguageMode::Manual { code: inp.value() };
-                                            save(next);
-                                        }
-                                    }
-                                }
+                            <SttManualLocalePicker
+                                settings=settings
+                                selected=manual_locale
+                                save=save
                             />
                         </Show>
                     </label>

From a1c77e7b10cdf97054bea0931339a59ca83f82e2 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 06:16:43 +0200
Subject: [PATCH 34/48] feat(agent_provider_pane): enhance layout and voice
 settings integration

- Updated CSS for the agent provider pane to improve grid layout, allowing for better responsiveness and visual organization.
- Replaced the placeholder column with the new `AgentVoiceColumn` component, integrating voice settings directly into the agent provider pane.
- Introduced a new inner grid for voice settings, ensuring a structured layout for STT and TTS sections.
- Refactored the `VoicePane` component to accommodate the new structure and improve maintainability.
---
 .../agent_provider_pane.css                   | 39 +++++++-
 src/workbench/agent_provider_pane/mod.rs      | 10 +-
 src/workbench/harness_voice_pane/mod.rs       | 92 +++++++++++--------
 3 files changed, 96 insertions(+), 45 deletions(-)

diff --git a/src/workbench/agent_provider_pane/agent_provider_pane.css b/src/workbench/agent_provider_pane/agent_provider_pane.css
index 8d83f6a..047da1f 100644
--- a/src/workbench/agent_provider_pane/agent_provider_pane.css
+++ b/src/workbench/agent_provider_pane/agent_provider_pane.css
@@ -2,15 +2,52 @@
 
 .agent-provider-pane__grid {
     display: grid;
-    grid-template-columns: repeat(3, minmax(0, 1fr));
+    grid-template-columns: repeat(2, minmax(0, 1fr));
     gap: 0.75rem;
     align-items: stretch;
 }
 
+.agent-provider-pane__col--span-2 {
+    grid-column: 1 / -1;
+}
+
 @media (max-width: 1100px) {
     .agent-provider-pane__grid {
         grid-template-columns: 1fr;
     }
+
+    .agent-provider-pane__col--span-2 {
+        grid-column: auto;
+    }
+}
+
+.agent-provider-pane__voice-inner {
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 0.85rem;
+    align-items: start;
+}
+
+@media (max-width: 900px) {
+    .agent-provider-pane__voice-inner {
+        grid-template-columns: 1fr;
+    }
+}
+
+.agent-provider-pane__voice-inner .voice-pane__section {
+    margin: 0;
+    padding: 0;
+    border: none;
+    background: transparent;
+    gap: 0.5rem;
+}
+
+.agent-provider-pane__voice-inner .voice-pane__section h3 {
+    margin: 0 0 0.35rem;
+    font-size: 0.82rem;
+    font-weight: 600;
+    color: var(--text-muted);
+    letter-spacing: 0.02em;
 }
 
 .agent-provider-pane__col {
diff --git a/src/workbench/agent_provider_pane/mod.rs b/src/workbench/agent_provider_pane/mod.rs
index 44aeffa..21955c4 100644
--- a/src/workbench/agent_provider_pane/mod.rs
+++ b/src/workbench/agent_provider_pane/mod.rs
@@ -655,14 +655,8 @@ pub fn AgentProviderPane() -> impl IntoView {
                     <crate::workbench::harness_image_pane::AgentImageColumn />
                 </div>
 
-                <div class="agent-provider-pane__col agent-provider-pane__col--placeholder">
-                    <h4 class="harness-pane-subhead agent-provider-pane__col-title">
-                        <span class="harness-pane-subhead__icon" aria-hidden="true">
-                            <LxIcon icon=icondata::LuMic width="0.82rem" height="0.82rem" />
-                        </span>
-                        <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgColumnVoice)()}</span>
-                    </h4>
-                    <p class="app-prefs-hint">{move || i18n.tr(I18nKey::AgColumnVoiceSoon)()}</p>
+                <div class="agent-provider-pane__col agent-provider-pane__col--span-2">
+                    <crate::workbench::harness_voice_pane::AgentVoiceColumn />
                 </div>
             </div>
 
diff --git a/src/workbench/harness_voice_pane/mod.rs b/src/workbench/harness_voice_pane/mod.rs
index 1872fb2..70dae01 100644
--- a/src/workbench/harness_voice_pane/mod.rs
+++ b/src/workbench/harness_voice_pane/mod.rs
@@ -83,8 +83,9 @@ impl GenderFilter {
     }
 }
 
+/// Voice settings column (BLXCode Agent grid, bottom row spanning both columns).
 #[component]
-pub fn VoicePane() -> impl IntoView {
+pub fn AgentVoiceColumn() -> impl IntoView {
     let i18n = expect_context::<I18nService>();
     let settings = RwSignal::new(Option::<VoiceSettings>::None);
     let voices = RwSignal::new(Vec::<VoiceEntry>::new());
@@ -93,7 +94,6 @@ pub fn VoicePane() -> impl IntoView {
     let stt_models = RwSignal::new(Vec::<ProviderModelEntry>::new());
     let tts_models = RwSignal::new(Vec::<ProviderModelEntry>::new());
 
-    // Load current settings + initial voice catalogue + model lists.
     if is_tauri_shell() {
         leptos::task::spawn_local(async move {
             if let Ok(v) = voice_settings_get().await {
@@ -116,7 +116,7 @@ pub fn VoicePane() -> impl IntoView {
             match voice_settings_save(patch).await {
                 Ok(v) => {
                     settings.set(Some(v));
-                    status.set(Some("saved".into()));
+                    status.set(Some(i18n.tr(I18nKey::ApiKeysSaved)().to_string()));
                 }
                 Err(e) => status.set(Some(e)),
             }
@@ -139,13 +139,13 @@ pub fn VoicePane() -> impl IntoView {
     };
 
     view! {
-        <section class="harness-settings-pane voice-pane" aria-labelledby="voice-pane-title">
-            <header class="harness-settings-pane__head">
-                <h2 id="voice-pane-title">
-                    <LxIcon icon=icondata::LuMic width="1.1rem" height="1.1rem" />
-                    <span>{move || i18n.tr(I18nKey::VoicePaneTitle)()}</span>
-                </h2>
-            </header>
+        <>
+            <h4 class="harness-pane-subhead agent-provider-pane__col-title">
+                <span class="harness-pane-subhead__icon" aria-hidden="true">
+                    <LxIcon icon=icondata::LuMic width="0.82rem" height="0.82rem" />
+                </span>
+                <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::AgColumnVoice)()}</span>
+            </h4>
 
             <Show
                 when=move || settings.get().is_some()
@@ -168,32 +168,34 @@ pub fn VoicePane() -> impl IntoView {
                     let tts_enabled = current.tts.enabled;
 
                     view! {
-                        <SttSection
-                            current=current.clone()
-                            stt_provider=stt_provider
-                            stt_model=stt_model.clone()
-                            sample_rate=sample_rate
-                            models=stt_models
-                            save=save
-                            reload_models=reload_stt_models
-                        />
-                        <TtsSection
-                            current=current.clone()
-                            tts_provider=tts_provider
-                            tts_model=tts_model.clone()
-                            voice_id=voice_id.clone()
-                            voices=voices
-                            gender_filter=gender_filter
-                            tts_enabled=tts_enabled
-                            models=tts_models
-                            save=save
-                            reload_voices=reload_voices
-                        />
-                        <BehaviorSection
-                            current=current.clone()
-                            post_flow=post_flow
-                            save=save
-                        />
+                        <div class="agent-provider-pane__voice-inner">
+                            <SttSection
+                                current=current.clone()
+                                stt_provider=stt_provider
+                                stt_model=stt_model.clone()
+                                sample_rate=sample_rate
+                                models=stt_models
+                                save=save
+                                reload_models=reload_stt_models
+                            />
+                            <TtsSection
+                                current=current.clone()
+                                tts_provider=tts_provider
+                                tts_model=tts_model.clone()
+                                voice_id=voice_id.clone()
+                                voices=voices
+                                gender_filter=gender_filter
+                                tts_enabled=tts_enabled
+                                models=tts_models
+                                save=save
+                                reload_voices=reload_voices
+                            />
+                            <BehaviorSection
+                                current=current.clone()
+                                post_flow=post_flow
+                                save=save
+                            />
+                        </div>
                     }.into_any()
                 }}
             </Show>
@@ -201,6 +203,24 @@ pub fn VoicePane() -> impl IntoView {
             <Show when=move || status.get().is_some()>
                 <p class="voice-pane__status">{move || status.get().unwrap_or_default()}</p>
             </Show>
+        </>
+    }
+}
+
+#[component]
+pub fn VoicePane() -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    view! {
+        <section class="harness-settings-pane voice-pane" aria-labelledby="voice-pane-title">
+            <header class="harness-settings-pane__head">
+                <h2 id="voice-pane-title">
+                    <LxIcon icon=icondata::LuMic width="1.1rem" height="1.1rem" />
+                    <span>{move || i18n.tr(I18nKey::VoicePaneTitle)()}</span>
+                </h2>
+            </header>
+            <div class="agent-provider-pane__col agent-provider-pane__col--standalone voice-pane-standalone">
+                <AgentVoiceColumn />
+            </div>
         </section>
     }
 }

From 27d20989ae854b8f2b2edd84726ab0981234e14c Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 06:17:54 +0200
Subject: [PATCH 35/48] feat(harness-level-picker): implement new CSS styles
 and structure for quality level pickers

- Added CSS styles for the harness-level-picker, enhancing the visual design and interaction of quality level selection components.
- Updated the `agent_provider_pane` and `harness_image_pane` modules to include the new `harness-level-picker` class, improving consistency across the UI.
- Introduced hover and focus styles for better user feedback during interaction with quality level options.
---
 src/workbench/agent_provider_pane/mod.rs |  2 +-
 src/workbench/harness_image_pane/mod.rs  |  2 +-
 styles.css                               | 27 ++++++++++++++++++++++++
 3 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/src/workbench/agent_provider_pane/mod.rs b/src/workbench/agent_provider_pane/mod.rs
index 21955c4..56a37fe 100644
--- a/src/workbench/agent_provider_pane/mod.rs
+++ b/src/workbench/agent_provider_pane/mod.rs
@@ -302,7 +302,7 @@ fn ThinkingLevelPicker(selected: RwSignal<ThinkingLevel>) -> impl IntoView {
     };
 
     view! {
-        <div class="harness-provider-picker">
+        <div class="harness-provider-picker harness-level-picker">
             <button
                 type="button"
                 class="harness-provider-trigger"
diff --git a/src/workbench/harness_image_pane/mod.rs b/src/workbench/harness_image_pane/mod.rs
index 6052b2f..d88729e 100644
--- a/src/workbench/harness_image_pane/mod.rs
+++ b/src/workbench/harness_image_pane/mod.rs
@@ -362,7 +362,7 @@ fn ImageQualityLevelPicker(
     };
 
     view! {
-        <div class="harness-provider-picker">
+        <div class="harness-provider-picker harness-level-picker">
             <button
                 type="button"
                 class="harness-provider-trigger"
diff --git a/styles.css b/styles.css
index 876de23..fa1ace6 100644
--- a/styles.css
+++ b/styles.css
@@ -4456,6 +4456,33 @@ button.workbench-shortcut-row--action:focus-visible {
   object-fit: cover;
 }
 
+/* Thinking / quality level pickers (Lucide icons, not brand logos) */
+.harness-level-picker .harness-provider-trigger__brand,
+.harness-level-picker .harness-provider-option__brand {
+  width: 1.35rem;
+  height: 1.35rem;
+  flex: 0 0 1.35rem;
+  background: color-mix(in srgb, var(--accent-cool, var(--accent)) 14%, var(--bg-panel));
+  border: 1px solid color-mix(in srgb, var(--accent-cool, var(--accent)) 38%, var(--border));
+  color: var(--accent-cool, var(--accent));
+}
+
+.harness-level-picker .harness-provider-trigger__brand svg,
+.harness-level-picker .harness-provider-option__brand svg {
+  width: 0.92rem;
+  height: 0.92rem;
+  stroke: currentColor;
+  fill: none;
+}
+
+.harness-level-picker .harness-provider-option:hover .harness-provider-option__brand,
+.harness-level-picker .harness-provider-option--active .harness-provider-option__brand,
+.harness-level-picker .harness-provider-option:focus .harness-provider-option__brand {
+  background: color-mix(in srgb, var(--accent) 22%, var(--bg-raised));
+  border-color: var(--accent);
+  color: var(--text);
+}
+
 .harness-stack {
   display: flex;
   flex-direction: column;

From 74efad0fffba177ddc9b17f82edb751ef77ddca2 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 06:27:37 +0200
Subject: [PATCH 36/48] refactor(harness_ui): remove unused select_str function

- Deleted the `select_str` function from the `harness_ui` module as it was no longer needed, simplifying the codebase and improving maintainability.
---
 src/workbench/harness_ui.rs | 7 -------
 1 file changed, 7 deletions(-)

diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index 0bf1019..de6a2de 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -486,13 +486,6 @@ fn checkbox_checked(ev: &web_sys::Event) -> Option<bool> {
         .map(|i| i.checked())
 }
 
-fn select_str(ev: &web_sys::Event) -> Option<String> {
-    ev.target()?
-        .dyn_into::<web_sys::HtmlSelectElement>()
-        .ok()
-        .map(|i| i.value())
-}
-
 #[component]
 fn PaletteList(
     ui: HarnessUiService,

From bd511229fe9ceda6b0aee24caaf66fad9ddcb568 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 06:38:39 +0200
Subject: [PATCH 37/48] feat(agent_provider_pane): add voice provider selection
 and styling

- Introduced a new CSS class for voice provider layout in the agent provider pane, enhancing visual organization.
- Implemented a `VoiceProviderPicker` component for selecting between OpenAI and OpenRouter voice providers, improving user interaction.
- Updated the `AgentVoiceColumn` to integrate voice provider selection, ensuring a cohesive experience for managing voice settings.
- Refactored related components to accommodate the new voice provider functionality, enhancing maintainability and responsiveness.
---
 .../agent_provider_pane.css                   |   5 +
 src/workbench/harness_voice_pane/mod.rs       | 531 +++++++++++-------
 2 files changed, 343 insertions(+), 193 deletions(-)

diff --git a/src/workbench/agent_provider_pane/agent_provider_pane.css b/src/workbench/agent_provider_pane/agent_provider_pane.css
index 047da1f..9a81a53 100644
--- a/src/workbench/agent_provider_pane/agent_provider_pane.css
+++ b/src/workbench/agent_provider_pane/agent_provider_pane.css
@@ -28,6 +28,11 @@
     align-items: start;
 }
 
+.agent-provider-pane__voice-provider {
+    grid-column: 1 / -1;
+    margin: 0 0 0.15rem;
+}
+
 @media (max-width: 900px) {
     .agent-provider-pane__voice-inner {
         grid-template-columns: 1fr;
diff --git a/src/workbench/harness_voice_pane/mod.rs b/src/workbench/harness_voice_pane/mod.rs
index 70dae01..0476c0b 100644
--- a/src/workbench/harness_voice_pane/mod.rs
+++ b/src/workbench/harness_voice_pane/mod.rs
@@ -11,6 +11,7 @@ use crate::tauri_bridge::{
 };
 use crate::workbench::model_picker::ModelPicker;
 use base64::{engine::general_purpose::STANDARD as BASE64, Engine as _};
+use gloo_timers::future::TimeoutFuture;
 use js_sys::Uint8Array;
 use leptos::prelude::*;
 use leptos_icons::Icon as LxIcon;
@@ -83,6 +84,46 @@ impl GenderFilter {
     }
 }
 
+fn voice_providers() -> [VoiceProviderKind; 2] {
+    [VoiceProviderKind::Openai, VoiceProviderKind::Openrouter]
+}
+
+fn voice_provider_icon_url(provider: VoiceProviderKind) -> &'static str {
+    match provider {
+        VoiceProviderKind::Openai => "/public/brand-icons/openai.svg",
+        VoiceProviderKind::Openrouter => "/public/brand-icons/openrouter.svg",
+    }
+}
+
+fn voice_provider_label(i18n: &I18nService, provider: VoiceProviderKind) -> String {
+    let key = match provider {
+        VoiceProviderKind::Openai => I18nKey::AgProviderOpenai,
+        VoiceProviderKind::Openrouter => I18nKey::AgProviderOpenrouter,
+    };
+    i18n.tr(key)().to_string()
+}
+
+fn focus_voice_provider_option(provider: VoiceProviderKind) {
+    let id = format!("voice-provider-option-{}", provider.as_str());
+    if let Some(doc) = web_sys::window().and_then(|w| w.document()) {
+        if let Some(el) = doc.get_element_by_id(&id) {
+            let _ = el.dyn_into::<web_sys::HtmlElement>().map(|e| e.focus());
+        }
+    }
+}
+
+fn next_voice_provider(provider: VoiceProviderKind) -> VoiceProviderKind {
+    let list = voice_providers();
+    let i = list.iter().position(|&p| p == provider).unwrap_or(0);
+    list[(i + 1) % list.len()]
+}
+
+fn prev_voice_provider(provider: VoiceProviderKind) -> VoiceProviderKind {
+    let list = voice_providers();
+    let i = list.iter().position(|&p| p == provider).unwrap_or(0);
+    list[(i + list.len() - 1) % list.len()]
+}
+
 /// Voice settings column (BLXCode Agent grid, bottom row spanning both columns).
 #[component]
 pub fn AgentVoiceColumn() -> impl IntoView {
@@ -93,10 +134,12 @@ pub fn AgentVoiceColumn() -> impl IntoView {
     let status = RwSignal::new(Option::<String>::None);
     let stt_models = RwSignal::new(Vec::<ProviderModelEntry>::new());
     let tts_models = RwSignal::new(Vec::<ProviderModelEntry>::new());
+    let voice_provider = RwSignal::new(VoiceProviderKind::Openai);
 
     if is_tauri_shell() {
         leptos::task::spawn_local(async move {
             if let Ok(v) = voice_settings_get().await {
+                voice_provider.set(v.stt.provider);
                 if let Ok(catalog) = voice_provider_voices(v.tts.provider).await {
                     voices.set(catalog.voices);
                 }
@@ -138,6 +181,11 @@ pub fn AgentVoiceColumn() -> impl IntoView {
         });
     };
 
+    let reload_all_for_provider = move |provider: VoiceProviderKind| {
+        reload_voices(provider);
+        reload_stt_models(provider);
+    };
+
     view! {
         <>
             <h4 class="harness-pane-subhead agent-provider-pane__col-title">
@@ -158,8 +206,6 @@ pub fn AgentVoiceColumn() -> impl IntoView {
                         return view! { <></> }.into_any();
                     };
 
-                    let stt_provider = current.stt.provider;
-                    let tts_provider = current.tts.provider;
                     let stt_model = current.stt.model_id.clone();
                     let tts_model = current.tts.model_id.clone();
                     let sample_rate = current.stt.sample_rate_hz;
@@ -167,11 +213,36 @@ pub fn AgentVoiceColumn() -> impl IntoView {
                     let post_flow = current.post_stt_flow;
                     let tts_enabled = current.tts.enabled;
 
+                    let on_voice_provider = {
+                        let current = current.clone();
+                        move |p: VoiceProviderKind| {
+                            voice_provider.set(p);
+                            let mut next = current.clone();
+                            next.stt.provider = p;
+                            next.tts.provider = p;
+                            save(next);
+                            reload_all_for_provider(p);
+                        }
+                    };
+
                     view! {
                         <div class="agent-provider-pane__voice-inner">
+                            <label class="agent-provider-pane__field agent-provider-pane__voice-provider">
+                                <span class="harness-field-label">
+                                    <span class="harness-field-label__icon" aria-hidden="true">
+                                        <LxIcon icon=icondata::LuPlug width="0.82rem" height="0.82rem" />
+                                    </span>
+                                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::VoiceProviderField)()}</span>
+                                </span>
+                                <VoiceProviderPicker
+                                    selected_provider=voice_provider
+                                    on_select=Callback::new(on_voice_provider)
+                                />
+                            </label>
+
                             <SttSection
                                 current=current.clone()
-                                stt_provider=stt_provider
+                                voice_provider=voice_provider
                                 stt_model=stt_model.clone()
                                 sample_rate=sample_rate
                                 models=stt_models
@@ -180,19 +251,19 @@ pub fn AgentVoiceColumn() -> impl IntoView {
                             />
                             <TtsSection
                                 current=current.clone()
-                                tts_provider=tts_provider
+                                voice_provider=voice_provider
                                 tts_model=tts_model.clone()
-                                voice_id=voice_id.clone()
-                                voices=voices
-                                gender_filter=gender_filter
-                                tts_enabled=tts_enabled
                                 models=tts_models
                                 save=save
-                                reload_voices=reload_voices
+                                reload_models=reload_voices
                             />
                             <BehaviorSection
                                 current=current.clone()
                                 post_flow=post_flow
+                                voice_id=voice_id.clone()
+                                voices=voices
+                                gender_filter=gender_filter
+                                tts_enabled=tts_enabled
                                 save=save
                             />
                         </div>
@@ -225,6 +296,140 @@ pub fn VoicePane() -> impl IntoView {
     }
 }
 
+// ---------------------------------------------------------------------------
+// Shared voice provider dropdown (STT + TTS)
+// ---------------------------------------------------------------------------
+
+#[component]
+fn VoiceProviderPicker(
+    selected_provider: RwSignal<VoiceProviderKind>,
+    on_select: Callback<VoiceProviderKind>,
+) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let open = RwSignal::new(false);
+
+    let choose = move |provider: VoiceProviderKind| {
+        selected_provider.set(provider);
+        open.set(false);
+        on_select.run(provider);
+    };
+
+    view! {
+        <div class="harness-provider-picker">
+            <button
+                type="button"
+                class="harness-provider-trigger"
+                aria-haspopup="listbox"
+                aria-expanded=move || if open.get() { "true" } else { "false" }
+                on:click=move |_| {
+                    let next = !open.get_untracked();
+                    open.set(next);
+                    if next {
+                        let provider = selected_provider.get_untracked();
+                        leptos::task::spawn_local(async move {
+                            TimeoutFuture::new(0).await;
+                            focus_voice_provider_option(provider);
+                        });
+                    }
+                }
+                on:keydown=move |ev: web_sys::KeyboardEvent| {
+                    match ev.key().as_str() {
+                        "ArrowDown" | "Enter" | " " => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let provider = selected_provider.get_untracked();
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_voice_provider_option(provider);
+                            });
+                        }
+                        "ArrowUp" => {
+                            ev.prevent_default();
+                            open.set(true);
+                            let provider = prev_voice_provider(selected_provider.get_untracked());
+                            leptos::task::spawn_local(async move {
+                                TimeoutFuture::new(0).await;
+                                focus_voice_provider_option(provider);
+                            });
+                        }
+                        "Escape" => open.set(false),
+                        _ => {}
+                    }
+                }
+            >
+                <span class="harness-provider-trigger__main">
+                    <span class="harness-provider-trigger__brand">
+                        <img
+                            class="harness-provider-trigger__img"
+                            src=move || voice_provider_icon_url(selected_provider.get())
+                            alt=""
+                        />
+                    </span>
+                    <span>{move || voice_provider_label(&i18n, selected_provider.get())}</span>
+                </span>
+                <span class="harness-provider-trigger__caret">"▾"</span>
+            </button>
+
+            <Show when=move || open.get()>
+                <div class="harness-provider-menu" role="listbox">
+                    {move || {
+                        voice_providers()
+                            .into_iter()
+                            .map(|provider| {
+                                view! {
+                                    <button
+                                        id=format!("voice-provider-option-{}", provider.as_str())
+                                        type="button"
+                                        role="option"
+                                        class="harness-provider-option"
+                                        class:harness-provider-option--active=move || selected_provider.get() == provider
+                                        aria-selected=move || if selected_provider.get() == provider {
+                                            "true"
+                                        } else {
+                                            "false"
+                                        }
+                                        on:click=move |_| choose(provider)
+                                        on:keydown=move |ev: web_sys::KeyboardEvent| {
+                                            match ev.key().as_str() {
+                                                "ArrowDown" => {
+                                                    ev.prevent_default();
+                                                    focus_voice_provider_option(next_voice_provider(provider));
+                                                }
+                                                "ArrowUp" => {
+                                                    ev.prevent_default();
+                                                    focus_voice_provider_option(prev_voice_provider(provider));
+                                                }
+                                                "Enter" | " " => {
+                                                    ev.prevent_default();
+                                                    choose(provider);
+                                                }
+                                                "Escape" => {
+                                                    ev.prevent_default();
+                                                    open.set(false);
+                                                }
+                                                _ => {}
+                                            }
+                                        }
+                                    >
+                                        <span class="harness-provider-option__brand">
+                                            <img
+                                                class="harness-provider-option__img"
+                                                src=voice_provider_icon_url(provider)
+                                                alt=""
+                                            />
+                                        </span>
+                                        <span>{voice_provider_label(&i18n, provider)}</span>
+                                    </button>
+                                }
+                            })
+                            .collect_view()
+                    }}
+                </div>
+            </Show>
+        </div>
+    }
+}
+
 // ---------------------------------------------------------------------------
 // STT section
 // ---------------------------------------------------------------------------
@@ -232,7 +437,7 @@ pub fn VoicePane() -> impl IntoView {
 #[component]
 fn SttSection<F, RM>(
     current: VoiceSettings,
-    stt_provider: VoiceProviderKind,
+    voice_provider: RwSignal<VoiceProviderKind>,
     stt_model: String,
     sample_rate: u32,
     models: RwSignal<Vec<ProviderModelEntry>>,
@@ -244,15 +449,6 @@ where
     RM: Fn(VoiceProviderKind) + Send + Sync + 'static + Copy,
 {
     let i18n = expect_context::<I18nService>();
-    let on_provider = {
-        let current = current.clone();
-        move |p: VoiceProviderKind| {
-            let mut next = current.clone();
-            next.stt.provider = p;
-            save(next);
-            reload_models(p);
-        }
-    };
     let on_model = {
         let current = current.clone();
         move |m: String| {
@@ -274,30 +470,13 @@ where
         <section class="voice-pane__section">
             <h3>{move || i18n.tr(I18nKey::VoiceSttSection)()}</h3>
 
-            <div class="voice-pane__field">
-                <label>{move || i18n.tr(I18nKey::VoiceProviderField)()}</label>
-                <div class="voice-pane__provider-row">
-                    <ProviderBtn label="OpenAI" target=VoiceProviderKind::Openai active=stt_provider on:click={
-                        let on_provider = on_provider.clone();
-                        move |_| on_provider(VoiceProviderKind::Openai)
-                    } />
-                    <ProviderBtn label="OpenRouter" target=VoiceProviderKind::Openrouter active=stt_provider on:click={
-                        let on_provider = on_provider.clone();
-                        move |_| on_provider(VoiceProviderKind::Openrouter)
-                    } />
-                </div>
-            </div>
-
             <ModelPicker
                 label_key=I18nKey::VoiceModelField
                 datalist_id="blxcode-voice-stt-models"
                 current=stt_model.clone()
                 models=models
                 on_change=on_model.clone()
-                on_refresh={
-                    let stt_provider = stt_provider;
-                    move || reload_models(stt_provider)
-                }
+                on_refresh=move || reload_models(voice_provider.get_untracked())
             />
 
             <div class="voice-pane__field">
@@ -331,76 +510,144 @@ where
 }
 
 #[component]
-fn ProviderBtn(
-    label: &'static str,
-    target: VoiceProviderKind,
-    active: VoiceProviderKind,
-) -> impl IntoView {
-    let is_active = move || target == active;
+fn QualityBtn(rate: u32, label_key: I18nKey, active: u32) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let is_active = move || rate == active;
     view! {
         <button
             type="button"
             class="voice-pane__choice"
             class:voice-pane__choice--active=is_active
         >
-            {label}
+            {move || i18n.tr(label_key)()}
         </button>
     }
 }
 
+// ---------------------------------------------------------------------------
+// TTS section
+// ---------------------------------------------------------------------------
+
+#[component]
+fn TtsSection<F, RV>(
+    current: VoiceSettings,
+    voice_provider: RwSignal<VoiceProviderKind>,
+    tts_model: String,
+    models: RwSignal<Vec<ProviderModelEntry>>,
+    save: F,
+    reload_models: RV,
+) -> impl IntoView
+where
+    F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
+    RV: Fn(VoiceProviderKind) + Send + Sync + 'static + Copy,
+{
+    let i18n = expect_context::<I18nService>();
+
+    let on_model = {
+        let current = current.clone();
+        move |m: String| {
+            let mut next = current.clone();
+            next.tts.model_id = m;
+            save(next);
+        }
+    };
+
+    view! {
+        <section class="voice-pane__section">
+            <h3>{move || i18n.tr(I18nKey::VoiceTtsSection)()}</h3>
+
+            <ModelPicker
+                label_key=I18nKey::VoiceModelField
+                datalist_id="blxcode-voice-tts-models"
+                current=tts_model.clone()
+                models=models
+                on_change=on_model.clone()
+                on_refresh=move || reload_models(voice_provider.get_untracked())
+            />
+        </section>
+    }
+}
+
 #[component]
-fn QualityBtn(rate: u32, label_key: I18nKey, active: u32) -> impl IntoView {
+fn GenderBtn(
+    target: GenderFilter,
+    label_key: I18nKey,
+    filter: RwSignal<GenderFilter>,
+) -> impl IntoView {
     let i18n = expect_context::<I18nService>();
-    let is_active = move || rate == active;
+    let is_active = move || filter.get() == target;
     view! {
         <button
             type="button"
-            class="voice-pane__choice"
+            class="voice-pane__choice voice-pane__choice--gender"
             class:voice-pane__choice--active=is_active
+            on:click=move |_| filter.set(target)
         >
             {move || i18n.tr(label_key)()}
         </button>
     }
 }
 
+fn gender_label_for(g: VoiceGender) -> &'static str {
+    match g {
+        VoiceGender::Male => "♂",
+        VoiceGender::Female => "♀",
+        VoiceGender::Neutral => "○",
+    }
+}
+
+fn play_b64(audio_ref: NodeRef<leptos::html::Audio>, b64: &str, mime: &str) {
+    let Ok(bytes) = BASE64.decode(b64) else {
+        return;
+    };
+    let arr = Uint8Array::new_with_length(bytes.len() as u32);
+    arr.copy_from(&bytes);
+    let parts = js_sys::Array::new();
+    parts.push(&arr.buffer());
+    let opts = BlobPropertyBag::new();
+    opts.set_type(mime);
+    let Ok(blob) = Blob::new_with_u8_array_sequence_and_options(&parts, &opts) else {
+        return;
+    };
+    let Ok(url) = web_sys::Url::create_object_url_with_blob(&blob) else {
+        return;
+    };
+    if let Some(audio) = audio_ref.get_untracked() {
+        let el: HtmlAudioElement = audio.unchecked_into();
+        let old = el.src();
+        if old.starts_with("blob:") {
+            let _ = web_sys::Url::revoke_object_url(&old);
+        }
+        el.set_src(&url);
+        let _ = el.play();
+    }
+}
+
 // ---------------------------------------------------------------------------
-// TTS section
+// Behavior section
 // ---------------------------------------------------------------------------
 
 #[component]
-fn TtsSection<F, RV>(
+fn BehaviorSection<F>(
     current: VoiceSettings,
-    tts_provider: VoiceProviderKind,
-    tts_model: String,
+    post_flow: PostSttFlow,
     voice_id: String,
     voices: RwSignal<Vec<VoiceEntry>>,
     gender_filter: RwSignal<GenderFilter>,
     tts_enabled: bool,
-    models: RwSignal<Vec<ProviderModelEntry>>,
     save: F,
-    reload_voices: RV,
 ) -> impl IntoView
 where
     F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
-    RV: Fn(VoiceProviderKind) + Send + Sync + 'static + Copy,
 {
     let i18n = expect_context::<I18nService>();
     let audio_ref = NodeRef::<leptos::html::Audio>::new();
 
-    let on_provider = {
-        let current = current.clone();
-        move |p: VoiceProviderKind| {
-            let mut next = current.clone();
-            next.tts.provider = p;
-            save(next);
-            reload_voices(p);
-        }
-    };
-    let on_model = {
+    let on_flow = {
         let current = current.clone();
-        move |m: String| {
+        move |flow: PostSttFlow| {
             let mut next = current.clone();
-            next.tts.model_id = m;
+            next.post_stt_flow = flow;
             save(next);
         }
     };
@@ -437,30 +684,35 @@ where
 
     view! {
         <section class="voice-pane__section">
-            <h3>{move || i18n.tr(I18nKey::VoiceTtsSection)()}</h3>
-
+            <h3>{move || i18n.tr(I18nKey::VoiceBehaviorSection)()}</h3>
             <div class="voice-pane__field">
-                <label>{move || i18n.tr(I18nKey::VoiceProviderField)()}</label>
-                <div class="voice-pane__provider-row">
-                    <ProviderBtn label="OpenAI" target=VoiceProviderKind::Openai active=tts_provider on:click={
-                        let on_provider = on_provider.clone();
-                        move |_| on_provider(VoiceProviderKind::Openai)
-                    } />
+                <label>{move || i18n.tr(I18nKey::VoicePostSttFlow)()}</label>
+                <div class="voice-pane__radio-row">
+                    <button
+                        type="button"
+                        class="voice-pane__choice"
+                        class:voice-pane__choice--active=move || matches!(post_flow, PostSttFlow::AutoSend)
+                        on:click={
+                            let on_flow = on_flow.clone();
+                            move |_| on_flow(PostSttFlow::AutoSend)
+                        }
+                    >
+                        {move || i18n.tr(I18nKey::VoicePostSttAutoSend)()}
+                    </button>
+                    <button
+                        type="button"
+                        class="voice-pane__choice"
+                        class:voice-pane__choice--active=move || matches!(post_flow, PostSttFlow::Draft)
+                        on:click={
+                            let on_flow = on_flow.clone();
+                            move |_| on_flow(PostSttFlow::Draft)
+                        }
+                    >
+                        {move || i18n.tr(I18nKey::VoicePostSttDraft)()}
+                    </button>
                 </div>
             </div>
 
-            <ModelPicker
-                label_key=I18nKey::VoiceModelField
-                datalist_id="blxcode-voice-tts-models"
-                current=tts_model.clone()
-                models=models
-                on_change=on_model.clone()
-                on_refresh={
-                    let tts_provider = tts_provider;
-                    move || reload_voices(tts_provider)
-                }
-            />
-
             <div class="voice-pane__field">
                 <label>{move || i18n.tr(I18nKey::VoiceVoiceField)()}</label>
                 <div class="voice-pane__gender-row">
@@ -544,113 +796,6 @@ where
     }
 }
 
-#[component]
-fn GenderBtn(
-    target: GenderFilter,
-    label_key: I18nKey,
-    filter: RwSignal<GenderFilter>,
-) -> impl IntoView {
-    let i18n = expect_context::<I18nService>();
-    let is_active = move || filter.get() == target;
-    view! {
-        <button
-            type="button"
-            class="voice-pane__choice voice-pane__choice--gender"
-            class:voice-pane__choice--active=is_active
-            on:click=move |_| filter.set(target)
-        >
-            {move || i18n.tr(label_key)()}
-        </button>
-    }
-}
-
-fn gender_label_for(g: VoiceGender) -> &'static str {
-    match g {
-        VoiceGender::Male => "♂",
-        VoiceGender::Female => "♀",
-        VoiceGender::Neutral => "○",
-    }
-}
-
-fn play_b64(audio_ref: NodeRef<leptos::html::Audio>, b64: &str, mime: &str) {
-    let Ok(bytes) = BASE64.decode(b64) else {
-        return;
-    };
-    let arr = Uint8Array::new_with_length(bytes.len() as u32);
-    arr.copy_from(&bytes);
-    let parts = js_sys::Array::new();
-    parts.push(&arr.buffer());
-    let opts = BlobPropertyBag::new();
-    opts.set_type(mime);
-    let Ok(blob) = Blob::new_with_u8_array_sequence_and_options(&parts, &opts) else {
-        return;
-    };
-    let Ok(url) = web_sys::Url::create_object_url_with_blob(&blob) else {
-        return;
-    };
-    if let Some(audio) = audio_ref.get_untracked() {
-        let el: HtmlAudioElement = audio.unchecked_into();
-        let old = el.src();
-        if old.starts_with("blob:") {
-            let _ = web_sys::Url::revoke_object_url(&old);
-        }
-        el.set_src(&url);
-        let _ = el.play();
-    }
-}
-
-// ---------------------------------------------------------------------------
-// Behavior section
-// ---------------------------------------------------------------------------
-
-#[component]
-fn BehaviorSection<F>(current: VoiceSettings, post_flow: PostSttFlow, save: F) -> impl IntoView
-where
-    F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
-{
-    let i18n = expect_context::<I18nService>();
-    let on_flow = {
-        let current = current.clone();
-        move |flow: PostSttFlow| {
-            let mut next = current.clone();
-            next.post_stt_flow = flow;
-            save(next);
-        }
-    };
-    view! {
-        <section class="voice-pane__section">
-            <h3>{move || i18n.tr(I18nKey::VoiceBehaviorSection)()}</h3>
-            <div class="voice-pane__field">
-                <label>{move || i18n.tr(I18nKey::VoicePostSttFlow)()}</label>
-                <div class="voice-pane__radio-row">
-                    <button
-                        type="button"
-                        class="voice-pane__choice"
-                        class:voice-pane__choice--active=move || matches!(post_flow, PostSttFlow::AutoSend)
-                        on:click={
-                            let on_flow = on_flow.clone();
-                            move |_| on_flow(PostSttFlow::AutoSend)
-                        }
-                    >
-                        {move || i18n.tr(I18nKey::VoicePostSttAutoSend)()}
-                    </button>
-                    <button
-                        type="button"
-                        class="voice-pane__choice"
-                        class:voice-pane__choice--active=move || matches!(post_flow, PostSttFlow::Draft)
-                        on:click={
-                            let on_flow = on_flow.clone();
-                            move |_| on_flow(PostSttFlow::Draft)
-                        }
-                    >
-                        {move || i18n.tr(I18nKey::VoicePostSttDraft)()}
-                    </button>
-                </div>
-            </div>
-        </section>
-    }
-}
-
 // Convince the compiler we still need these types (referenced via trait bounds only).
 #[allow(dead_code)]
 fn _ensure_types(_s: SttSettings, _t: TtsSettings) {}

From 075c60d6b24e2b21ec1ab1937962df499516f867 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 06:50:56 +0200
Subject: [PATCH 38/48] fix(voice_settings): ensure voice provider updates on
 settings save

- Updated the `AgentVoiceColumn` to set the voice provider when saving voice settings, ensuring the correct provider is applied.
- Enhanced the save functionality to reflect changes in the voice provider after settings are saved, improving user experience and consistency.
---
 src/workbench/harness_voice_pane/mod.rs | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/workbench/harness_voice_pane/mod.rs b/src/workbench/harness_voice_pane/mod.rs
index 0476c0b..e599203 100644
--- a/src/workbench/harness_voice_pane/mod.rs
+++ b/src/workbench/harness_voice_pane/mod.rs
@@ -151,6 +151,7 @@ pub fn AgentVoiceColumn() -> impl IntoView {
     }
 
     let save = move |patch: VoiceSettings| {
+        voice_provider.set(patch.stt.provider);
         if !is_tauri_shell() {
             settings.set(Some(patch));
             return;
@@ -158,6 +159,7 @@ pub fn AgentVoiceColumn() -> impl IntoView {
         leptos::task::spawn_local(async move {
             match voice_settings_save(patch).await {
                 Ok(v) => {
+                    voice_provider.set(v.stt.provider);
                     settings.set(Some(v));
                     status.set(Some(i18n.tr(I18nKey::ApiKeysSaved)().to_string()));
                 }

From a2e12afeb877a690d5f6e19813914496c141a551 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 07:23:31 +0200
Subject: [PATCH 39/48] feat(agent_voice_column): enhance voice model
 management and layout

- Updated the `AgentVoiceColumn` to improve handling of STT and TTS model IDs, ensuring they are correctly set and saved.
- Refactored the speech section to separate STT and TTS model selection, enhancing clarity and user interaction.
- Introduced loading states for model fetching, improving user feedback during asynchronous operations.
- Adjusted CSS for the agent provider pane to refine layout and spacing, enhancing overall visual organization.
---
 .../agent_provider_pane.css                   |  14 +-
 src/workbench/harness_voice_pane/mod.rs       | 259 +++++++++++-------
 src/workbench/model_picker/mod.rs             |   1 +
 3 files changed, 168 insertions(+), 106 deletions(-)

diff --git a/src/workbench/agent_provider_pane/agent_provider_pane.css b/src/workbench/agent_provider_pane/agent_provider_pane.css
index 9a81a53..97c0fcb 100644
--- a/src/workbench/agent_provider_pane/agent_provider_pane.css
+++ b/src/workbench/agent_provider_pane/agent_provider_pane.css
@@ -23,7 +23,7 @@
 
 .agent-provider-pane__voice-inner {
     display: grid;
-    grid-template-columns: repeat(3, minmax(0, 1fr));
+    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.35fr);
     gap: 0.85rem;
     align-items: start;
 }
@@ -55,6 +55,18 @@
     letter-spacing: 0.02em;
 }
 
+.agent-provider-pane__voice-inner .voice-pane__model-block {
+    gap: 0.4rem;
+}
+
+.agent-provider-pane__voice-inner .voice-pane__model-block + .voice-pane__model-block {
+    margin-top: 0.55rem;
+}
+
+.agent-provider-pane__voice-inner .voice-pane__field {
+    margin-top: 0.65rem;
+}
+
 .agent-provider-pane__col {
     min-width: 0;
     display: flex;
diff --git a/src/workbench/harness_voice_pane/mod.rs b/src/workbench/harness_voice_pane/mod.rs
index e599203..6ec1eb9 100644
--- a/src/workbench/harness_voice_pane/mod.rs
+++ b/src/workbench/harness_voice_pane/mod.rs
@@ -9,7 +9,7 @@ use crate::tauri_bridge::{
     SttSettings, TtsSettings, VoiceEntry, VoiceGender,
     VoiceProviderKind, VoiceSettings,
 };
-use crate::workbench::model_picker::ModelPicker;
+use crate::workbench::agent_model_picker::AgentModelPicker;
 use base64::{engine::general_purpose::STANDARD as BASE64, Engine as _};
 use gloo_timers::future::TimeoutFuture;
 use js_sys::Uint8Array;
@@ -135,11 +135,17 @@ pub fn AgentVoiceColumn() -> impl IntoView {
     let stt_models = RwSignal::new(Vec::<ProviderModelEntry>::new());
     let tts_models = RwSignal::new(Vec::<ProviderModelEntry>::new());
     let voice_provider = RwSignal::new(VoiceProviderKind::Openai);
+    let stt_model_id = RwSignal::new(String::new());
+    let tts_model_id = RwSignal::new(String::new());
+    let stt_loading_models = RwSignal::new(false);
+    let tts_loading_models = RwSignal::new(false);
 
     if is_tauri_shell() {
         leptos::task::spawn_local(async move {
             if let Ok(v) = voice_settings_get().await {
                 voice_provider.set(v.stt.provider);
+                stt_model_id.set(v.stt.model_id.clone());
+                tts_model_id.set(v.tts.model_id.clone());
                 if let Ok(catalog) = voice_provider_voices(v.tts.provider).await {
                     voices.set(catalog.voices);
                 }
@@ -152,6 +158,8 @@ pub fn AgentVoiceColumn() -> impl IntoView {
 
     let save = move |patch: VoiceSettings| {
         voice_provider.set(patch.stt.provider);
+        stt_model_id.set(patch.stt.model_id.clone());
+        tts_model_id.set(patch.tts.model_id.clone());
         if !is_tauri_shell() {
             settings.set(Some(patch));
             return;
@@ -160,6 +168,8 @@ pub fn AgentVoiceColumn() -> impl IntoView {
             match voice_settings_save(patch).await {
                 Ok(v) => {
                     voice_provider.set(v.stt.provider);
+                    stt_model_id.set(v.stt.model_id.clone());
+                    tts_model_id.set(v.tts.model_id.clone());
                     settings.set(Some(v));
                     status.set(Some(i18n.tr(I18nKey::ApiKeysSaved)().to_string()));
                 }
@@ -168,23 +178,27 @@ pub fn AgentVoiceColumn() -> impl IntoView {
         });
     };
 
-    let reload_voices = move |provider: VoiceProviderKind| {
+    let reload_tts_models = move |provider: VoiceProviderKind| {
+        tts_loading_models.set(true);
         leptos::task::spawn_local(async move {
             if let Ok(catalog) = voice_provider_voices(provider).await {
                 voices.set(catalog.voices);
             }
             fetch_models_for(provider, ModelKind::Tts, tts_models).await;
+            tts_loading_models.set(false);
         });
     };
 
     let reload_stt_models = move |provider: VoiceProviderKind| {
+        stt_loading_models.set(true);
         leptos::task::spawn_local(async move {
             fetch_models_for(provider, ModelKind::Stt, stt_models).await;
+            stt_loading_models.set(false);
         });
     };
 
     let reload_all_for_provider = move |provider: VoiceProviderKind| {
-        reload_voices(provider);
+        reload_tts_models(provider);
         reload_stt_models(provider);
     };
 
@@ -208,8 +222,6 @@ pub fn AgentVoiceColumn() -> impl IntoView {
                         return view! { <></> }.into_any();
                     };
 
-                    let stt_model = current.stt.model_id.clone();
-                    let tts_model = current.tts.model_id.clone();
                     let sample_rate = current.stt.sample_rate_hz;
                     let voice_id = current.tts.voice.clone();
                     let post_flow = current.post_stt_flow;
@@ -242,22 +254,19 @@ pub fn AgentVoiceColumn() -> impl IntoView {
                                 />
                             </label>
 
-                            <SttSection
-                                current=current.clone()
+                            <SpeechSection
+                                settings=settings
                                 voice_provider=voice_provider
-                                stt_model=stt_model.clone()
+                                stt_model_id=stt_model_id
+                                tts_model_id=tts_model_id
                                 sample_rate=sample_rate
-                                models=stt_models
-                                save=save
-                                reload_models=reload_stt_models
-                            />
-                            <TtsSection
-                                current=current.clone()
-                                voice_provider=voice_provider
-                                tts_model=tts_model.clone()
-                                models=tts_models
+                                stt_models=stt_models
+                                tts_models=tts_models
+                                stt_loading_models=stt_loading_models
+                                tts_loading_models=tts_loading_models
                                 save=save
-                                reload_models=reload_voices
+                                reload_stt_models=reload_stt_models
+                                reload_tts_models=reload_tts_models
                             />
                             <BehaviorSection
                                 current=current.clone()
@@ -433,69 +442,153 @@ fn VoiceProviderPicker(
 }
 
 // ---------------------------------------------------------------------------
-// STT section
+// Speech column (STT + TTS models, then recording quality)
 // ---------------------------------------------------------------------------
 
 #[component]
-fn SttSection<F, RM>(
-    current: VoiceSettings,
+fn SpeechSection<F, RS, RT>(
+    settings: RwSignal<Option<VoiceSettings>>,
     voice_provider: RwSignal<VoiceProviderKind>,
-    stt_model: String,
+    stt_model_id: RwSignal<String>,
+    tts_model_id: RwSignal<String>,
     sample_rate: u32,
-    models: RwSignal<Vec<ProviderModelEntry>>,
+    stt_models: RwSignal<Vec<ProviderModelEntry>>,
+    tts_models: RwSignal<Vec<ProviderModelEntry>>,
+    stt_loading_models: RwSignal<bool>,
+    tts_loading_models: RwSignal<bool>,
     save: F,
-    reload_models: RM,
+    reload_stt_models: RS,
+    reload_tts_models: RT,
 ) -> impl IntoView
 where
     F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
-    RM: Fn(VoiceProviderKind) + Send + Sync + 'static + Copy,
+    RS: Fn(VoiceProviderKind) + Send + Sync + 'static + Copy,
+    RT: Fn(VoiceProviderKind) + Send + Sync + 'static + Copy,
 {
     let i18n = expect_context::<I18nService>();
-    let on_model = {
-        let current = current.clone();
-        move |m: String| {
-            let mut next = current.clone();
-            next.stt.model_id = m;
-            save(next);
-        }
-    };
-    let on_rate = {
-        let current = current.clone();
-        move |r: u32| {
-            let mut next = current.clone();
-            next.stt.sample_rate_hz = r;
-            save(next);
-        }
+
+    let on_stt_model = Callback::new(move |m: String| {
+        let Some(mut next) = settings.get_untracked() else {
+            return;
+        };
+        stt_model_id.set(m.clone());
+        next.stt.model_id = m;
+        save(next);
+    });
+
+    let on_tts_model = Callback::new(move |m: String| {
+        let Some(mut next) = settings.get_untracked() else {
+            return;
+        };
+        tts_model_id.set(m.clone());
+        next.tts.model_id = m;
+        save(next);
+    });
+
+    let on_rate = move |r: u32| {
+        let Some(mut next) = settings.get_untracked() else {
+            return;
+        };
+        next.stt.sample_rate_hz = r;
+        save(next);
     };
 
     view! {
-        <section class="voice-pane__section">
+        <section class="voice-pane__section voice-pane__section--speech">
             <h3>{move || i18n.tr(I18nKey::VoiceSttSection)()}</h3>
 
-            <ModelPicker
-                label_key=I18nKey::VoiceModelField
-                datalist_id="blxcode-voice-stt-models"
-                current=stt_model.clone()
-                models=models
-                on_change=on_model.clone()
-                on_refresh=move || reload_models(voice_provider.get_untracked())
-            />
+            <label class="harness-stack voice-pane__model-block">
+                <span class="harness-field-label">
+                    <span class="harness-field-label__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuAudioLines width="0.82rem" height="0.82rem" />
+                    </span>
+                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::VoiceSttSection)()}</span>
+                </span>
+                <AgentModelPicker
+                    model_id=stt_model_id
+                    model_entries=stt_models
+                    loading_models=stt_loading_models
+                    option_id_prefix="voice-stt-model"
+                    on_change=on_stt_model
+                />
+                <div class="agent-provider-pane__actions">
+                    <button
+                        type="button"
+                        class="workbench-mini-btn"
+                        disabled=move || stt_loading_models.get() || !is_tauri_shell()
+                        on:click=move |_| reload_stt_models(voice_provider.get_untracked())
+                    >
+                        <span class="harness-btn-inline">
+                            <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
+                            <span>{move || if stt_loading_models.get() {
+                                i18n.tr(I18nKey::AgModelsLoading)().to_string()
+                            } else {
+                                i18n.tr(I18nKey::AgModelsRefresh)().to_string()
+                            }}</span>
+                        </span>
+                    </button>
+                    <small class="harness-muted">
+                        {move || {
+                            let n = stt_models.get().len();
+                            if n == 0 {
+                                String::new()
+                            } else {
+                                format!("{n} entries")
+                            }
+                        }}
+                    </small>
+                </div>
+            </label>
+
+            <label class="harness-stack voice-pane__model-block">
+                <span class="harness-field-label">
+                    <span class="harness-field-label__icon" aria-hidden="true">
+                        <LxIcon icon=icondata::LuVolume2 width="0.82rem" height="0.82rem" />
+                    </span>
+                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::VoiceTtsSection)()}</span>
+                </span>
+                <AgentModelPicker
+                    model_id=tts_model_id
+                    model_entries=tts_models
+                    loading_models=tts_loading_models
+                    option_id_prefix="voice-tts-model"
+                    on_change=on_tts_model
+                />
+                <div class="agent-provider-pane__actions">
+                    <button
+                        type="button"
+                        class="workbench-mini-btn"
+                        disabled=move || tts_loading_models.get() || !is_tauri_shell()
+                        on:click=move |_| reload_tts_models(voice_provider.get_untracked())
+                    >
+                        <span class="harness-btn-inline">
+                            <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
+                            <span>{move || if tts_loading_models.get() {
+                                i18n.tr(I18nKey::AgModelsLoading)().to_string()
+                            } else {
+                                i18n.tr(I18nKey::AgModelsRefresh)().to_string()
+                            }}</span>
+                        </span>
+                    </button>
+                    <small class="harness-muted">
+                        {move || {
+                            let n = tts_models.get().len();
+                            if n == 0 {
+                                String::new()
+                            } else {
+                                format!("{n} entries")
+                            }
+                        }}
+                    </small>
+                </div>
+            </label>
 
             <div class="voice-pane__field">
                 <label>{move || i18n.tr(I18nKey::VoiceQualityField)()}</label>
                 <div class="voice-pane__quality-row">
-                    <QualityBtn rate=16000 label_key=I18nKey::VoiceQualityLow active=sample_rate on:click={
-                        let on_rate = on_rate.clone();
-                        move |_| on_rate(16_000)
-                    } />
-                    <QualityBtn rate=24000 label_key=I18nKey::VoiceQualityStandard active=sample_rate on:click={
-                        let on_rate = on_rate.clone();
-                        move |_| on_rate(24_000)
-                    } />
-                    <QualityBtn rate=48000 label_key=I18nKey::VoiceQualityHigh active=sample_rate on:click={
-                        let on_rate = on_rate.clone();
-                        move |_| on_rate(48_000)
-                    } />
+                    <QualityBtn rate=16000 label_key=I18nKey::VoiceQualityLow active=sample_rate on:click=move |_| on_rate(16_000) />
+                    <QualityBtn rate=24000 label_key=I18nKey::VoiceQualityStandard active=sample_rate on:click=move |_| on_rate(24_000) />
+                    <QualityBtn rate=48000 label_key=I18nKey::VoiceQualityHigh active=sample_rate on:click=move |_| on_rate(48_000) />
                 </div>
                 <p class="voice-pane__hint">{move || i18n.tr(I18nKey::VoiceQualityHint)()}</p>
                 <p class="voice-pane__hint voice-pane__hint--small">
@@ -526,50 +619,6 @@ fn QualityBtn(rate: u32, label_key: I18nKey, active: u32) -> impl IntoView {
     }
 }
 
-// ---------------------------------------------------------------------------
-// TTS section
-// ---------------------------------------------------------------------------
-
-#[component]
-fn TtsSection<F, RV>(
-    current: VoiceSettings,
-    voice_provider: RwSignal<VoiceProviderKind>,
-    tts_model: String,
-    models: RwSignal<Vec<ProviderModelEntry>>,
-    save: F,
-    reload_models: RV,
-) -> impl IntoView
-where
-    F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
-    RV: Fn(VoiceProviderKind) + Send + Sync + 'static + Copy,
-{
-    let i18n = expect_context::<I18nService>();
-
-    let on_model = {
-        let current = current.clone();
-        move |m: String| {
-            let mut next = current.clone();
-            next.tts.model_id = m;
-            save(next);
-        }
-    };
-
-    view! {
-        <section class="voice-pane__section">
-            <h3>{move || i18n.tr(I18nKey::VoiceTtsSection)()}</h3>
-
-            <ModelPicker
-                label_key=I18nKey::VoiceModelField
-                datalist_id="blxcode-voice-tts-models"
-                current=tts_model.clone()
-                models=models
-                on_change=on_model.clone()
-                on_refresh=move || reload_models(voice_provider.get_untracked())
-            />
-        </section>
-    }
-}
-
 #[component]
 fn GenderBtn(
     target: GenderFilter,
diff --git a/src/workbench/model_picker/mod.rs b/src/workbench/model_picker/mod.rs
index 9dd6b45..e4913e1 100644
--- a/src/workbench/model_picker/mod.rs
+++ b/src/workbench/model_picker/mod.rs
@@ -20,6 +20,7 @@ use leptos::prelude::*;
 use leptos_icons::Icon as LxIcon;
 use wasm_bindgen::JsCast;
 
+#[allow(dead_code)]
 #[component]
 pub fn ModelPicker<F, R>(
     label_key: I18nKey,

From 85fabd7a2061801538b303b35d3a907899e8c82c Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 07:55:40 +0200
Subject: [PATCH 40/48] feat(voice_provider): add AWS support and localization
 updates

- Introduced AWS as a new voice provider in the `VoiceProviderKind` enum, enhancing the application's voice capabilities.
- Updated localization files to include AWS provider keys in multiple languages, improving internationalization support.
- Enhanced the `AgentVoiceColumn` and related components to handle AWS-specific voice settings and model management.
- Refactored voice provider functions to accommodate AWS, ensuring proper integration and user experience.
---
 src-tauri/src/voice/settings.rs               |  19 +-
 src-tauri/src/voice/stt.rs                    |   7 +
 src-tauri/src/voice/tts.rs                    |   5 +
 src-tauri/src/voice/voices.rs                 |  23 ++
 src/i18n/keys.rs                              |   1 +
 src/i18n/locales/de_de.rs                     |   1 +
 src/i18n/locales/en_us.rs                     |   1 +
 src/i18n/locales/es_es.rs                     |   1 +
 src/i18n/locales/fr_fr.rs                     |   1 +
 src/i18n/locales/hu_hu.rs                     |   1 +
 src/i18n/locales/it_it.rs                     |   1 +
 src/i18n/locales/ja_jp.rs                     |   1 +
 src/i18n/locales/ko_kr.rs                     |   1 +
 src/i18n/locales/pl_pl.rs                     |   1 +
 src/i18n/locales/pt_br.rs                     |   1 +
 src/i18n/locales/ru_ru.rs                     |   1 +
 src/i18n/locales/zh_cn.rs                     |   1 +
 src/i18n/locales/zh_tw.rs                     |   1 +
 src/tauri_bridge.rs                           |   2 +
 .../agent_provider_pane.css                   |  10 +
 src/workbench/harness_voice_pane/mod.rs       | 300 +++++++++++++-----
 21 files changed, 290 insertions(+), 90 deletions(-)

diff --git a/src-tauri/src/voice/settings.rs b/src-tauri/src/voice/settings.rs
index 607f311..8030232 100644
--- a/src-tauri/src/voice/settings.rs
+++ b/src-tauri/src/voice/settings.rs
@@ -12,6 +12,7 @@ use crate::agent_settings;
 pub enum VoiceProviderKind {
     Openai,
     Openrouter,
+    Aws,
 }
 
 impl VoiceProviderKind {
@@ -19,6 +20,7 @@ impl VoiceProviderKind {
         match self {
             Self::Openai => "openai",
             Self::Openrouter => "openrouter",
+            Self::Aws => "aws",
         }
     }
 }
@@ -157,9 +159,16 @@ pub fn save(app: &AppHandle, settings: &VoiceSettings) -> Result<VoiceSettings,
 /// Resolve the API key used for a voice provider, piggybacking on the
 /// existing agent provider keyring entries.
 pub fn provider_key(app: &AppHandle, provider: VoiceProviderKind) -> Result<String, String> {
-    let agent_provider = match provider {
-        VoiceProviderKind::Openai => agent_settings::AgentProviderKind::Openai,
-        VoiceProviderKind::Openrouter => agent_settings::AgentProviderKind::Openrouter,
-    };
-    agent_settings::provider_key_pub(app, agent_provider)
+    match provider {
+        VoiceProviderKind::Aws => crate::media_keys::resolve_key(crate::media_keys::MediaKeyKind::AwsPolly)
+            .ok_or_else(|| {
+                "AWS API key missing. Add it under Settings → API Keys (Amazon Polly).".into()
+            }),
+        VoiceProviderKind::Openai => {
+            agent_settings::provider_key_pub(app, agent_settings::AgentProviderKind::Openai)
+        }
+        VoiceProviderKind::Openrouter => {
+            agent_settings::provider_key_pub(app, agent_settings::AgentProviderKind::Openrouter)
+        }
+    }
 }
diff --git a/src-tauri/src/voice/stt.rs b/src-tauri/src/voice/stt.rs
index 40f9110..6430532 100644
--- a/src-tauri/src/voice/stt.rs
+++ b/src-tauri/src/voice/stt.rs
@@ -21,6 +21,7 @@ fn base_url(provider: VoiceProviderKind) -> &'static str {
     match provider {
         VoiceProviderKind::Openai => "https://api.openai.com/v1",
         VoiceProviderKind::Openrouter => "https://openrouter.ai/api/v1",
+        VoiceProviderKind::Aws => unreachable!("handled above"),
     }
 }
 
@@ -31,6 +32,12 @@ pub async fn transcribe_wav(
     wav_path: &Path,
     language: Option<&str>,
 ) -> Result<String, String> {
+    if provider == VoiceProviderKind::Aws {
+        let _ = (model, api_key, wav_path, language);
+        return Err(
+            "AWS Transcribe STT ist in den Einstellungen wählbar; die Laufzeit-Anbindung folgt.".into(),
+        );
+    }
     let bytes = tokio::fs::read(wav_path)
         .await
         .map_err(|e| format!("read {}: {e}", wav_path.display()))?;
diff --git a/src-tauri/src/voice/tts.rs b/src-tauri/src/voice/tts.rs
index d34ecc1..d423ea8 100644
--- a/src-tauri/src/voice/tts.rs
+++ b/src-tauri/src/voice/tts.rs
@@ -14,6 +14,11 @@ pub async fn synthesize(
     text: &str,
     api_key: &str,
 ) -> Result<Vec<u8>, String> {
+    if provider == VoiceProviderKind::Aws {
+        return Err(
+            "AWS Polly TTS ist in den Einstellungen wählbar; die Laufzeit-Anbindung folgt.".into(),
+        );
+    }
     if !matches!(provider, VoiceProviderKind::Openai) {
         return Err(format!(
             "TTS provider {} ist (noch) nicht unterstützt.",
diff --git a/src-tauri/src/voice/voices.rs b/src-tauri/src/voice/voices.rs
index 807fc73..ff123fd 100644
--- a/src-tauri/src/voice/voices.rs
+++ b/src-tauri/src/voice/voices.rs
@@ -26,6 +26,7 @@ pub fn voices_for(provider: VoiceProviderKind) -> Vec<VoiceEntry> {
     match provider {
         VoiceProviderKind::Openai => openai_voices(),
         VoiceProviderKind::Openrouter => Vec::new(),
+        VoiceProviderKind::Aws => aws_polly_voices(),
     }
 }
 
@@ -50,3 +51,25 @@ fn openai_voices() -> Vec<VoiceEntry> {
         })
         .collect()
 }
+
+fn aws_polly_voices() -> Vec<VoiceEntry> {
+    let raw: &[(&str, &str, VoiceGender)] = &[
+        ("Joanna", "Joanna", VoiceGender::Female),
+        ("Matthew", "Matthew", VoiceGender::Male),
+        ("Amy", "Amy", VoiceGender::Female),
+        ("Brian", "Brian", VoiceGender::Male),
+        ("Ivy", "Ivy", VoiceGender::Female),
+        ("Justin", "Justin", VoiceGender::Male),
+        ("Kendra", "Kendra", VoiceGender::Female),
+        ("Kimberly", "Kimberly", VoiceGender::Female),
+        ("Salli", "Salli", VoiceGender::Female),
+        ("Joey", "Joey", VoiceGender::Male),
+    ];
+    raw.iter()
+        .map(|(id, label, gender)| VoiceEntry {
+            id: (*id).to_string(),
+            label: (*label).to_string(),
+            gender: *gender,
+        })
+        .collect()
+}
diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index 2c5d2b0..d3bfb63 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -370,6 +370,7 @@ pub enum I18nKey {
     AgProviderAnthropic,
     AgProviderOpenai,
     AgProviderFal,
+    AgProviderAws,
     AgModelField,
     AgModelCustomField,
     AgThinkingField,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index 76fa082..48a4248 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -323,6 +323,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "Such-Anbieter",
         I18nKey::ApiKeysImageVideoSubhead => "Bild / Video & Sprache",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Gespeichert.",
         I18nKey::ApiKeysDiscard => "Verwerfen",
         I18nKey::ApiKeysUnsaved => "Nicht gespeicherte Änderungen",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index 773686f..f4f2c11 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -361,6 +361,7 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::ApiKeysSearchSubhead => "Search Providers",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Saved.",
         I18nKey::ApiKeysDiscard => "Discard",
         I18nKey::ApiKeysUnsaved => "Unsaved changes",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index 9c8128f..6888a17 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -323,6 +323,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "Proveedores de búsqueda",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Guardado.",
         I18nKey::ApiKeysDiscard => "Descartar",
         I18nKey::ApiKeysUnsaved => "Cambios sin guardar",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index bac6bfe..b7d8836 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -325,6 +325,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "Fournisseurs de recherche",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Enregistré.",
         I18nKey::ApiKeysDiscard => "Annuler",
         I18nKey::ApiKeysUnsaved => "Modifications non enregistrées",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index f3d2bb6..09ae887 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -323,6 +323,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "Keresőszolgáltatók",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Mentve.",
         I18nKey::ApiKeysDiscard => "Elvetés",
         I18nKey::ApiKeysUnsaved => "Nem mentett módosítások",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index e2472e1..ce9b29c 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -323,6 +323,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "Provider di ricerca",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Salvato.",
         I18nKey::ApiKeysDiscard => "Annulla modifiche",
         I18nKey::ApiKeysUnsaved => "Modifiche non salvate",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index 6c611ca..6c5a5b7 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -317,6 +317,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "検索プロバイダー",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "保存しました。",
         I18nKey::ApiKeysDiscard => "破棄",
         I18nKey::ApiKeysUnsaved => "未保存の変更",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index d36d57a..554c76d 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -317,6 +317,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "검색 제공업체",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "저장됨.",
         I18nKey::ApiKeysDiscard => "취소",
         I18nKey::ApiKeysUnsaved => "저장되지 않은 변경",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index c3d5de5..cb542ac 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -321,6 +321,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "Dostawcy wyszukiwania",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Zapisano.",
         I18nKey::ApiKeysDiscard => "Odrzuć",
         I18nKey::ApiKeysUnsaved => "Niezapisane zmiany",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index d7c91c2..b486b44 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -323,6 +323,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "Provedores de busca",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Salvo.",
         I18nKey::ApiKeysDiscard => "Descartar",
         I18nKey::ApiKeysUnsaved => "Alterações não salvas",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index 729ce6e..da94a17 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -321,6 +321,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "Поисковые поставщики",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Сохранено.",
         I18nKey::ApiKeysDiscard => "Отменить",
         I18nKey::ApiKeysUnsaved => "Несохранённые изменения",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index d6348ad..fcd2ef0 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -315,6 +315,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "搜索提供商",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "已保存。",
         I18nKey::ApiKeysDiscard => "放弃",
         I18nKey::ApiKeysUnsaved => "未保存的更改",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index f3e4312..d755257 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -315,6 +315,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysSearchSubhead => "搜尋供應商",
         I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
         I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "已儲存。",
         I18nKey::ApiKeysDiscard => "捨棄",
         I18nKey::ApiKeysUnsaved => "未儲存的變更",
diff --git a/src/tauri_bridge.rs b/src/tauri_bridge.rs
index 5c34d58..0521dae 100644
--- a/src/tauri_bridge.rs
+++ b/src/tauri_bridge.rs
@@ -1770,6 +1770,7 @@ pub async fn agent_drain_turn_opts(
 pub enum VoiceProviderKind {
     Openai,
     Openrouter,
+    Aws,
 }
 
 impl VoiceProviderKind {
@@ -1778,6 +1779,7 @@ impl VoiceProviderKind {
         match self {
             Self::Openai => "openai",
             Self::Openrouter => "openrouter",
+            Self::Aws => "aws",
         }
     }
 }
diff --git a/src/workbench/agent_provider_pane/agent_provider_pane.css b/src/workbench/agent_provider_pane/agent_provider_pane.css
index 97c0fcb..3f88860 100644
--- a/src/workbench/agent_provider_pane/agent_provider_pane.css
+++ b/src/workbench/agent_provider_pane/agent_provider_pane.css
@@ -30,9 +30,19 @@
 
 .agent-provider-pane__voice-provider {
     grid-column: 1 / -1;
+    display: flex;
+    flex-direction: column;
+    gap: 0.45rem;
     margin: 0 0 0.15rem;
 }
 
+.agent-provider-pane__voice-inner .voice-pane__section--speech {
+    display: flex;
+    flex-direction: column;
+    gap: 0.45rem;
+    min-width: 0;
+}
+
 @media (max-width: 900px) {
     .agent-provider-pane__voice-inner {
         grid-template-columns: 1fr;
diff --git a/src/workbench/harness_voice_pane/mod.rs b/src/workbench/harness_voice_pane/mod.rs
index 6ec1eb9..c785246 100644
--- a/src/workbench/harness_voice_pane/mod.rs
+++ b/src/workbench/harness_voice_pane/mod.rs
@@ -4,10 +4,11 @@
 use crate::i18n::I18nKey;
 use crate::service::I18nService;
 use crate::tauri_bridge::{
-    agent_provider_models, is_tauri_shell, voice_provider_voices, voice_settings_get,
-    voice_settings_save, voice_tts_preview, AgentProviderKind, PostSttFlow, ProviderModelEntry,
-    SttSettings, TtsSettings, VoiceEntry, VoiceGender,
-    VoiceProviderKind, VoiceSettings,
+    agent_provider_models, agent_settings_get, api_keys_status, is_tauri_shell,
+    voice_provider_voices, voice_settings_get, voice_settings_save, voice_tts_preview,
+    AgentProviderKind, AgentProviderSettingsView, ApiKeyEntry, ApiKeysStatus, PostSttFlow,
+    ProviderModelEntry, SttSettings, TtsSettings, VoiceEntry, VoiceGender, VoiceProviderKind,
+    VoiceSettings,
 };
 use crate::workbench::agent_model_picker::AgentModelPicker;
 use base64::{engine::general_purpose::STANDARD as BASE64, Engine as _};
@@ -34,10 +35,86 @@ impl ModelKind {
     }
 }
 
-fn voice_to_agent_provider(v: VoiceProviderKind) -> AgentProviderKind {
+fn voice_to_agent_provider(v: VoiceProviderKind) -> Option<AgentProviderKind> {
     match v {
-        VoiceProviderKind::Openai => AgentProviderKind::Openai,
-        VoiceProviderKind::Openrouter => AgentProviderKind::Openrouter,
+        VoiceProviderKind::Openai => Some(AgentProviderKind::Openai),
+        VoiceProviderKind::Openrouter => Some(AgentProviderKind::Openrouter),
+        VoiceProviderKind::Aws => None,
+    }
+}
+
+fn voice_model_entry(id: &str, label: &str, description: &str) -> ProviderModelEntry {
+    ProviderModelEntry {
+        id: id.into(),
+        label: label.into(),
+        description: Some(description.into()),
+        pricing: None,
+    }
+}
+
+fn curated_voice_models(provider: VoiceProviderKind, kind: ModelKind) -> Vec<ProviderModelEntry> {
+    if provider != VoiceProviderKind::Aws {
+        return Vec::new();
+    }
+    match kind {
+        ModelKind::Stt => vec![voice_model_entry(
+            "amazon-transcribe",
+            "Amazon Transcribe",
+            "AWS speech-to-text (curated list).",
+        )],
+        ModelKind::Tts => vec![
+            voice_model_entry("neural", "Polly Neural", "Neural TTS engine."),
+            voice_model_entry("standard", "Polly Standard", "Standard TTS engine."),
+        ],
+    }
+}
+
+fn media_key_entry<'a>(api_keys: &'a ApiKeysStatus, kind: &str) -> Option<&'a ApiKeyEntry> {
+    api_keys.entries.iter().find(|e| e.kind == kind)
+}
+
+fn voice_provider_key_status(
+    i18n: &I18nService,
+    agent_settings: Option<&AgentProviderSettingsView>,
+    api_keys: Option<&ApiKeysStatus>,
+    provider: VoiceProviderKind,
+) -> String {
+    if provider == VoiceProviderKind::Aws {
+        let Some(entry) = api_keys.and_then(|s| media_key_entry(s, "aws_polly")) else {
+            return i18n.tr(I18nKey::AgApiKeyMissing)().to_string();
+        };
+        if entry.configured {
+            if let Some(mask) = entry.masked_value.as_ref() {
+                format!("{} ({mask})", i18n.tr(I18nKey::AgApiKeyConfigured)())
+            } else {
+                i18n.tr(I18nKey::AgApiKeyConfigured)().to_string()
+            }
+        } else {
+            i18n.tr(I18nKey::AgApiKeyMissing)().to_string()
+        }
+    } else if let (Some(view), Some(agent)) = (agent_settings, voice_to_agent_provider(provider)) {
+        let configured = view
+            .key_statuses
+            .iter()
+            .find(|s| s.provider == agent)
+            .map(|s| s.configured)
+            .unwrap_or(false);
+        if configured {
+            let mask = view
+                .key_statuses
+                .iter()
+                .find(|s| s.provider == agent)
+                .and_then(|s| s.masked_value.clone());
+            if let Some(mask) = mask {
+                format!("{} ({mask})", i18n.tr(I18nKey::AgApiKeyConfigured)())
+            } else {
+                i18n.tr(I18nKey::AgApiKeyConfigured)().to_string()
+            }
+        } else {
+            i18n.tr(I18nKey::AgApiKeyMissing)().to_string()
+        }
+    } else {
+        i18n.tr(I18nKey::AgApiKeyMissing)().to_string()
     }
 }
 
@@ -46,7 +123,14 @@ async fn fetch_models_for(
     kind: ModelKind,
     out: RwSignal<Vec<ProviderModelEntry>>,
 ) {
-    let agent_provider = voice_to_agent_provider(provider);
+    if provider == VoiceProviderKind::Aws {
+        out.set(curated_voice_models(provider, kind));
+        return;
+    }
+    let Some(agent_provider) = voice_to_agent_provider(provider) else {
+        out.set(Vec::new());
+        return;
+    };
     let all = match agent_provider_models(agent_provider).await {
         Ok(resp) => resp.entries,
         Err(_) => Vec::new(),
@@ -84,14 +168,19 @@ impl GenderFilter {
     }
 }
 
-fn voice_providers() -> [VoiceProviderKind; 2] {
-    [VoiceProviderKind::Openai, VoiceProviderKind::Openrouter]
+fn voice_providers() -> [VoiceProviderKind; 3] {
+    [
+        VoiceProviderKind::Openai,
+        VoiceProviderKind::Openrouter,
+        VoiceProviderKind::Aws,
+    ]
 }
 
 fn voice_provider_icon_url(provider: VoiceProviderKind) -> &'static str {
     match provider {
         VoiceProviderKind::Openai => "/public/brand-icons/openai.svg",
         VoiceProviderKind::Openrouter => "/public/brand-icons/openrouter.svg",
+        VoiceProviderKind::Aws => "/public/brand-icons/aws.svg",
     }
 }
 
@@ -99,10 +188,31 @@ fn voice_provider_label(i18n: &I18nService, provider: VoiceProviderKind) -> Stri
     let key = match provider {
         VoiceProviderKind::Openai => I18nKey::AgProviderOpenai,
         VoiceProviderKind::Openrouter => I18nKey::AgProviderOpenrouter,
+        VoiceProviderKind::Aws => I18nKey::AgProviderAws,
     };
     i18n.tr(key)().to_string()
 }
 
+fn apply_voice_provider_defaults(next: &mut VoiceSettings, provider: VoiceProviderKind) {
+    if provider == VoiceProviderKind::Aws {
+        if !next.stt.model_id.contains("transcribe") {
+            next.stt.model_id = "amazon-transcribe".into();
+        }
+        if !matches!(next.tts.model_id.as_str(), "neural" | "standard") {
+            next.tts.model_id = "neural".into();
+        }
+        if next.tts.voice.is_empty() || openai_voice_ids().contains(&next.tts.voice.as_str()) {
+            next.tts.voice = "Joanna".into();
+        }
+    }
+}
+
+fn openai_voice_ids() -> &'static [&'static str] {
+    &[
+        "alloy", "ash", "ballad", "coral", "echo", "fable", "nova", "onyx", "sage", "shimmer",
+    ]
+}
+
 fn focus_voice_provider_option(provider: VoiceProviderKind) {
     let id = format!("voice-provider-option-{}", provider.as_str());
     if let Some(doc) = web_sys::window().and_then(|w| w.document()) {
@@ -129,6 +239,8 @@ fn prev_voice_provider(provider: VoiceProviderKind) -> VoiceProviderKind {
 pub fn AgentVoiceColumn() -> impl IntoView {
     let i18n = expect_context::<I18nService>();
     let settings = RwSignal::new(Option::<VoiceSettings>::None);
+    let agent_settings = RwSignal::new(Option::<AgentProviderSettingsView>::None);
+    let api_keys = RwSignal::new(Option::<ApiKeysStatus>::None);
     let voices = RwSignal::new(Vec::<VoiceEntry>::new());
     let gender_filter = RwSignal::new(GenderFilter::All);
     let status = RwSignal::new(Option::<String>::None);
@@ -142,6 +254,12 @@ pub fn AgentVoiceColumn() -> impl IntoView {
 
     if is_tauri_shell() {
         leptos::task::spawn_local(async move {
+            if let Ok(view) = agent_settings_get().await {
+                agent_settings.set(Some(view));
+            }
+            if let Ok(keys) = api_keys_status().await {
+                api_keys.set(Some(keys));
+            }
             if let Ok(v) = voice_settings_get().await {
                 voice_provider.set(v.stt.provider);
                 stt_model_id.set(v.stt.model_id.clone());
@@ -234,6 +352,9 @@ pub fn AgentVoiceColumn() -> impl IntoView {
                             let mut next = current.clone();
                             next.stt.provider = p;
                             next.tts.provider = p;
+                            apply_voice_provider_defaults(&mut next, p);
+                            stt_model_id.set(next.stt.model_id.clone());
+                            tts_model_id.set(next.tts.model_id.clone());
                             save(next);
                             reload_all_for_provider(p);
                         }
@@ -241,18 +362,33 @@ pub fn AgentVoiceColumn() -> impl IntoView {
 
                     view! {
                         <div class="agent-provider-pane__voice-inner">
-                            <label class="agent-provider-pane__field agent-provider-pane__voice-provider">
-                                <span class="harness-field-label">
-                                    <span class="harness-field-label__icon" aria-hidden="true">
-                                        <LxIcon icon=icondata::LuPlug width="0.82rem" height="0.82rem" />
+                            <div class="agent-provider-pane__voice-provider">
+                                <label class="agent-provider-pane__field">
+                                    <span class="harness-field-label">
+                                        <span class="harness-field-label__icon" aria-hidden="true">
+                                            <LxIcon icon=icondata::LuPlug width="0.82rem" height="0.82rem" />
+                                        </span>
+                                        <span class="harness-field-label__text">{move || i18n.tr(I18nKey::AgProviderField)()}</span>
+                                    </span>
+                                    <VoiceProviderPicker
+                                        selected_provider=voice_provider
+                                        on_select=Callback::new(on_voice_provider)
+                                    />
+                                </label>
+                                <div class="agent-provider-pane__key-row harness-muted">
+                                    <span>{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</span>
+                                    <span class="agent-provider-pane__key-status">
+                                        {move || {
+                                            voice_provider_key_status(
+                                                &i18n,
+                                                agent_settings.get().as_ref(),
+                                                api_keys.get().as_ref(),
+                                                voice_provider.get(),
+                                            )
+                                        }}
                                     </span>
-                                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::VoiceProviderField)()}</span>
-                                </span>
-                                <VoiceProviderPicker
-                                    selected_provider=voice_provider
-                                    on_select=Callback::new(on_voice_provider)
-                                />
-                            </label>
+                                </div>
+                            </div>
 
                             <SpeechSection
                                 settings=settings
@@ -493,16 +629,25 @@ where
         save(next);
     };
 
+    let models_source_hint = move || {
+        if voice_provider.get() == VoiceProviderKind::Aws {
+            i18n.tr(I18nKey::AgModelsSourceCurated)().to_string()
+        } else {
+            i18n.tr(I18nKey::AgModelsSourceLive)().to_string()
+        }
+    };
+
     view! {
         <section class="voice-pane__section voice-pane__section--speech">
-            <h3>{move || i18n.tr(I18nKey::VoiceSttSection)()}</h3>
-
-            <label class="harness-stack voice-pane__model-block">
+            <label class="harness-stack">
                 <span class="harness-field-label">
-                    <span class="harness-field-label__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuAudioLines width="0.82rem" height="0.82rem" />
+                    <span class="harness-field-label__text">
+                        {move || format!(
+                            "{} — {}",
+                            i18n.tr(I18nKey::AgModelField)(),
+                            i18n.tr(I18nKey::VoiceSttSection)()
+                        )}
                     </span>
-                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::VoiceSttSection)()}</span>
                 </span>
                 <AgentModelPicker
                     model_id=stt_model_id
@@ -511,41 +656,35 @@ where
                     option_id_prefix="voice-stt-model"
                     on_change=on_stt_model
                 />
-                <div class="agent-provider-pane__actions">
-                    <button
-                        type="button"
-                        class="workbench-mini-btn"
-                        disabled=move || stt_loading_models.get() || !is_tauri_shell()
-                        on:click=move |_| reload_stt_models(voice_provider.get_untracked())
-                    >
-                        <span class="harness-btn-inline">
-                            <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
-                            <span>{move || if stt_loading_models.get() {
-                                i18n.tr(I18nKey::AgModelsLoading)().to_string()
-                            } else {
-                                i18n.tr(I18nKey::AgModelsRefresh)().to_string()
-                            }}</span>
-                        </span>
-                    </button>
-                    <small class="harness-muted">
-                        {move || {
-                            let n = stt_models.get().len();
-                            if n == 0 {
-                                String::new()
-                            } else {
-                                format!("{n} entries")
-                            }
-                        }}
-                    </small>
-                </div>
             </label>
+            <div class="agent-provider-pane__actions">
+                <button
+                    type="button"
+                    class="workbench-mini-btn"
+                    disabled=move || stt_loading_models.get() || !is_tauri_shell()
+                    on:click=move |_| reload_stt_models(voice_provider.get_untracked())
+                >
+                    <span class="harness-btn-inline">
+                        <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
+                        <span>{move || if stt_loading_models.get() {
+                            i18n.tr(I18nKey::AgModelsLoading)().to_string()
+                        } else {
+                            i18n.tr(I18nKey::AgModelsRefresh)().to_string()
+                        }}</span>
+                    </span>
+                </button>
+                <small class="harness-muted">{models_source_hint}</small>
+            </div>
 
-            <label class="harness-stack voice-pane__model-block">
+            <label class="harness-stack">
                 <span class="harness-field-label">
-                    <span class="harness-field-label__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuVolume2 width="0.82rem" height="0.82rem" />
+                    <span class="harness-field-label__text">
+                        {move || format!(
+                            "{} — {}",
+                            i18n.tr(I18nKey::AgModelField)(),
+                            i18n.tr(I18nKey::VoiceTtsSection)()
+                        )}
                     </span>
-                    <span class="harness-field-label__text">{move || i18n.tr(I18nKey::VoiceTtsSection)()}</span>
                 </span>
                 <AgentModelPicker
                     model_id=tts_model_id
@@ -554,34 +693,25 @@ where
                     option_id_prefix="voice-tts-model"
                     on_change=on_tts_model
                 />
-                <div class="agent-provider-pane__actions">
-                    <button
-                        type="button"
-                        class="workbench-mini-btn"
-                        disabled=move || tts_loading_models.get() || !is_tauri_shell()
-                        on:click=move |_| reload_tts_models(voice_provider.get_untracked())
-                    >
-                        <span class="harness-btn-inline">
-                            <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
-                            <span>{move || if tts_loading_models.get() {
-                                i18n.tr(I18nKey::AgModelsLoading)().to_string()
-                            } else {
-                                i18n.tr(I18nKey::AgModelsRefresh)().to_string()
-                            }}</span>
-                        </span>
-                    </button>
-                    <small class="harness-muted">
-                        {move || {
-                            let n = tts_models.get().len();
-                            if n == 0 {
-                                String::new()
-                            } else {
-                                format!("{n} entries")
-                            }
-                        }}
-                    </small>
-                </div>
             </label>
+            <div class="agent-provider-pane__actions">
+                <button
+                    type="button"
+                    class="workbench-mini-btn"
+                    disabled=move || tts_loading_models.get() || !is_tauri_shell()
+                    on:click=move |_| reload_tts_models(voice_provider.get_untracked())
+                >
+                    <span class="harness-btn-inline">
+                        <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
+                        <span>{move || if tts_loading_models.get() {
+                            i18n.tr(I18nKey::AgModelsLoading)().to_string()
+                        } else {
+                            i18n.tr(I18nKey::AgModelsRefresh)().to_string()
+                        }}</span>
+                    </span>
+                </button>
+                <small class="harness-muted">{models_source_hint}</small>
+            </div>
 
             <div class="voice-pane__field">
                 <label>{move || i18n.tr(I18nKey::VoiceQualityField)()}</label>

From ca35c85a0847bc72e49bec4fb608ba1ef943a04c Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 08:26:22 +0200
Subject: [PATCH 41/48] feat(voice_provider): remove model picker and enhance
 voice selection UI

- Deleted the `model_picker` module and its associated CSS, streamlining the codebase and improving maintainability.
- Updated the `AgentVoiceColumn` and `VoicePicksGrid` components to integrate a custom field for voice selection, enhancing user interaction.
- Added localization support for AWS voice selection hints across multiple languages, improving user experience for international users.
- Refactored CSS for voice selection components to improve layout and responsiveness, ensuring a cohesive design.
---
 .github/workflows/release.yml                 |  82 ++++-
 index.html                                    |   1 -
 src-tauri/src/voice/voices.rs                 |   4 -
 src/i18n/keys.rs                              |   1 +
 src/i18n/locales/de_de.rs                     |   1 +
 src/i18n/locales/en_us.rs                     |   1 +
 src/i18n/locales/es_es.rs                     |   1 +
 src/i18n/locales/fr_fr.rs                     |   1 +
 src/i18n/locales/hu_hu.rs                     |   1 +
 src/i18n/locales/it_it.rs                     |   1 +
 src/i18n/locales/ja_jp.rs                     |   1 +
 src/i18n/locales/ko_kr.rs                     |   1 +
 src/i18n/locales/pl_pl.rs                     |   1 +
 src/i18n/locales/pt_br.rs                     |   1 +
 src/i18n/locales/ru_ru.rs                     |   1 +
 src/i18n/locales/zh_cn.rs                     |   1 +
 src/i18n/locales/zh_tw.rs                     |   1 +
 src/workbench/agent_model_picker/mod.rs       |  28 +-
 .../agent_provider_pane.css                   |   4 +
 src/workbench/harness_voice_pane/mod.rs       | 319 +++++++++++-------
 src/workbench/mod.rs                          |   1 -
 src/workbench/model_picker/mod.rs             | 117 -------
 src/workbench/model_picker/model_picker.css   |  33 --
 styles.css                                    |  31 +-
 24 files changed, 333 insertions(+), 301 deletions(-)
 delete mode 100644 src/workbench/model_picker/mod.rs
 delete mode 100644 src/workbench/model_picker/model_picker.css

diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index b8afccd..8d82756 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -1,5 +1,6 @@
 # Build release bundles on macOS and Windows (no Linux CI).
 # macOS .app/.dmg require a macOS runner (Intel + Apple Silicon via universal target).
+# Windows builds use the self-hosted runner (label: blxcode-win).
 name: Release
 
 permissions:
@@ -15,6 +16,14 @@ on:
     tags: ["v*"]
   workflow_dispatch:
     inputs:
+      mode:
+        description: "testbuild = build only (workflow artifacts); release = draft GitHub release + upload"
+        type: choice
+        required: true
+        default: testbuild
+        options:
+          - testbuild
+          - release
       platforms:
         description: Build targets
         type: choice
@@ -88,19 +97,49 @@ jobs:
             }
             core.setFailed("Unauthorized release actor");
 
-  build:
+  resolve:
     needs: authorize
+    runs-on: ubuntu-latest
+    outputs:
+      mode: ${{ steps.mode.outputs.mode }}
+      matrix: ${{ steps.matrix.outputs.matrix }}
+    steps:
+      - id: mode
+        run: |
+          if [ "${{ github.event_name }}" = "push" ]; then
+            echo "mode=release" >> "$GITHUB_OUTPUT"
+          else
+            echo "mode=${{ inputs.mode }}" >> "$GITHUB_OUTPUT"
+          fi
+
+      - id: matrix
+        run: |
+          platforms="${{ inputs.platforms }}"
+          if [ "${{ github.event_name }}" = "push" ]; then
+            platforms="Alle"
+          fi
+
+          include="["
+          sep=""
+          if [ "$platforms" = "Alle" ] || [ "$platforms" = "Mac Universal" ]; then
+            include+="${sep}{\"platform\":\"macos-latest\",\"platform_id\":\"mac\",\"args\":\"--target universal-apple-darwin\"}"
+            sep=","
+          fi
+          if [ "$platforms" = "Alle" ] || [ "$platforms" = "Windows" ]; then
+            include+="${sep}{\"platform\":[\"self-hosted\",\"Windows\",\"blxcode-win\"],\"platform_id\":\"windows\",\"args\":\"\"}"
+          fi
+          include+="]"
+
+          echo "matrix={\"include\":${include}}" >> "$GITHUB_OUTPUT"
+
+  build:
+    needs: [authorize, resolve]
     permissions:
       contents: write
     strategy:
       fail-fast: false
       max-parallel: 1
-      matrix:
-        include:
-          - platform: macos-latest
-            args: --target universal-apple-darwin
-          - platform: windows-latest
-            args: ""
+      matrix: ${{ fromJson(needs.resolve.outputs.matrix) }}
 
     runs-on: ${{ matrix.platform }}
     steps:
@@ -118,8 +157,11 @@ jobs:
           cache: npm
           cache-dependency-path: frontend-js/package-lock.json
 
+      - name: Install frontend dependencies
+        run: npm ci --prefix frontend-js
+
       - name: Add macOS Rust targets
-        if: matrix.platform == 'macos-latest'
+        if: matrix.platform_id == 'mac'
         run: |
           rustup target add aarch64-apple-darwin x86_64-apple-darwin
           echo "macOS universal build: Apple Silicon (aarch64) + Intel (x86_64)"
@@ -129,7 +171,28 @@ jobs:
           cargo install trunk --locked
           cargo install tauri-cli --version "^2" --locked
 
-      - name: Build bundles
+      - name: Build bundles (testbuild)
+        if: needs.resolve.outputs.mode == 'testbuild'
+        working-directory: src-tauri
+        env:
+          TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY }}
+          TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY_PASSWORD }}
+          CI: true
+          CSC_IDENTITY_AUTO_DISCOVERY: false
+          APPLE_SIGNING_IDENTITY: "-"
+        run: cargo tauri build ${{ matrix.args }}
+
+      - name: Upload test build artifacts
+        if: needs.resolve.outputs.mode == 'testbuild'
+        uses: actions/upload-artifact@v4
+        with:
+          name: blxcode-${{ matrix.platform_id }}-${{ github.run_id }}
+          path: target/**/release/bundle/**/*
+          retention-days: 7
+          if-no-files-found: error
+
+      - name: Build bundles (release)
+        if: needs.resolve.outputs.mode == 'release'
         uses: tauri-apps/tauri-action@v0
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
@@ -149,6 +212,7 @@ jobs:
           args: ${{ matrix.args || '' }}
 
       - name: Merge updater latest.json
+        if: needs.resolve.outputs.mode == 'release'
         shell: bash
         env:
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
diff --git a/index.html b/index.html
index cbe3717..cd81263 100644
--- a/index.html
+++ b/index.html
@@ -12,7 +12,6 @@
     />
     <link data-trunk rel="css" href="styles.css" />
     <link data-trunk rel="css" href="src/workbench/plans_panel/plans-panel.css" />
-    <link data-trunk rel="css" href="src/workbench/model_picker/model_picker.css" />
     <link data-trunk rel="css" href="src/workbench/update_dialog.css" />
     <link data-trunk rel="css" href="src/workbench/harness_image_pane/harness_image_pane.css" />
     <link data-trunk rel="css" href="src/workbench/api_keys_pane/api_keys_pane.css" />
diff --git a/src-tauri/src/voice/voices.rs b/src-tauri/src/voice/voices.rs
index ff123fd..758ef59 100644
--- a/src-tauri/src/voice/voices.rs
+++ b/src-tauri/src/voice/voices.rs
@@ -60,10 +60,6 @@ fn aws_polly_voices() -> Vec<VoiceEntry> {
         ("Brian", "Brian", VoiceGender::Male),
         ("Ivy", "Ivy", VoiceGender::Female),
         ("Justin", "Justin", VoiceGender::Male),
-        ("Kendra", "Kendra", VoiceGender::Female),
-        ("Kimberly", "Kimberly", VoiceGender::Female),
-        ("Salli", "Salli", VoiceGender::Female),
-        ("Joey", "Joey", VoiceGender::Male),
     ];
     raw.iter()
         .map(|(id, label, gender)| VoiceEntry {
diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index d3bfb63..7143475 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -501,6 +501,7 @@ pub enum I18nKey {
     VoiceProviderField,
     VoiceModelField,
     VoiceVoiceField,
+    VoiceVoicesAwsOnly,
     VoiceGenderAll,
     VoiceGenderMale,
     VoiceGenderFemale,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index 48a4248..2252601 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -496,6 +496,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Anbieter",
         I18nKey::VoiceModelField => "Modell",
         I18nKey::VoiceVoiceField => "Stimme",
+        I18nKey::VoiceVoicesAwsOnly => "Wähle AWS als Provider, um eine Polly-Stimme auszuwählen.",
         I18nKey::VoiceGenderAll => "Alle",
         I18nKey::VoiceGenderMale => "Männlich",
         I18nKey::VoiceGenderFemale => "Weiblich",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index f4f2c11..feacfa6 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -533,6 +533,7 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::VoiceProviderField => "Provider",
         I18nKey::VoiceModelField => "Model",
         I18nKey::VoiceVoiceField => "Voice",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "All",
         I18nKey::VoiceGenderMale => "Male",
         I18nKey::VoiceGenderFemale => "Female",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index 6888a17..a13e8b6 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -498,6 +498,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Proveedor",
         I18nKey::VoiceModelField => "Modelo",
         I18nKey::VoiceVoiceField => "Voz",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "Todo",
         I18nKey::VoiceGenderMale => "Masculino",
         I18nKey::VoiceGenderFemale => "Femenino",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index b7d8836..48400d0 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -500,6 +500,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Fournisseur",
         I18nKey::VoiceModelField => "Modèle",
         I18nKey::VoiceVoiceField => "Voix",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "Tous",
         I18nKey::VoiceGenderMale => "Mâle",
         I18nKey::VoiceGenderFemale => "Femelle",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index 09ae887..f33d324 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -496,6 +496,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Szolgáltató",
         I18nKey::VoiceModelField => "Modell",
         I18nKey::VoiceVoiceField => "Hang",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "Minden",
         I18nKey::VoiceGenderMale => "Férfi",
         I18nKey::VoiceGenderFemale => "Női",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index ce9b29c..4b5b7ad 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -494,6 +494,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Fornitore",
         I18nKey::VoiceModelField => "Modello",
         I18nKey::VoiceVoiceField => "Voce",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "Tutto",
         I18nKey::VoiceGenderMale => "Maschio",
         I18nKey::VoiceGenderFemale => "Femmina",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index 6c5a5b7..f658035 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -484,6 +484,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "プロバイダー",
         I18nKey::VoiceModelField => "モデル",
         I18nKey::VoiceVoiceField => "声",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "全て",
         I18nKey::VoiceGenderMale => "男",
         I18nKey::VoiceGenderFemale => "女性",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index 554c76d..816cfd0 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -482,6 +482,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "공급자",
         I18nKey::VoiceModelField => "모델",
         I18nKey::VoiceVoiceField => "목소리",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "모두",
         I18nKey::VoiceGenderMale => "남성",
         I18nKey::VoiceGenderFemale => "여성",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index cb542ac..ad6c7bb 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -494,6 +494,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Dostawca",
         I18nKey::VoiceModelField => "Model",
         I18nKey::VoiceVoiceField => "Głos",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "Wszystko",
         I18nKey::VoiceGenderMale => "Mężczyzna",
         I18nKey::VoiceGenderFemale => "Kobieta",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index b486b44..f2807e5 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -496,6 +496,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Provedor",
         I18nKey::VoiceModelField => "Modelo",
         I18nKey::VoiceVoiceField => "Voz",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "Todos",
         I18nKey::VoiceGenderMale => "Macho",
         I18nKey::VoiceGenderFemale => "Fêmea",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index da94a17..f6c11ec 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -494,6 +494,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Поставщик",
         I18nKey::VoiceModelField => "Модель",
         I18nKey::VoiceVoiceField => "Голос",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "Все",
         I18nKey::VoiceGenderMale => "Мужской",
         I18nKey::VoiceGenderFemale => "Женский",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index fcd2ef0..468393d 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -480,6 +480,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "提供者",
         I18nKey::VoiceModelField => "模型",
         I18nKey::VoiceVoiceField => "嗓音",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "全部",
         I18nKey::VoiceGenderMale => "男性",
         I18nKey::VoiceGenderFemale => "女性",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index d755257..0c83145 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -480,6 +480,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "提供者",
         I18nKey::VoiceModelField => "模型",
         I18nKey::VoiceVoiceField => "嗓音",
+        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
         I18nKey::VoiceGenderAll => "全部",
         I18nKey::VoiceGenderMale => "男性",
         I18nKey::VoiceGenderFemale => "女性",
diff --git a/src/workbench/agent_model_picker/mod.rs b/src/workbench/agent_model_picker/mod.rs
index 22313a9..0dfb1fe 100644
--- a/src/workbench/agent_model_picker/mod.rs
+++ b/src/workbench/agent_model_picker/mod.rs
@@ -96,6 +96,8 @@ pub fn AgentModelPicker(
     loading_models: RwSignal<bool>,
     #[prop(default = "agent-model")]
     option_id_prefix: &'static str,
+    #[prop(default = true)]
+    show_custom_field: bool,
     #[prop(optional)] on_change: Option<Callback<String>>,
 ) -> impl IntoView {
     let i18n = expect_context::<I18nService>();
@@ -220,20 +222,22 @@ pub fn AgentModelPicker(
                 </Show>
             </div>
 
-            <input
-                class="workbench-plain-input"
-                type="text"
-                placeholder=move || i18n.tr(I18nKey::AgModelCustomField)()
-                prop:value=move || model_id.get()
-                on:input=move |ev| {
-                    if let Some(value) = input_str(&ev) {
-                        model_id.set(value.clone());
-                        if let Some(cb) = on_change.as_ref() {
-                            cb.run(value);
+            <Show when=move || show_custom_field>
+                <input
+                    class="workbench-plain-input"
+                    type="text"
+                    placeholder=move || i18n.tr(I18nKey::AgModelCustomField)()
+                    prop:value=move || model_id.get()
+                    on:input=move |ev| {
+                        if let Some(value) = input_str(&ev) {
+                            model_id.set(value.clone());
+                            if let Some(cb) = on_change.as_ref() {
+                                cb.run(value);
+                            }
                         }
                     }
-                }
-            />
+                />
+            </Show>
 
             {move || {
                 let Some(entry) = selected_entry.get() else {
diff --git a/src/workbench/agent_provider_pane/agent_provider_pane.css b/src/workbench/agent_provider_pane/agent_provider_pane.css
index 3f88860..c31d266 100644
--- a/src/workbench/agent_provider_pane/agent_provider_pane.css
+++ b/src/workbench/agent_provider_pane/agent_provider_pane.css
@@ -77,6 +77,10 @@
     margin-top: 0.65rem;
 }
 
+.agent-provider-pane__voice-inner .voice-pane__voice-grid--six {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+
 .agent-provider-pane__col {
     min-width: 0;
     display: flex;
diff --git a/src/workbench/harness_voice_pane/mod.rs b/src/workbench/harness_voice_pane/mod.rs
index c785246..c848fd5 100644
--- a/src/workbench/harness_voice_pane/mod.rs
+++ b/src/workbench/harness_voice_pane/mod.rs
@@ -405,7 +405,8 @@ pub fn AgentVoiceColumn() -> impl IntoView {
                                 reload_tts_models=reload_tts_models
                             />
                             <BehaviorSection
-                                current=current.clone()
+                                settings=settings
+                                voice_provider=voice_provider
                                 post_flow=post_flow
                                 voice_id=voice_id.clone()
                                 voices=voices
@@ -654,6 +655,7 @@ where
                     model_entries=stt_models
                     loading_models=stt_loading_models
                     option_id_prefix="voice-stt-model"
+                    show_custom_field=false
                     on_change=on_stt_model
                 />
             </label>
@@ -691,6 +693,7 @@ where
                     model_entries=tts_models
                     loading_models=tts_loading_models
                     option_id_prefix="voice-tts-model"
+                    show_custom_field=false
                     on_change=on_tts_model
                 />
             </label>
@@ -754,6 +757,7 @@ fn GenderBtn(
     target: GenderFilter,
     label_key: I18nKey,
     filter: RwSignal<GenderFilter>,
+    #[prop(default = false)] disabled: bool,
 ) -> impl IntoView {
     let i18n = expect_context::<I18nService>();
     let is_active = move || filter.get() == target;
@@ -762,7 +766,12 @@ fn GenderBtn(
             type="button"
             class="voice-pane__choice voice-pane__choice--gender"
             class:voice-pane__choice--active=is_active
-            on:click=move |_| filter.set(target)
+            disabled=disabled
+            on:click=move |_| {
+                if !disabled {
+                    filter.set(target);
+                }
+            }
         >
             {move || i18n.tr(label_key)()}
         </button>
@@ -777,10 +786,13 @@ fn gender_label_for(g: VoiceGender) -> &'static str {
     }
 }
 
-fn play_b64(audio_ref: NodeRef<leptos::html::Audio>, b64: &str, mime: &str) {
+fn play_b64(b64: &str, mime: &str) {
     let Ok(bytes) = BASE64.decode(b64) else {
         return;
     };
+    let Ok(el) = HtmlAudioElement::new() else {
+        return;
+    };
     let arr = Uint8Array::new_with_length(bytes.len() as u32);
     arr.copy_from(&bytes);
     let parts = js_sys::Array::new();
@@ -793,14 +805,153 @@ fn play_b64(audio_ref: NodeRef<leptos::html::Audio>, b64: &str, mime: &str) {
     let Ok(url) = web_sys::Url::create_object_url_with_blob(&blob) else {
         return;
     };
-    if let Some(audio) = audio_ref.get_untracked() {
-        let el: HtmlAudioElement = audio.unchecked_into();
-        let old = el.src();
-        if old.starts_with("blob:") {
-            let _ = web_sys::Url::revoke_object_url(&old);
-        }
-        el.set_src(&url);
-        let _ = el.play();
+    let old = el.src();
+    if old.starts_with("blob:") {
+        let _ = web_sys::Url::revoke_object_url(&old);
+    }
+    el.set_src(&url);
+    let _ = el.play();
+}
+
+#[component]
+fn VoicePickCard(
+    entry: VoiceEntry,
+    active: bool,
+    disabled: bool,
+    settings: RwSignal<Option<VoiceSettings>>,
+    on_pick: Callback<String>,
+) -> impl IntoView {
+    let id_pick = entry.id.clone();
+    let id_preview = entry.id.clone();
+    view! {
+        <div
+            class="voice-pane__voice-card"
+            class:voice-pane__voice-card--active=move || active && !disabled
+            class:voice-pane__voice-card--disabled=move || disabled
+        >
+            <button
+                type="button"
+                class="voice-pane__voice-pick"
+                disabled=disabled
+                on:click=move |_| {
+                    if !disabled {
+                        on_pick.run(id_pick.clone());
+                    }
+                }
+            >
+                <strong>{entry.label.clone()}</strong>
+                <span class="voice-pane__voice-gender">{gender_label_for(entry.gender)}</span>
+            </button>
+            <button
+                type="button"
+                class="voice-pane__voice-preview"
+                disabled=disabled
+                on:click=move |_| {
+                    if disabled {
+                        return;
+                    }
+                    let Some(s) = settings.get_untracked() else {
+                        return;
+                    };
+                    let model = s.tts.model_id.clone();
+                    let provider = s.tts.provider;
+                    let voice = id_preview.clone();
+                    leptos::task::spawn_local(async move {
+                        let text = expect_context::<I18nService>()
+                            .tr(I18nKey::VoicePreviewText)()
+                            .to_string();
+                        if let Ok(resp) = voice_tts_preview(provider, model, voice, text).await {
+                            play_b64(&resp.audio_b64, &resp.mime);
+                        }
+                    });
+                }
+                aria-label="Sample"
+            >
+                <LxIcon icon=icondata::LuPlay width="0.85rem" height="0.85rem" />
+            </button>
+        </div>
+    }
+}
+
+#[component]
+fn VoicePicksGrid(
+    settings: RwSignal<Option<VoiceSettings>>,
+    voice_id: String,
+    voices: RwSignal<Vec<VoiceEntry>>,
+    gender_filter: RwSignal<GenderFilter>,
+    voices_pick_enabled: Memo<bool>,
+    on_pick: Callback<String>,
+) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    view! {
+        <div class="voice-pane__voice-picks">
+            <div class="voice-pane__gender-row">
+                <GenderBtn target=GenderFilter::All label_key=I18nKey::VoiceGenderAll filter=gender_filter />
+                <GenderBtn target=GenderFilter::Male label_key=I18nKey::VoiceGenderMale filter=gender_filter />
+                <GenderBtn target=GenderFilter::Female label_key=I18nKey::VoiceGenderFemale filter=gender_filter />
+                <GenderBtn target=GenderFilter::Neutral label_key=I18nKey::VoiceGenderNeutral filter=gender_filter />
+            </div>
+            <p
+                class="voice-pane__hint voice-pane__hint--aws-only"
+                class:voice-pane__hint--visible=move || !voices_pick_enabled.get()
+            >
+                {move || i18n.tr(I18nKey::VoiceVoicesAwsOnly)()}
+            </p>
+            <div
+                class="voice-pane__voice-grid voice-pane__voice-grid--six"
+                class:voice-pane__voice-grid--disabled=move || !voices_pick_enabled.get()
+                aria-disabled=move || if voices_pick_enabled.get() { "false" } else { "true" }
+            >
+                {move || {
+                    let active = voice_id.clone();
+                    let filter = gender_filter.get();
+                    let picks_disabled = !voices_pick_enabled.get();
+                    voices.get()
+                        .into_iter()
+                        .filter(|v| filter.matches(v.gender))
+                        .map(|v| {
+                            view! {
+                                <VoicePickCard
+                                    entry=v.clone()
+                                    active=v.id == active
+                                    disabled=picks_disabled
+                                    settings=settings
+                                    on_pick=on_pick
+                                />
+                            }
+                        })
+                        .collect_view()
+                }}
+            </div>
+        </div>
+    }
+}
+
+#[component]
+fn VoicePickerBlock(
+    settings: RwSignal<Option<VoiceSettings>>,
+    voice_provider: RwSignal<VoiceProviderKind>,
+    voice_id: String,
+    voices: RwSignal<Vec<VoiceEntry>>,
+    gender_filter: RwSignal<GenderFilter>,
+    on_pick: Callback<String>,
+) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let voices_pick_enabled =
+        Memo::new(move |_| voice_provider.get() == VoiceProviderKind::Aws);
+
+    view! {
+        <div class="voice-pane__field">
+            <label>{move || i18n.tr(I18nKey::VoiceVoiceField)()}</label>
+            <VoicePicksGrid
+                settings=settings
+                voice_id=voice_id.clone()
+                voices=voices
+                gender_filter=gender_filter
+                voices_pick_enabled=voices_pick_enabled
+                on_pick=on_pick
+            />
+        </div>
     }
 }
 
@@ -810,7 +961,8 @@ fn play_b64(audio_ref: NodeRef<leptos::html::Audio>, b64: &str, mime: &str) {
 
 #[component]
 fn BehaviorSection<F>(
-    current: VoiceSettings,
+    settings: RwSignal<Option<VoiceSettings>>,
+    voice_provider: RwSignal<VoiceProviderKind>,
     post_flow: PostSttFlow,
     voice_id: String,
     voices: RwSignal<Vec<VoiceEntry>>,
@@ -822,46 +974,28 @@ where
     F: Fn(VoiceSettings) + Send + Sync + 'static + Copy,
 {
     let i18n = expect_context::<I18nService>();
-    let audio_ref = NodeRef::<leptos::html::Audio>::new();
-
-    let on_flow = {
-        let current = current.clone();
-        move |flow: PostSttFlow| {
-            let mut next = current.clone();
-            next.post_stt_flow = flow;
-            save(next);
-        }
-    };
-    let on_voice = {
-        let current = current.clone();
-        move |id: String| {
-            let mut next = current.clone();
-            next.tts.voice = id;
-            save(next);
-        }
-    };
-    let on_enabled = {
-        let current = current.clone();
-        move |enabled: bool| {
-            let mut next = current.clone();
-            next.tts.enabled = enabled;
-            save(next);
-        }
-    };
 
-    let preview_voice = {
-        let current = current.clone();
-        move |voice: String| {
-            let model = current.tts.model_id.clone();
-            let provider = current.tts.provider;
-            let text = i18n.tr(I18nKey::VoicePreviewText)().to_string();
-            leptos::task::spawn_local(async move {
-                if let Ok(resp) = voice_tts_preview(provider, model, voice, text).await {
-                    play_b64(audio_ref, &resp.audio_b64, &resp.mime);
-                }
-            });
-        }
-    };
+    let on_flow = Callback::new(move |flow: PostSttFlow| {
+        let Some(mut next) = settings.get_untracked() else {
+            return;
+        };
+        next.post_stt_flow = flow;
+        save(next);
+    });
+    let on_voice = Callback::new(move |id: String| {
+        let Some(mut next) = settings.get_untracked() else {
+            return;
+        };
+        next.tts.voice = id;
+        save(next);
+    });
+    let on_enabled = Callback::new(move |enabled: bool| {
+        let Some(mut next) = settings.get_untracked() else {
+            return;
+        };
+        next.tts.enabled = enabled;
+        save(next);
+    });
 
     view! {
         <section class="voice-pane__section">
@@ -873,10 +1007,7 @@ where
                         type="button"
                         class="voice-pane__choice"
                         class:voice-pane__choice--active=move || matches!(post_flow, PostSttFlow::AutoSend)
-                        on:click={
-                            let on_flow = on_flow.clone();
-                            move |_| on_flow(PostSttFlow::AutoSend)
-                        }
+                        on:click=move |_| on_flow.run(PostSttFlow::AutoSend)
                     >
                         {move || i18n.tr(I18nKey::VoicePostSttAutoSend)()}
                     </button>
@@ -884,82 +1015,31 @@ where
                         type="button"
                         class="voice-pane__choice"
                         class:voice-pane__choice--active=move || matches!(post_flow, PostSttFlow::Draft)
-                        on:click={
-                            let on_flow = on_flow.clone();
-                            move |_| on_flow(PostSttFlow::Draft)
-                        }
+                        on:click=move |_| on_flow.run(PostSttFlow::Draft)
                     >
                         {move || i18n.tr(I18nKey::VoicePostSttDraft)()}
                     </button>
                 </div>
             </div>
 
-            <div class="voice-pane__field">
-                <label>{move || i18n.tr(I18nKey::VoiceVoiceField)()}</label>
-                <div class="voice-pane__gender-row">
-                    <GenderBtn target=GenderFilter::All label_key=I18nKey::VoiceGenderAll filter=gender_filter />
-                    <GenderBtn target=GenderFilter::Male label_key=I18nKey::VoiceGenderMale filter=gender_filter />
-                    <GenderBtn target=GenderFilter::Female label_key=I18nKey::VoiceGenderFemale filter=gender_filter />
-                    <GenderBtn target=GenderFilter::Neutral label_key=I18nKey::VoiceGenderNeutral filter=gender_filter />
-                </div>
-                <div class="voice-pane__voice-grid">
-                    {move || {
-                        let active = voice_id.clone();
-                        let filter = gender_filter.get();
-                        let on_voice = on_voice.clone();
-                        let preview_voice = preview_voice.clone();
-                        voices.get()
-                            .into_iter()
-                            .filter(|v| filter.matches(v.gender))
-                            .map(|v| {
-                                let is_active = v.id == active;
-                                let id_choose = v.id.clone();
-                                let id_preview = v.id.clone();
-                                let on_voice = on_voice.clone();
-                                let preview_voice = preview_voice.clone();
-                                view! {
-                                    <div
-                                        class="voice-pane__voice-card"
-                                        class:voice-pane__voice-card--active=is_active
-                                    >
-                                        <button
-                                            type="button"
-                                            class="voice-pane__voice-pick"
-                                            on:click=move |_| on_voice(id_choose.clone())
-                                        >
-                                            <strong>{v.label.clone()}</strong>
-                                            <span class="voice-pane__voice-gender">
-                                                {gender_label_for(v.gender)}
-                                            </span>
-                                        </button>
-                                        <button
-                                            type="button"
-                                            class="voice-pane__voice-preview"
-                                            on:click=move |_| preview_voice(id_preview.clone())
-                                            aria-label="Sample"
-                                        >
-                                            <LxIcon icon=icondata::LuPlay width="0.85rem" height="0.85rem" />
-                                        </button>
-                                    </div>
-                                }
-                            })
-                            .collect_view()
-                    }}
-                </div>
-            </div>
+            <VoicePickerBlock
+                settings=settings
+                voice_provider=voice_provider
+                voice_id=voice_id
+                voices=voices
+                gender_filter=gender_filter
+                on_pick=on_voice
+            />
 
             <div class="voice-pane__field">
                 <label class="voice-pane__toggle">
                     <input
                         type="checkbox"
                         prop:checked=tts_enabled
-                        on:change={
-                            let on_enabled = on_enabled.clone();
-                            move |ev| {
-                                if let Some(t) = ev.target() {
-                                    if let Ok(inp) = t.dyn_into::<web_sys::HtmlInputElement>() {
-                                        on_enabled(inp.checked());
-                                    }
+                        on:change=move |ev| {
+                            if let Some(t) = ev.target() {
+                                if let Ok(inp) = t.dyn_into::<web_sys::HtmlInputElement>() {
+                                    on_enabled.run(inp.checked());
                                 }
                             }
                         }
@@ -972,7 +1052,6 @@ where
                 </p>
             </div>
 
-            <audio node_ref=audio_ref preload="none" />
         </section>
     }
 }
diff --git a/src/workbench/mod.rs b/src/workbench/mod.rs
index 3cdcb5c..88f63cf 100644
--- a/src/workbench/mod.rs
+++ b/src/workbench/mod.rs
@@ -18,7 +18,6 @@ mod harness_ui;
 mod harness_voice_pane;
 mod memory_graph;
 mod memory_panel;
-mod model_picker;
 mod notification_sound;
 mod path_nav;
 mod plans_panel;
diff --git a/src/workbench/model_picker/mod.rs b/src/workbench/model_picker/mod.rs
deleted file mode 100644
index e4913e1..0000000
--- a/src/workbench/model_picker/mod.rs
+++ /dev/null
@@ -1,117 +0,0 @@
-//! Shared model picker (datalist input + refresh button).
-//!
-//! Originally inlined in `harness_voice_pane`; lifted here so the image
-//! settings pane (and any future provider-bound picker) can reuse the same
-//! UX without duplicating logic.
-//!
-//! Component contract:
-//! - `label_key`  – i18n key for the field label.
-//! - `datalist_id` – DOM id for the inline `<datalist>` (must be unique per
-//!   picker on the page; both panes set their own id).
-//! - `current`    – the currently-persisted model id (displayed in the input).
-//! - `models`     – reactive list of suggestions.
-//! - `on_change`  – fired on every keystroke; caller persists.
-//! - `on_refresh` – fired when the user clicks the refresh button.
-
-use crate::i18n::I18nKey;
-use crate::service::I18nService;
-use crate::tauri_bridge::ProviderModelEntry;
-use leptos::prelude::*;
-use leptos_icons::Icon as LxIcon;
-use wasm_bindgen::JsCast;
-
-#[allow(dead_code)]
-#[component]
-pub fn ModelPicker<F, R>(
-    label_key: I18nKey,
-    datalist_id: &'static str,
-    current: String,
-    models: RwSignal<Vec<ProviderModelEntry>>,
-    on_change: F,
-    on_refresh: R,
-) -> impl IntoView
-where
-    F: Fn(String) + Send + Sync + 'static + Clone,
-    R: Fn() + Send + Sync + 'static + Copy,
-{
-    let i18n = expect_context::<I18nService>();
-    let buf = RwSignal::new(current.clone());
-    let loading = RwSignal::new(false);
-
-    // Keep the buffer aligned with the persisted value when settings reload.
-    Effect::new({
-        let current = current.clone();
-        move |_| {
-            let _ = models.get();
-            buf.set(current.clone());
-        }
-    });
-
-    let on_input = {
-        let on_change = on_change.clone();
-        move |ev: web_sys::Event| {
-            if let Some(t) = ev.target() {
-                if let Ok(inp) = t.dyn_into::<web_sys::HtmlInputElement>() {
-                    let v = inp.value();
-                    buf.set(v.clone());
-                    on_change(v);
-                }
-            }
-        }
-    };
-
-    let on_refresh_click = move |_| {
-        if loading.get_untracked() {
-            return;
-        }
-        loading.set(true);
-        on_refresh();
-    };
-
-    // Reset the loading flag whenever the model list arrives.
-    Effect::new(move |_| {
-        let _ = models.get();
-        loading.set(false);
-    });
-
-    view! {
-        <div class="model-picker">
-            <label class="model-picker__label">{move || i18n.tr(label_key)()}</label>
-            <input
-                class="model-picker__input workbench-plain-input"
-                type="text"
-                list=datalist_id
-                prop:value=move || buf.get()
-                on:input=on_input
-            />
-            <datalist id=datalist_id>
-                {move || {
-                    models.get()
-                        .into_iter()
-                        .map(|m| view! { <option value=m.id.clone()></option> })
-                        .collect_view()
-                }}
-            </datalist>
-            <div class="model-picker__row">
-                <button
-                    type="button"
-                    class="model-picker__refresh workbench-mini-btn"
-                    prop:disabled=move || loading.get()
-                    on:click=on_refresh_click
-                >
-                    <span class="harness-btn-inline">
-                        <LxIcon icon=icondata::LuRefreshCw width="0.78rem" height="0.78rem" />
-                        <span>{move || if loading.get() {
-                            i18n.tr(I18nKey::AgModelsLoading)().to_string()
-                        } else {
-                            i18n.tr(I18nKey::AgModelsRefresh)().to_string()
-                        }}</span>
-                    </span>
-                </button>
-                <small class="model-picker__count harness-muted">
-                    {move || format!("{} entries", models.get().len())}
-                </small>
-            </div>
-        </div>
-    }
-}
diff --git a/src/workbench/model_picker/model_picker.css b/src/workbench/model_picker/model_picker.css
deleted file mode 100644
index 2745ef4..0000000
--- a/src/workbench/model_picker/model_picker.css
+++ /dev/null
@@ -1,33 +0,0 @@
-/* Shared model picker — keeps the field layout consistent across the
-   voice and image settings panes. Globals (workbench-plain-input,
-   workbench-mini-btn, harness-muted) come from styles.css. */
-
-.model-picker {
-    display: flex;
-    flex-direction: column;
-    gap: 0.4rem;
-    margin-bottom: 0.6rem;
-}
-
-.model-picker__label {
-    font-size: 0.78rem;
-    font-weight: 600;
-    color: var(--text-muted, #9aa);
-    letter-spacing: 0.02em;
-    text-transform: uppercase;
-}
-
-.model-picker__input {
-    width: 100%;
-}
-
-.model-picker__row {
-    display: flex;
-    align-items: center;
-    gap: 0.5rem;
-}
-
-.model-picker__count {
-    font-size: 0.7rem;
-    opacity: 0.7;
-}
diff --git a/styles.css b/styles.css
index fa1ace6..1f37c6b 100644
--- a/styles.css
+++ b/styles.css
@@ -7698,10 +7698,33 @@ button {
     border-color: #5b9dff;
 }
 .voice-pane__voice-grid {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
-    gap: 0.5rem;
-    margin-top: 0.4rem;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
+  gap: 0.5rem;
+  margin-top: 0.4rem;
+}
+
+.voice-pane__voice-grid--six {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+
+.voice-pane__hint--aws-only {
+  visibility: hidden;
+  min-height: 1.35rem;
+  margin: 0.15rem 0 0;
+}
+
+.voice-pane__hint--aws-only.voice-pane__hint--visible {
+  visibility: visible;
+}
+
+.voice-pane__voice-grid--disabled {
+  opacity: 0.45;
+  pointer-events: none;
+}
+
+.voice-pane__voice-card--disabled {
+  opacity: 0.72;
 }
 .voice-pane__voice-card {
     display: flex;

From 0e651d4607fad36d09943da599fa91ae8f0641b6 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 08:31:50 +0200
Subject: [PATCH 42/48] refactor(voice_settings): streamline voice selection
 logic and remove unused variables

- Replaced the `openai_voice_ids` function with `is_openai_voice_id` for improved clarity in voice ID validation.
- Introduced `fixed_aws_polly_voices` function to centralize AWS Polly voice entries, enhancing maintainability.
- Removed unused `voices` signals from the `AgentVoiceColumn` and related components, simplifying the state management.
- Updated `VoicePicksGrid` to utilize the new voice catalog, improving the voice selection UI.
---
 src/workbench/harness_voice_pane/mod.rs | 47 ++++++++++++++-----------
 1 file changed, 27 insertions(+), 20 deletions(-)

diff --git a/src/workbench/harness_voice_pane/mod.rs b/src/workbench/harness_voice_pane/mod.rs
index c848fd5..d4a791a 100644
--- a/src/workbench/harness_voice_pane/mod.rs
+++ b/src/workbench/harness_voice_pane/mod.rs
@@ -5,7 +5,7 @@ use crate::i18n::I18nKey;
 use crate::service::I18nService;
 use crate::tauri_bridge::{
     agent_provider_models, agent_settings_get, api_keys_status, is_tauri_shell,
-    voice_provider_voices, voice_settings_get, voice_settings_save, voice_tts_preview,
+    voice_settings_get, voice_settings_save, voice_tts_preview,
     AgentProviderKind, AgentProviderSettingsView, ApiKeyEntry, ApiKeysStatus, PostSttFlow,
     ProviderModelEntry, SttSettings, TtsSettings, VoiceEntry, VoiceGender, VoiceProviderKind,
     VoiceSettings,
@@ -201,16 +201,35 @@ fn apply_voice_provider_defaults(next: &mut VoiceSettings, provider: VoiceProvid
         if !matches!(next.tts.model_id.as_str(), "neural" | "standard") {
             next.tts.model_id = "neural".into();
         }
-        if next.tts.voice.is_empty() || openai_voice_ids().contains(&next.tts.voice.as_str()) {
+        if next.tts.voice.is_empty() || is_openai_voice_id(&next.tts.voice) {
             next.tts.voice = "Joanna".into();
         }
     }
 }
 
-fn openai_voice_ids() -> &'static [&'static str] {
-    &[
-        "alloy", "ash", "ballad", "coral", "echo", "fable", "nova", "onyx", "sage", "shimmer",
+fn fixed_aws_polly_voices() -> Vec<VoiceEntry> {
+    [
+        ("Joanna", "Joanna", VoiceGender::Female),
+        ("Matthew", "Matthew", VoiceGender::Male),
+        ("Amy", "Amy", VoiceGender::Female),
+        ("Brian", "Brian", VoiceGender::Male),
+        ("Ivy", "Ivy", VoiceGender::Female),
+        ("Justin", "Justin", VoiceGender::Male),
     ]
+    .into_iter()
+    .map(|(id, label, gender)| VoiceEntry {
+        id: id.into(),
+        label: label.into(),
+        gender,
+    })
+    .collect()
+}
+
+fn is_openai_voice_id(id: &str) -> bool {
+    matches!(
+        id,
+        "alloy" | "ash" | "ballad" | "coral" | "echo" | "fable" | "nova" | "onyx" | "sage" | "shimmer"
+    )
 }
 
 fn focus_voice_provider_option(provider: VoiceProviderKind) {
@@ -241,7 +260,6 @@ pub fn AgentVoiceColumn() -> impl IntoView {
     let settings = RwSignal::new(Option::<VoiceSettings>::None);
     let agent_settings = RwSignal::new(Option::<AgentProviderSettingsView>::None);
     let api_keys = RwSignal::new(Option::<ApiKeysStatus>::None);
-    let voices = RwSignal::new(Vec::<VoiceEntry>::new());
     let gender_filter = RwSignal::new(GenderFilter::All);
     let status = RwSignal::new(Option::<String>::None);
     let stt_models = RwSignal::new(Vec::<ProviderModelEntry>::new());
@@ -264,9 +282,6 @@ pub fn AgentVoiceColumn() -> impl IntoView {
                 voice_provider.set(v.stt.provider);
                 stt_model_id.set(v.stt.model_id.clone());
                 tts_model_id.set(v.tts.model_id.clone());
-                if let Ok(catalog) = voice_provider_voices(v.tts.provider).await {
-                    voices.set(catalog.voices);
-                }
                 fetch_models_for(v.stt.provider, ModelKind::Stt, stt_models).await;
                 fetch_models_for(v.tts.provider, ModelKind::Tts, tts_models).await;
                 settings.set(Some(v));
@@ -299,9 +314,6 @@ pub fn AgentVoiceColumn() -> impl IntoView {
     let reload_tts_models = move |provider: VoiceProviderKind| {
         tts_loading_models.set(true);
         leptos::task::spawn_local(async move {
-            if let Ok(catalog) = voice_provider_voices(provider).await {
-                voices.set(catalog.voices);
-            }
             fetch_models_for(provider, ModelKind::Tts, tts_models).await;
             tts_loading_models.set(false);
         });
@@ -409,7 +421,6 @@ pub fn AgentVoiceColumn() -> impl IntoView {
                                 voice_provider=voice_provider
                                 post_flow=post_flow
                                 voice_id=voice_id.clone()
-                                voices=voices
                                 gender_filter=gender_filter
                                 tts_enabled=tts_enabled
                                 save=save
@@ -877,12 +888,12 @@ fn VoicePickCard(
 fn VoicePicksGrid(
     settings: RwSignal<Option<VoiceSettings>>,
     voice_id: String,
-    voices: RwSignal<Vec<VoiceEntry>>,
     gender_filter: RwSignal<GenderFilter>,
     voices_pick_enabled: Memo<bool>,
     on_pick: Callback<String>,
 ) -> impl IntoView {
     let i18n = expect_context::<I18nService>();
+    let catalog = fixed_aws_polly_voices();
     view! {
         <div class="voice-pane__voice-picks">
             <div class="voice-pane__gender-row">
@@ -906,8 +917,8 @@ fn VoicePicksGrid(
                     let active = voice_id.clone();
                     let filter = gender_filter.get();
                     let picks_disabled = !voices_pick_enabled.get();
-                    voices.get()
-                        .into_iter()
+                    catalog
+                        .iter()
                         .filter(|v| filter.matches(v.gender))
                         .map(|v| {
                             view! {
@@ -932,7 +943,6 @@ fn VoicePickerBlock(
     settings: RwSignal<Option<VoiceSettings>>,
     voice_provider: RwSignal<VoiceProviderKind>,
     voice_id: String,
-    voices: RwSignal<Vec<VoiceEntry>>,
     gender_filter: RwSignal<GenderFilter>,
     on_pick: Callback<String>,
 ) -> impl IntoView {
@@ -946,7 +956,6 @@ fn VoicePickerBlock(
             <VoicePicksGrid
                 settings=settings
                 voice_id=voice_id.clone()
-                voices=voices
                 gender_filter=gender_filter
                 voices_pick_enabled=voices_pick_enabled
                 on_pick=on_pick
@@ -965,7 +974,6 @@ fn BehaviorSection<F>(
     voice_provider: RwSignal<VoiceProviderKind>,
     post_flow: PostSttFlow,
     voice_id: String,
-    voices: RwSignal<Vec<VoiceEntry>>,
     gender_filter: RwSignal<GenderFilter>,
     tts_enabled: bool,
     save: F,
@@ -1026,7 +1034,6 @@ where
                 settings=settings
                 voice_provider=voice_provider
                 voice_id=voice_id
-                voices=voices
                 gender_filter=gender_filter
                 on_pick=on_voice
             />

From 9064fa4ab4333620288d2d84e873ece36b88736c Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 08:33:13 +0200
Subject: [PATCH 43/48] refactor(agent_model_picker): simplify pricing display
 logic in agent model picker

- Removed unnecessary lines and conditions for building the display lines for agent model details.
- Streamlined the pricing information retrieval and display, enhancing code clarity and maintainability.
- Updated the UI to directly show pricing information without intermediate variables, improving performance and readability.
---
 src/workbench/agent_model_picker/mod.rs | 29 +++++--------------------
 1 file changed, 5 insertions(+), 24 deletions(-)

diff --git a/src/workbench/agent_model_picker/mod.rs b/src/workbench/agent_model_picker/mod.rs
index 0dfb1fe..159dbc1 100644
--- a/src/workbench/agent_model_picker/mod.rs
+++ b/src/workbench/agent_model_picker/mod.rs
@@ -243,34 +243,15 @@ pub fn AgentModelPicker(
                 let Some(entry) = selected_entry.get() else {
                     return ().into_any();
                 };
-                let mut lines = Vec::new();
-                if entry.id != entry.label && !entry.label.trim().is_empty() {
-                    lines.push(entry.id.clone());
-                }
-                if let Some(desc) = entry.description.as_ref().filter(|d| !d.trim().is_empty()) {
-                    lines.push(desc.trim().to_string());
-                }
-                if let Some(p) = entry.pricing {
-                    lines.push(
-                        i18n.tr(I18nKey::AgModelMetaPricing)()
-                            .replace("{in}", &price_per_million(p.prompt))
-                            .replace("{out}", &price_per_million(p.completion)),
-                    );
-                }
-                if lines.is_empty() {
+                let Some(p) = entry.pricing else {
                     return ().into_any();
-                }
-                let title = if entry.label.trim().is_empty() {
-                    entry.id.clone()
-                } else {
-                    entry.label.clone()
                 };
+                let pricing = i18n.tr(I18nKey::AgModelMetaPricing)()
+                    .replace("{in}", &price_per_million(p.prompt))
+                    .replace("{out}", &price_per_million(p.completion));
                 view! {
                     <div class="agent-model-picker__detail harness-muted" aria-live="polite">
-                        <span class="agent-model-picker__detail-title">{title}</span>
-                        {lines.into_iter().map(|line| view! {
-                            <span class="agent-model-picker__detail-line">{line}</span>
-                        }).collect_view()}
+                        <span class="agent-model-picker__detail-line">{pricing}</span>
                     </div>
                 }
                 .into_any()

From 7fde5eb0cf601a73602463bac1a86b93d2bd0d1f Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 08:35:45 +0200
Subject: [PATCH 44/48] feat(voice_provider): update voice selection hints and
 enhance voice catalog functionality

- Updated localization files across multiple languages to reflect the inclusion of OpenAI as a voice provider alongside AWS.
- Enhanced the voice selection logic to accommodate both OpenAI and AWS, improving user experience and flexibility in voice options.
- Refactored voice catalog functions to streamline voice entry management for different providers, ensuring maintainability and clarity in the codebase.
---
 src/i18n/locales/de_de.rs               |   2 +-
 src/i18n/locales/en_us.rs               |   2 +-
 src/i18n/locales/es_es.rs               |   2 +-
 src/i18n/locales/fr_fr.rs               |   2 +-
 src/i18n/locales/hu_hu.rs               |   2 +-
 src/i18n/locales/it_it.rs               |   2 +-
 src/i18n/locales/ja_jp.rs               |   2 +-
 src/i18n/locales/ko_kr.rs               |   2 +-
 src/i18n/locales/pl_pl.rs               |   2 +-
 src/i18n/locales/pt_br.rs               |   2 +-
 src/i18n/locales/ru_ru.rs               |   2 +-
 src/i18n/locales/zh_cn.rs               |   2 +-
 src/i18n/locales/zh_tw.rs               |   2 +-
 src/workbench/harness_voice_pane/mod.rs | 102 ++++++++++++++++--------
 14 files changed, 82 insertions(+), 46 deletions(-)

diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index 2252601..c25bea6 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -496,7 +496,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Anbieter",
         I18nKey::VoiceModelField => "Modell",
         I18nKey::VoiceVoiceField => "Stimme",
-        I18nKey::VoiceVoicesAwsOnly => "Wähle AWS als Provider, um eine Polly-Stimme auszuwählen.",
+        I18nKey::VoiceVoicesAwsOnly => "Wähle OpenAI oder AWS als Provider, um eine Stimme auszuwählen.",
         I18nKey::VoiceGenderAll => "Alle",
         I18nKey::VoiceGenderMale => "Männlich",
         I18nKey::VoiceGenderFemale => "Weiblich",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index feacfa6..a339270 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -533,7 +533,7 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::VoiceProviderField => "Provider",
         I18nKey::VoiceModelField => "Model",
         I18nKey::VoiceVoiceField => "Voice",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "All",
         I18nKey::VoiceGenderMale => "Male",
         I18nKey::VoiceGenderFemale => "Female",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index a13e8b6..c9aff4e 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -498,7 +498,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Proveedor",
         I18nKey::VoiceModelField => "Modelo",
         I18nKey::VoiceVoiceField => "Voz",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "Todo",
         I18nKey::VoiceGenderMale => "Masculino",
         I18nKey::VoiceGenderFemale => "Femenino",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index 48400d0..b1c0792 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -500,7 +500,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Fournisseur",
         I18nKey::VoiceModelField => "Modèle",
         I18nKey::VoiceVoiceField => "Voix",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "Tous",
         I18nKey::VoiceGenderMale => "Mâle",
         I18nKey::VoiceGenderFemale => "Femelle",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index f33d324..f82ac3a 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -496,7 +496,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Szolgáltató",
         I18nKey::VoiceModelField => "Modell",
         I18nKey::VoiceVoiceField => "Hang",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "Minden",
         I18nKey::VoiceGenderMale => "Férfi",
         I18nKey::VoiceGenderFemale => "Női",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index 4b5b7ad..0e30dcb 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -494,7 +494,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Fornitore",
         I18nKey::VoiceModelField => "Modello",
         I18nKey::VoiceVoiceField => "Voce",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "Tutto",
         I18nKey::VoiceGenderMale => "Maschio",
         I18nKey::VoiceGenderFemale => "Femmina",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index f658035..bacc277 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -484,7 +484,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "プロバイダー",
         I18nKey::VoiceModelField => "モデル",
         I18nKey::VoiceVoiceField => "声",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "全て",
         I18nKey::VoiceGenderMale => "男",
         I18nKey::VoiceGenderFemale => "女性",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index 816cfd0..68c195a 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -482,7 +482,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "공급자",
         I18nKey::VoiceModelField => "모델",
         I18nKey::VoiceVoiceField => "목소리",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "모두",
         I18nKey::VoiceGenderMale => "남성",
         I18nKey::VoiceGenderFemale => "여성",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index ad6c7bb..407e27e 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -494,7 +494,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Dostawca",
         I18nKey::VoiceModelField => "Model",
         I18nKey::VoiceVoiceField => "Głos",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "Wszystko",
         I18nKey::VoiceGenderMale => "Mężczyzna",
         I18nKey::VoiceGenderFemale => "Kobieta",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index f2807e5..6b9490e 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -496,7 +496,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Provedor",
         I18nKey::VoiceModelField => "Modelo",
         I18nKey::VoiceVoiceField => "Voz",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "Todos",
         I18nKey::VoiceGenderMale => "Macho",
         I18nKey::VoiceGenderFemale => "Fêmea",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index f6c11ec..30df2f7 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -494,7 +494,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Поставщик",
         I18nKey::VoiceModelField => "Модель",
         I18nKey::VoiceVoiceField => "Голос",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "Все",
         I18nKey::VoiceGenderMale => "Мужской",
         I18nKey::VoiceGenderFemale => "Женский",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index 468393d..d55e4ad 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -480,7 +480,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "提供者",
         I18nKey::VoiceModelField => "模型",
         I18nKey::VoiceVoiceField => "嗓音",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "全部",
         I18nKey::VoiceGenderMale => "男性",
         I18nKey::VoiceGenderFemale => "女性",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index 0c83145..edf1002 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -480,7 +480,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "提供者",
         I18nKey::VoiceModelField => "模型",
         I18nKey::VoiceVoiceField => "嗓音",
-        I18nKey::VoiceVoicesAwsOnly => "Select AWS as provider to choose a Polly voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
         I18nKey::VoiceGenderAll => "全部",
         I18nKey::VoiceGenderMale => "男性",
         I18nKey::VoiceGenderFemale => "女性",
diff --git a/src/workbench/harness_voice_pane/mod.rs b/src/workbench/harness_voice_pane/mod.rs
index d4a791a..7488d65 100644
--- a/src/workbench/harness_voice_pane/mod.rs
+++ b/src/workbench/harness_voice_pane/mod.rs
@@ -194,44 +194,80 @@ fn voice_provider_label(i18n: &I18nService, provider: VoiceProviderKind) -> Stri
 }
 
 fn apply_voice_provider_defaults(next: &mut VoiceSettings, provider: VoiceProviderKind) {
-    if provider == VoiceProviderKind::Aws {
-        if !next.stt.model_id.contains("transcribe") {
-            next.stt.model_id = "amazon-transcribe".into();
-        }
-        if !matches!(next.tts.model_id.as_str(), "neural" | "standard") {
-            next.tts.model_id = "neural".into();
+    match provider {
+        VoiceProviderKind::Aws => {
+            if !next.stt.model_id.contains("transcribe") {
+                next.stt.model_id = "amazon-transcribe".into();
+            }
+            if !matches!(next.tts.model_id.as_str(), "neural" | "standard") {
+                next.tts.model_id = "neural".into();
+            }
+            if next.tts.voice.is_empty() || is_openai_voice_id(&next.tts.voice) {
+                next.tts.voice = "Joanna".into();
+            }
         }
-        if next.tts.voice.is_empty() || is_openai_voice_id(&next.tts.voice) {
-            next.tts.voice = "Joanna".into();
+        VoiceProviderKind::Openai => {
+            if next.tts.voice.is_empty() || is_aws_polly_voice_id(&next.tts.voice) {
+                next.tts.voice = "nova".into();
+            }
         }
+        VoiceProviderKind::Openrouter => {}
     }
 }
 
-fn fixed_aws_polly_voices() -> Vec<VoiceEntry> {
-    [
-        ("Joanna", "Joanna", VoiceGender::Female),
-        ("Matthew", "Matthew", VoiceGender::Male),
-        ("Amy", "Amy", VoiceGender::Female),
-        ("Brian", "Brian", VoiceGender::Male),
-        ("Ivy", "Ivy", VoiceGender::Female),
-        ("Justin", "Justin", VoiceGender::Male),
-    ]
-    .into_iter()
-    .map(|(id, label, gender)| VoiceEntry {
+fn voice_entry(id: &str, label: &str, gender: VoiceGender) -> VoiceEntry {
+    VoiceEntry {
         id: id.into(),
         label: label.into(),
         gender,
-    })
-    .collect()
+    }
 }
 
-fn is_openai_voice_id(id: &str) -> bool {
+/// Six curated OpenAI built-in TTS voices (see OpenAI Audio API speech guide).
+fn fixed_openai_voices() -> Vec<VoiceEntry> {
+    vec![
+        voice_entry("alloy", "Alloy", VoiceGender::Neutral),
+        voice_entry("nova", "Nova", VoiceGender::Female),
+        voice_entry("echo", "Echo", VoiceGender::Male),
+        voice_entry("shimmer", "Shimmer", VoiceGender::Female),
+        voice_entry("onyx", "Onyx", VoiceGender::Male),
+        voice_entry("coral", "Coral", VoiceGender::Female),
+    ]
+}
+
+fn fixed_aws_polly_voices() -> Vec<VoiceEntry> {
+    vec![
+        voice_entry("Joanna", "Joanna", VoiceGender::Female),
+        voice_entry("Matthew", "Matthew", VoiceGender::Male),
+        voice_entry("Amy", "Amy", VoiceGender::Female),
+        voice_entry("Brian", "Brian", VoiceGender::Male),
+        voice_entry("Ivy", "Ivy", VoiceGender::Female),
+        voice_entry("Justin", "Justin", VoiceGender::Male),
+    ]
+}
+
+fn voice_catalog_for(provider: VoiceProviderKind) -> Vec<VoiceEntry> {
+    match provider {
+        VoiceProviderKind::Openai | VoiceProviderKind::Openrouter => fixed_openai_voices(),
+        VoiceProviderKind::Aws => fixed_aws_polly_voices(),
+    }
+}
+
+fn voices_pick_enabled(provider: VoiceProviderKind) -> bool {
     matches!(
-        id,
-        "alloy" | "ash" | "ballad" | "coral" | "echo" | "fable" | "nova" | "onyx" | "sage" | "shimmer"
+        provider,
+        VoiceProviderKind::Openai | VoiceProviderKind::Aws
     )
 }
 
+fn is_openai_voice_id(id: &str) -> bool {
+    fixed_openai_voices().iter().any(|v| v.id == id)
+}
+
+fn is_aws_polly_voice_id(id: &str) -> bool {
+    fixed_aws_polly_voices().iter().any(|v| v.id == id)
+}
+
 fn focus_voice_provider_option(provider: VoiceProviderKind) {
     let id = format!("voice-provider-option-{}", provider.as_str());
     if let Some(doc) = web_sys::window().and_then(|w| w.document()) {
@@ -887,13 +923,14 @@ fn VoicePickCard(
 #[component]
 fn VoicePicksGrid(
     settings: RwSignal<Option<VoiceSettings>>,
+    voice_provider: RwSignal<VoiceProviderKind>,
     voice_id: String,
     gender_filter: RwSignal<GenderFilter>,
-    voices_pick_enabled: Memo<bool>,
     on_pick: Callback<String>,
 ) -> impl IntoView {
     let i18n = expect_context::<I18nService>();
-    let catalog = fixed_aws_polly_voices();
+    let picks_enabled =
+        Memo::new(move |_| voices_pick_enabled(voice_provider.get()));
     view! {
         <div class="voice-pane__voice-picks">
             <div class="voice-pane__gender-row">
@@ -904,19 +941,20 @@ fn VoicePicksGrid(
             </div>
             <p
                 class="voice-pane__hint voice-pane__hint--aws-only"
-                class:voice-pane__hint--visible=move || !voices_pick_enabled.get()
+                class:voice-pane__hint--visible=move || !picks_enabled.get()
             >
                 {move || i18n.tr(I18nKey::VoiceVoicesAwsOnly)()}
             </p>
             <div
                 class="voice-pane__voice-grid voice-pane__voice-grid--six"
-                class:voice-pane__voice-grid--disabled=move || !voices_pick_enabled.get()
-                aria-disabled=move || if voices_pick_enabled.get() { "false" } else { "true" }
+                class:voice-pane__voice-grid--disabled=move || !picks_enabled.get()
+                aria-disabled=move || if picks_enabled.get() { "false" } else { "true" }
             >
                 {move || {
                     let active = voice_id.clone();
                     let filter = gender_filter.get();
-                    let picks_disabled = !voices_pick_enabled.get();
+                    let picks_disabled = !picks_enabled.get();
+                    let catalog = voice_catalog_for(voice_provider.get());
                     catalog
                         .iter()
                         .filter(|v| filter.matches(v.gender))
@@ -947,17 +985,15 @@ fn VoicePickerBlock(
     on_pick: Callback<String>,
 ) -> impl IntoView {
     let i18n = expect_context::<I18nService>();
-    let voices_pick_enabled =
-        Memo::new(move |_| voice_provider.get() == VoiceProviderKind::Aws);
 
     view! {
         <div class="voice-pane__field">
             <label>{move || i18n.tr(I18nKey::VoiceVoiceField)()}</label>
             <VoicePicksGrid
                 settings=settings
+                voice_provider=voice_provider
                 voice_id=voice_id.clone()
                 gender_filter=gender_filter
-                voices_pick_enabled=voices_pick_enabled
                 on_pick=on_pick
             />
         </div>

From eb0e753c158d2282f9a1a04664c5091611dca446 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 08:58:18 +0200
Subject: [PATCH 45/48] refactor(voice): remove unused voice provider
 functionality and streamline voice commands

- Deleted the `voice_provider_voices` function and associated structures, simplifying the voice command interface.
- Updated documentation to reflect the removal of the `voice_provider_voices` command, ensuring clarity for developers.
- Cleaned up related files by removing references to the deleted voice provider functionality, enhancing maintainability.
---
 docs/developer/tauri-ipc.md     |  2 +-
 docs/developer/voice.md         |  1 -
 src-tauri/src/lib.rs            |  3 +-
 src-tauri/src/voice/commands.rs | 24 -----------
 src-tauri/src/voice/mod.rs      |  2 -
 src-tauri/src/voice/voices.rs   | 71 ---------------------------------
 src/tauri_bridge.rs             | 30 --------------
 7 files changed, 2 insertions(+), 131 deletions(-)
 delete mode 100644 src-tauri/src/voice/voices.rs

diff --git a/docs/developer/tauri-ipc.md b/docs/developer/tauri-ipc.md
index 8e46aed..703805d 100644
--- a/docs/developer/tauri-ipc.md
+++ b/docs/developer/tauri-ipc.md
@@ -93,7 +93,7 @@ Authoritative list from `src-tauri/src/lib.rs` (grouped for navigation):
 ### Voice
 
 - `voice_start_recording`, `voice_stop_and_transcribe`, `voice_cancel_recording`
-- `voice_settings_get`, `voice_settings_save`, `voice_provider_voices`, `voice_tts_preview`
+- `voice_settings_get`, `voice_settings_save`, `voice_tts_preview`
 
 Server-side agent tools (`environment_detect`, `shell_exec`, `git_*`, `web_*`, `subagents.run`, …) run inside provider/subagent HTTP loops, not as separate Tauri commands. See [Agent Harness](agent-harness.md) and [Subagents](subagents.md).
 
diff --git a/docs/developer/voice.md b/docs/developer/voice.md
index 5e3fbe7..c3d1cca 100644
--- a/docs/developer/voice.md
+++ b/docs/developer/voice.md
@@ -104,7 +104,6 @@ TTS currently supports OpenAI only. If another provider is selected, `tts::synth
 - `voice_cancel_recording`
 - `voice_settings_get`
 - `voice_settings_save`
-- `voice_provider_voices`
 - `voice_tts_preview`
 
 Keep new command arguments owned and serializable. Validate provider/model assumptions on the backend, not only in the settings UI.
diff --git a/src-tauri/src/lib.rs b/src-tauri/src/lib.rs
index 63c9e97..6239722 100644
--- a/src-tauri/src/lib.rs
+++ b/src-tauri/src/lib.rs
@@ -36,7 +36,7 @@ use updater::{
     BlxUpdaterState,
 };
 use voice::{
-    voice_cancel_recording, voice_provider_voices, voice_settings_get, voice_settings_save,
+    voice_cancel_recording, voice_settings_get, voice_settings_save,
     voice_start_recording, voice_stop_and_transcribe, voice_tts_preview, VoiceRecorderState,
 };
 use workbench_state::{
@@ -219,7 +219,6 @@ pub fn run() {
             voice_cancel_recording,
             voice_settings_get,
             voice_settings_save,
-            voice_provider_voices,
             voice_tts_preview,
             image_settings_get,
             image_settings_save,
diff --git a/src-tauri/src/voice/commands.rs b/src-tauri/src/voice/commands.rs
index 49a5a95..29b4783 100644
--- a/src-tauri/src/voice/commands.rs
+++ b/src-tauri/src/voice/commands.rs
@@ -10,7 +10,6 @@ use super::recorder::{self, VoiceRecorderState};
 use super::settings::{self, VoiceProviderKind, VoiceSettings};
 use super::stt;
 use super::tts;
-use super::voices::{self, VoiceEntry};
 
 #[derive(Serialize)]
 #[serde(rename_all = "camelCase")]
@@ -44,19 +43,6 @@ pub struct VoiceStopResponse {
     pub text: String,
 }
 
-#[derive(Deserialize)]
-#[serde(rename_all = "camelCase")]
-pub struct VoiceProviderRef {
-    pub provider: VoiceProviderKind,
-}
-
-#[derive(Serialize)]
-#[serde(rename_all = "camelCase")]
-pub struct VoiceProviderVoicesResponse {
-    pub provider: VoiceProviderKind,
-    pub voices: Vec<VoiceEntry>,
-}
-
 #[derive(Deserialize)]
 #[serde(rename_all = "camelCase")]
 pub struct VoiceTtsPreviewPayload {
@@ -138,16 +124,6 @@ pub fn voice_settings_save(app: AppHandle, patch: VoiceSettings) -> Result<Voice
     settings::save(&app, &patch)
 }
 
-#[tauri::command]
-pub fn voice_provider_voices(
-    payload: VoiceProviderRef,
-) -> Result<VoiceProviderVoicesResponse, String> {
-    Ok(VoiceProviderVoicesResponse {
-        provider: payload.provider,
-        voices: voices::voices_for(payload.provider),
-    })
-}
-
 #[tauri::command]
 pub async fn voice_tts_preview(
     app: AppHandle,
diff --git a/src-tauri/src/voice/mod.rs b/src-tauri/src/voice/mod.rs
index 0732fec..f6a428b 100644
--- a/src-tauri/src/voice/mod.rs
+++ b/src-tauri/src/voice/mod.rs
@@ -4,7 +4,6 @@
 //! - `recorder` – cpal capture into WAV files inside `app_cache_dir/voice/`.
 //! - `stt`      – multipart POST to OpenAI/OpenRouter audio transcription.
 //! - `tts`      – JSON POST to OpenAI speech endpoint, returns MP3 bytes.
-//! - `voices`   – static voice catalog with gender labels.
 //! - `settings` – `VoiceSettings` persisted alongside `agent_provider_settings.json`.
 //! - `commands` – Tauri command handlers.
 
@@ -13,7 +12,6 @@ pub mod recorder;
 pub mod settings;
 pub mod stt;
 pub mod tts;
-pub mod voices;
 
 pub use commands::*;
 pub use recorder::VoiceRecorderState;
diff --git a/src-tauri/src/voice/voices.rs b/src-tauri/src/voice/voices.rs
deleted file mode 100644
index 758ef59..0000000
--- a/src-tauri/src/voice/voices.rs
+++ /dev/null
@@ -1,71 +0,0 @@
-//! Static catalog of TTS voices per provider with a Gender hint.
-//!
-//! Sources: <https://platform.openai.com/docs/guides/text-to-speech>.
-
-use serde::{Deserialize, Serialize};
-
-use super::settings::VoiceProviderKind;
-
-#[derive(Clone, Copy, Debug, PartialEq, Eq, Serialize, Deserialize)]
-#[serde(rename_all = "camelCase")]
-pub enum VoiceGender {
-    Male,
-    Female,
-    Neutral,
-}
-
-#[derive(Clone, Debug, Serialize)]
-#[serde(rename_all = "camelCase")]
-pub struct VoiceEntry {
-    pub id: String,
-    pub label: String,
-    pub gender: VoiceGender,
-}
-
-pub fn voices_for(provider: VoiceProviderKind) -> Vec<VoiceEntry> {
-    match provider {
-        VoiceProviderKind::Openai => openai_voices(),
-        VoiceProviderKind::Openrouter => Vec::new(),
-        VoiceProviderKind::Aws => aws_polly_voices(),
-    }
-}
-
-fn openai_voices() -> Vec<VoiceEntry> {
-    let raw: &[(&str, &str, VoiceGender)] = &[
-        ("alloy", "Alloy", VoiceGender::Neutral),
-        ("ash", "Ash", VoiceGender::Male),
-        ("ballad", "Ballad", VoiceGender::Female),
-        ("coral", "Coral", VoiceGender::Female),
-        ("echo", "Echo", VoiceGender::Male),
-        ("fable", "Fable", VoiceGender::Neutral),
-        ("nova", "Nova", VoiceGender::Female),
-        ("onyx", "Onyx", VoiceGender::Male),
-        ("sage", "Sage", VoiceGender::Female),
-        ("shimmer", "Shimmer", VoiceGender::Female),
-    ];
-    raw.iter()
-        .map(|(id, label, gender)| VoiceEntry {
-            id: (*id).to_string(),
-            label: (*label).to_string(),
-            gender: *gender,
-        })
-        .collect()
-}
-
-fn aws_polly_voices() -> Vec<VoiceEntry> {
-    let raw: &[(&str, &str, VoiceGender)] = &[
-        ("Joanna", "Joanna", VoiceGender::Female),
-        ("Matthew", "Matthew", VoiceGender::Male),
-        ("Amy", "Amy", VoiceGender::Female),
-        ("Brian", "Brian", VoiceGender::Male),
-        ("Ivy", "Ivy", VoiceGender::Female),
-        ("Justin", "Justin", VoiceGender::Male),
-    ];
-    raw.iter()
-        .map(|(id, label, gender)| VoiceEntry {
-            id: (*id).to_string(),
-            label: (*label).to_string(),
-            gender: *gender,
-        })
-        .collect()
-}
diff --git a/src/tauri_bridge.rs b/src/tauri_bridge.rs
index 0521dae..6f01725 100644
--- a/src/tauri_bridge.rs
+++ b/src/tauri_bridge.rs
@@ -1885,14 +1885,6 @@ pub struct VoiceEntry {
     pub gender: VoiceGender,
 }
 
-#[derive(Clone, Debug, serde::Deserialize)]
-#[serde(rename_all = "camelCase")]
-pub struct VoiceProviderVoicesResponse {
-    #[allow(dead_code)]
-    pub provider: VoiceProviderKind,
-    pub voices: Vec<VoiceEntry>,
-}
-
 #[derive(Clone, Debug, serde::Deserialize)]
 #[serde(rename_all = "camelCase")]
 pub struct VoiceStartResponse {
@@ -1992,28 +1984,6 @@ pub async fn voice_settings_save(patch: VoiceSettings) -> Result<VoiceSettings,
     invoke_typed("voice_settings_save", Args { patch }).await
 }
 
-pub async fn voice_provider_voices(
-    provider: VoiceProviderKind,
-) -> Result<VoiceProviderVoicesResponse, String> {
-    #[derive(Serialize)]
-    #[serde(rename_all = "camelCase")]
-    struct Args {
-        payload: Payload,
-    }
-    #[derive(Serialize)]
-    #[serde(rename_all = "camelCase")]
-    struct Payload {
-        provider: VoiceProviderKind,
-    }
-    invoke_typed(
-        "voice_provider_voices",
-        Args {
-            payload: Payload { provider },
-        },
-    )
-    .await
-}
-
 pub async fn voice_tts_preview(
     provider: VoiceProviderKind,
     model_id: String,

From 896da7e6bfaf1ef44b24d4b6a960480b75320839 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 09:00:50 +0200
Subject: [PATCH 46/48] refactor(harness_ui, agent_provider): remove voice
 category and update agent provider pane

- Removed the voice category button from the settings dock, streamlining the UI.
- Replaced the voice pane with the agent provider pane in the settings view, enhancing consistency.
- Updated CSS styles for the agent provider pane to improve visual clarity and maintainability.
- Cleaned up redundant classes in the agent provider pane across multiple components.
---
 .../agent_provider_pane.css                   |  6 +++++-
 src/workbench/agent_provider_pane/mod.rs      |  2 +-
 src/workbench/harness_image_pane/mod.rs       |  2 +-
 src/workbench/harness_ui.rs                   |  5 ++---
 src/workbench/harness_voice_pane/mod.rs       | 20 +------------------
 5 files changed, 10 insertions(+), 25 deletions(-)

diff --git a/src/workbench/agent_provider_pane/agent_provider_pane.css b/src/workbench/agent_provider_pane/agent_provider_pane.css
index c31d266..0f4635c 100644
--- a/src/workbench/agent_provider_pane/agent_provider_pane.css
+++ b/src/workbench/agent_provider_pane/agent_provider_pane.css
@@ -176,11 +176,15 @@
   flex-wrap: wrap;
   align-items: baseline;
   gap: 0.35rem 0.65rem;
+  font-size: 0.75rem;
+  line-height: 1.35;
+  color: var(--text-muted, rgba(170, 175, 190, 0.72));
 }
 
 .agent-provider-pane__key-status {
   font-family: var(--font-mono);
-  font-size: 0.74rem;
+  font-size: 0.72rem;
+  color: var(--text-muted, rgba(170, 175, 190, 0.65));
 }
 
 .agent-provider-pane__actions {
diff --git a/src/workbench/agent_provider_pane/mod.rs b/src/workbench/agent_provider_pane/mod.rs
index 56a37fe..c4da278 100644
--- a/src/workbench/agent_provider_pane/mod.rs
+++ b/src/workbench/agent_provider_pane/mod.rs
@@ -599,7 +599,7 @@ pub fn AgentProviderPane() -> impl IntoView {
                             <ThinkingLevelPicker selected=thinking_level />
                         </label>
                     </div>
-                    <div class="agent-provider-pane__key-row harness-muted">
+                    <div class="agent-provider-pane__key-row">
                         <span>{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</span>
                         <span class="agent-provider-pane__key-status">
                             {move || {
diff --git a/src/workbench/harness_image_pane/mod.rs b/src/workbench/harness_image_pane/mod.rs
index d88729e..5907bfb 100644
--- a/src/workbench/harness_image_pane/mod.rs
+++ b/src/workbench/harness_image_pane/mod.rs
@@ -604,7 +604,7 @@ pub fn AgentImageColumn() -> impl IntoView {
                         />
                     </label>
                 </div>
-                <div class="agent-provider-pane__key-row harness-muted">
+                <div class="agent-provider-pane__key-row">
                     <span>{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</span>
                     <span class="agent-provider-pane__key-status">
                         {move || {
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index de6a2de..b729096 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -686,7 +686,6 @@ pub fn SettingsDock(
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Workspace label=I18nKey::HsCatWorkspace />
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::AgentProvider label=I18nKey::HsCatProvider />
                 <HarnessCatStaticBtn ui=ui cat=HarnessSettingsCategory::Memory label="Memory" />
-                <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Voice label=I18nKey::HsCatVoice />
             </nav>
 
             <div class="harness-settings-detail">
@@ -710,8 +709,8 @@ pub fn SettingsDock(
                         <MemorySettingsPane wb=wb />
                     }.into_any(),
                     HarnessSettingsCategory::Voice => view! {
-                        <crate::workbench::harness_voice_pane::VoicePane />
-                    }.into_any(),
+                        <crate::workbench::AgentProviderPane />
+                    }.into_any(), // legacy category → BLXCode Agent
                     HarnessSettingsCategory::Image => view! {
                         <crate::workbench::AgentProviderPane />
                     }.into_any(), // legacy category → BLXCode Agent
diff --git a/src/workbench/harness_voice_pane/mod.rs b/src/workbench/harness_voice_pane/mod.rs
index 7488d65..6218e95 100644
--- a/src/workbench/harness_voice_pane/mod.rs
+++ b/src/workbench/harness_voice_pane/mod.rs
@@ -423,7 +423,7 @@ pub fn AgentVoiceColumn() -> impl IntoView {
                                         on_select=Callback::new(on_voice_provider)
                                     />
                                 </label>
-                                <div class="agent-provider-pane__key-row harness-muted">
+                                <div class="agent-provider-pane__key-row">
                                     <span>{move || i18n.tr(I18nKey::ApiKeysManageHint)()}</span>
                                     <span class="agent-provider-pane__key-status">
                                         {move || {
@@ -473,24 +473,6 @@ pub fn AgentVoiceColumn() -> impl IntoView {
     }
 }
 
-#[component]
-pub fn VoicePane() -> impl IntoView {
-    let i18n = expect_context::<I18nService>();
-    view! {
-        <section class="harness-settings-pane voice-pane" aria-labelledby="voice-pane-title">
-            <header class="harness-settings-pane__head">
-                <h2 id="voice-pane-title">
-                    <LxIcon icon=icondata::LuMic width="1.1rem" height="1.1rem" />
-                    <span>{move || i18n.tr(I18nKey::VoicePaneTitle)()}</span>
-                </h2>
-            </header>
-            <div class="agent-provider-pane__col agent-provider-pane__col--standalone voice-pane-standalone">
-                <AgentVoiceColumn />
-            </div>
-        </section>
-    }
-}
-
 // ---------------------------------------------------------------------------
 // Shared voice provider dropdown (STT + TTS)
 // ---------------------------------------------------------------------------

From d9166614edddc647c7b3386f424ba9bc7465c490 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 09:10:48 +0200
Subject: [PATCH 47/48] feat(category_colors): add category color management to
 workspace settings

- Introduced a new section for managing category color presets in the workspace settings pane.
- Added localization support for category color features across multiple languages.
- Implemented functionality to add, update, and delete category color presets, enhancing user customization options.
- Refactored the workspace settings pane to integrate the new category colors section, improving overall UI organization.
---
 src/i18n/keys.rs                              |   5 +
 src/i18n/locales/de_de.rs                     |   5 +
 src/i18n/locales/en_us.rs                     |   5 +
 src/i18n/locales/es_es.rs                     |   5 +
 src/i18n/locales/fr_fr.rs                     |   5 +
 src/i18n/locales/hu_hu.rs                     |   5 +
 src/i18n/locales/it_it.rs                     |   5 +
 src/i18n/locales/ja_jp.rs                     |   5 +
 src/i18n/locales/ko_kr.rs                     |   5 +
 src/i18n/locales/pl_pl.rs                     |   5 +
 src/i18n/locales/pt_br.rs                     |   5 +
 src/i18n/locales/ru_ru.rs                     |   5 +
 src/i18n/locales/zh_cn.rs                     |   5 +
 src/i18n/locales/zh_tw.rs                     |   5 +
 src/workbench/harness_ui.rs                   | 190 +-----------------
 .../category_colors.rs                        | 164 +++++++++++++++
 src/workbench/workspace_settings_pane/mod.rs  |   5 +
 17 files changed, 242 insertions(+), 187 deletions(-)
 create mode 100644 src/workbench/workspace_settings_pane/category_colors.rs

diff --git a/src/i18n/keys.rs b/src/i18n/keys.rs
index 7143475..ba8c5f1 100644
--- a/src/i18n/keys.rs
+++ b/src/i18n/keys.rs
@@ -349,6 +349,11 @@ pub enum I18nKey {
     WsHeading,
     WsSectionPaths,
     WsSectionBrowser,
+    WsSectionCategoryColors,
+    WsCategoryColorsPresetPlaceholder,
+    WsCategoryColorsAdd,
+    WsCategoryColorsReset,
+    WsCategoryColorsDeleteAria,
     LayBrowserUrl,
     WsBrowserDefault,
     WsRootLabel,
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index c25bea6..0027eda 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -343,6 +343,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "Arbeitsplatz",
         I18nKey::WsSectionPaths => "Pfade & Sandbox",
         I18nKey::WsSectionBrowser => "Eingebetteter Browser",
+        I18nKey::WsSectionCategoryColors => "Kategorie-Farben",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "Name der Voreinstellung",
+        I18nKey::WsCategoryColorsAdd => "Hinzufügen",
+        I18nKey::WsCategoryColorsReset => "Zurücksetzen",
+        I18nKey::WsCategoryColorsDeleteAria => "Voreinstellung löschen",
         I18nKey::LayBrowserUrl => "Standard-URL des eingebetteten Browsers",
         I18nKey::WsBrowserDefault => "Voreinstellung:",
         I18nKey::WsRootLabel => "Arbeitsbereich/Sandbox-Root",
diff --git a/src/i18n/locales/en_us.rs b/src/i18n/locales/en_us.rs
index a339270..8977c24 100644
--- a/src/i18n/locales/en_us.rs
+++ b/src/i18n/locales/en_us.rs
@@ -381,6 +381,11 @@ Classic: Ctrl+O quick open, Ctrl+` new terminal, Ctrl+Shift+P palette."
         I18nKey::WsHeading => "Workspace",
         I18nKey::WsSectionPaths => "Paths & sandbox",
         I18nKey::WsSectionBrowser => "Embedded browser",
+        I18nKey::WsSectionCategoryColors => "Category colors",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "Preset name",
+        I18nKey::WsCategoryColorsAdd => "Add",
+        I18nKey::WsCategoryColorsReset => "Reset",
+        I18nKey::WsCategoryColorsDeleteAria => "Delete preset",
         I18nKey::LayBrowserUrl => "Default embedded browser URL",
         I18nKey::WsBrowserDefault => "Preset:",
         I18nKey::WsRootLabel => "Agent sandbox root",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index c9aff4e..b9b0546 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -343,6 +343,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "Espacio de trabajo",
         I18nKey::WsSectionPaths => "Rutas y sandbox",
         I18nKey::WsSectionBrowser => "Navegador integrado",
+        I18nKey::WsSectionCategoryColors => "Colores de categoría",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "Nombre del ajuste",
+        I18nKey::WsCategoryColorsAdd => "Añadir",
+        I18nKey::WsCategoryColorsReset => "Restablecer",
+        I18nKey::WsCategoryColorsDeleteAria => "Eliminar ajuste",
         I18nKey::LayBrowserUrl => "URL del navegador integrado predeterminado",
         I18nKey::WsBrowserDefault => "Programar:",
         I18nKey::WsRootLabel => "Raíz del espacio de trabajo/zona de pruebas",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index b1c0792..dac8839 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -345,6 +345,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "Espace de travail",
         I18nKey::WsSectionPaths => "Chemins et sandbox",
         I18nKey::WsSectionBrowser => "Navigateur intégré",
+        I18nKey::WsSectionCategoryColors => "Couleurs de catégorie",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "Nom du préréglage",
+        I18nKey::WsCategoryColorsAdd => "Ajouter",
+        I18nKey::WsCategoryColorsReset => "Réinitialiser",
+        I18nKey::WsCategoryColorsDeleteAria => "Supprimer le préréglage",
         I18nKey::LayBrowserUrl => "URL du navigateur intégré par défaut",
         I18nKey::WsBrowserDefault => "Préréglage :",
         I18nKey::WsRootLabel => "Racine de l'espace de travail/bac à sable",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index f82ac3a..78dc7e6 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -343,6 +343,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "Munkaterület",
         I18nKey::WsSectionPaths => "Útvonalak és sandbox",
         I18nKey::WsSectionBrowser => "Beágyazott böngésző",
+        I18nKey::WsSectionCategoryColors => "Kategória színek",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "Előbeállítás neve",
+        I18nKey::WsCategoryColorsAdd => "Hozzáadás",
+        I18nKey::WsCategoryColorsReset => "Visszaállítás",
+        I18nKey::WsCategoryColorsDeleteAria => "Előbeállítás törlése",
         I18nKey::LayBrowserUrl => "Alapértelmezett beágyazott böngésző URL",
         I18nKey::WsBrowserDefault => "Előre beállított:",
         I18nKey::WsRootLabel => "Munkaterület / sandbox gyökér",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index 0e30dcb..340b803 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -343,6 +343,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "Spazio di lavoro",
         I18nKey::WsSectionPaths => "Percorsi e sandbox",
         I18nKey::WsSectionBrowser => "Browser incorporato",
+        I18nKey::WsSectionCategoryColors => "Colori categoria",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "Nome preset",
+        I18nKey::WsCategoryColorsAdd => "Aggiungi",
+        I18nKey::WsCategoryColorsReset => "Reimposta",
+        I18nKey::WsCategoryColorsDeleteAria => "Elimina preset",
         I18nKey::LayBrowserUrl => "URL del browser incorporato predefinito",
         I18nKey::WsBrowserDefault => "Preimpostazione:",
         I18nKey::WsRootLabel => "Radice dell'area di lavoro/sandbox",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index bacc277..38426af 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -337,6 +337,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "ワークスペース",
         I18nKey::WsSectionPaths => "パスとサンドボックス",
         I18nKey::WsSectionBrowser => "埋め込みブラウザ",
+        I18nKey::WsSectionCategoryColors => "カテゴリの色",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "プリセット名",
+        I18nKey::WsCategoryColorsAdd => "追加",
+        I18nKey::WsCategoryColorsReset => "リセット",
+        I18nKey::WsCategoryColorsDeleteAria => "プリセットを削除",
         I18nKey::LayBrowserUrl => "デフォルトの埋め込みブラウザ URL",
         I18nKey::WsBrowserDefault => "プリセット：",
         I18nKey::WsRootLabel => "ワークスペース/サンドボックスのルート",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index 68c195a..ccd5a3e 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -337,6 +337,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "작업공간",
         I18nKey::WsSectionPaths => "경로 및 샌드박스",
         I18nKey::WsSectionBrowser => "내장 브라우저",
+        I18nKey::WsSectionCategoryColors => "카테고리 색상",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "프리셋 이름",
+        I18nKey::WsCategoryColorsAdd => "추가",
+        I18nKey::WsCategoryColorsReset => "초기화",
+        I18nKey::WsCategoryColorsDeleteAria => "프리셋 삭제",
         I18nKey::LayBrowserUrl => "기본 내장 브라우저 URL",
         I18nKey::WsBrowserDefault => "사전 설정:",
         I18nKey::WsRootLabel => "작업공간/샌드박스 루트",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index 407e27e..973a6a3 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -341,6 +341,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "Obszar roboczy",
         I18nKey::WsSectionPaths => "Ścieżki i piaskownica",
         I18nKey::WsSectionBrowser => "Wbudowana przeglądarka",
+        I18nKey::WsSectionCategoryColors => "Kolory kategorii",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "Nazwa presetu",
+        I18nKey::WsCategoryColorsAdd => "Dodaj",
+        I18nKey::WsCategoryColorsReset => "Resetuj",
+        I18nKey::WsCategoryColorsDeleteAria => "Usuń preset",
         I18nKey::LayBrowserUrl => "Domyślny adres URL wbudowanej przeglądarki",
         I18nKey::WsBrowserDefault => "Ustawienie wstępne:",
         I18nKey::WsRootLabel => "Katalog główny obszaru roboczego/piaskownicy",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index 6b9490e..5978eaf 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -343,6 +343,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "Espaço de trabalho",
         I18nKey::WsSectionPaths => "Caminhos e sandbox",
         I18nKey::WsSectionBrowser => "Navegador incorporado",
+        I18nKey::WsSectionCategoryColors => "Cores de categoria",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "Nome do preset",
+        I18nKey::WsCategoryColorsAdd => "Adicionar",
+        I18nKey::WsCategoryColorsReset => "Redefinir",
+        I18nKey::WsCategoryColorsDeleteAria => "Excluir preset",
         I18nKey::LayBrowserUrl => "URL do navegador incorporado padrão",
         I18nKey::WsBrowserDefault => "Predefinição:",
         I18nKey::WsRootLabel => "Raiz do espaço de trabalho/sandbox",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index 30df2f7..e3c2a98 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -341,6 +341,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "Рабочая область",
         I18nKey::WsSectionPaths => "Пути и песочница",
         I18nKey::WsSectionBrowser => "Встроенный браузер",
+        I18nKey::WsSectionCategoryColors => "Цвета категорий",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "Имя пресета",
+        I18nKey::WsCategoryColorsAdd => "Добавить",
+        I18nKey::WsCategoryColorsReset => "Сбросить",
+        I18nKey::WsCategoryColorsDeleteAria => "Удалить пресет",
         I18nKey::LayBrowserUrl => "URL-адрес встроенного браузера по умолчанию",
         I18nKey::WsBrowserDefault => "Предустановка:",
         I18nKey::WsRootLabel => "Корень рабочей области/песочницы",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index d55e4ad..35a5e60 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -335,6 +335,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "工作空间",
         I18nKey::WsSectionPaths => "路径与沙箱",
         I18nKey::WsSectionBrowser => "嵌入式浏览器",
+        I18nKey::WsSectionCategoryColors => "分类颜色",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "预设名称",
+        I18nKey::WsCategoryColorsAdd => "添加",
+        I18nKey::WsCategoryColorsReset => "重置",
+        I18nKey::WsCategoryColorsDeleteAria => "删除预设",
         I18nKey::LayBrowserUrl => "默认嵌入浏览器 URL",
         I18nKey::WsBrowserDefault => "预设：",
         I18nKey::WsRootLabel => "工作区/沙箱根目录",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index edf1002..dfb3570 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -335,6 +335,11 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsHeading => "工作空間",
         I18nKey::WsSectionPaths => "路徑與沙箱",
         I18nKey::WsSectionBrowser => "嵌入式瀏覽器",
+        I18nKey::WsSectionCategoryColors => "分類顏色",
+        I18nKey::WsCategoryColorsPresetPlaceholder => "預設名稱",
+        I18nKey::WsCategoryColorsAdd => "新增",
+        I18nKey::WsCategoryColorsReset => "重設",
+        I18nKey::WsCategoryColorsDeleteAria => "刪除預設",
         I18nKey::LayBrowserUrl => "預設嵌入瀏覽器 URL",
         I18nKey::WsBrowserDefault => "預設：",
         I18nKey::WsRootLabel => "工作區/沙箱根目錄",
diff --git a/src/workbench/harness_ui.rs b/src/workbench/harness_ui.rs
index b729096..cadf804 100644
--- a/src/workbench/harness_ui.rs
+++ b/src/workbench/harness_ui.rs
@@ -8,7 +8,7 @@ use super::browser_tab::sync_embedded_browser_layer;
 use super::harness_chords::handle_harness_keydown;
 use super::state::{
     workspace_entry_has_folder, BrowserEmbedSurface, HarnessSettingsCategory, HarnessUiService,
-    MemoryColorPreset, RecentWorkspaceItem, RightPanelTab, WorkbenchService,
+    RecentWorkspaceItem, RightPanelTab, WorkbenchService,
 };
 use super::update_service::{UpdateService, UpdateUiStatus};
 use crate::i18n::{lookup, I18nKey, Locale, APP_LOCALES};
@@ -18,7 +18,6 @@ use crate::tauri_bridge::{
     voice_settings_get, voice_settings_save, AgentHooksReport, VoiceSettings,
 };
 use gloo_timers::future::TimeoutFuture;
-use js_sys::Date;
 use leptos::leptos_dom::helpers::window_event_listener_untyped;
 use leptos::prelude::*;
 use leptos_icons::Icon as LxIcon;
@@ -685,7 +684,6 @@ pub fn SettingsDock(
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::ApiKeys label=I18nKey::HsCatApiKeys />
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::Workspace label=I18nKey::HsCatWorkspace />
                 <HarnessCatBtn ui=ui cat=HarnessSettingsCategory::AgentProvider label=I18nKey::HsCatProvider />
-                <HarnessCatStaticBtn ui=ui cat=HarnessSettingsCategory::Memory label="Memory" />
             </nav>
 
             <div class="harness-settings-detail">
@@ -706,8 +704,8 @@ pub fn SettingsDock(
                         <crate::workbench::AgentProviderPane />
                     }.into_any(),
                     HarnessSettingsCategory::Memory => view! {
-                        <MemorySettingsPane wb=wb />
-                    }.into_any(),
+                        <crate::workbench::WorkspaceSettingsPane wb=wb embed=embed />
+                    }.into_any(), // legacy category → Workspace
                     HarnessSettingsCategory::Voice => view! {
                         <crate::workbench::AgentProviderPane />
                     }.into_any(), // legacy category → BLXCode Agent
@@ -745,28 +743,6 @@ fn HarnessCatBtn(
     }
 }
 
-#[component]
-fn HarnessCatStaticBtn(
-    ui: HarnessUiService,
-    cat: HarnessSettingsCategory,
-    label: &'static str,
-) -> impl IntoView {
-    let icon = harness_settings_cat_icon(cat);
-    view! {
-        <button
-            type="button"
-            class:harness-cat-active=move || ui.settings_category().get() == cat
-            class="harness-cat-btn"
-            on:click=move |_| ui.settings_category().set(cat)
-        >
-            <span class="harness-cat-btn__icon" aria-hidden="true">
-                <LxIcon icon=icon width="0.92rem" height="0.92rem" />
-            </span>
-            <span class="harness-cat-btn__label">{label}</span>
-        </button>
-    }
-}
-
 fn focus_locale_option(loc: Locale) {
     let id = format!("locale-option-{}", loc.as_str());
     let Some(doc) = web_sys::window().and_then(|w| w.document()) else {
@@ -1152,166 +1128,6 @@ fn ApiKeysSettingsPane() -> impl IntoView {
     view! { <crate::workbench::ApiKeysPane /> }
 }
 
-#[component]
-fn MemorySettingsPane(wb: WorkbenchService) -> impl IntoView {
-    let new_label = RwSignal::new(String::new());
-    let new_color = RwSignal::new("#7dd3fc".to_string());
-
-    view! {
-        <article class="harness-pane memory-settings-pane">
-            <h3 class="harness-pane-title">
-                <span class="harness-pane-title__icon" aria-hidden="true">
-                    <LxIcon icon=icondata::LuPalette width="1.02rem" height="1.02rem" />
-                </span>
-                <span class="harness-pane-title__text">"Memory"</span>
-            </h3>
-            <section class="harness-subpane memory-presets">
-                <h4 class="harness-pane-subhead">
-                    <span class="harness-pane-subhead__icon" aria-hidden="true">
-                        <LxIcon icon=icondata::LuPalette width="0.82rem" height="0.82rem" />
-                    </span>
-                    <span>"Color presets"</span>
-                </h4>
-                <ol class="memory-preset-list">
-                    <For
-                        each=move || wb.memory_color_presets().get()
-                        key=|preset| preset.id.clone()
-                        children=move |preset: MemoryColorPreset| {
-                            let id_for_label = preset.id.clone();
-                            let id_for_color = preset.id.clone();
-                            let id_for_delete = preset.id.clone();
-                            view! {
-                                <li class="memory-preset-row">
-                                    <input
-                                        type="color"
-                                        class="memory-preset-row__color"
-                                        prop:value=preset.color.clone()
-                                        on:input=move |ev| {
-                                            if let Some(value) = harness_input_value(ev) {
-                                                update_memory_preset(wb, &id_for_color, None, Some(value));
-                                            }
-                                        }
-                                    />
-                                    <input
-                                        type="text"
-                                        class="workbench-plain-input memory-preset-row__name"
-                                        prop:value=preset.label.clone()
-                                        on:input=move |ev| {
-                                            if let Some(value) = harness_input_value(ev) {
-                                                update_memory_preset(wb, &id_for_label, Some(value), None);
-                                            }
-                                        }
-                                    />
-                                    <button
-                                        type="button"
-                                        class="workbench-mini-btn memory-preset-row__delete"
-                                        title="Delete preset"
-                                        aria-label="Delete preset"
-                                        on:click=move |_| {
-                                            let mut presets = wb.memory_color_presets().get_untracked();
-                                            presets.retain(|preset| preset.id != id_for_delete);
-                                            wb.set_memory_color_presets(presets);
-                                        }
-                                    >
-                                        <LxIcon icon=icondata::LuTrash2 width="0.78rem" height="0.78rem" />
-                                    </button>
-                                </li>
-                            }
-                        }
-                    />
-                </ol>
-                <form
-                    class="memory-preset-add"
-                    on:submit=move |ev: web_sys::SubmitEvent| {
-                        ev.prevent_default();
-                        let name = new_label.get_untracked().trim().to_string();
-                        if name.is_empty() {
-                            return;
-                        }
-                        let mut presets = wb.memory_color_presets().get_untracked();
-                        presets.push(MemoryColorPreset {
-                            id: format!("custom-{}", Date::now() as i64),
-                            label: name,
-                            color: normalize_settings_color(&new_color.get_untracked()),
-                        });
-                        wb.set_memory_color_presets(presets);
-                        new_label.set(String::new());
-                    }
-                >
-                    <input
-                        type="color"
-                        class="memory-preset-row__color"
-                        prop:value=move || new_color.get()
-                        on:input=move |ev| {
-                            if let Some(value) = harness_input_value(ev) {
-                                new_color.set(value);
-                            }
-                        }
-                    />
-                    <input
-                        type="text"
-                        class="workbench-plain-input"
-                        placeholder="Preset name"
-                        prop:value=move || new_label.get()
-                        on:input=move |ev| {
-                            if let Some(value) = harness_input_value(ev) {
-                                new_label.set(value);
-                            }
-                        }
-                    />
-                    <button type="submit" class="workbench-mini-btn workbench-mini-btn--primary">
-                        <span class="harness-btn-inline">
-                            <LxIcon icon=icondata::LuPlus width="0.78rem" height="0.78rem" />
-                            <span>"Add"</span>
-                        </span>
-                    </button>
-                    <button
-                        type="button"
-                        class="workbench-mini-btn"
-                        on:click=move |_| wb.reset_memory_color_presets()
-                    >"Reset"</button>
-                </form>
-            </section>
-        </article>
-    }
-}
-
-fn harness_input_value(ev: web_sys::Event) -> Option<String> {
-    ev.target()
-        .and_then(|target| target.dyn_into::<web_sys::HtmlInputElement>().ok())
-        .map(|input| input.value())
-}
-
-fn update_memory_preset(
-    wb: WorkbenchService,
-    id: &str,
-    label: Option<String>,
-    color: Option<String>,
-) {
-    let mut presets = wb.memory_color_presets().get_untracked();
-    if let Some(preset) = presets.iter_mut().find(|preset| preset.id == id) {
-        if let Some(label) = label {
-            preset.label = label;
-        }
-        if let Some(color) = color {
-            preset.color = normalize_settings_color(&color);
-        }
-    }
-    wb.set_memory_color_presets(presets);
-}
-
-fn normalize_settings_color(raw: &str) -> String {
-    let trimmed = raw.trim();
-    if trimmed.len() == 7
-        && trimmed.starts_with('#')
-        && trimmed.chars().skip(1).all(|ch| ch.is_ascii_hexdigit())
-    {
-        trimmed.to_ascii_lowercase()
-    } else {
-        "#7dd3fc".into()
-    }
-}
-
 fn hook_brand_icon(agent: &str) -> Option<&'static str> {
     match agent {
         "claude" => Some("/public/brand-icons/anthropic.svg"),
diff --git a/src/workbench/workspace_settings_pane/category_colors.rs b/src/workbench/workspace_settings_pane/category_colors.rs
new file mode 100644
index 0000000..a5ff12c
--- /dev/null
+++ b/src/workbench/workspace_settings_pane/category_colors.rs
@@ -0,0 +1,164 @@
+//! Workspace settings — memory category color presets.
+
+use crate::workbench::state::{MemoryColorPreset, WorkbenchService};
+use crate::i18n::I18nKey;
+use crate::service::I18nService;
+use js_sys::Date;
+use leptos::prelude::*;
+use leptos_icons::Icon as LxIcon;
+use wasm_bindgen::JsCast;
+
+fn input_value(ev: web_sys::Event) -> Option<String> {
+    ev.target()
+        .and_then(|target| target.dyn_into::<web_sys::HtmlInputElement>().ok())
+        .map(|input| input.value())
+}
+
+fn normalize_settings_color(raw: &str) -> String {
+    let trimmed = raw.trim();
+    if trimmed.len() == 7
+        && trimmed.starts_with('#')
+        && trimmed.chars().skip(1).all(|ch| ch.is_ascii_hexdigit())
+    {
+        trimmed.to_ascii_lowercase()
+    } else {
+        "#7dd3fc".into()
+    }
+}
+
+fn update_memory_preset(
+    wb: WorkbenchService,
+    id: &str,
+    label: Option<String>,
+    color: Option<String>,
+) {
+    let mut presets = wb.memory_color_presets().get_untracked();
+    if let Some(preset) = presets.iter_mut().find(|preset| preset.id == id) {
+        if let Some(label) = label {
+            preset.label = label;
+        }
+        if let Some(color) = color {
+            preset.color = normalize_settings_color(&color);
+        }
+    }
+    wb.set_memory_color_presets(presets);
+}
+
+#[component]
+pub fn WorkspaceCategoryColorsSection(wb: WorkbenchService) -> impl IntoView {
+    let i18n = expect_context::<I18nService>();
+    let new_label = RwSignal::new(String::new());
+    let new_color = RwSignal::new("#7dd3fc".to_string());
+
+    view! {
+        <section class="harness-subpane memory-presets">
+            <h4 class="harness-pane-subhead">
+                <span class="harness-pane-subhead__icon" aria-hidden="true">
+                    <LxIcon icon=icondata::LuPalette width="0.82rem" height="0.82rem" />
+                </span>
+                <span class="harness-pane-subhead__text">{move || i18n.tr(I18nKey::WsSectionCategoryColors)()}</span>
+            </h4>
+            <ol class="memory-preset-list">
+                <For
+                    each=move || wb.memory_color_presets().get()
+                    key=|preset| preset.id.clone()
+                    children=move |preset: MemoryColorPreset| {
+                        let id_for_label = preset.id.clone();
+                        let id_for_color = preset.id.clone();
+                        let id_for_delete = preset.id.clone();
+                        view! {
+                            <li class="memory-preset-row">
+                                <input
+                                    type="color"
+                                    class="memory-preset-row__color"
+                                    prop:value=preset.color.clone()
+                                    on:input=move |ev| {
+                                        if let Some(value) = input_value(ev) {
+                                            update_memory_preset(wb, &id_for_color, None, Some(value));
+                                        }
+                                    }
+                                />
+                                <input
+                                    type="text"
+                                    class="workbench-plain-input memory-preset-row__name"
+                                    prop:value=preset.label.clone()
+                                    on:input=move |ev| {
+                                        if let Some(value) = input_value(ev) {
+                                            update_memory_preset(wb, &id_for_label, Some(value), None);
+                                        }
+                                    }
+                                />
+                                <button
+                                    type="button"
+                                    class="workbench-mini-btn memory-preset-row__delete"
+                                    title=move || i18n.tr(I18nKey::WsCategoryColorsDeleteAria)()
+                                    aria-label=move || i18n.tr(I18nKey::WsCategoryColorsDeleteAria)()
+                                    on:click=move |_| {
+                                        let mut presets = wb.memory_color_presets().get_untracked();
+                                        presets.retain(|preset| preset.id != id_for_delete);
+                                        wb.set_memory_color_presets(presets);
+                                    }
+                                >
+                                    <LxIcon icon=icondata::LuTrash2 width="0.78rem" height="0.78rem" />
+                                </button>
+                            </li>
+                        }
+                    }
+                />
+            </ol>
+            <form
+                class="memory-preset-add"
+                on:submit=move |ev: web_sys::SubmitEvent| {
+                    ev.prevent_default();
+                    let name = new_label.get_untracked().trim().to_string();
+                    if name.is_empty() {
+                        return;
+                    }
+                    let mut presets = wb.memory_color_presets().get_untracked();
+                    presets.push(MemoryColorPreset {
+                        id: format!("custom-{}", Date::now() as i64),
+                        label: name,
+                        color: normalize_settings_color(&new_color.get_untracked()),
+                    });
+                    wb.set_memory_color_presets(presets);
+                    new_label.set(String::new());
+                }
+            >
+                <input
+                    type="color"
+                    class="memory-preset-row__color"
+                    prop:value=move || new_color.get()
+                    on:input=move |ev| {
+                        if let Some(value) = input_value(ev) {
+                            new_color.set(value);
+                        }
+                    }
+                />
+                <input
+                    type="text"
+                    class="workbench-plain-input"
+                    placeholder=move || i18n.tr(I18nKey::WsCategoryColorsPresetPlaceholder)()
+                    prop:value=move || new_label.get()
+                    on:input=move |ev| {
+                        if let Some(value) = input_value(ev) {
+                            new_label.set(value);
+                        }
+                    }
+                />
+                <button type="submit" class="workbench-mini-btn workbench-mini-btn--primary">
+                    <span class="harness-btn-inline">
+                        <LxIcon icon=icondata::LuPlus width="0.78rem" height="0.78rem" />
+                        <span>{move || i18n.tr(I18nKey::WsCategoryColorsAdd)()}</span>
+                    </span>
+                </button>
+                <button
+                    type="button"
+                    class="workbench-mini-btn"
+                    on:click=move |_| wb.reset_memory_color_presets()
+                >
+                    {move || i18n.tr(I18nKey::WsCategoryColorsReset)()}
+                </button>
+            </form>
+        </section>
+    }
+}
diff --git a/src/workbench/workspace_settings_pane/mod.rs b/src/workbench/workspace_settings_pane/mod.rs
index 33af6ab..a48034e 100644
--- a/src/workbench/workspace_settings_pane/mod.rs
+++ b/src/workbench/workspace_settings_pane/mod.rs
@@ -1,7 +1,10 @@
 //! Workspace settings pane — same row/list layout as API Keys (`api-keys-row`).
 
+mod category_colors;
+
 use super::browser_tab::sync_embedded_browser_layer;
 use super::state::{BrowserEmbedSurface, WorkbenchService};
+use category_colors::WorkspaceCategoryColorsSection;
 use crate::config::HARNESS_BROWSER_DEFAULT_URL;
 use crate::i18n::I18nKey;
 use crate::service::I18nService;
@@ -209,6 +212,8 @@ pub fn WorkspaceSettingsPane(
                 </ul>
             </section>
 
+            <WorkspaceCategoryColorsSection wb=wb />
+
             <Show when=move || status_msg.with(|m| m.is_some())>
                 <p class="harness-status">{move || status_msg.get().unwrap_or_default()}</p>
             </Show>

From 8bc65803dcc73aa824813762c7dcee90c85b6029 Mon Sep 17 00:00:00 2001
From: iptoux <iptoux@gmail.com>
Date: Fri, 22 May 2026 09:14:45 +0200
Subject: [PATCH 48/48] docs: settings revamp changelog, user/dev guides, close
 api-keys plan

Document docked center-tab settings, centralized API Keys, BLXCode Agent
grid (text/image/voice), Workspace category colors, and removed Image/Voice/
Memory nav entries. Mark api-keys-centralized plan done; refresh PR-facing
docs and Unreleased CHANGELOG from branch work.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 .agents/plans/PLANS.md                |  2 +-
 .agents/plans/api-keys-centralized.md | 35 +++++++----------
 CHANGELOG.md                          | 12 ++++--
 docs/README.md                        |  2 +
 docs/developer/agent-harness.md       | 15 +++++--
 docs/developer/tauri-ipc.md           |  7 ++--
 docs/user/agent-harness.md            | 34 +++++++++-------
 docs/user/agent-providers.md          | 22 +++++------
 docs/user/getting-started.md          | 14 +++----
 docs/user/image.md                    | 12 +++---
 docs/user/settings.md                 | 56 +++++++++++++++++++++++++++
 docs/user/troubleshooting.md          |  8 ++--
 docs/user/voice.md                    | 25 +++++-------
 docs/user/workspaces.md               | 14 +++++++
 src/i18n/locales/de_de.rs             |  4 +-
 src/i18n/locales/es_es.rs             | 20 +++++-----
 src/i18n/locales/fr_fr.rs             | 18 ++++-----
 src/i18n/locales/hu_hu.rs             | 20 +++++-----
 src/i18n/locales/it_it.rs             | 24 ++++++------
 src/i18n/locales/ja_jp.rs             | 22 +++++------
 src/i18n/locales/ko_kr.rs             | 20 +++++-----
 src/i18n/locales/pl_pl.rs             | 18 ++++-----
 src/i18n/locales/pt_br.rs             | 20 +++++-----
 src/i18n/locales/ru_ru.rs             | 24 ++++++------
 src/i18n/locales/zh_cn.rs             | 22 +++++------
 src/i18n/locales/zh_tw.rs             | 22 +++++------
 26 files changed, 282 insertions(+), 210 deletions(-)
 create mode 100644 docs/user/settings.md

diff --git a/.agents/plans/PLANS.md b/.agents/plans/PLANS.md
index 27fd46f..7bec3d5 100644
--- a/.agents/plans/PLANS.md
+++ b/.agents/plans/PLANS.md
@@ -20,4 +20,4 @@ Persistent plans for multi-step work on **blxcode**. Individual plans live as Ma
 | done | [better-harness.md](better-harness.md) | BetterHarness: Shrink system prompt by extracting tool docs into 6 embedded Core Skills; Skills tab gets Core/User sub-tabs |
 | done | [agent-chat-maximize.md](agent-chat-maximize.md) | Agent-Tab: Chat-Maximize-Toggle vor Reset; Voice-Hero kompakt (`agent-hero--compact`), mehr Platz fuer Chat-Verlauf |
 | planned | [workspace-color-terminal-badge.md](workspace-color-terminal-badge.md) | Workspace-Farbe persistent in Sidebar (Dot, farbiges Unread-Badge), Terminal-Slot-Zahl vor Name, aenderbar via Kontextmenue-Dialog |
-| planned | [api-keys-centralized.md](api-keys-centralized.md) | API-Schlüssel zentral unter Settings → API Keys; Backend-Katalog + resolve; Agent-Tab ohne Key-Felder; Coming-soon-Provider mit CRUD |
+| done | [api-keys-centralized.md](api-keys-centralized.md) | API-Schlüssel zentral unter Settings → API Keys; Backend-Katalog + resolve; Agent-Tab ohne Key-Felder; Coming-soon-Provider mit CRUD |
diff --git a/.agents/plans/api-keys-centralized.md b/.agents/plans/api-keys-centralized.md
index a388976..6a7bfa6 100644
--- a/.agents/plans/api-keys-centralized.md
+++ b/.agents/plans/api-keys-centralized.md
@@ -38,27 +38,20 @@ Zentrale API-Schlüssel unter **Settings → API Keys**. UI folgt **App**- und *
 
 ## Tasks (in Ausführungsreihenfolge)
 
-1. [ ] **`api-keys-backend`** — Katalog-Struct, Storage (Keyring/Datei), `api_keys_apply`, `api_keys::resolve`, One-shot-Migration aus altem `agent_api_key_set`-Store, Env-Fallback-Logik.
-   _Blockiert von: —_
-2. [ ] **`api-keys-bridge`** — `tauri_bridge.rs` + `agent_wire.rs`: neue Batch-Typen + Wrapper; alte `agent_api_key_set/delete` Wrapper entfernen.
-   _Blockiert von: `api-keys-backend`_
-3. [ ] **`settings-scaffold`** — `src/workbench/settings/mod.rs` neu (folgt Harness-Stil), Routing/Tab in Sidebar/Right-Panel.
-   _Blockiert von: —_ (parallel zu Backend möglich)
-4. [ ] **`api-keys-ui`** — Pane unter Settings → API Keys: ein Save-Footer, Discard-Button, Draft-State, Per-Row-Remove, Verlassen-Warnung bei Dirty-State, „via env"-Hinweis.
-   _Blockiert von: `api-keys-bridge`, `settings-scaffold`_
-5. [ ] **`runtime-wiring`** — Agent/Subagent/Image/Voice/Web/Model-Refresh auf `provider_key_pub` / `resolve` umstellen; Image/Voice-Settings: Key-Felder aus Struct + UI entfernen; Fehlermeldungen umtexten.
-   _Blockiert von: `api-keys-backend`_
-6. [ ] **`agent-pane-trim`** — Key-Eingabe im Agent-Pane entfernen (Verweis auf Settings → API Keys).
-   _Blockiert von: `api-keys-ui`, `runtime-wiring`_
-7. [ ] **`i18n-docs`** — Locales (API-Keys-Kategorie/Headings sind teilweise schon gelandet — siehe Commits `1b66656`, `e67c03a`; ergänzen statt neu), Doc-Update, neue Fehlertexte.
-   _Blockiert von: `api-keys-ui`, `runtime-wiring`_
+1. [x] **`api-keys-backend`** — Katalog-Struct, Storage (Keyring/Datei), `api_keys_apply`, `api_keys::resolve`, One-shot-Migration aus altem `agent_api_key_set`-Store, Env-Fallback-Logik.
+2. [x] **`api-keys-bridge`** — `tauri_bridge.rs`: `api_keys_status` / `api_keys_apply`; alte per-provider key commands entfernt.
+3. [x] **`settings-scaffold`** — Docked center settings tab + sidebar categories (`harness_ui.rs` / `SettingsDock`).
+4. [x] **`api-keys-ui`** — `api_keys_pane/`: Save/Discard footer, draft state, per-row remove, „via env" hint, brand icons.
+5. [x] **`runtime-wiring`** — Agent/Subagent/Image/Voice/Web/Model-Refresh über zentralen resolve; Image/Voice ohne eigene Key-Felder.
+6. [x] **`agent-pane-trim`** — BLXCode Agent: nur Status-Hinweis → API Keys (Text/Image/Voice).
+7. [x] **`i18n-docs`** — Locales + user/developer docs + CHANGELOG (PR #13 branch).
 
 ## Acceptance Criteria
 
-- [ ] Subagent läuft mit zentral gesetztem Key (kein separater Lookup-Pfad).
-- [ ] Image-Fehlermeldung verweist auf **Settings → API Keys** (nicht mehr „Image-Einstellungen").
-- [ ] Agent-Pane enthält kein Key-Eingabefeld mehr.
-- [ ] Migration-Smoke: Vorhandene Pro-Provider-Keys (alter Store) sind nach erstem Start im zentralen Katalog lesbar; alter Store geleert.
-- [ ] `agent_api_key_set` / `agent_api_key_delete` (Backend-Command + Bridge-Wrapper) sind aus dem Repo entfernt.
-- [ ] Env-Fallback: Bei leerem Store-Eintrag wird `BLX_ANTHROPIC_API_KEY` gelesen; UI zeigt „via env".
-- [ ] Discard-Button verwirft Draft; Verlassen mit Dirty-State löst Bestätigung aus.
+- [x] Subagent läuft mit zentral gesetztem Key (kein separater Lookup-Pfad).
+- [x] Image-Fehlermeldung verweist auf **Settings → API Keys** (nicht mehr „Image-Einstellungen").
+- [x] Agent-Pane enthält kein Key-Eingabefeld mehr.
+- [x] Migration-Smoke: Vorhandene Pro-Provider-Keys (alter Store) sind nach erstem Start im zentralen Katalog lesbar; alter Store geleert.
+- [x] `agent_api_key_set` / `agent_api_key_delete` (Backend-Command + Bridge-Wrapper) sind aus dem Repo entfernt.
+- [x] Env-Fallback: Bei leerem Store-Eintrag wird `BLX_*` env gelesen; UI zeigt „via env".
+- [x] Discard-Button verwirft Draft; Dirty-State im Footer sichtbar.
diff --git a/CHANGELOG.md b/CHANGELOG.md
index ef34fc3..0ca5903 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -16,13 +16,18 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - **Boot loading screen**: new branded loading experience that paints before the WASM bundle is ready and stays on screen until the workbench is mounted. `index.html` ships a static `#blx-static-boot` section (logo, eyebrow, faux workbench preview, animated rail) so the first paint happens immediately on Trunk-served HTML; once Leptos mounts, the static node is removed and `BootLoadingScreen` (`src/boot_loading.rs`) takes over with phased copy (`Starting BLXCode` → `Restoring workspace` → `Opening workbench`). 306 lines of dedicated CSS in `styles.css` add the radial-gradient backdrop, frame-enter / sheen / rail keyframes, and the sidebar/main/panel preview skeleton. The `App` boot fallback now renders `<BootLoadingScreen phase=app_boot_phase.get()/>` instead of the prior empty `app-shell--boot` div.
 - **Agent question card (`harness.ask_user`)**: new client-side tool that lets the coordinator agent ask a clarifying multiple-choice question and receive the user's answer as a structured tool result. Backend registers `harness.ask_user` (`src-tauri/src/agent/tools.rs`) with a JSON schema accepting `question`, optional `header` (≤12 chars), 2–4 `options` (label + optional description), `multiSelect`, and `allowOther`; the tool sits in the `CoordinatorHarness` group (subagents excluded) and the system prompt instructs the model to use it only when 2–4 distinct options would unblock progress. Frontend adds a new `TimelineItem::AskUser` variant and `ask_user_card/` component (Angular-style folder with co-located CSS) rendering a chat bubble with numbered option buttons, single- or multi-select mode, an optional free-text “Other” field, and a cancel button; the card submits via `agent_submit_tool_result` and transitions the row state to `Answered { selected, other }` or `Cancelled` so the bubble stays visible with disabled controls. Persistence drops `Open` ask-user rows from the saved timeline (the awaiting backend loop is dead after reload). Tool-result payload: `{ "selected": [...], "other": "...", "cancelled": false }`; on cancel: `ok=false` + `{ "cancelled": true }`. 8 new i18n keys (`AgAskUser*`) added in `en_us.rs` and `de_de.rs`; other locales receive English placeholders pending a `render_i18n_locales_from_en.py` pass.
 - **Centralized API Keys settings**: new **Settings → API Keys** pane (`src/workbench/api_keys_pane/`) replaces per-provider key inputs that previously lived under Settings → Agent. Backend module `src-tauri/src/api_keys.rs` exposes `api_keys_status` (catalog of LLM + search providers with masked values, env-var hints, and `comingSoon` placeholders for Google / Mistral / **Grok xAI**) and `api_keys_apply` (batch `set` / `delete` actions). Active keys still use the existing OS keyring accounts (`agent:*`, `agent:web:*`) with optional `BLX_*` env fallback; resolve order is keyring-first so UI-saved secrets are not overridden by shell env. The pane uses draft state, a single **Save** / **Discard** footer, row-level remove/undo, and shared `settings-field-card` / `api-keys-row` styling with brand icons (`public/brand-icons/`: OpenRouter, Anthropic, OpenAI, Google/Gemini, Mistral, Groq, Tavily, Brave). 15 new `ApiKeys*` i18n keys in all 13 locales.
-- **BLXCode Agent settings (3-column grid)**: Settings → **BLXCode Agent** (renamed from Agent Provider; sidebar `HsCatProvider` → “BLXCode Agent”) is implemented in `src/workbench/agent_provider_pane/` with a responsive 3-column layout. **Text** (column 1): provider + thinking pickers (shared `harness-provider-trigger` dropdown chrome), API-key status line pointing at API Keys, rich model picker (menu rows show description or OpenRouter pricing; detail sub-row under selection; custom model-id field), refresh + source hint. **Image** (column 2): former Settings → Image pane extracted as `AgentImageColumn` in `harness_image_pane` (provider chips + `ModelPicker`, auto-save on change). **Voice** (column 3): placeholder copy until voice settings migrate here (full Voice tab remains for now). Web Tools sit below the grid as a 3-option radio grid (App-style); one **Save** / **Discard** footer persists text provider settings and web backend together. New i18n: `AgColumnText`, `AgColumnImage`, `AgColumnVoice`, `AgColumnVoiceSoon`, `AgSectionInference`, `AgSectionModel`, `AgModelMetaPricing`. Dedicated CSS: `agent_provider_pane.css`.
+- **Settings revamp (docked center tab)**: harness settings moved from a modal overlay into a **center workbench tab** (`SettingsDock` in `harness_ui.rs`). Sidebar categories: **App**, **Appearance** (stub), **API Keys**, **Workspace**, **BLXCode Agent**. Legacy `HarnessSettingsCategory` values (`Image`, `Voice`, `Memory`) still deserialize and route to the correct pane for older snapshots. Command palette / tmux chords open or focus a singleton settings tab per workspace.
+- **BLXCode Agent settings pane**: `src/workbench/agent_provider_pane/` — responsive grid. **Text** (top-left): provider + **thinking level** pickers (`harness-level-picker` icons), muted `text-xs` API-key status line → Settings → API Keys, shared **`AgentModelPicker`** (catalog rows, pricing-only detail sub-row, custom model id, refresh). **Image** (top-right): `AgentImageColumn` in `harness_image_pane` — provider dropdown, **quality level** picker, `AgentModelPicker`, auto-save; **fal.ai** provider + key via API Keys catalog. **Voice** (bottom, full width): `AgentVoiceColumn` in `harness_voice_pane` — unified STT/TTS provider (OpenAI / OpenRouter / **AWS Polly**), `AgentModelPicker` for speech + TTS models, recording quality, behavior (post-STT flow, gender filter, fixed 6-voice catalog per provider, TTS autoplay). Web Tools below the grid (Tavily / Brave / disabled); one **Save** / **Discard** footer for text provider + web backend. Replaced standalone `model_picker/` with `agent_model_picker/`.
+- **Voice in App settings**: STT language mode + push-to-talk hotkey moved to **Settings → App** (`voice_app_controls`); full voice provider/model/voice UI lives only under BLXCode Agent.
+- **Workspace category colors**: former **Settings → Memory → Color presets** moved to **Settings → Workspace** section **Category colors** (`workspace_settings_pane/category_colors.rs`, `WsSectionCategoryColors` + related i18n). Same preset list/edit/add/reset backed by `memory_color_presets` in `WorkbenchService`.
 - **Per-turn chat metrics & session cost**: tokens, TTFT, decode speed and resolved USD cost are now reported per conversation row instead of as a single aggregated footer. Each provider round emits `TurnUsage { kind: ModelRound, .. }` and each tool dispatch emits `TurnUsage { kind: ToolExec, call_id, .. }`, in both the main agent (`openrouter.rs`, `anthropic.rs`) and `subagent_runner.rs`. OpenRouter requests opt into `usage: { include: true }` and parse the native `usage.cost` field; everything else (including Anthropic Direct) is priced locally via a new `agent/pricing.rs` module — `ProviderModelEntry` carries `Option<ModelPricing>` populated from OpenRouter `/v1/models`, and direct-provider model ids route through a static id-mapping table (`claude-opus-4-7` → `anthropic/claude-opus-4.7`, etc.). A monotonic `turn_generation` counter on `AgentEngineState`, bumped by `agent_clear_conversation`, lets the frontend drop late events from a cancelled turn instead of polluting the fresh chat. New `workbench/agent_panel/turn_metrics_bar/` component renders the per-row `in · out · tok/s · ttft · $cost` strip under Assistant, Tool, the new synthetic `ModelDecision` row (tool-only rounds), and per-tool inside subagent cards. Subagent cards show aggregated round metrics in the header. The chat header gains a `SessionCostChip` with the resolved USD total + turn count, replacing the retired `ChatUsageFooter`. `ToolGroup` bundling is gone — each tool is its own timeline row now. 14 new `I18nKey` variants (`AgMetricsIn/Out/Ttft/CostUnknown/TurnsOne/TurnsMany/Tooltip*`, `AgMetricsBarAria`, `AgMetricsModelRound`, `AgSessionCostAria`) added in all 12 locale files. Pricing module ships with 7 unit tests.
 
 ### Changed
 
 - **`ChatUsageStats` schema migrated**: `total_cost_usd: f64` and `current_turn_generation: u64` added; legacy `ttft_sum_ms` / `ttft_sample_count` fields removed (TTFT now lives per-row). Older `workbench.json` snapshots deserialize cleanly thanks to `#[serde(default)]` and rewrite without the removed fields on next save. `record_chat_turn_usage` signature changed to accept the new `turn_generation` and `cost_usd` and to return `bool` so callers can drop stale events.
-- **Workspace settings layout aligned with API Keys**: the Workspace pane moved into `src/workbench/workspace_settings_pane/` and now mirrors the App / API Keys harness pattern — `harness-subpane` sections (**Paths & sandbox**, **Embedded browser**), `api-keys-list` / `api-keys-row` field cards with monospace path inputs, label→input spacing on `.api-keys-row__head`, and one footer **Save** / **Discard** (native `disabled` + `.workbench-mini-btn:disabled` styling) that persists default project directory, agent sandbox root, and embedded-browser URL together (replacing three inline Save/Apply buttons). New i18n keys `WsSectionPaths` and `WsSectionBrowser` in all locales. Shared footer/field CSS lives in `workspace_settings_pane.css` and `api_keys_pane.css` (`.settings-pane-footer`, `.settings-field-card`).
+- **Workspace settings layout aligned with API Keys**: the Workspace pane (`src/workbench/workspace_settings_pane/`) uses `harness-subpane` sections (**Paths & sandbox**, **Embedded browser**, **Category colors**), `api-keys-list` / `api-keys-row` field cards, and one footer **Save** / **Discard** for project directory, agent sandbox root, and embedded-browser URL. Category color edits apply immediately (same as former Memory tab). Shared footer/field CSS in `workspace_settings_pane.css` and `api_keys_pane.css`.
+- **BLXCode Agent API-key hints**: relocation lines under Text / Image / Voice use `0.75rem` + `--text-muted` (`.agent-provider-pane__key-row`) instead of body-sized copy.
+- **Voice catalog UX**: six fixed voices per provider (OpenAI + AWS Polly active; OpenRouter shows OpenAI set disabled with hint); gender filter always visible; disabled cards keep layout (no hide-on-disable).
 - **Settings panel restructured**: `AppSettingsPane` (`src/workbench/harness_ui.rs`) now reads top-to-bottom as Language → Keyboard shortcuts → Notifications → **Terminal hooks** → **App updates** (updates moved below hooks to put install actions closer to the per-agent hook list). Keyboard shortcuts and Notifications switched from single-column lists to 2-column grids (new `.app-prefs-shortcut-modes--grid` and `.app-prefs-toggle-grid`). Current version no longer renders inside a readonly `<input>` — it's now a styled `<dl>` row, and a sibling **Available version** row only appears when `UpdateService::available_version` is `Some`. Terminal hooks list (`.harness-hooks__list--grid`) lays out as 3 columns on wide screens, collapsing to 2 / 1 below 900 px / 600 px; per-agent **status is icon-only** (check / X) with full text in `title` + `aria-label`, aligned to the end of the title row. The EULA status row was removed from the App pane (acceptance is still gated at boot; the field added no actionable signal here). Workspace pane changed the agent sandbox `<textarea>` to a single-line `<input>` and gained a new **Default project directory** field above it: persisted to `blxcode_default_project_dir_v1` via new `WorkbenchService::default_project_dir` signal + setters/persist, seeded from the user's home directory through a new `harness_user_home_dir` Tauri command (`src-tauri/src/commands.rs`) on first run. Inline workspace configuration (`start_inline_configure` and snapshot hydration) now prefills new workspace `cwd` from `default_project_dir`, falling back to the agent sandbox root only when blank — sandbox path is reserved for BLXCode Agent sandbox actions. New i18n keys `AppUpdateAvailableVersion`, `WsRootHint`, `WsDefaultProjectDirLabel/Placeholder/Hint` added across all 13 locale files (English authored; other locales carry English placeholders until `scripts/tools/render_i18n_locales_from_en.py` runs).
 
 ### Fixed
@@ -31,7 +36,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Removed
 
-- **Settings → Image sidebar entry**: image model configuration now lives in the middle column of **Settings → BLXCode Agent**; the dedicated Image category button was removed from the settings nav (legacy `HarnessSettingsCategory::Image` still routes to BLXCode Agent for old snapshots).
+- **Settings → Image / Voice / Memory sidebar entries**: image, voice, and memory color configuration moved into **BLXCode Agent** (image + voice) and **Workspace** (category colors). Dedicated **Image**, **Voice**, and **Memory** nav buttons removed; legacy categories still route to the correct pane.
+- **`voice_provider_voices` Tauri command** and backend `voice/voices.rs` catalog (frontend uses fixed voice lists).
 - **Global `ChatUsageFooter`**: superseded by the per-row `TurnMetricsBar` + chat-header `SessionCostChip`.
 - **`compact_timeline` tool bundling**: `DisplayTimelineItem::ToolGroup`, `merge_consecutive_tools` and `aggregate_status` retired — each tool now renders as its own row carrying its own metrics bar.
 - **Per-provider API key fields in Agent settings**: keys are managed only under Settings → API Keys; the old Agent Provider password rows and duplicate Web Tools description were dropped in favour of short relocation hints.
diff --git a/docs/README.md b/docs/README.md
index fb93cf0..7bfc95e 100644
--- a/docs/README.md
+++ b/docs/README.md
@@ -10,6 +10,7 @@ Welcome to the BLXCode docs. User guides explain how to run and use the app; dev
 
 | Topic | Guide |
 |-------|--------|
+| Settings (API Keys, BLXCode Agent, Workspace) | [Settings](user/settings.md) |
 | Workbench, terminals, sidebar, handoff | [Workspaces](user/workspaces.md) |
 | Memory, learnings, graph, categories | [Memory And Tasks](user/memory-and-tasks.md) |
 | Markdown plans and plan-linked tasks | [Plans](user/plans.md) |
@@ -27,6 +28,7 @@ Welcome to the BLXCode docs. User guides explain how to run and use the app; dev
 ## User docs
 
 - [Getting Started](user/getting-started.md) — prerequisites, run BLXCode, first workspace, where data lives.
+- [Settings](user/settings.md) — docked center-tab settings, API Keys, BLXCode Agent grid, Workspace.
 - [Workspaces](user/workspaces.md) — creation, terminal grids, sidebar explorer, Git graph, handoff, persistence.
 - [Memory And Tasks](user/memory-and-tasks.md) — Memory panel (Files, Graph, Search), dynamic categories, tasks, agent memory tools.
 - [Plans](user/plans.md) — `.agents/plans/`, Kanban board, task syntax, Plans panel, agent tools.
diff --git a/docs/developer/agent-harness.md b/docs/developer/agent-harness.md
index 21e3248..4b47713 100644
--- a/docs/developer/agent-harness.md
+++ b/docs/developer/agent-harness.md
@@ -32,11 +32,18 @@ src-tauri/src/agent/
   openrouter.rs / anthropic.rs  # Use tool_dispatch
 
 src/skills_rules/store.rs   # CORE_SKILLS, core SkillSourceKind, availability
+src-tauri/src/api_keys.rs     # Central key catalog, resolve, api_keys_status/apply
 src/workbench/
-  harness_ui.rs             # AgentProviderPane + Web Tools section
-  agent_timeline.rs         # tool_label, subagent_*_label (i18n)
-  agent_panel/timeline.rs   # chat timeline (subagent UI: see subagents.md)
-src/tauri_bridge.rs         # agent_web_*, agent_environment_invalidate
+  harness_ui.rs               # SettingsDock, App/Appearance panes
+  agent_provider_pane/        # BLXCode Agent grid (text, web footer)
+  harness_image_pane/         # AgentImageColumn
+  harness_voice_pane/         # AgentVoiceColumn
+  agent_model_picker/         # Shared model dropdown + pricing detail
+  api_keys_pane/              # Settings → API Keys UI
+  workspace_settings_pane/    # Paths, browser, category_colors
+  agent_timeline.rs           # tool_label, subagent_*_label (i18n)
+  agent_panel/timeline.rs     # chat timeline (subagent UI: see subagents.md)
+src/tauri_bridge.rs           # api_keys_*, agent_web_*, agent_environment_invalidate
 ```
 
 ## Core skills (Better Harness)
diff --git a/docs/developer/tauri-ipc.md b/docs/developer/tauri-ipc.md
index 703805d..f8db318 100644
--- a/docs/developer/tauri-ipc.md
+++ b/docs/developer/tauri-ipc.md
@@ -31,10 +31,11 @@ Authoritative list from `src-tauri/src/lib.rs` (grouped for navigation):
 
 ### Agent settings and keys
 
-- `agent_settings_get`, `agent_settings_save`, `agent_api_key_set`, `agent_api_key_delete`, `agent_provider_models`
-- `agent_web_settings_get`, `agent_web_settings_save`, `agent_web_api_key_set`, `agent_web_api_key_delete`
+- `agent_settings_get`, `agent_settings_save`, `agent_provider_models`
+- `api_keys_status`, `api_keys_apply` — centralized key catalog (LLM, Tavily, Brave, fal.ai, AWS Polly); see `src-tauri/src/api_keys.rs`
+- `agent_web_settings_get`, `agent_web_settings_save` (backend choice only; keys via `api_keys_apply`)
 - `agent_environment_invalidate` — clears `environment_detect` session cache (also triggered from UI on workspace switch)
-- `harness_ensure_default_sandbox`
+- `harness_ensure_default_sandbox`, `harness_user_home_dir`
 
 ### Image generation
 
diff --git a/docs/user/agent-harness.md b/docs/user/agent-harness.md
index ad28d2d..08ca0c9 100644
--- a/docs/user/agent-harness.md
+++ b/docs/user/agent-harness.md
@@ -6,34 +6,38 @@ For **subagents** (parallel scout/review/security runs), see the dedicated guide
 
 This guide covers what you see in the UI and how the agent is expected to behave. For implementation detail, see [Agent Harness (developer)](../developer/agent-harness.md).
 
-## Settings → Agent
+## Settings
 
-Open **Harness settings** (command palette or sidebar) and choose the **Agent** pane.
+Open **Settings** from the command palette (center tab). Overview: [Settings](settings.md).
 
-| Section | What it configures |
-|---------|-------------------|
+| Category | Harness-related content |
+|----------|-------------------------|
+| **API Keys** | All LLM, search, fal.ai, and AWS Polly secrets |
+| **BLXCode Agent** | Text provider/model/thinking, image provider, voice STT/TTS, web tools |
+| **App** | STT language + push-to-talk (not full voice models) |
+
+### BLXCode Agent → Text
+
+| Field | What it configures |
+|-------|-------------------|
 | **Provider** | OpenRouter, Anthropic, or OpenAI-compatible API |
-| **Model** | Model ID (datalist from live/cached catalog) |
+| **Model** | `AgentModelPicker` — catalog, pricing line, custom id |
 | **Thinking** | Off / Low / Medium / High / Max |
-| **API key** | Per-provider key in the OS keyring (`BLXCode` service) |
-| **Web Tools** | Search/fetch backend (Tavily or Brave) and API keys |
-
-Provider and web keys are stored separately. Masked values appear in the UI after save; secrets are never shown in full.
 
-### Web Tools
+API keys are **not** entered here. A muted hint links to **Settings → API Keys**; masked status shows configured / missing.
 
-Web search and fetch require a configured backend:
+### Web Tools (bottom of BLXCode Agent)
 
 | Backend | Keyring account | Env fallback |
 |---------|-----------------|--------------|
 | **Tavily** | `agent:web:tavily` | `BLX_TAVILY_API_KEY` |
 | **Brave** | `agent:web:brave` | `BLX_BRAVE_API_KEY` |
 
-1. Pick **Tavily** or **Brave** as the backend (or **Disabled**).
-2. Paste the API key for the provider you use and click **Save key**.
-3. Click **Save** on the web section to persist the provider choice.
+1. Set Tavily and/or Brave keys under **Settings → API Keys**.
+2. Pick **Tavily**, **Brave**, or **Disabled** in BLXCode Agent.
+3. Click **Save** on the BLXCode Agent footer (with text provider settings).
 
-Until a key is available, `web_search` and `web_fetch` are omitted from the agent tool catalog. The **web** core skill still appears in the Skills panel with availability **disabled_no_key** so you know what to configure.
+Until a key is available, `web_search` and `web_fetch` are omitted from the agent tool catalog. The **web** core skill still appears in the Skills panel with availability **disabled_no_key**.
 
 ## Core skills vs user skills
 
diff --git a/docs/user/agent-providers.md b/docs/user/agent-providers.md
index 6e1f64f..3d1332e 100644
--- a/docs/user/agent-providers.md
+++ b/docs/user/agent-providers.md
@@ -27,20 +27,18 @@ Model lists are fetched live when possible. If a provider request fails or retur
 
 ## API Keys
 
-API keys are saved per provider. BLXCode tries to store them in the OS keyring using service name `BLXCode`.
+All secrets are managed under **Settings → API Keys** (single Save/Discard pane). BLXCode stores them in the OS keyring (`BLXCode` service) with `BLX_*` env fallback when a slot is empty.
 
-If keyring access fails on Linux or another platform, BLXCode writes a fallback secret file under the Tauri app config directory. On Unix, the fallback secrets directory is created with private permissions.
+**Settings → BLXCode Agent** shows provider/model/thinking for text, image, and voice plus web-tool backend choice. Each column displays a short **configured / missing** hint — no password fields.
 
-The UI only displays masked API key values after save.
+| Use | Keys in API Keys pane |
+|-----|------------------------|
+| Text agent | OpenRouter, Anthropic, OpenAI, … |
+| Image mode | OpenAI, OpenRouter, fal.ai |
+| Voice STT/TTS | OpenAI, OpenRouter, AWS (Polly) |
+| Web search/fetch | Tavily, Brave |
 
-<p align="center">
-  <img src="../images/screenshot-2026-05-18_17-58-05.png" alt="Agent provider settings showing provider, model, thinking level, and masked API key" />
-</p>
-
-## Voice And Image Keys
-
-- **Voice** reuses provider keys — see [Voice](voice.md).
-- **Image mode** (generate images in chat) reuses OpenAI/OpenRouter keys — see [Image Mode](image.md). This is separate from **context images** below.
+See [Settings](settings.md) and [Voice](voice.md) / [Image Mode](image.md).
 
 ## Thinking Levels
 
@@ -91,7 +89,7 @@ Call `list_tools` for the full JSON catalog (name, server/client site, schema).
 
 `harness.send_agent_context` prefers explicit single-terminal targets; default `includeKinds` is `["memory","plans","tasks","images"]`.
 
-**Web tools** need Tavily or Brave keys in Agent settings → Web Tools. **Shell/Git** need `environment_detect` once per workspace session.
+**Web tools** need Tavily or Brave keys in **Settings → API Keys**, then a backend choice under **BLXCode Agent → Web Tools**. **Shell/Git** need `environment_detect` once per workspace session.
 
 See [Agent Harness](agent-harness.md) for core skills and web keys; [Subagents](subagents.md) for roles, timeline, and tool groups.
 
diff --git a/docs/user/getting-started.md b/docs/user/getting-started.md
index ab28558..1e905df 100644
--- a/docs/user/getting-started.md
+++ b/docs/user/getting-started.md
@@ -49,17 +49,15 @@ After accepting, the workbench opens. In the desktop shell, BLXCode also creates
 
 Workspace layout and recent workspace state are persisted by the Tauri backend and restored on the next launch. With [agent hooks](agent-providers.md) installed, terminal slots can **resume** prior Claude/Codex/Gemini/OpenCode/Cursor sessions and surface **completion badges** in the sidebar—see [Workspaces](workspaces.md#session-resume).
 
-## Configure An Agent Provider
+## Configure settings
 
-Open the agent/provider settings in the right panel. BLXCode supports provider settings for:
+Open **Settings** from the command palette (center tab). See [Settings](settings.md).
 
-- OpenRouter.
-- Anthropic.
-- OpenAI-compatible API.
+1. **API Keys** — add OpenRouter, Anthropic, OpenAI, and optional Tavily/Brave keys.
+2. **BLXCode Agent** — pick text provider, model, thinking level; configure image/voice and web-tool backend.
+3. **Workspace** — optional default project folder, sandbox root, and memory **category colors**.
 
-API keys are stored in the operating system keyring when available. On platforms where keyring storage is unavailable, BLXCode falls back to a private app-config file.
-
-Optional **Web Tools** (search/fetch) use separate Tavily or Brave keys in the same Agent settings pane. The agent also ships **core harness skills** (built-in tool guides) — see [Agent Harness](agent-harness.md).
+Keys use the OS keyring when available, with `BLX_*` env fallback. The agent ships **core harness skills** (built-in tool guides) — see [Agent Harness](agent-harness.md).
 
 ## Where Data Lives
 
diff --git a/docs/user/image.md b/docs/user/image.md
index 4faab80..b8752a2 100644
--- a/docs/user/image.md
+++ b/docs/user/image.md
@@ -18,19 +18,17 @@ You need:
 - Network access to the provider.
 - A selected workspace **if** you want generated images saved to disk. Without one the image lives in chat memory only.
 
-Image keys piggyback on the existing agent provider keyring:
+Image keys are set under **Settings → API Keys** (OpenAI, OpenRouter, fal.ai).
 
-- **OpenAI** image generation uses the saved OpenAI key.
-- **OpenRouter** image generation uses the saved OpenRouter key.
-
-## Settings (Settings → Image)
+## Settings (Settings → BLXCode Agent → Image)
 
 | Setting | Default |
 |---|---|
 | Provider | OpenAI |
 | Model | `gpt-image-1` |
+| Quality | Medium |
 
-Switch the provider with the OpenAI/OpenRouter buttons; pick a model from the suggestion list or type a custom id. The refresh button pulls the provider's catalog (filtered to image-shaped models).
+Pick provider from the dropdown; choose model via **AgentModelPicker** (catalog + custom id). Changes auto-save. API-key status points to API Keys.
 
 OpenRouter uses chat-completions with `modalities: ["image"]`. OpenAI uses `/v1/images/generations` (text-only) or `/v1/images/edits` when one or more reference images are attached.
 
@@ -51,7 +49,7 @@ Filenames collide-protect with a numeric suffix. The relative path is shown unde
 
 ## Voice + Image
 
-If you submit an image-mode turn from voice (PTT or hotkey) **and** TTS is enabled in the Voice tab, BLXCode plays a short confirmation phrase (in your locale's voice) after the image arrives. The image content itself is not narrated.
+If you submit an image-mode turn from voice (PTT or hotkey) **and** TTS is enabled in BLXCode Agent voice settings, BLXCode plays a short confirmation phrase after the image arrives. The image content itself is not narrated.
 
 ## Limits
 
diff --git a/docs/user/settings.md b/docs/user/settings.md
new file mode 100644
index 0000000..6e35c65
--- /dev/null
+++ b/docs/user/settings.md
@@ -0,0 +1,56 @@
+# Settings
+
+BLXCode opens settings in a **center workbench tab** (not a modal). The command palette entry **Open Settings** focuses an existing settings tab or creates one per workspace.
+
+## Sidebar categories
+
+| Category | What it configures |
+|----------|-------------------|
+| **App** | UI language, STT language + push-to-talk, keyboard shortcut mode, notifications, terminal hooks, app updates |
+| **Appearance** | Placeholder (themes planned) |
+| **API Keys** | All provider secrets in one pane — see below |
+| **Workspace** | Default project directory, agent sandbox root, embedded browser URL, **category colors** for Memory |
+| **BLXCode Agent** | Text, image, and voice inference — see below |
+
+Legacy saved categories (`Image`, `Voice`, `Memory`) still open the correct pane.
+
+## API Keys
+
+**Settings → API Keys** is the only place to enter provider secrets.
+
+- LLM providers: OpenRouter, Anthropic, OpenAI, and coming-soon rows (Google, Mistral, Grok xAI).
+- Media / search: Tavily, Brave, **fal.ai** (image), **Amazon Polly** (AWS voice).
+- One **Save** / **Discard** footer for the whole pane; per-row remove marks keys for deletion on save.
+- Keys use the OS keyring (`BLXCode` service) with `BLX_*` env fallback when the store is empty; the UI shows **via env** when a fallback is active.
+
+Agent, image, and voice panes show a short status line pointing here — they do not contain password fields.
+
+## BLXCode Agent
+
+**Settings → BLXCode Agent** uses a grid:
+
+| Area | Settings |
+|------|----------|
+| **Text** | Provider, thinking level, model (`AgentModelPicker`), refresh |
+| **Image** | Provider, quality level, model, auto-save |
+| **Voice** | Provider (OpenAI / OpenRouter / AWS), STT + TTS models, recording quality, post-STT behavior, voice picks, speak replies |
+| **Web Tools** | Tavily / Brave / disabled backend |
+
+One **Save** / **Discard** at the bottom persists text provider + web tools together. Image and voice sections auto-save on change.
+
+Details: [Agent Providers](agent-providers.md), [Image Mode](image.md), [Voice](voice.md).
+
+## Workspace
+
+**Settings → Workspace**:
+
+- **Paths & sandbox** — default folder for new workspaces and BLXCode Agent file sandbox root.
+- **Embedded browser** — default URL for the Browser tab.
+- **Category colors** — presets used for Memory category dots and sidebar accents (formerly under a separate Memory settings tab).
+
+See [Workspaces](workspaces.md).
+
+## See also
+
+- [Agent Harness](agent-harness.md) — core skills, web tools behavior
+- [Troubleshooting](troubleshooting.md) — keyring and key errors
diff --git a/docs/user/troubleshooting.md b/docs/user/troubleshooting.md
index f01a51b..4c6f6e4 100644
--- a/docs/user/troubleshooting.md
+++ b/docs/user/troubleshooting.md
@@ -33,20 +33,20 @@ Try opening another URL or use your system browser for sites that explicitly den
 
 ## API Key Does Not Save
 
-BLXCode stores provider keys in the OS keyring when available. If the keyring is unavailable, it falls back to app-config secret files.
+BLXCode stores keys from **Settings → API Keys** in the OS keyring when available. If the keyring is unavailable, it falls back to app-config secret files.
 
 On Linux, make sure a secret service such as GNOME Keyring or KWallet is available if you want keyring-backed storage. Otherwise, check app config directory permissions.
 
 ## Agent Says Provider Key Is Missing
 
-Open provider settings, select the provider you want to use, paste an API key, save it, and retry the agent turn. Provider keys are stored per provider, so saving an Anthropic key does not configure OpenRouter or OpenAI.
+Open **Settings → API Keys**, set the key for the provider shown in the error (OpenRouter, Anthropic, OpenAI, etc.), click **Save**, then retry. Keys are per provider — an Anthropic key does not configure OpenRouter.
 
 ## Web Search Or Fetch Unavailable
 
 `web_search` and `web_fetch` are omitted from the tool list until a web backend is configured.
 
-1. Open Harness settings → **Agent** → **Web Tools**.
-2. Choose **Tavily** or **Brave**, save the provider choice, and set the matching API key (or set `BLX_TAVILY_API_KEY` / `BLX_BRAVE_API_KEY` in the environment before launch).
+1. Set Tavily and/or Brave keys under **Settings → API Keys** (or `BLX_TAVILY_API_KEY` / `BLX_BRAVE_API_KEY` in the environment).
+2. Open **Settings → BLXCode Agent** → **Web Tools**, choose **Tavily** or **Brave**, and **Save** the agent footer.
 3. Enable the **web** core skill in the Skills panel if it was disabled.
 
 See [Agent Harness](agent-harness.md).
diff --git a/docs/user/voice.md b/docs/user/voice.md
index 0df55c0..f354d29 100644
--- a/docs/user/voice.md
+++ b/docs/user/voice.md
@@ -16,12 +16,11 @@ You need:
 - An API key for the configured voice provider.
 - Network access to the configured STT/TTS provider.
 
-Voice API keys reuse the existing agent provider key storage:
+Voice API keys are set under **Settings → API Keys** (OpenAI, OpenRouter, AWS/Polly). The voice column in **Settings → BLXCode Agent** shows configured/missing status only.
 
-- OpenAI voice uses the saved OpenAI key.
-- OpenRouter STT uses the saved OpenRouter key.
-
-Keys are stored through the OS keyring when available, with the same private file fallback used by agent provider settings.
+- **OpenAI** — six OpenAI TTS voices selectable.
+- **OpenRouter** — STT/TTS models; voice picks show OpenAI names disabled with a hint.
+- **AWS** — six Polly voices when the AWS key is set.
 
 ## Default Settings
 
@@ -42,23 +41,19 @@ The default voice settings are conservative:
 
 ## Configure Voice
 
-Open the voice settings tab in the right-side settings area.
+Open **Settings** (center tab) → **BLXCode Agent** → **Voice** section.
 
-<p align="center">
-  <img src="../images/screenshot-2026-05-18_17-58-12.png" alt="Voice settings showing STT provider, model, recording quality, TTS model, and voice selection" />
-</p>
+**Settings → App** holds STT **language mode** and **push-to-talk** hotkey only.
 
 You can configure:
 
-- STT provider and model.
+- STT/TTS provider and models (shared provider dropdown).
 - Recording quality: low `16000`, standard `24000`, or high `48000` Hz.
-- TTS model. The backend currently supports OpenAI for TTS.
-- TTS voice.
-- TTS voice gender filter.
+- TTS voice (fixed catalog per provider) and gender filter.
 - TTS autoplay on or off.
 - Whether STT should auto-send or only fill a draft.
-- STT language mode.
-- Push-to-talk hotkey.
+
+See [Settings](settings.md).
 
 ## STT Language Modes
 
diff --git a/docs/user/workspaces.md b/docs/user/workspaces.md
index 452709b..3fc5e4e 100644
--- a/docs/user/workspaces.md
+++ b/docs/user/workspaces.md
@@ -97,6 +97,20 @@ The left sidebar combines the workspace list with a resizable bottom panel for p
 
 Explorer and Git section open/collapsed state restores per workspace after reload.
 
+## Workspace settings
+
+**Settings** (center tab) → **Workspace**:
+
+| Section | Purpose |
+|---------|---------|
+| **Paths & sandbox** | Default directory for new workspaces; agent sandbox root for file tools |
+| **Embedded browser** | Default URL when opening the Browser tab |
+| **Category colors** | Named color presets for Memory categories (sidebar dots, graph accents) |
+
+One **Save** / **Discard** footer applies path and browser changes together. Category color edits save immediately when you change a swatch or label.
+
+See [Settings](settings.md).
+
 ## Terminal Agent Context Handoff
 
 Each terminal cell exposes a share icon in its titlebar. The menu lists every live terminal in the workspace, a separator, and **Send to BLXCode Agent**.
diff --git a/src/i18n/locales/de_de.rs b/src/i18n/locales/de_de.rs
index 0027eda..36aadbf 100644
--- a/src/i18n/locales/de_de.rs
+++ b/src/i18n/locales/de_de.rs
@@ -313,7 +313,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::HsCatAppearance => "Erscheinungsbild",
         I18nKey::HsCatApiKeys => "API-Schlüssel",
         I18nKey::HsCatWorkspace => "Arbeitsplatz",
-        I18nKey::HsCatProvider => "BLXCode Agent",
+        I18nKey::HsCatProvider => "BLXCode-Agent",
         I18nKey::HsCatVoice => "Stimme",
         I18nKey::HsCatImage => "Bild",
         I18nKey::AppHeading => "App",
@@ -356,7 +356,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Standardprojektverzeichnis",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "Füllt das Arbeitsverzeichnis für neue Arbeitsbereiche vorab aus.",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
+        I18nKey::AgProviderHeading => "BLXCode-Agent",
         I18nKey::AgSectionInference => "Inferenz",
         I18nKey::AgSectionModel => "Modell",
         I18nKey::AgColumnText => "Text",
diff --git a/src/i18n/locales/es_es.rs b/src/i18n/locales/es_es.rs
index b9b0546..e702ae2 100644
--- a/src/i18n/locales/es_es.rs
+++ b/src/i18n/locales/es_es.rs
@@ -321,7 +321,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "Claves API",
         I18nKey::ApiKeysLlmSubhead => "Proveedores LLM",
         I18nKey::ApiKeysSearchSubhead => "Proveedores de búsqueda",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::ApiKeysImageVideoSubhead => "Imagen/vídeo y voz",
         I18nKey::AgProviderFal => "fal.ai",
         I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Guardado.",
@@ -356,14 +356,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Directorio de proyecto predeterminado",
         I18nKey::WsDefaultProjectDirPlaceholder => "$INICIO",
         I18nKey::WsDefaultProjectDirHint => "Rellena previamente el directorio de trabajo para nuevos espacios de trabajo.",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
-        I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
-        I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgProviderHeading => "Agente de código BLX",
+        I18nKey::AgSectionInference => "Inferencia",
+        I18nKey::AgSectionModel => "Modelo",
+        I18nKey::AgColumnText => "Texto",
+        I18nKey::AgColumnImage => "Imagen",
+        I18nKey::AgColumnVoice => "Voz",
+        I18nKey::AgColumnVoiceSoon => "La configuración de voz se trasladará aquí pronto. Utilice la pestaña Voz por ahora.",
+        I18nKey::AgModelMetaPricing => "{in} entrada / {out} salida por 1 millón de tokens",
         I18nKey::AgProviderField => "Proveedor",
         I18nKey::AgProviderOpenrouter => "enrutador abierto",
         I18nKey::AgProviderAnthropic => "antrópico",
@@ -503,7 +503,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Proveedor",
         I18nKey::VoiceModelField => "Modelo",
         I18nKey::VoiceVoiceField => "Voz",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Seleccione OpenAI o AWS como proveedor para elegir una voz.",
         I18nKey::VoiceGenderAll => "Todo",
         I18nKey::VoiceGenderMale => "Masculino",
         I18nKey::VoiceGenderFemale => "Femenino",
diff --git a/src/i18n/locales/fr_fr.rs b/src/i18n/locales/fr_fr.rs
index dac8839..28ff5a0 100644
--- a/src/i18n/locales/fr_fr.rs
+++ b/src/i18n/locales/fr_fr.rs
@@ -323,7 +323,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "Clés API",
         I18nKey::ApiKeysLlmSubhead => "Fournisseurs LLM",
         I18nKey::ApiKeysSearchSubhead => "Fournisseurs de recherche",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::ApiKeysImageVideoSubhead => "Image / vidéo et voix",
         I18nKey::AgProviderFal => "fal.ai",
         I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Enregistré.",
@@ -358,14 +358,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Répertoire du projet par défaut",
         I18nKey::WsDefaultProjectDirPlaceholder => "$ACCUEIL",
         I18nKey::WsDefaultProjectDirHint => "Pré-remplit le répertoire de travail pour les nouveaux espaces de travail.",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
-        I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
+        I18nKey::AgProviderHeading => "Agent BLXCode",
+        I18nKey::AgSectionInference => "Inférence",
+        I18nKey::AgSectionModel => "Modèle",
+        I18nKey::AgColumnText => "Texte",
         I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgColumnVoice => "Voix",
+        I18nKey::AgColumnVoiceSoon => "Les paramètres vocaux seront bientôt déplacés ici. Utilisez l'onglet Voix pour l'instant.",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out par 1 million de jetons",
         I18nKey::AgProviderField => "Fournisseur",
         I18nKey::AgProviderOpenrouter => "OuvrirRouter",
         I18nKey::AgProviderAnthropic => "Anthropique",
@@ -505,7 +505,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Fournisseur",
         I18nKey::VoiceModelField => "Modèle",
         I18nKey::VoiceVoiceField => "Voix",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Sélectionnez OpenAI ou AWS comme fournisseur pour choisir une voix.",
         I18nKey::VoiceGenderAll => "Tous",
         I18nKey::VoiceGenderMale => "Mâle",
         I18nKey::VoiceGenderFemale => "Femelle",
diff --git a/src/i18n/locales/hu_hu.rs b/src/i18n/locales/hu_hu.rs
index 78dc7e6..90b4c8a 100644
--- a/src/i18n/locales/hu_hu.rs
+++ b/src/i18n/locales/hu_hu.rs
@@ -321,7 +321,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API-kulcsok",
         I18nKey::ApiKeysLlmSubhead => "LLM-szolgáltatók",
         I18nKey::ApiKeysSearchSubhead => "Keresőszolgáltatók",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::ApiKeysImageVideoSubhead => "Kép / videó és hang",
         I18nKey::AgProviderFal => "fal.ai",
         I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Mentve.",
@@ -356,14 +356,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Alapértelmezett projektkönyvtár",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "Előre kitölti a munkakönyvtárat az új munkaterületekhez.",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
-        I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
-        I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgProviderHeading => "BLXCode ügynök",
+        I18nKey::AgSectionInference => "Következtetés",
+        I18nKey::AgSectionModel => "Modell",
+        I18nKey::AgColumnText => "Szöveg",
+        I18nKey::AgColumnImage => "Kép",
+        I18nKey::AgColumnVoice => "Hang",
+        I18nKey::AgColumnVoiceSoon => "A hangbeállítások hamarosan ide kerülnek. Egyelőre használja a Hang lapot.",
+        I18nKey::AgModelMetaPricing => "{in} be / {out} ki 1 millió tokenenként",
         I18nKey::AgProviderField => "Szolgáltató",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
         I18nKey::AgProviderAnthropic => "Antropikus",
@@ -501,7 +501,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Szolgáltató",
         I18nKey::VoiceModelField => "Modell",
         I18nKey::VoiceVoiceField => "Hang",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Hang kiválasztásához válassza az OpenAI-t vagy az AWS-t szolgáltatóként.",
         I18nKey::VoiceGenderAll => "Minden",
         I18nKey::VoiceGenderMale => "Férfi",
         I18nKey::VoiceGenderFemale => "Női",
diff --git a/src/i18n/locales/it_it.rs b/src/i18n/locales/it_it.rs
index 340b803..8e7c7de 100644
--- a/src/i18n/locales/it_it.rs
+++ b/src/i18n/locales/it_it.rs
@@ -321,7 +321,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "Chiavi API",
         I18nKey::ApiKeysLlmSubhead => "Provider LLM",
         I18nKey::ApiKeysSearchSubhead => "Provider di ricerca",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::ApiKeysImageVideoSubhead => "Immagine/video e voce",
         I18nKey::AgProviderFal => "fal.ai",
         I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Salvato.",
@@ -329,7 +329,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysUnsaved => "Modifiche non salvate",
         I18nKey::ApiKeysComingSoon => "In arrivo",
         I18nKey::ApiKeysWillBeRemoved => "Verrà rimosso",
-        I18nKey::ApiKeysViaEnv => "via env",
+        I18nKey::ApiKeysViaEnv => "tramite inv",
         I18nKey::ApiKeysNotSet => "Non impostato",
         I18nKey::ApiKeysUndo => "Annulla",
         I18nKey::ApiKeysRemove => "Rimuovi",
@@ -352,18 +352,18 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsBrowserDefault => "Preimpostazione:",
         I18nKey::WsRootLabel => "Radice dell'area di lavoro/sandbox",
         I18nKey::WsRootPlaceholder => "/abs/percorso/del/repo",
-        I18nKey::WsRootHint => "Used only by BLXCode Agent for sandboxed file actions.",
+        I18nKey::WsRootHint => "Utilizzato solo da BLXCode Agent per azioni su file sandbox.",
         I18nKey::WsDefaultProjectDirLabel => "Directory di progetto predefinita",
         I18nKey::WsDefaultProjectDirPlaceholder => "$CASA",
         I18nKey::WsDefaultProjectDirHint => "Precompila la directory di lavoro per i nuovi spazi di lavoro.",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
-        I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
-        I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgProviderHeading => "Agente BLXCode",
+        I18nKey::AgSectionInference => "Inferenza",
+        I18nKey::AgSectionModel => "Modello",
+        I18nKey::AgColumnText => "Testo",
+        I18nKey::AgColumnImage => "Immagine",
+        I18nKey::AgColumnVoice => "Voce",
+        I18nKey::AgColumnVoiceSoon => "Le impostazioni vocali verranno spostate qui a breve. Utilizza la scheda Voce per ora.",
+        I18nKey::AgModelMetaPricing => "{in} in ingresso/{out} in uscita per 1 milione di token",
         I18nKey::AgProviderField => "Fornitore",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
         I18nKey::AgProviderAnthropic => "Antropico",
@@ -499,7 +499,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Fornitore",
         I18nKey::VoiceModelField => "Modello",
         I18nKey::VoiceVoiceField => "Voce",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Seleziona OpenAI o AWS come fornitore per scegliere una voce.",
         I18nKey::VoiceGenderAll => "Tutto",
         I18nKey::VoiceGenderMale => "Maschio",
         I18nKey::VoiceGenderFemale => "Femmina",
diff --git a/src/i18n/locales/ja_jp.rs b/src/i18n/locales/ja_jp.rs
index 38426af..28823d5 100644
--- a/src/i18n/locales/ja_jp.rs
+++ b/src/i18n/locales/ja_jp.rs
@@ -315,8 +315,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "APIキー",
         I18nKey::ApiKeysLlmSubhead => "LLMプロバイダー",
         I18nKey::ApiKeysSearchSubhead => "検索プロバイダー",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
-        I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::ApiKeysImageVideoSubhead => "画像・動画＆音声",
+        I18nKey::AgProviderFal => "ファルアイ",
         I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "保存しました。",
         I18nKey::ApiKeysDiscard => "破棄",
@@ -350,14 +350,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "デフォルトのプロジェクトディレクトリ",
         I18nKey::WsDefaultProjectDirPlaceholder => "$ホーム",
         I18nKey::WsDefaultProjectDirHint => "新しいワークスペースの作業ディレクトリを事前に入力します。",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
-        I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
-        I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgProviderHeading => "BLXコードエージェント",
+        I18nKey::AgSectionInference => "推論",
+        I18nKey::AgSectionModel => "モデル",
+        I18nKey::AgColumnText => "文章",
+        I18nKey::AgColumnImage => "画像",
+        I18nKey::AgColumnVoice => "声",
+        I18nKey::AgColumnVoiceSoon => "音声設定はまもなくここに移動します。ここでは「音声」タブを使用してください。",
+        I18nKey::AgModelMetaPricing => "100 万トークンあたり {in} 入力 / {out} 出力",
         I18nKey::AgProviderField => "プロバイダー",
         I18nKey::AgProviderOpenrouter => "オープンルーター",
         I18nKey::AgProviderAnthropic => "人間的",
@@ -489,7 +489,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "プロバイダー",
         I18nKey::VoiceModelField => "モデル",
         I18nKey::VoiceVoiceField => "声",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "音声を選択するには、プロバイダーとして OpenAI または AWS を選択します。",
         I18nKey::VoiceGenderAll => "全て",
         I18nKey::VoiceGenderMale => "男",
         I18nKey::VoiceGenderFemale => "女性",
diff --git a/src/i18n/locales/ko_kr.rs b/src/i18n/locales/ko_kr.rs
index ccd5a3e..24a03a1 100644
--- a/src/i18n/locales/ko_kr.rs
+++ b/src/i18n/locales/ko_kr.rs
@@ -315,7 +315,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API 키",
         I18nKey::ApiKeysLlmSubhead => "LLM 제공업체",
         I18nKey::ApiKeysSearchSubhead => "검색 제공업체",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::ApiKeysImageVideoSubhead => "이미지/영상 & 음성",
         I18nKey::AgProviderFal => "fal.ai",
         I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "저장됨.",
@@ -350,14 +350,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "기본 프로젝트 디렉토리",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "새 작업공간에 대한 작업 디렉토리를 미리 채웁니다.",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
-        I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
-        I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgProviderHeading => "BLX코드 에이전트",
+        I18nKey::AgSectionInference => "추론",
+        I18nKey::AgSectionModel => "모델",
+        I18nKey::AgColumnText => "텍스트",
+        I18nKey::AgColumnImage => "영상",
+        I18nKey::AgColumnVoice => "목소리",
+        I18nKey::AgColumnVoiceSoon => "음성 설정이 곧 여기로 이전됩니다. 지금은 음성 탭을 사용하세요.",
+        I18nKey::AgModelMetaPricing => "100만 토큰당 {in} in / {out} out",
         I18nKey::AgProviderField => "공급자",
         I18nKey::AgProviderOpenrouter => "오픈라우터",
         I18nKey::AgProviderAnthropic => "인류학",
@@ -487,7 +487,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "공급자",
         I18nKey::VoiceModelField => "모델",
         I18nKey::VoiceVoiceField => "목소리",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "음성을 선택하려면 OpenAI 또는 AWS를 공급자로 선택하세요.",
         I18nKey::VoiceGenderAll => "모두",
         I18nKey::VoiceGenderMale => "남성",
         I18nKey::VoiceGenderFemale => "여성",
diff --git a/src/i18n/locales/pl_pl.rs b/src/i18n/locales/pl_pl.rs
index 973a6a3..a9373c4 100644
--- a/src/i18n/locales/pl_pl.rs
+++ b/src/i18n/locales/pl_pl.rs
@@ -319,7 +319,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "Klucze API",
         I18nKey::ApiKeysLlmSubhead => "Dostawcy LLM",
         I18nKey::ApiKeysSearchSubhead => "Dostawcy wyszukiwania",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::ApiKeysImageVideoSubhead => "Obraz / wideo i głos",
         I18nKey::AgProviderFal => "fal.ai",
         I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Zapisano.",
@@ -354,14 +354,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Domyślny katalog projektu",
         I18nKey::WsDefaultProjectDirPlaceholder => "$DOM",
         I18nKey::WsDefaultProjectDirHint => "Wstępnie wypełnia katalog roboczy dla nowych obszarów roboczych.",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
+        I18nKey::AgProviderHeading => "Agent BLXCode",
+        I18nKey::AgSectionInference => "Wnioskowanie",
         I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
-        I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgColumnText => "Tekst",
+        I18nKey::AgColumnImage => "Obraz",
+        I18nKey::AgColumnVoice => "Głos",
+        I18nKey::AgColumnVoiceSoon => "Ustawienia głosu zostaną wkrótce przeniesione tutaj. Skorzystaj na razie z karty Głos.",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out na 1 milion tokenów",
         I18nKey::AgProviderField => "Dostawca",
         I18nKey::AgProviderOpenrouter => "OtwórzRouter",
         I18nKey::AgProviderAnthropic => "Antropiczny",
@@ -499,7 +499,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Dostawca",
         I18nKey::VoiceModelField => "Model",
         I18nKey::VoiceVoiceField => "Głos",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Wybierz OpenAI lub AWS jako dostawcę, aby wybrać głos.",
         I18nKey::VoiceGenderAll => "Wszystko",
         I18nKey::VoiceGenderMale => "Mężczyzna",
         I18nKey::VoiceGenderFemale => "Kobieta",
diff --git a/src/i18n/locales/pt_br.rs b/src/i18n/locales/pt_br.rs
index 5978eaf..5f27952 100644
--- a/src/i18n/locales/pt_br.rs
+++ b/src/i18n/locales/pt_br.rs
@@ -321,7 +321,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "Chaves de API",
         I18nKey::ApiKeysLlmSubhead => "Provedores LLM",
         I18nKey::ApiKeysSearchSubhead => "Provedores de busca",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
+        I18nKey::ApiKeysImageVideoSubhead => "Imagem/vídeo e voz",
         I18nKey::AgProviderFal => "fal.ai",
         I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "Salvo.",
@@ -356,14 +356,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Diretório padrão do projeto",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "Preenche previamente o diretório de trabalho para novos espaços de trabalho.",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
-        I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
-        I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgProviderHeading => "Agente BLXCode",
+        I18nKey::AgSectionInference => "Inferência",
+        I18nKey::AgSectionModel => "Modelo",
+        I18nKey::AgColumnText => "Texto",
+        I18nKey::AgColumnImage => "Imagem",
+        I18nKey::AgColumnVoice => "Voz",
+        I18nKey::AgColumnVoiceSoon => "As configurações de voz serão movidas para cá em breve. Use a guia Voz por enquanto.",
+        I18nKey::AgModelMetaPricing => "{in} in / {out} out por 1 milhão de tokens",
         I18nKey::AgProviderField => "Provedor",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
         I18nKey::AgProviderAnthropic => "Antrópico",
@@ -501,7 +501,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Provedor",
         I18nKey::VoiceModelField => "Modelo",
         I18nKey::VoiceVoiceField => "Voz",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Selecione OpenAI ou AWS como provedor para escolher uma voz.",
         I18nKey::VoiceGenderAll => "Todos",
         I18nKey::VoiceGenderMale => "Macho",
         I18nKey::VoiceGenderFemale => "Fêmea",
diff --git a/src/i18n/locales/ru_ru.rs b/src/i18n/locales/ru_ru.rs
index e3c2a98..062dd23 100644
--- a/src/i18n/locales/ru_ru.rs
+++ b/src/i18n/locales/ru_ru.rs
@@ -319,9 +319,9 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API-ключи",
         I18nKey::ApiKeysLlmSubhead => "Поставщики LLM",
         I18nKey::ApiKeysSearchSubhead => "Поисковые поставщики",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
-        I18nKey::AgProviderFal => "fal.ai",
-        I18nKey::AgProviderAws => "AWS",
+        I18nKey::ApiKeysImageVideoSubhead => "Изображение/видео и голос",
+        I18nKey::AgProviderFal => "фал.ай",
+        I18nKey::AgProviderAws => "АВС",
         I18nKey::ApiKeysSaved => "Сохранено.",
         I18nKey::ApiKeysDiscard => "Отменить",
         I18nKey::ApiKeysUnsaved => "Несохранённые изменения",
@@ -354,14 +354,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "Каталог проекта по умолчанию",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "Предварительно заполняет рабочий каталог для новых рабочих пространств.",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
-        I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
-        I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgProviderHeading => "Агент BLXCode",
+        I18nKey::AgSectionInference => "Вывод",
+        I18nKey::AgSectionModel => "Модель",
+        I18nKey::AgColumnText => "Текст",
+        I18nKey::AgColumnImage => "Изображение",
+        I18nKey::AgColumnVoice => "Голос",
+        I18nKey::AgColumnVoiceSoon => "Настройки голоса скоро переместятся сюда. Сейчас используйте вкладку «Голос».",
+        I18nKey::AgModelMetaPricing => "{in} in/{out} out на 1 млн токенов",
         I18nKey::AgProviderField => "Поставщик",
         I18nKey::AgProviderOpenrouter => "OpenRouter",
         I18nKey::AgProviderAnthropic => "антропный",
@@ -499,7 +499,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "Поставщик",
         I18nKey::VoiceModelField => "Модель",
         I18nKey::VoiceVoiceField => "Голос",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "Выберите OpenAI или AWS в качестве поставщика, чтобы выбрать голос.",
         I18nKey::VoiceGenderAll => "Все",
         I18nKey::VoiceGenderMale => "Мужской",
         I18nKey::VoiceGenderFemale => "Женский",
diff --git a/src/i18n/locales/zh_cn.rs b/src/i18n/locales/zh_cn.rs
index 35a5e60..1a9baf9 100644
--- a/src/i18n/locales/zh_cn.rs
+++ b/src/i18n/locales/zh_cn.rs
@@ -313,8 +313,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API 密钥",
         I18nKey::ApiKeysLlmSubhead => "LLM 提供商",
         I18nKey::ApiKeysSearchSubhead => "搜索提供商",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
-        I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::ApiKeysImageVideoSubhead => "图像/视频和语音",
+        I18nKey::AgProviderFal => "法尔.ai",
         I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "已保存。",
         I18nKey::ApiKeysDiscard => "放弃",
@@ -348,14 +348,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "默认项目目录",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "预填充新工作区的工作目录。",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
-        I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
-        I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgProviderHeading => "BLX代码代理",
+        I18nKey::AgSectionInference => "推理",
+        I18nKey::AgSectionModel => "模型",
+        I18nKey::AgColumnText => "文本",
+        I18nKey::AgColumnImage => "图像",
+        I18nKey::AgColumnVoice => "嗓音",
+        I18nKey::AgColumnVoiceSoon => "语音设置很快就会移至此处。现在使用“语音”选项卡。",
+        I18nKey::AgModelMetaPricing => "每 1M 代币 {in} in / {out} out",
         I18nKey::AgProviderField => "提供者",
         I18nKey::AgProviderOpenrouter => "开放路由器",
         I18nKey::AgProviderAnthropic => "人择",
@@ -485,7 +485,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "提供者",
         I18nKey::VoiceModelField => "模型",
         I18nKey::VoiceVoiceField => "嗓音",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "选择 OpenAI 或 AWS 作为提供商来选择语音。",
         I18nKey::VoiceGenderAll => "全部",
         I18nKey::VoiceGenderMale => "男性",
         I18nKey::VoiceGenderFemale => "女性",
diff --git a/src/i18n/locales/zh_tw.rs b/src/i18n/locales/zh_tw.rs
index dfb3570..2b33d32 100644
--- a/src/i18n/locales/zh_tw.rs
+++ b/src/i18n/locales/zh_tw.rs
@@ -313,8 +313,8 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::ApiKeysHeading => "API 金鑰",
         I18nKey::ApiKeysLlmSubhead => "LLM 供應商",
         I18nKey::ApiKeysSearchSubhead => "搜尋供應商",
-        I18nKey::ApiKeysImageVideoSubhead => "Image / video & voice",
-        I18nKey::AgProviderFal => "fal.ai",
+        I18nKey::ApiKeysImageVideoSubhead => "圖像/視訊和語音",
+        I18nKey::AgProviderFal => "法爾.ai",
         I18nKey::AgProviderAws => "AWS",
         I18nKey::ApiKeysSaved => "已儲存。",
         I18nKey::ApiKeysDiscard => "捨棄",
@@ -348,14 +348,14 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::WsDefaultProjectDirLabel => "預設項目目錄",
         I18nKey::WsDefaultProjectDirPlaceholder => "$HOME",
         I18nKey::WsDefaultProjectDirHint => "預填新工作區的工作目錄。",
-        I18nKey::AgProviderHeading => "BLXCode Agent",
-        I18nKey::AgSectionInference => "Inference",
-        I18nKey::AgSectionModel => "Model",
-        I18nKey::AgColumnText => "Text",
-        I18nKey::AgColumnImage => "Image",
-        I18nKey::AgColumnVoice => "Voice",
-        I18nKey::AgColumnVoiceSoon => "Voice settings will move here soon. Use the Voice tab for now.",
-        I18nKey::AgModelMetaPricing => "{in} in / {out} out per 1M tokens",
+        I18nKey::AgProviderHeading => "BLX程式碼代理",
+        I18nKey::AgSectionInference => "推理",
+        I18nKey::AgSectionModel => "模型",
+        I18nKey::AgColumnText => "文字",
+        I18nKey::AgColumnImage => "影像",
+        I18nKey::AgColumnVoice => "嗓音",
+        I18nKey::AgColumnVoiceSoon => "語音設定很快就會移至此處。現在使用“語音”選項卡。",
+        I18nKey::AgModelMetaPricing => "每 1M 代幣 {in} in / {out} out",
         I18nKey::AgProviderField => "提供者",
         I18nKey::AgProviderOpenrouter => "開放路由器",
         I18nKey::AgProviderAnthropic => "人擇",
@@ -485,7 +485,7 @@ pub fn msg(key: I18nKey) -> &'static str {
         I18nKey::VoiceProviderField => "提供者",
         I18nKey::VoiceModelField => "模型",
         I18nKey::VoiceVoiceField => "嗓音",
-        I18nKey::VoiceVoicesAwsOnly => "Select OpenAI or AWS as provider to choose a voice.",
+        I18nKey::VoiceVoicesAwsOnly => "選擇 OpenAI 或 AWS 作為提供者來選擇語音。",
         I18nKey::VoiceGenderAll => "全部",
         I18nKey::VoiceGenderMale => "男性",
         I18nKey::VoiceGenderFemale => "女性",