@anionex/dsh-vision-toolkit 0.1.5 → 0.1.7

package/lib/client.js

@@ -17,15 +17,29 @@ const paste_images_tsx_1 = __load_("./paste-images.js");
 const NS = 'vision-toolkit';
 const SETTINGS_ROUTE = '/_dsh/vision-toolkit/settings';
 const PRESENTATION_META_KEY = '$dshVisionToolkit';
+const DEFAULT_USER_AGENT = 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36';
 const en = {
     nav: 'Vision',
     settingsTitle: 'Vision Toolkit',
     settingsIntro: 'Configure the pinned visual engineering runtime, its external vision endpoint, and local safety limits.',
     externalNotice: 'Remote tools send the selected image bytes to the configured external vision API. Local crop, trace, pixel diff, palette, foreground extraction, and HTML rendering do not upload images.',
     provider: 'Vision service',
+    providerHint: 'Choose the API protocol, then provide the service address, model, and API key used by online vision features.',
     baseUrl: 'Base URL',
-    credential: 'Credential reference',
+    apiKey: 'API key',
+    apiKeyPlaceholderMissing: 'Paste the API key',
+    apiKeyPlaceholderConfigured: 'Saved; leave blank to keep it',
+    apiKeyHint: 'The key is stored in DSH Credentials and is never shown again after saving.',
+    apiKeyLocked: 'The current key comes from a read-only source and cannot be replaced here.',
+    apiKeyBlank: 'The API key cannot contain only spaces.',
+    apiKeyInvalid: 'Paste only the key, without a variable name, quotes, spaces, or line breaks.',
+    credential: 'Credential name',
+    credentialHint: 'Advanced: the API key is stored under this name. Keep VISION_API_KEY unless another plugin configuration requires a different reference.',
     model: 'Model',
+    protocol: 'API protocol',
+    anthropicThinking: 'Anthropic thinking',
+    anthropicThinkingHint: 'omit has the broadest compatibility. Use disabled or adaptive only when the selected model documents that mode; restore omit first after HTTP 400.',
+    userAgent: 'User-Agent',
     language: 'Output language',
     limits: 'Limits',
     timeout: 'Request timeout (ms)',
@@ -42,20 +56,31 @@ const en = {
     saving: 'Validating runtime…',
     reload: 'Reload',
     saved: 'Settings validated and applied.',
-    readOnly: 'The active Settings provider is read-only.',
+    readOnly: 'Service settings are read-only. A writable API key can still be saved.',
     configured: 'Configured',
     missing: 'Missing',
     source: 'Source',
+    sourceHint: '{source}: {value}',
+    sourceEnv: 'Environment variable',
+    sourceFile: 'Credential file',
     health: 'Health',
     runHealth: 'Run health check',
     testConnection: 'Test connection',
     testing: 'Checking…',
     connectionHint: 'Connection testing explicitly sends the configured credential to GET /models. It uploads no image and creates no completion.',
+    saveBeforeTesting: 'Save service changes before testing the connection.',
+    advanced: 'Advanced settings',
+    advancedHint: 'Credential name, provider compatibility, output language, resource limits, runtime source, Python, and additional readable directories.',
     pluginVersion: 'Plugin',
     upstreamVersion: 'Upstream',
     activeGeneration: 'Runtime generation',
+    activeGenerationValue: 'Generation {generation}',
+    pluginKind: 'DSH native plugin',
     runtimeUnavailable: 'Runtime unavailable',
     runtimeCandidateRejected: 'Last runtime candidate was rejected; the active generation remains available.',
+    runtimeReady: 'Ready',
+    runtimeManaged: 'Managed',
+    runtimeExternal: 'External checkout',
     retry: 'Retry',
     open: 'Open file',
     download: 'Download',
@@ -75,65 +100,197 @@ const en = {
     healthy: 'Healthy',
     degraded: 'Needs attention',
     notTested: 'Not tested',
+    groundTitle: 'Ground',
+    detectTitle: 'Detect',
+    traceTitle: 'Trace SVG',
+    pixelDiffTitle: 'Pixel Diff',
+    cropTitle: 'Crop',
+    longOcrTitle: 'Long OCR',
+    extractForegroundTitle: 'Extract Foreground',
+    htmlScreenshotTitle: 'HTML Screenshot',
+    artifactTitle: 'Vision Artifact',
+    dominantColorsTitle: 'Dominant Colors',
+    artifactGroundPreview: 'Grounding bounding-box preview',
+    artifactDetectPreview: 'Detected-element bounding-box preview',
+    artifactCrop: 'Cropped image region',
+    artifactTrace: 'Traced vector geometry',
+    artifactDiffHeatmap: 'Pixel-difference heatmap',
+    artifactDiffReport: 'Structured pixel-difference report',
+    artifactLongManifest: 'Long-screenshot split and merge manifest',
+    artifactLongTranscript: 'Merged long-screenshot OCR transcript',
+    artifactLongAudit: 'Long-screenshot OCR boundary audit',
+    artifactLongChunk: 'Long-screenshot OCR chunk {index}',
+    artifactOcrSidecar: 'OCR sidecar for chunk {index}',
+    artifactForeground: 'Extracted transparent foreground',
+    artifactHtmlScreenshot: 'Headless browser screenshot of local HTML',
+    label: 'Label',
+    paths: 'paths',
+    healthPython: 'Python',
+    healthDependencies: 'Dependencies',
+    healthChrome: 'Browser',
+    healthCredential: 'Credential',
+    healthArtifactDirectory: 'Artifact directory',
+    healthTempDirectory: 'Temporary directory',
+    healthService: 'Vision service',
+    statusOk: 'OK',
+    statusWarning: 'Warning',
+    statusError: 'Error',
+    statusNotTested: 'Not tested',
+    positiveInteger: '{field} must be a positive integer.',
+    healthPythonDetail: '{version} via {path}',
+    healthChromeMissing: 'Chrome, Chromium, or Edge was not found; HTML Screenshot is unavailable.',
+    healthChromeProbeFailed: 'Could not check whether a supported browser is available.',
+    healthCredentialMissing: 'Credential {credential} is not configured.',
+    healthCredentialReady: 'Credential {credential} is available.',
+    healthCredentialFailed: 'Could not read credential {credential}.',
+    healthDirectoryWritable: '{directory} is writable: {path}',
+    healthDirectoryNotWritable: '{directory} is not writable: {path}',
+    healthArtifactDirectoryFailed: 'Could not prepare the artifact directory.',
+    healthConnectionNotTested: 'Connection not tested. Use Test connection to query /models.',
+    healthConnectionCredentialMissing: 'Connection test skipped because the credential is unavailable.',
+    healthServiceResponded: 'Service responded at {endpoint} (HTTP {status}).',
+    healthServiceRejectedCredential: 'Service rejected the configured credential (HTTP {status}).',
+    healthServiceNoModels: 'Service is reachable but does not support GET /models (HTTP {status}).',
+    healthServiceRateLimited: 'Service is reachable, but the connection test was rate-limited (HTTP 429).',
+    healthServiceHttpFailed: 'Connection test failed with HTTP {status}.',
+    healthServiceUnreachable: 'Could not reach {endpoint}.',
 };
 const zh = {
     nav: '视觉工具',
-    settingsTitle: 'Vision Toolkit',
-    settingsIntro: '配置固定版本的视觉工程运行时、外部视觉服务与本地安全限制。',
-    externalNotice: '远程工具会把选中的图片字节发送到已配置的外部视觉 API。本地裁剪、几何恢复、像素对比、调色板、前景提取和 HTML 渲染不会上传图片。',
-    provider: '视觉服务',
-    baseUrl: '服务地址',
-    credential: 'Credential 引用',
-    model: '模型',
-    language: '输出语言',
-    limits: '限制',
-    timeout: '请求超时（毫秒）',
-    maxBytes: '最大图片字节数',
-    maxPixels: '最大图片像素数',
-    concurrency: '每个 Session 并发数',
-    runtime: '运行时',
-    runtimeMode: '运行模式',
-    toolkitPath: '固定上游 checkout 路径',
-    python: 'Python 覆盖',
-    allowedDirs: '额外允许目录',
-    allowedDirsHint: '每行一个路径；Session 工作区始终允许。',
-    save: '保存并应用',
-    saving: '正在验证运行时…',
+    settingsTitle: '视觉工具箱',
+    settingsIntro: '在这里设置视觉模型服务、工具运行环境，以及图片和文件的本地访问范围。',
+    externalNotice: '使用图像理解、目标定位、界面检测或文字识别等在线功能时，所选图片会发送到下方配置的视觉服务。图片裁剪、轮廓描摹、像素对比、主色提取、前景提取和网页截图均在本机完成，不会上传图片。',
+    provider: '在线视觉服务',
+    providerHint: '选择接口协议后，填写在线视觉功能使用的 API 地址、模型名称和 API 密钥。',
+    baseUrl: 'API 地址',
+    apiKey: 'API 密钥',
+    apiKeyPlaceholderMissing: '粘贴 API 密钥',
+    apiKeyPlaceholderConfigured: '已保存；留空表示不修改',
+    apiKeyHint: '密钥会保存到 DSH 凭据存储，保存后不会在页面中回显。',
+    apiKeyLocked: '当前密钥来自只读配置，无法在此替换。',
+    apiKeyBlank: 'API 密钥不能只包含空格。',
+    apiKeyInvalid: '请只粘贴密钥本身，不要包含变量名、引号、空格或换行。',
+    credential: '凭据名称',
+    credentialHint: '高级用法：API 密钥会按此名称保存。除非其他插件配置要求不同名称，否则保持 VISION_API_KEY。',
+    model: '模型名称',
+    protocol: 'API 协议',
+    anthropicThinking: 'Anthropic thinking',
+    anthropicThinkingHint: 'omit 兼容性最好。仅当所选模型明确支持时使用 disabled 或 adaptive；遇到 HTTP 400 时先恢复 omit。',
+    userAgent: 'User-Agent',
+    language: '结果语言',
+    limits: '资源与并发限制',
+    timeout: '单次请求超时（毫秒）',
+    maxBytes: '单张图片大小上限（字节）',
+    maxPixels: '单张图片最大像素数',
+    concurrency: '单个会话最多并发任务数',
+    runtime: '工具运行环境',
+    runtimeMode: '环境来源',
+    toolkitPath: 'agent-vision-toolkit 目录',
+    python: 'Python 解释器（可选）',
+    allowedDirs: '允许读取的其他目录',
+    allowedDirsHint: '每行填写一个目录。当前会话的工作目录始终可以读取，无需重复填写。',
+    save: '保存设置',
+    saving: '正在检查并应用…',
     reload: '重新加载',
-    saved: '设置已验证并生效。',
-    readOnly: '当前 Settings 提供方为只读。',
-    configured: '已配置',
-    missing: '缺失',
-    source: '来源',
-    health: '健康检查',
-    runHealth: '运行健康检查',
-    testConnection: '测试连接',
+    saved: '设置已保存并生效。',
+    readOnly: '服务设置来自只读配置；如果 API 密钥可写，仍可在此保存密钥。',
+    configured: '已就绪',
+    missing: '未配置',
+    source: '配置来源',
+    sourceHint: '{source}：{value}',
+    sourceEnv: '环境变量',
+    sourceFile: '凭据文件',
+    health: '运行检查',
+    runHealth: '检查本地环境',
+    testConnection: '测试服务连接',
     testing: '检查中…',
-    connectionHint: '连接测试会显式把已配置 Credential 发送到 GET /models；不会上传图片，也不会创建 completion。',
-    pluginVersion: '插件',
-    upstreamVersion: '上游',
-    activeGeneration: '运行时世代',
-    runtimeUnavailable: '运行时不可用',
-    runtimeCandidateRejected: '最近的运行时候选已被拒绝；当前世代仍可用。',
+    connectionHint: '“检查本地环境”只检查本机依赖和目录；“测试服务连接”会携带已配置的 API 密钥请求 /models，但不会上传图片或调用模型。',
+    saveBeforeTesting: '修改服务配置后，请先保存，再测试连接。',
+    advanced: '高级设置',
+    advancedHint: '凭据名称、服务兼容参数、结果语言、资源限制、运行环境来源、Python 和额外可读目录。一般无需修改。',
+    pluginVersion: '插件版本',
+    upstreamVersion: '工具包版本',
+    activeGeneration: '本次运行已应用',
+    activeGenerationValue: '{generation} 次',
+    pluginKind: 'DSH 原生插件',
+    runtimeUnavailable: '运行环境尚未就绪',
+    runtimeCandidateRejected: '新设置未能生效，仍在使用上一次可用的设置。',
+    runtimeReady: '已就绪',
+    runtimeManaged: '自动安装',
+    runtimeExternal: '本地源码',
     retry: '重试',
-    open: '打开文件',
+    open: '在工作区中打开',
     download: '下载',
-    previewUnavailable: '当前宿主不提供 HTTP 预览，请使用“打开文件”。',
+    previewUnavailable: '此页面无法直接预览该文件，请在工作区中打开。',
     running: '运行中…',
-    failed: '失败',
-    matches: '个匹配',
+    failed: '运行失败',
+    matches: '处匹配',
     elements: '个元素',
-    dimensions: '尺寸',
+    dimensions: '图片尺寸',
     coordinates: '坐标',
-    artifact: '交付文件',
-    artifacts: '交付文件',
-    difference: '总体差异',
-    worstRegions: '差异最大区域',
-    colors: '主色',
-    noResult: '结构化结果不可用，请检查原始 Tool 结果。',
-    healthy: '健康',
-    degraded: '需要处理',
-    notTested: '未测试',
+    artifact: '生成文件',
+    artifacts: '个生成文件',
+    difference: '像素差异',
+    worstRegions: '差异最大的区域',
+    colors: '种颜色',
+    noResult: '未能读取结果，请查看工具的原始输出。',
+    healthy: '一切正常',
+    degraded: '有项目需要处理',
+    notTested: '尚未检查',
+    groundTitle: '目标定位',
+    detectTitle: '界面元素识别',
+    traceTitle: '描摹为 SVG',
+    pixelDiffTitle: '像素对比',
+    cropTitle: '裁剪图片',
+    longOcrTitle: '长图文字识别',
+    extractForegroundTitle: '提取前景',
+    htmlScreenshotTitle: '网页截图',
+    artifactTitle: '视觉处理结果',
+    dominantColorsTitle: '主色提取',
+    artifactGroundPreview: '目标定位框预览',
+    artifactDetectPreview: '界面元素标注预览',
+    artifactCrop: '裁剪后的图片',
+    artifactTrace: '描摹得到的矢量图',
+    artifactDiffHeatmap: '像素差异热力图',
+    artifactDiffReport: '像素差异详细报告',
+    artifactLongManifest: '长图切分与合并记录',
+    artifactLongTranscript: '长图文字识别结果',
+    artifactLongAudit: '长图分块边界检查记录',
+    artifactLongChunk: '长图文字识别分块 {index}',
+    artifactOcrSidecar: '分块 {index} 的文字识别记录',
+    artifactForeground: '提取后的透明背景前景图',
+    artifactHtmlScreenshot: '本地网页截图',
+    label: '名称',
+    paths: '条路径',
+    healthPython: 'Python',
+    healthDependencies: 'Python 依赖',
+    healthChrome: '浏览器',
+    healthCredential: 'API 密钥',
+    healthArtifactDirectory: '输出目录',
+    healthTempDirectory: '临时目录',
+    healthService: '视觉服务',
+    statusOk: '正常',
+    statusWarning: '注意',
+    statusError: '异常',
+    statusNotTested: '未检查',
+    positiveInteger: '{field}必须填写正整数。',
+    healthPythonDetail: '版本 {version}；解释器：{path}',
+    healthChromeMissing: '未找到 Chrome、Chromium 或 Edge，网页截图功能暂不可用。',
+    healthChromeProbeFailed: '无法检查浏览器是否可用。',
+    healthCredentialMissing: '尚未配置凭据 {credential}。',
+    healthCredentialReady: '已找到凭据 {credential}。',
+    healthCredentialFailed: '无法读取凭据 {credential}。',
+    healthDirectoryWritable: '{directory}可写：{path}',
+    healthDirectoryNotWritable: '{directory}不可写：{path}',
+    healthArtifactDirectoryFailed: '无法准备输出目录。',
+    healthConnectionNotTested: '尚未测试服务连接。点击“测试服务连接”可请求 /models。',
+    healthConnectionCredentialMissing: 'API 密钥不可用，未执行连接测试。',
+    healthServiceResponded: '服务已响应：{endpoint}（HTTP {status}）。',
+    healthServiceRejectedCredential: '服务拒绝了当前 API 密钥（HTTP {status}）。',
+    healthServiceNoModels: '服务可以访问，但不支持 GET /models（HTTP {status}）。',
+    healthServiceRateLimited: '服务可以访问，但本次连接测试触发了限流（HTTP 429）。',
+    healthServiceHttpFailed: '连接测试失败（HTTP {status}）。',
+    healthServiceUnreachable: '无法连接到 {endpoint}。',
 };
 function isRecord(value) {
     return typeof value === 'object' && value !== null && !Array.isArray(value);
@@ -261,21 +418,53 @@ function ArtifactActions({ artifact, grant, openFile, t }) {
 }
 function ArtifactPreview({ artifact, grant, openFile, t }) {
     const canPreview = grant !== undefined && (artifact.kind === 'image' || artifact.kind === 'svg');
+    const description = artifactDescription(artifact.description, t);
     return ((0, jsx_runtime_1.jsxs)("article", { className: "dvt-artifact", children: [canPreview
                 ? artifact.kind === 'svg'
-                    ? (0, jsx_runtime_1.jsx)("iframe", { className: "dvt-preview dvt-svg", sandbox: "", src: grant.previewUrl, title: artifact.description })
-                    : (0, jsx_runtime_1.jsx)("img", { className: "dvt-preview", src: grant.previewUrl, alt: artifact.description, loading: "lazy" })
-                : null, (0, jsx_runtime_1.jsxs)("div", { className: "dvt-artifact-meta", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: artifact.filename }), (0, jsx_runtime_1.jsx)("span", { children: artifact.description }), (0, jsx_runtime_1.jsxs)("small", { children: [artifact.mimeType, " \u00B7 ", formatBytes(artifact.bytes)] })] }), (0, jsx_runtime_1.jsx)(ArtifactActions, { artifact: artifact, grant: grant, openFile: openFile, t: t })] }), !canPreview && grant === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('previewUnavailable') }) : null] }));
+                    ? (0, jsx_runtime_1.jsx)("iframe", { className: "dvt-preview dvt-svg", sandbox: "", src: grant.previewUrl, title: description })
+                    : (0, jsx_runtime_1.jsx)("img", { className: "dvt-preview", src: grant.previewUrl, alt: description, loading: "lazy" })
+                : null, (0, jsx_runtime_1.jsxs)("div", { className: "dvt-artifact-meta", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("strong", { children: artifact.filename }), (0, jsx_runtime_1.jsx)("span", { children: description }), (0, jsx_runtime_1.jsxs)("small", { children: [artifact.mimeType, " \u00B7 ", formatBytes(artifact.bytes)] })] }), (0, jsx_runtime_1.jsx)(ArtifactActions, { artifact: artifact, grant: grant, openFile: openFile, t: t })] }), !canPreview && grant === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('previewUnavailable') }) : null] }));
+}
+const ARTIFACT_DESCRIPTION_KEYS = {
+    'Grounding bounding-box preview': 'artifactGroundPreview',
+    'Detected-element bounding-box preview': 'artifactDetectPreview',
+    'Cropped image region': 'artifactCrop',
+    'Traced vector geometry': 'artifactTrace',
+    'Pixel-difference heatmap': 'artifactDiffHeatmap',
+    'Structured pixel-difference report': 'artifactDiffReport',
+    'Long-screenshot split and merge manifest': 'artifactLongManifest',
+    'Merged long-screenshot OCR transcript': 'artifactLongTranscript',
+    'Long-screenshot OCR boundary audit': 'artifactLongAudit',
+    'Extracted transparent foreground': 'artifactForeground',
+    'Headless browser screenshot of local HTML': 'artifactHtmlScreenshot',
+};
+function artifactDescription(description, t) {
+    const key = ARTIFACT_DESCRIPTION_KEYS[description];
+    if (key !== undefined) {
+        const translated = t(key);
+        return translated === key ? description : translated;
+    }
+    let match = /^Long-screenshot OCR chunk (\d+)$/u.exec(description);
+    if (match !== null) {
+        const translated = t('artifactLongChunk', { index: match[1] });
+        return translated === 'artifactLongChunk' ? description : translated;
+    }
+    match = /^OCR sidecar for chunk (\d+)$/u.exec(description);
+    if (match !== null) {
+        const translated = t('artifactOcrSidecar', { index: match[1] });
+        return translated === 'artifactOcrSidecar' ? description : translated;
+    }
+    return description;
 }
 function GroundView({ block, openFile, t = key => en[key] }) {
     const value = decodeVisionResult(block);
     const matches = Array.isArray(value?.matches) ? value.matches.filter(isRecord) : [];
-    const target = stringOf(value?.target) ?? 'Ground';
+    const target = stringOf(value?.target) ?? t('groundTitle');
     const width = numberOf(value?.imageWidth);
     const height = numberOf(value?.imageHeight);
     const preview = artifactFrom(value?.preview);
     const grants = accessMap(value);
-    return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: "Ground", summary: matches.length > 0 ? `${target} · ${matches.length} ${t('matches')}` : target, icon: (0, jsx_runtime_1.jsx)(VisionIcon, { kind: "target" }), t: t, children: value === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : ((0, jsx_runtime_1.jsxs)("div", { className: "dvt-stack", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-metrics", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: t('dimensions') }), (0, jsx_runtime_1.jsxs)("strong", { children: [width ?? '—', " \u00D7 ", height ?? '—'] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: t('coordinates') }), (0, jsx_runtime_1.jsx)("strong", { children: matches[0] === undefined ? '—' : boxText(matches[0].box) })] })] }), matches.length > 1 ? ((0, jsx_runtime_1.jsx)("ol", { className: "dvt-list", children: matches.map((match, index) => (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("span", { children: stringOf(match.label) ?? `#${index + 1}` }), (0, jsx_runtime_1.jsx)("code", { children: boxText(match.box) })] }, index)) })) : null, preview === undefined ? null : (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: preview, grant: grants.get(preview.path), openFile: openFile, t: t })] })) }));
+    return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: t('groundTitle'), summary: matches.length > 0 ? `${target} · ${matches.length} ${t('matches')}` : target, icon: (0, jsx_runtime_1.jsx)(VisionIcon, { kind: "target" }), t: t, children: value === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : ((0, jsx_runtime_1.jsxs)("div", { className: "dvt-stack", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-metrics", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: t('dimensions') }), (0, jsx_runtime_1.jsxs)("strong", { children: [width ?? '—', " \u00D7 ", height ?? '—'] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: t('coordinates') }), (0, jsx_runtime_1.jsx)("strong", { children: matches[0] === undefined ? '—' : boxText(matches[0].box) })] })] }), matches.length > 1 ? ((0, jsx_runtime_1.jsx)("ol", { className: "dvt-list", children: matches.map((match, index) => (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("span", { children: stringOf(match.label) ?? `#${index + 1}` }), (0, jsx_runtime_1.jsx)("code", { children: boxText(match.box) })] }, index)) })) : null, preview === undefined ? null : (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: preview, grant: grants.get(preview.path), openFile: openFile, t: t })] })) }));
 }
 function DetectView({ block, openFile, t = key => en[key] }) {
     const value = decodeVisionResult(block);
@@ -284,15 +473,15 @@ function DetectView({ block, openFile, t = key => en[key] }) {
     const height = numberOf(value?.imageHeight);
     const preview = artifactFrom(value?.preview);
     const grants = accessMap(value);
-    return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: "Detect", summary: `${elements.length} ${t('elements')}`, icon: (0, jsx_runtime_1.jsx)(VisionIcon, { kind: "layers" }), t: t, children: value === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : ((0, jsx_runtime_1.jsxs)("div", { className: "dvt-stack", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-metrics", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: t('dimensions') }), (0, jsx_runtime_1.jsxs)("strong", { children: [width ?? '—', " \u00D7 ", height ?? '—'] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: t('elements') }), (0, jsx_runtime_1.jsx)("strong", { children: elements.length })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "dvt-table-wrap", children: (0, jsx_runtime_1.jsxs)("table", { className: "dvt-table", children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("th", { children: "#" }), (0, jsx_runtime_1.jsx)("th", { children: "Label" }), (0, jsx_runtime_1.jsx)("th", { children: t('coordinates') })] }) }), (0, jsx_runtime_1.jsx)("tbody", { children: elements.map((element, index) => (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("td", { children: numberOf(element.index) ?? index + 1 }), (0, jsx_runtime_1.jsx)("td", { children: stringOf(element.label) ?? '—' }), (0, jsx_runtime_1.jsx)("td", { children: (0, jsx_runtime_1.jsx)("code", { children: boxText(element.box) }) })] }, index)) })] }) }), preview === undefined ? null : (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: preview, grant: grants.get(preview.path), openFile: openFile, t: t })] })) }));
+    return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: t('detectTitle'), summary: `${elements.length} ${t('elements')}`, icon: (0, jsx_runtime_1.jsx)(VisionIcon, { kind: "layers" }), t: t, children: value === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : ((0, jsx_runtime_1.jsxs)("div", { className: "dvt-stack", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-metrics", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: t('dimensions') }), (0, jsx_runtime_1.jsxs)("strong", { children: [width ?? '—', " \u00D7 ", height ?? '—'] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: t('elements') }), (0, jsx_runtime_1.jsx)("strong", { children: elements.length })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "dvt-table-wrap", children: (0, jsx_runtime_1.jsxs)("table", { className: "dvt-table", children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("th", { children: "#" }), (0, jsx_runtime_1.jsx)("th", { children: t('label') }), (0, jsx_runtime_1.jsx)("th", { children: t('coordinates') })] }) }), (0, jsx_runtime_1.jsx)("tbody", { children: elements.map((element, index) => (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("td", { children: numberOf(element.index) ?? index + 1 }), (0, jsx_runtime_1.jsx)("td", { children: stringOf(element.label) ?? '—' }), (0, jsx_runtime_1.jsx)("td", { children: (0, jsx_runtime_1.jsx)("code", { children: boxText(element.box) }) })] }, index)) })] }) }), preview === undefined ? null : (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: preview, grant: grants.get(preview.path), openFile: openFile, t: t })] })) }));
 }
 function TraceView({ block, openFile, t = key => en[key] }) {
     const value = decodeVisionResult(block);
     const artifact = artifactFrom(value?.artifact);
     const geometry = isRecord(value?.geometry) ? value.geometry : undefined;
-    const summary = geometry === undefined ? undefined : `${numberOf(geometry.pathCount) ?? 0} paths · ${formatBytes(numberOf(geometry.bytes) ?? 0)}`;
+    const summary = geometry === undefined ? undefined : `${numberOf(geometry.pathCount) ?? 0} ${t('paths')} · ${formatBytes(numberOf(geometry.bytes) ?? 0)}`;
     const grants = accessMap(value);
-    return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: "Trace SVG", summary: summary, icon: (0, jsx_runtime_1.jsx)(VisionIcon, { kind: "shape" }), t: t, children: artifact === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: artifact, grant: grants.get(artifact.path), openFile: openFile, t: t }) }));
+    return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: t('traceTitle'), summary: summary, icon: (0, jsx_runtime_1.jsx)(VisionIcon, { kind: "shape" }), t: t, children: artifact === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: artifact, grant: grants.get(artifact.path), openFile: openFile, t: t }) }));
 }
 function PixelDiffView({ block, openFile, t = key => en[key] }) {
     const value = decodeVisionResult(block);
@@ -301,24 +490,24 @@ function PixelDiffView({ block, openFile, t = key => en[key] }) {
     const heatmap = artifactFrom(value?.heatmap);
     const report = artifactFrom(value?.report);
     const grants = accessMap(value);
-    return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: "Pixel Diff", summary: pct === undefined ? undefined : `${pct.toFixed(3)}%`, icon: (0, jsx_runtime_1.jsx)(VisionIcon, { kind: "diff" }), t: t, children: value === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : ((0, jsx_runtime_1.jsxs)("div", { className: "dvt-stack", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-diff-score", children: [(0, jsx_runtime_1.jsx)("span", { children: t('difference') }), (0, jsx_runtime_1.jsxs)("strong", { children: [pct?.toFixed(4) ?? '—', "%"] }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("i", { style: { width: `${Math.min(100, Math.max(0, pct ?? 0))}%` } }) })] }), regions.length === 0 ? null : (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h4", { children: t('worstRegions') }), (0, jsx_runtime_1.jsx)("ol", { className: "dvt-list", children: regions.map((region, index) => (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsxs)("span", { children: [(numberOf(region.differencePct) ?? 0).toFixed(3), "%"] }), (0, jsx_runtime_1.jsx)("code", { children: boxText(region.box) })] }, index)) })] }), heatmap === undefined ? null : (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: heatmap, grant: grants.get(heatmap.path), openFile: openFile, t: t }), report === undefined ? null : (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: report, grant: grants.get(report.path), openFile: openFile, t: t })] })) }));
+    return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: t('pixelDiffTitle'), summary: pct === undefined ? undefined : `${pct.toFixed(3)}%`, icon: (0, jsx_runtime_1.jsx)(VisionIcon, { kind: "diff" }), t: t, children: value === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : ((0, jsx_runtime_1.jsxs)("div", { className: "dvt-stack", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-diff-score", children: [(0, jsx_runtime_1.jsx)("span", { children: t('difference') }), (0, jsx_runtime_1.jsxs)("strong", { children: [pct?.toFixed(4) ?? '—', "%"] }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("i", { style: { width: `${Math.min(100, Math.max(0, pct ?? 0))}%` } }) })] }), regions.length === 0 ? null : (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h4", { children: t('worstRegions') }), (0, jsx_runtime_1.jsx)("ol", { className: "dvt-list", children: regions.map((region, index) => (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsxs)("span", { children: [(numberOf(region.differencePct) ?? 0).toFixed(3), "%"] }), (0, jsx_runtime_1.jsx)("code", { children: boxText(region.box) })] }, index)) })] }), heatmap === undefined ? null : (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: heatmap, grant: grants.get(heatmap.path), openFile: openFile, t: t }), report === undefined ? null : (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: report, grant: grants.get(report.path), openFile: openFile, t: t })] })) }));
 }
 function ArtifactView({ block, openFile, toolName, t = key => en[key] }) {
     const value = decodeVisionResult(block);
     const artifacts = collectArtifacts(value);
     const grants = accessMap(value);
-    const title = toolName === 'vision_crop' ? 'Crop'
-        : toolName === 'vision_long_screenshot_ocr' ? 'Long OCR'
-            : toolName === 'vision_extract_foreground' ? 'Extract Foreground'
-                : toolName === 'vision_html_screenshot' ? 'HTML Screenshot'
-                    : 'Vision Artifact';
+    const title = toolName === 'vision_crop' ? t('cropTitle')
+        : toolName === 'vision_long_screenshot_ocr' ? t('longOcrTitle')
+            : toolName === 'vision_extract_foreground' ? t('extractForegroundTitle')
+                : toolName === 'vision_html_screenshot' ? t('htmlScreenshotTitle')
+                    : t('artifactTitle');
     return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: title, summary: artifacts.length > 0 ? `${artifacts.length} ${t('artifacts')}` : undefined, icon: (0, jsx_runtime_1.jsx)(VisionIcon, {}), t: t, children: artifacts.length === 0 ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : (0, jsx_runtime_1.jsx)("div", { className: "dvt-stack", children: artifacts.map(artifact => (0, jsx_runtime_1.jsx)(ArtifactPreview, { artifact: artifact, grant: grants.get(artifact.path), openFile: openFile, t: t }, artifact.path)) }) }));
 }
 function PaletteView({ block, t = key => en[key] }) {
     const value = decodeVisionResult(block);
     const analysis = isRecord(value?.analysis) ? value.analysis : undefined;
     const colors = Array.isArray(analysis?.colors) ? analysis.colors.filter(isRecord) : [];
-    return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: "Dominant Colors", summary: `${colors.length} ${t('colors')}`, icon: (0, jsx_runtime_1.jsx)(VisionIcon, { kind: "palette" }), t: t, children: colors.length === 0 ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : (0, jsx_runtime_1.jsx)("div", { className: "dvt-palette", children: colors.map((color, index) => {
+    return ((0, jsx_runtime_1.jsx)(ToolShell, { block: block, title: t('dominantColorsTitle'), summary: `${colors.length} ${t('colors')}`, icon: (0, jsx_runtime_1.jsx)(VisionIcon, { kind: "palette" }), t: t, children: colors.length === 0 ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('noResult') }) : (0, jsx_runtime_1.jsx)("div", { className: "dvt-palette", children: colors.map((color, index) => {
                 const hex = stringOf(color.color) ?? '#000000';
                 const share = numberOf(color.sharePct);
                 return (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("i", { style: { background: hex } }), (0, jsx_runtime_1.jsxs)("span", { children: [(0, jsx_runtime_1.jsx)("strong", { children: hex }), (0, jsx_runtime_1.jsx)("small", { children: share === undefined ? '' : `${share.toFixed(2)}%` })] })] }, `${hex}-${index}`);
@@ -368,18 +557,48 @@ class VisionSettingsController {
             return;
         void this.load();
     }
-    async save(value, expectedRevision) {
+    async save(value, expectedRevision, credentialValue, writeSettings) {
         this.set({ ...this.state, action: 'save', error: undefined, message: undefined });
+        let snapshot = this.state.snapshot;
         try {
-            const snapshot = await apiRequest({
-                method: 'POST',
-                headers: { 'Content-Type': 'application/json' },
-                body: JSON.stringify({ action: 'save', expectedRevision, value }),
-            });
+            if (writeSettings) {
+                snapshot = await apiRequest({
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ action: 'save', expectedRevision, value }),
+                });
+            }
+            if (snapshot === undefined)
+                throw new Error('Vision Toolkit Settings are unavailable');
+            if (credentialValue !== undefined) {
+                try {
+                    snapshot = await apiRequest({
+                        method: 'POST',
+                        headers: { 'Content-Type': 'application/json' },
+                        body: JSON.stringify({
+                            action: 'credential',
+                            expectedRevision: snapshot.settings.revision,
+                            ref: snapshot.credential.ref,
+                            value: credentialValue,
+                        }),
+                    });
+                }
+                catch (error) {
+                    this.set({
+                        status: 'ready',
+                        snapshot,
+                        health: this.state.health,
+                        error: error instanceof Error ? error.message : String(error),
+                    });
+                    return false;
+                }
+            }
             this.set({ status: 'ready', snapshot, health: this.state.health, message: 'saved' });
+            return true;
         }
         catch (error) {
             this.set({ ...this.state, action: undefined, error: error instanceof Error ? error.message : String(error) });
+            return false;
         }
     }
     async runHealth(testConnection) {
@@ -403,6 +622,9 @@ function draftOf(value) {
         baseUrl: value.provider?.baseUrl ?? 'https://api.inferera.com/v1',
         credential: value.provider?.credential ?? 'VISION_API_KEY',
         model: value.provider?.model ?? 'gemini-3.6-flash',
+        protocol: value.provider?.protocol ?? 'openai',
+        anthropicThinking: value.provider?.anthropicThinking ?? 'omit',
+        userAgent: value.provider?.userAgent ?? DEFAULT_USER_AGENT,
         language: value.language ?? 'zh',
         timeoutMs: String(value.timeoutMs ?? 60000),
         maxImageBytes: String(value.maxImageBytes ?? 10485760),
@@ -414,20 +636,39 @@ function draftOf(value) {
         allowedDirs: (value.allowedDirs ?? []).join('\n'),
     };
 }
-function positiveInteger(raw, label) {
+function positiveInteger(raw, label, t) {
     const value = Number(raw);
     if (!Number.isSafeInteger(value) || value <= 0)
-        throw new Error(`${label} must be a positive integer`);
+        throw new Error(t('positiveInteger', { field: label }));
     return value;
 }
-function valueOf(draft) {
+function apiKeyFailure(value, t) {
+    if (value.length === 0)
+        return undefined;
+    const trimmed = value.trim();
+    if (trimmed.length === 0)
+        return t('apiKeyBlank');
+    const quoted = trimmed.length > 1 && ['"', '\'', '`'].includes(trimmed[0] ?? '') && trimmed.endsWith(trimmed[0] ?? '');
+    const environmentLine = /^[A-Z][A-Z0-9_]*=[^=]/u.test(trimmed);
+    if (quoted || environmentLine || !/^[\x21-\x7E]+$/u.test(trimmed))
+        return t('apiKeyInvalid');
+    return undefined;
+}
+function valueOf(draft, t) {
     return {
-        provider: { baseUrl: draft.baseUrl.trim(), credential: draft.credential.trim(), model: draft.model.trim() },
+        provider: {
+            baseUrl: draft.baseUrl.trim(),
+            credential: draft.credential.trim(),
+            model: draft.model.trim(),
+            protocol: draft.protocol,
+            anthropicThinking: draft.anthropicThinking,
+            userAgent: draft.userAgent.trim(),
+        },
         language: draft.language,
-        timeoutMs: positiveInteger(draft.timeoutMs, 'timeoutMs'),
-        maxImageBytes: positiveInteger(draft.maxImageBytes, 'maxImageBytes'),
-        maxImagePixels: positiveInteger(draft.maxImagePixels, 'maxImagePixels'),
-        concurrency: positiveInteger(draft.concurrency, 'concurrency'),
+        timeoutMs: positiveInteger(draft.timeoutMs, t('timeout'), t),
+        maxImageBytes: positiveInteger(draft.maxImageBytes, t('maxBytes'), t),
+        maxImagePixels: positiveInteger(draft.maxImagePixels, t('maxPixels'), t),
+        concurrency: positiveInteger(draft.concurrency, t('concurrency'), t),
         runtime: {
             mode: draft.runtimeMode,
             ...(draft.runtimeMode === 'external' ? { agentVisionToolkitPath: draft.toolkitPath.trim() } : {}),
@@ -444,10 +685,89 @@ function SettingsSection({ controller, t }) {
         return null;
     return (0, jsx_runtime_1.jsx)(LoadedSettings, { controller: controller, t: t });
 }
+const HEALTH_NAME_KEYS = {
+    python: 'healthPython',
+    dependencies: 'healthDependencies',
+    chrome: 'healthChrome',
+    credential: 'healthCredential',
+    artifactDirectory: 'healthArtifactDirectory',
+    tempDirectory: 'healthTempDirectory',
+    service: 'healthService',
+};
+const HEALTH_STATUS_KEYS = {
+    ok: 'statusOk',
+    warning: 'statusWarning',
+    error: 'statusError',
+    not_tested: 'statusNotTested',
+};
+function healthDetail(name, detail, t) {
+    if (name === 'python') {
+        const match = /^(.+) via (.+)$/u.exec(detail);
+        if (match !== null)
+            return t('healthPythonDetail', { version: match[1], path: match[2] });
+    }
+    if (detail === 'Chrome/Chromium/Edge was not found; vision_html_screenshot is unavailable')
+        return t('healthChromeMissing');
+    if (detail === 'Chrome availability probe failed')
+        return t('healthChromeProbeFailed');
+    let match = /^credential (.+) is not configured$/u.exec(detail);
+    if (match !== null)
+        return t('healthCredentialMissing', { credential: match[1] });
+    match = /^credential (.+) is resolvable$/u.exec(detail);
+    if (match !== null)
+        return t('healthCredentialReady', { credential: match[1] });
+    match = /^credential (.+) could not be resolved$/u.exec(detail);
+    if (match !== null)
+        return t('healthCredentialFailed', { credential: match[1] });
+    match = /^(Artifact directory|Runtime temp directory) is writable: (.+)$/u.exec(detail);
+    if (match !== null)
+        return t('healthDirectoryWritable', {
+            directory: match[1] === 'Artifact directory' ? t('healthArtifactDirectory') : t('healthTempDirectory'),
+            path: match[2],
+        });
+    match = /^(Artifact directory|Runtime temp directory) is not writable: (.+)$/u.exec(detail);
+    if (match !== null)
+        return t('healthDirectoryNotWritable', {
+            directory: match[1] === 'Artifact directory' ? t('healthArtifactDirectory') : t('healthTempDirectory'),
+            path: match[2],
+        });
+    if (detail === 'Artifact directory could not be prepared')
+        return t('healthArtifactDirectoryFailed');
+    if (detail === 'Connection was not tested; pass testConnection=true to query the configured /models endpoint')
+        return t('healthConnectionNotTested');
+    if (detail === 'Connection test skipped because the configured credential is unavailable')
+        return t('healthConnectionCredentialMissing');
+    match = /^Service responded at (.+) \(HTTP (\d+)\)$/u.exec(detail);
+    if (match !== null)
+        return t('healthServiceResponded', { endpoint: match[1], status: match[2] });
+    match = /^Service rejected the configured credential \(HTTP (\d+)\)$/u.exec(detail);
+    if (match !== null)
+        return t('healthServiceRejectedCredential', { status: match[1] });
+    match = /^Service is reachable but does not expose GET \/models \(HTTP (\d+)\)$/u.exec(detail);
+    if (match !== null)
+        return t('healthServiceNoModels', { status: match[1] });
+    if (detail === 'Service is reachable but rate-limited the connection test (HTTP 429)')
+        return t('healthServiceRateLimited');
+    match = /^Service connection test failed with HTTP (\d+)$/u.exec(detail);
+    if (match !== null)
+        return t('healthServiceHttpFailed', { status: match[1] });
+    match = /^Service could not be reached at (.+)$/u.exec(detail);
+    if (match !== null)
+        return t('healthServiceUnreachable', { endpoint: match[1] });
+    return detail;
+}
+function credentialSource(source, t) {
+    if (source === 'env')
+        return t('sourceEnv');
+    if (source === 'file')
+        return t('sourceFile');
+    return source;
+}
 function LoadedSettings({ controller, t }) {
     const state = (0, react_1.useSyncExternalStore)(controller.subscribe, controller.snapshot, controller.snapshot);
     const snapshot = state.snapshot;
     const [draft, setDraft] = (0, react_1.useState)(undefined);
+    const [apiKey, setApiKey] = (0, react_1.useState)('');
     const [draftError, setDraftError] = (0, react_1.useState)(undefined);
     (0, react_1.useEffect)(() => { if (state.status === 'idle')
         void controller.load(); }, [controller, state.status]);
@@ -464,26 +784,37 @@ function LoadedSettings({ controller, t }) {
     const update = (key, value) => setDraft(current => current === undefined ? current : { ...current, [key]: value });
     const save = () => {
         try {
+            const keyFailure = apiKeyFailure(apiKey, t);
+            if (keyFailure !== undefined) {
+                setDraftError(keyFailure);
+                return;
+            }
+            const credentialValue = apiKey.length === 0 ? undefined : apiKey.trim();
             setDraftError(undefined);
-            void controller.save(valueOf(draft), snapshot.settings.revision);
+            void controller.save(valueOf(draft, t), snapshot.settings.revision, credentialValue, snapshot.writable).then(saved => { if (saved)
+                setApiKey(''); });
         }
         catch (error) {
             setDraftError(error instanceof Error ? error.message : String(error));
         }
     };
     const busy = state.action !== undefined;
+    const credentialMatchesSnapshot = draft.credential.trim() === snapshot.credential.ref;
+    const keyLocked = credentialMatchesSnapshot && !snapshot.credential.writable;
+    const canSave = snapshot.writable || (apiKey.length > 0 && !keyLocked);
     const runtimeErrorTitle = snapshot.runtime.ready ? t('runtimeCandidateRejected') : t('runtimeUnavailable');
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "dvt-settings", children: [(0, jsx_runtime_1.jsxs)("header", { className: "dvt-settings-header", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { className: "dvt-kicker", children: "DSH native plugin" }), (0, jsx_runtime_1.jsx)("h2", { children: t('settingsTitle') }), (0, jsx_runtime_1.jsx)("p", { children: t('settingsIntro') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-release", children: [(0, jsx_runtime_1.jsxs)("span", { children: [t('pluginVersion'), " ", (0, jsx_runtime_1.jsx)("strong", { children: snapshot.release.pluginVersion })] }), (0, jsx_runtime_1.jsxs)("span", { children: [t('upstreamVersion'), " ", (0, jsx_runtime_1.jsx)("strong", { children: snapshot.release.upstreamVersion })] }), (0, jsx_runtime_1.jsxs)("span", { children: [t('activeGeneration'), " ", (0, jsx_runtime_1.jsx)("strong", { children: snapshot.runtime.generation })] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "dvt-alert notice", children: t('externalNotice') }), !snapshot.writable ? (0, jsx_runtime_1.jsx)("div", { className: "dvt-alert warning", children: t('readOnly') }) : null, draftError === undefined ? null : (0, jsx_runtime_1.jsx)("div", { className: "dvt-alert error", children: draftError }), state.error === undefined ? null : (0, jsx_runtime_1.jsx)("div", { className: "dvt-alert error", children: state.error }), state.message === 'saved' ? (0, jsx_runtime_1.jsx)("div", { className: "dvt-alert success", children: t('saved') }) : null, snapshot.runtime.lastError === undefined ? null : (0, jsx_runtime_1.jsxs)("div", { className: "dvt-alert error", children: [(0, jsx_runtime_1.jsx)("strong", { children: runtimeErrorTitle }), (0, jsx_runtime_1.jsx)("span", { children: snapshot.runtime.lastError })] }), (0, jsx_runtime_1.jsxs)("section", { className: "dvt-panel", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-panel-title", children: [(0, jsx_runtime_1.jsx)("h3", { children: t('provider') }), (0, jsx_runtime_1.jsx)("span", { className: `dvt-badge ${snapshot.credential.configured ? 'ok' : 'error'}`, children: snapshot.credential.configured ? t('configured') : t('missing') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-form-grid", children: [(0, jsx_runtime_1.jsx)(Field, { label: t('baseUrl'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { value: draft.baseUrl, onChange: (event) => { update('baseUrl', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('model'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { value: draft.model, onChange: (event) => { update('model', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('credential'), hint: snapshot.credential.source === undefined ? undefined : `${t('source')}: ${snapshot.credential.source}`, children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { value: draft.credential, onChange: (event) => { update('credential', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('language'), children: (0, jsx_runtime_1.jsxs)("select", { value: draft.language, onChange: (event) => { update('language', event.target.value); }, children: [(0, jsx_runtime_1.jsx)("option", { value: "zh", children: "\u4E2D\u6587" }), (0, jsx_runtime_1.jsx)("option", { value: "en", children: "English" })] }) })] })] }), (0, jsx_runtime_1.jsxs)("section", { className: "dvt-panel", children: [(0, jsx_runtime_1.jsx)("div", { className: "dvt-panel-title", children: (0, jsx_runtime_1.jsx)("h3", { children: t('limits') }) }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-form-grid", children: [(0, jsx_runtime_1.jsx)(Field, { label: t('timeout'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { inputMode: "numeric", value: draft.timeoutMs, onChange: (event) => { update('timeoutMs', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('maxBytes'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { inputMode: "numeric", value: draft.maxImageBytes, onChange: (event) => { update('maxImageBytes', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('maxPixels'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { inputMode: "numeric", value: draft.maxImagePixels, onChange: (event) => { update('maxImagePixels', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('concurrency'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { inputMode: "numeric", value: draft.concurrency, onChange: (event) => { update('concurrency', event.target.value); } }) })] })] }), (0, jsx_runtime_1.jsxs)("section", { className: "dvt-panel", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-panel-title", children: [(0, jsx_runtime_1.jsx)("h3", { children: t('runtime') }), (0, jsx_runtime_1.jsx)("span", { className: `dvt-badge ${snapshot.runtime.ready ? 'ok' : 'error'}`, children: snapshot.runtime.ready ? snapshot.runtime.upstream?.source ?? 'ready' : t('runtimeUnavailable') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-form-grid", children: [(0, jsx_runtime_1.jsx)(Field, { label: t('runtimeMode'), children: (0, jsx_runtime_1.jsxs)("select", { value: draft.runtimeMode, onChange: (event) => { update('runtimeMode', event.target.value); }, children: [(0, jsx_runtime_1.jsx)("option", { value: "managed", children: "managed" }), (0, jsx_runtime_1.jsx)("option", { value: "external", children: "external" })] }) }), draft.runtimeMode === 'external' ? (0, jsx_runtime_1.jsx)(Field, { label: t('toolkitPath'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { value: draft.toolkitPath, onChange: (event) => { update('toolkitPath', event.target.value); } }) }) : null, (0, jsx_runtime_1.jsx)(Field, { label: t('python'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { placeholder: "python3", value: draft.python, onChange: (event) => { update('python', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('allowedDirs'), hint: t('allowedDirsHint'), children: (0, jsx_runtime_1.jsx)("textarea", { rows: 3, value: draft.allowedDirs, onChange: (event) => { update('allowedDirs', event.target.value); } }) })] }), snapshot.runtime.upstream === undefined ? null : (0, jsx_runtime_1.jsxs)("div", { className: "dvt-runtime-facts", children: [(0, jsx_runtime_1.jsx)("code", { children: snapshot.runtime.upstream.path }), (0, jsx_runtime_1.jsxs)("code", { children: [snapshot.runtime.upstream.python, " \u00B7 ", snapshot.runtime.upstream.pythonVersion] }), (0, jsx_runtime_1.jsx)("code", { children: snapshot.runtime.upstream.runtimeHome })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-save-row", children: [(0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Button, { variant: "primary", disabled: !snapshot.writable || busy, onClick: save, children: state.action === 'save' ? t('saving') : t('save') }), (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Button, { variant: "outline", disabled: busy, onClick: () => { void controller.load(); }, children: t('reload') })] }), (0, jsx_runtime_1.jsxs)("section", { className: "dvt-panel", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-panel-title", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { children: t('health') }), (0, jsx_runtime_1.jsx)("p", { children: t('connectionHint') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-actions", children: [(0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Button, { size: "sm", variant: "outline", disabled: busy || !snapshot.runtime.ready, onClick: () => { void controller.runHealth(false); }, children: state.action === 'health' ? t('testing') : t('runHealth') }), (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Button, { size: "sm", variant: "primary", disabled: busy || !snapshot.runtime.ready, onClick: () => { void controller.runHealth(true); }, children: state.action === 'connection' ? t('testing') : t('testConnection') })] })] }), state.health === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('notTested') }) : (0, jsx_runtime_1.jsx)("div", { className: "dvt-health-grid", children: Object.entries(state.health.checks).map(([name, check]) => (0, jsx_runtime_1.jsxs)("div", { "data-status": check.status, children: [(0, jsx_runtime_1.jsx)("span", { children: name }), (0, jsx_runtime_1.jsx)("strong", { children: check.status }), (0, jsx_runtime_1.jsx)("p", { children: check.detail })] }, name)) })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "dvt-settings", children: [(0, jsx_runtime_1.jsx)("div", { className: "dvt-alert notice", children: t('externalNotice') }), !snapshot.writable ? (0, jsx_runtime_1.jsx)("div", { className: "dvt-alert warning", children: t('readOnly') }) : null, draftError === undefined ? null : (0, jsx_runtime_1.jsx)("div", { className: "dvt-alert error", children: draftError }), state.error === undefined ? null : (0, jsx_runtime_1.jsx)("div", { className: "dvt-alert error", children: state.error }), state.message === 'saved' ? (0, jsx_runtime_1.jsx)("div", { className: "dvt-alert success", children: t('saved') }) : null, snapshot.runtime.lastError === undefined ? null : (0, jsx_runtime_1.jsxs)("div", { className: "dvt-alert error", children: [(0, jsx_runtime_1.jsx)("strong", { children: runtimeErrorTitle }), (0, jsx_runtime_1.jsx)("span", { children: snapshot.runtime.lastError })] }), (0, jsx_runtime_1.jsxs)("section", { className: "dvt-panel dvt-essential", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-panel-title", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { children: t('provider') }), (0, jsx_runtime_1.jsx)("p", { children: t('providerHint') })] }), (0, jsx_runtime_1.jsx)("span", { className: `dvt-badge ${snapshot.credential.configured ? 'ok' : 'error'}`, children: snapshot.credential.configured ? t('configured') : t('missing') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-form-grid", children: [(0, jsx_runtime_1.jsx)(Field, { label: t('protocol'), children: (0, jsx_runtime_1.jsxs)("select", { disabled: !snapshot.writable || busy, value: draft.protocol, onChange: (event) => { update('protocol', event.target.value); }, children: [(0, jsx_runtime_1.jsx)("option", { value: "openai", children: "OpenAI Chat Completions" }), (0, jsx_runtime_1.jsx)("option", { value: "anthropic", children: "Anthropic Messages" })] }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('baseUrl'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { disabled: !snapshot.writable || busy, value: draft.baseUrl, onChange: (event) => { update('baseUrl', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('model'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { disabled: !snapshot.writable || busy, value: draft.model, onChange: (event) => { update('model', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('apiKey'), hint: keyLocked ? t('apiKeyLocked') : snapshot.credential.source === undefined ? t('apiKeyHint') : `${t('apiKeyHint')} ${t('sourceHint', { source: t('source'), value: credentialSource(snapshot.credential.source, t) })}`, children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { "aria-label": t('apiKey'), type: "password", autoComplete: "new-password", disabled: busy || keyLocked, placeholder: snapshot.credential.configured ? t('apiKeyPlaceholderConfigured') : t('apiKeyPlaceholderMissing'), value: apiKey, onChange: (event) => { setApiKey(event.target.value); setDraftError(undefined); } }) })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-save-row", children: [(0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Button, { variant: "primary", disabled: !canSave || busy, onClick: save, children: state.action === 'save' ? t('saving') : t('save') }), (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Button, { variant: "outline", disabled: busy, onClick: () => { void controller.load(); }, children: t('reload') })] }), (0, jsx_runtime_1.jsxs)("section", { className: "dvt-panel", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-panel-title", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { children: t('health') }), (0, jsx_runtime_1.jsx)("p", { children: t('connectionHint') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-actions", children: [(0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Button, { size: "sm", variant: "outline", disabled: busy || !snapshot.runtime.ready, onClick: () => { void controller.runHealth(false); }, children: state.action === 'health' ? t('testing') : t('runHealth') }), (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Button, { size: "sm", variant: "primary", disabled: busy || !snapshot.runtime.ready, onClick: () => { void controller.runHealth(true); }, children: state.action === 'connection' ? t('testing') : t('testConnection') })] })] }), (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('saveBeforeTesting') }), state.health === undefined ? (0, jsx_runtime_1.jsx)("p", { className: "dvt-muted", children: t('notTested') }) : (0, jsx_runtime_1.jsx)("div", { className: "dvt-health-grid", children: Object.entries(state.health.checks).map(([name, check]) => (0, jsx_runtime_1.jsxs)("div", { "data-status": check.status, children: [(0, jsx_runtime_1.jsx)("span", { children: t(HEALTH_NAME_KEYS[name] ?? 'health') }), (0, jsx_runtime_1.jsx)("strong", { children: t(HEALTH_STATUS_KEYS[check.status]) }), (0, jsx_runtime_1.jsx)("p", { children: healthDetail(name, check.detail, t) })] }, name)) })] }), (0, jsx_runtime_1.jsxs)("details", { className: "dvt-advanced", children: [(0, jsx_runtime_1.jsxs)("summary", { children: [(0, jsx_runtime_1.jsxs)("span", { children: [(0, jsx_runtime_1.jsx)("strong", { children: t('advanced') }), (0, jsx_runtime_1.jsx)("small", { children: t('advancedHint') })] }), (0, jsx_runtime_1.jsx)("span", { className: "dvt-details-chevron", "aria-hidden": "true", children: "\u2304" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-advanced-body", children: [(0, jsx_runtime_1.jsxs)("section", { className: "dvt-panel", children: [(0, jsx_runtime_1.jsx)("div", { className: "dvt-panel-title", children: (0, jsx_runtime_1.jsx)("h3", { children: t('provider') }) }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-form-grid", children: [(0, jsx_runtime_1.jsx)(Field, { label: t('credential'), hint: t('credentialHint'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { "aria-label": t('credential'), disabled: !snapshot.writable || busy, value: draft.credential, onChange: (event) => { update('credential', event.target.value); } }) }), draft.protocol === 'anthropic' ? (0, jsx_runtime_1.jsx)(Field, { label: t('anthropicThinking'), hint: t('anthropicThinkingHint'), children: (0, jsx_runtime_1.jsxs)("select", { "aria-label": t('anthropicThinking'), value: draft.anthropicThinking, onChange: (event) => { update('anthropicThinking', event.target.value); }, children: [(0, jsx_runtime_1.jsx)("option", { value: "omit", children: "omit (widest compatibility)" }), (0, jsx_runtime_1.jsx)("option", { value: "disabled", children: "disabled (model support required)" }), (0, jsx_runtime_1.jsx)("option", { value: "adaptive", children: "adaptive (model support required)" })] }) }) : null, (0, jsx_runtime_1.jsx)(Field, { label: t('userAgent'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { value: draft.userAgent, onChange: (event) => { update('userAgent', event.target.value); } }) })] })] }), (0, jsx_runtime_1.jsxs)("section", { className: "dvt-panel", children: [(0, jsx_runtime_1.jsx)("div", { className: "dvt-panel-title", children: (0, jsx_runtime_1.jsx)("h3", { children: t('limits') }) }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-form-grid", children: [(0, jsx_runtime_1.jsx)(Field, { label: t('language'), children: (0, jsx_runtime_1.jsxs)("select", { value: draft.language, onChange: (event) => { update('language', event.target.value); }, children: [(0, jsx_runtime_1.jsx)("option", { value: "zh", children: "\u4E2D\u6587" }), (0, jsx_runtime_1.jsx)("option", { value: "en", children: "English" })] }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('timeout'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { inputMode: "numeric", value: draft.timeoutMs, onChange: (event) => { update('timeoutMs', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('maxBytes'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { inputMode: "numeric", value: draft.maxImageBytes, onChange: (event) => { update('maxImageBytes', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('maxPixels'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { inputMode: "numeric", value: draft.maxImagePixels, onChange: (event) => { update('maxImagePixels', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('concurrency'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { inputMode: "numeric", value: draft.concurrency, onChange: (event) => { update('concurrency', event.target.value); } }) })] })] }), (0, jsx_runtime_1.jsxs)("section", { className: "dvt-panel", children: [(0, jsx_runtime_1.jsxs)("div", { className: "dvt-panel-title", children: [(0, jsx_runtime_1.jsx)("h3", { children: t('runtime') }), (0, jsx_runtime_1.jsx)("span", { className: `dvt-badge ${snapshot.runtime.ready ? 'ok' : 'error'}`, children: snapshot.runtime.ready ? snapshot.runtime.upstream?.source === 'managed' ? t('runtimeManaged') : snapshot.runtime.upstream?.source === 'external' ? t('runtimeExternal') : t('runtimeReady') : t('runtimeUnavailable') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-form-grid", children: [(0, jsx_runtime_1.jsx)(Field, { label: t('runtimeMode'), children: (0, jsx_runtime_1.jsxs)("select", { value: draft.runtimeMode, onChange: (event) => { update('runtimeMode', event.target.value); }, children: [(0, jsx_runtime_1.jsx)("option", { value: "managed", children: t('runtimeManaged') }), (0, jsx_runtime_1.jsx)("option", { value: "external", children: t('runtimeExternal') })] }) }), draft.runtimeMode === 'external' ? (0, jsx_runtime_1.jsx)(Field, { label: t('toolkitPath'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { value: draft.toolkitPath, onChange: (event) => { update('toolkitPath', event.target.value); } }) }) : null, (0, jsx_runtime_1.jsx)(Field, { label: t('python'), children: (0, jsx_runtime_1.jsx)(dsh_client_ui_primitives_1.Input, { placeholder: "python3", value: draft.python, onChange: (event) => { update('python', event.target.value); } }) }), (0, jsx_runtime_1.jsx)(Field, { label: t('allowedDirs'), hint: t('allowedDirsHint'), children: (0, jsx_runtime_1.jsx)("textarea", { rows: 3, value: draft.allowedDirs, onChange: (event) => { update('allowedDirs', event.target.value); } }) })] }), snapshot.runtime.upstream === undefined ? null : (0, jsx_runtime_1.jsxs)("div", { className: "dvt-runtime-facts", children: [(0, jsx_runtime_1.jsx)("code", { children: snapshot.runtime.upstream.path }), (0, jsx_runtime_1.jsxs)("code", { children: [snapshot.runtime.upstream.python, " \u00B7 ", snapshot.runtime.upstream.pythonVersion] }), (0, jsx_runtime_1.jsx)("code", { children: snapshot.runtime.upstream.runtimeHome })] })] })] })] }), (0, jsx_runtime_1.jsxs)("footer", { className: "dvt-settings-footer", children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { className: "dvt-kicker", children: t('pluginKind') }), (0, jsx_runtime_1.jsx)("h2", { children: t('settingsTitle') }), (0, jsx_runtime_1.jsx)("p", { children: t('settingsIntro') })] }), (0, jsx_runtime_1.jsxs)("div", { className: "dvt-release", children: [(0, jsx_runtime_1.jsxs)("span", { children: [t('pluginVersion'), " ", (0, jsx_runtime_1.jsx)("strong", { children: snapshot.release.pluginVersion })] }), (0, jsx_runtime_1.jsxs)("span", { children: [t('upstreamVersion'), " ", (0, jsx_runtime_1.jsx)("strong", { children: snapshot.release.upstreamVersion })] }), (0, jsx_runtime_1.jsxs)("span", { children: [t('activeGeneration'), " ", (0, jsx_runtime_1.jsx)("strong", { children: t('activeGenerationValue', { generation: snapshot.runtime.generation }) })] })] })] })] }));
 }
 const CSS = `
 .dvt-tool{margin:4px 0;border:1px solid var(--dsw-alias-border-l1);border-radius:12px;background:var(--dsw-alias-bg-layer-1);overflow:hidden;box-shadow:var(--dsw-shadow-lv1)}
 .dvt-tool-head{width:100%;min-height:38px;display:flex;align-items:center;gap:7px;padding:8px 10px;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;font:inherit}.dvt-tool-head:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary);outline-offset:-2px}.dvt-tool-icon{width:20px;height:20px;display:grid;place-items:center;border-radius:6px;color:var(--dsw-alias-state-business-primary);background:color-mix(in srgb,var(--dsw-alias-state-business-primary) 12%,transparent);flex:none}.dvt-tool-title{font-size:12px;font-weight:650;white-space:nowrap}.dvt-tool-sep{opacity:.35}.dvt-tool-summary{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:var(--dsw-alias-label-secondary)}.dvt-tool-status{margin-left:auto;font-size:11px;color:var(--dsw-alias-label-secondary);max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dvt-tool[data-state=error] .dvt-tool-status{color:var(--dsw-alias-state-error-primary)}.dvt-chevron{margin-left:auto;transition:transform .16s ease;opacity:.55}.dvt-chevron[data-open=true]{transform:rotate(180deg)}.dvt-tool-body{padding:0 10px 10px}.dvt-stack{display:grid;gap:10px}.dvt-muted{margin:0;color:var(--dsw-alias-label-secondary);font-size:12px;line-height:1.5}
 .dvt-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.dvt-metrics>div,.dvt-diff-score{padding:10px;border-radius:9px;background:var(--dsw-alias-bg-layer-2);display:grid;gap:4px}.dvt-metrics span,.dvt-diff-score span{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--dsw-alias-label-secondary)}.dvt-metrics strong,.dvt-diff-score strong{font-size:13px}.dvt-list{list-style:none;margin:0;padding:0;display:grid;gap:4px;max-height:160px;overflow:auto}.dvt-list li{display:flex;justify-content:space-between;gap:12px;padding:6px 8px;border-radius:7px;background:var(--dsw-alias-bg-layer-2);font-size:11px}.dvt-list code{color:var(--dsw-alias-state-business-primary)}.dvt-table-wrap{max-height:220px;overflow:auto;border:1px solid var(--dsw-alias-border-l1);border-radius:9px}.dvt-table{width:100%;border-collapse:collapse;font-size:11px}.dvt-table th,.dvt-table td{padding:7px 8px;text-align:left;border-bottom:1px solid var(--dsw-alias-border-l1)}.dvt-table th{position:sticky;top:0;background:var(--dsw-alias-bg-layer-2);font-size:10px;text-transform:uppercase;letter-spacing:.05em}.dvt-table tr:last-child td{border-bottom:0}
 .dvt-artifact{border:1px solid var(--dsw-alias-border-l1);border-radius:10px;overflow:hidden;background:var(--dsw-alias-bg-layer-1)}.dvt-preview{display:block;width:100%;max-height:360px;object-fit:contain;background:repeating-conic-gradient(var(--dsw-alias-bg-module-platform) 0 25%,var(--dsw-alias-bg-layer-1) 0 50%) 50%/18px 18px;border:0}.dvt-svg{height:280px}.dvt-artifact-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 10px}.dvt-artifact-meta>div:first-child{min-width:0;display:grid;gap:2px}.dvt-artifact-meta strong{font-size:12px;overflow:hidden;text-overflow:ellipsis}.dvt-artifact-meta span,.dvt-artifact-meta small{font-size:10px;color:var(--dsw-alias-label-secondary)}.dvt-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.dvt-download{display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:999px;background:var(--dsw-alias-button-primary-fill);color:var(--dsw-alias-label-primary-foreground);text-decoration:none;font-size:12px;font-weight:600}.dvt-download:hover{background:var(--dsw-alias-button-primary-hover)}.dvt-download:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary);outline-offset:2px}.dvt-artifact>.dvt-muted{padding:0 10px 10px}.dvt-diff-score>div{height:5px;border-radius:99px;background:var(--dsw-alias-border-l2);overflow:hidden}.dvt-diff-score i{display:block;height:100%;min-width:2px;background:linear-gradient(90deg,var(--dsw-alias-state-warn-primary),var(--dsw-alias-state-error-primary));border-radius:99px}.dvt-tool h4{font-size:11px;margin:0 0 6px}.dvt-palette{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:7px}.dvt-palette>div{display:flex;align-items:center;gap:8px;padding:7px;border:1px solid var(--dsw-alias-border-l1);border-radius:9px}.dvt-palette i{width:28px;height:28px;border-radius:7px;box-shadow:inset 0 0 0 1px var(--dsw-alias-border-l2)}.dvt-palette span{display:grid}.dvt-palette strong{font-size:11px}.dvt-palette small{font-size:10px;color:var(--dsw-alias-label-secondary)}
-.dvt-settings{display:grid;gap:14px;max-width:900px;padding:8px 2px 32px;color:var(--dsw-alias-label-primary)}.dvt-settings-header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:8px 2px}.dvt-settings-header h2{font-size:25px;letter-spacing:-.025em;margin:3px 0 6px}.dvt-settings-header p{max-width:620px;margin:0;color:var(--dsw-alias-label-secondary);font-size:13px;line-height:1.55}.dvt-kicker{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--dsw-alias-state-business-primary);font-weight:700}.dvt-release{display:grid;gap:4px;min-width:170px;padding:9px 11px;border-radius:10px;background:var(--dsw-alias-bg-layer-2);font-size:10px;color:var(--dsw-alias-label-secondary)}.dvt-release span{display:flex;justify-content:space-between;gap:12px}.dvt-release strong{color:var(--dsw-alias-label-primary)}.dvt-alert{padding:10px 12px;border-radius:10px;font-size:12px;line-height:1.5;display:grid;gap:3px}.dvt-alert.notice{background:color-mix(in srgb,var(--dsw-alias-state-business-primary) 10%,transparent);color:var(--dsw-alias-state-business-primary)}.dvt-alert.warning{background:color-mix(in srgb,var(--dsw-alias-state-warn-primary) 12%,transparent);color:var(--dsw-alias-state-warn-label)}.dvt-alert.error{background:color-mix(in srgb,var(--dsw-alias-state-error-primary) 10%,transparent);color:var(--dsw-alias-state-error-primary)}.dvt-alert.success{background:color-mix(in srgb,var(--dsw-alias-state-success-primary) 10%,transparent);color:var(--dsw-alias-state-success-primary)}.dvt-panel{display:grid;gap:12px;padding:15px;border:1px solid var(--dsw-alias-border-l1);border-radius:14px;background:var(--dsw-alias-bg-layer-1);box-shadow:var(--dsw-shadow-lv1)}.dvt-panel-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.dvt-panel-title h3{font-size:14px;margin:0}.dvt-panel-title p{font-size:11px;line-height:1.45;color:var(--dsw-alias-label-secondary);margin:4px 0 0;max-width:620px}.dvt-badge{font-size:10px;padding:3px 7px;border-radius:999px;font-weight:650}.dvt-badge.ok{background:color-mix(in srgb,var(--dsw-alias-state-success-primary) 12%,transparent);color:var(--dsw-alias-state-success-primary)}.dvt-badge.error{background:color-mix(in srgb,var(--dsw-alias-state-error-primary) 10%,transparent);color:var(--dsw-alias-state-error-primary)}.dvt-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.dvt-field{display:grid;gap:6px;align-content:start}.dvt-field>span{font-size:11px;font-weight:600}.dvt-field>small{font-size:10px;color:var(--dsw-alias-label-secondary);line-height:1.4}.dvt-field select,.dvt-field textarea{width:100%;box-sizing:border-box;border:1px solid var(--dsw-alias-border-l1);border-radius:9px;background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-primary);font:inherit;font-size:12px;padding:8px 10px}.dvt-field select{height:36px}.dvt-field textarea{resize:vertical;min-height:76px}.dvt-runtime-facts{display:grid;gap:4px;padding:9px 10px;border-radius:9px;background:var(--dsw-alias-bg-layer-2);overflow:auto}.dvt-runtime-facts code{font-size:10px;white-space:nowrap;color:var(--dsw-alias-label-secondary)}.dvt-save-row{display:flex;gap:8px;padding:2px 0}
+.dvt-settings{display:grid;gap:14px;max-width:900px;padding:8px 2px 32px;color:var(--dsw-alias-label-primary)}.dvt-settings-footer{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:8px 2px}.dvt-settings-footer h2{font-size:25px;letter-spacing:-.025em;margin:3px 0 6px}.dvt-settings-footer p{max-width:620px;margin:0;color:var(--dsw-alias-label-secondary);font-size:13px;line-height:1.55}.dvt-kicker{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--dsw-alias-state-business-primary);font-weight:700}.dvt-release{display:grid;gap:4px;min-width:170px;padding:9px 11px;border-radius:10px;background:var(--dsw-alias-bg-layer-2);font-size:10px;color:var(--dsw-alias-label-secondary)}.dvt-release span{display:flex;justify-content:space-between;gap:12px}.dvt-release strong{color:var(--dsw-alias-label-primary)}.dvt-alert{padding:10px 12px;border-radius:10px;font-size:12px;line-height:1.5;display:grid;gap:3px}.dvt-alert.notice{background:color-mix(in srgb,var(--dsw-alias-state-business-primary) 10%,transparent);color:var(--dsw-alias-state-business-primary)}.dvt-alert.warning{background:color-mix(in srgb,var(--dsw-alias-state-warn-primary) 12%,transparent);color:var(--dsw-alias-state-warn-label)}.dvt-alert.error{background:color-mix(in srgb,var(--dsw-alias-state-error-primary) 10%,transparent);color:var(--dsw-alias-state-error-primary)}.dvt-alert.success{background:color-mix(in srgb,var(--dsw-alias-state-success-primary) 10%,transparent);color:var(--dsw-alias-state-success-primary)}.dvt-panel{display:grid;gap:12px;padding:15px;border:1px solid var(--dsw-alias-border-l1);border-radius:14px;background:var(--dsw-alias-bg-layer-1);box-shadow:var(--dsw-shadow-lv1)}.dvt-panel-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.dvt-panel-title h3{font-size:14px;margin:0}.dvt-panel-title p{font-size:11px;line-height:1.45;color:var(--dsw-alias-label-secondary);margin:4px 0 0;max-width:620px}.dvt-badge{font-size:10px;padding:3px 7px;border-radius:999px;font-weight:650}.dvt-badge.ok{background:color-mix(in srgb,var(--dsw-alias-state-success-primary) 12%,transparent);color:var(--dsw-alias-state-success-primary)}.dvt-badge.error{background:color-mix(in srgb,var(--dsw-alias-state-error-primary) 10%,transparent);color:var(--dsw-alias-state-error-primary)}.dvt-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.dvt-field{display:grid;gap:6px;align-content:start}.dvt-field>span{font-size:11px;font-weight:600}.dvt-field>small{font-size:10px;color:var(--dsw-alias-label-secondary);line-height:1.4}.dvt-field select,.dvt-field textarea{width:100%;box-sizing:border-box;border:1px solid var(--dsw-alias-border-l1);border-radius:9px;background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-primary);font:inherit;font-size:12px;padding:8px 10px}.dvt-field select{height:36px}.dvt-field textarea{resize:vertical;min-height:76px}.dvt-runtime-facts{display:grid;gap:4px;padding:9px 10px;border-radius:9px;background:var(--dsw-alias-bg-layer-2);overflow:auto}.dvt-runtime-facts code{font-size:10px;white-space:nowrap;color:var(--dsw-alias-label-secondary)}.dvt-save-row{display:flex;gap:8px;padding:2px 0}
+.dvt-settings-footer{margin-top:8px;padding:20px 2px 4px;border-top:1px solid var(--dsw-alias-border-l1);opacity:.82}.dvt-settings-footer h2{font-size:18px;letter-spacing:-.015em;margin:3px 0 5px}.dvt-settings-footer p{font-size:11px;line-height:1.5}.dvt-release{min-width:220px}.dvt-release span{white-space:nowrap}.dvt-essential{border-color:color-mix(in srgb,var(--dsw-alias-state-business-primary) 30%,var(--dsw-alias-border-l1));box-shadow:var(--dsw-shadow-lv1),0 0 0 3px color-mix(in srgb,var(--dsw-alias-state-business-primary) 5%,transparent)}.dvt-advanced{border:1px solid var(--dsw-alias-border-l1);border-radius:14px;background:var(--dsw-alias-bg-layer-1);overflow:hidden}.dvt-advanced>summary{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 15px;cursor:pointer;list-style:none}.dvt-advanced>summary::-webkit-details-marker{display:none}.dvt-advanced>summary>span:first-child{display:grid;gap:3px}.dvt-advanced>summary strong{font-size:13px}.dvt-advanced>summary small{font-size:10px;line-height:1.45;color:var(--dsw-alias-label-secondary);font-weight:400}.dvt-details-chevron{font-size:15px;opacity:.55;transition:transform .16s ease}.dvt-advanced[open] .dvt-details-chevron{transform:rotate(180deg)}.dvt-advanced-body{display:grid;gap:12px;padding:0 12px 12px}.dvt-advanced-body>.dvt-panel{box-shadow:none}
 .dvt-health-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px}.dvt-health-grid>div{padding:9px 10px;border-radius:9px;background:var(--dsw-alias-bg-layer-2);border-left:3px solid var(--dsw-alias-border-l4)}.dvt-health-grid>div[data-status=ok]{border-left-color:var(--dsw-alias-state-success-primary)}.dvt-health-grid>div[data-status=warning],.dvt-health-grid>div[data-status=not_tested]{border-left-color:var(--dsw-alias-state-warn-primary)}.dvt-health-grid>div[data-status=error]{border-left-color:var(--dsw-alias-state-error-primary)}.dvt-health-grid span{font-size:10px;text-transform:capitalize}.dvt-health-grid strong{float:right;font-size:9px;text-transform:uppercase;color:var(--dsw-alias-label-secondary)}.dvt-health-grid p{clear:both;margin:5px 0 0;font-size:10px;line-height:1.4;color:var(--dsw-alias-label-secondary)}.dvt-loading{padding:24px;border-radius:12px;background:var(--dsw-alias-bg-layer-2);font-size:12px;color:var(--dsw-alias-label-secondary)}
 .dvt-paste-dock{box-sizing:border-box;width:calc(100% - 32px);max-width:var(--dsh-composer-card-max-width,960px);margin:0 auto;display:flex;flex-wrap:wrap;gap:6px;padding:0 2px 6px}.dvt-paste-chip{max-width:100%;height:32px;box-sizing:border-box;display:flex;align-items:center;gap:7px;padding:0 6px 0 10px;border:1px solid var(--dsw-alias-border-l1);border-radius:9px;background:var(--dsw-specific-tip);font-size:12px}.dvt-paste-chip[data-status=copying]{border-color:var(--dsw-alias-state-business-primary)}.dvt-paste-chip[data-status=error]{border-color:var(--dsw-alias-state-error-primary)}.dvt-paste-name{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dvt-paste-detail{color:var(--dsw-alias-label-caption);max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dvt-paste-chip[data-status=error] .dvt-paste-detail{color:var(--dsw-alias-state-error-primary)}.dvt-paste-chip button{width:20px;height:20px;display:grid;place-items:center;border:0;border-radius:50%;padding:0;background:transparent;color:var(--dsw-alias-label-caption);font:inherit;font-size:16px;cursor:pointer}.dvt-paste-chip button:hover{background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-primary)}.dvt-paste-chip button:disabled{opacity:.4;cursor:default}
-@media(max-width:720px){.dvt-settings-header{display:grid}.dvt-release{width:auto}.dvt-form-grid{grid-template-columns:1fr}.dvt-metrics{grid-template-columns:1fr}.dvt-artifact-meta{align-items:flex-start;flex-direction:column}.dvt-panel-title{flex-direction:column}}
+@media(max-width:720px){.dvt-settings-footer{display:grid}.dvt-release{width:auto}.dvt-form-grid{grid-template-columns:1fr}.dvt-metrics{grid-template-columns:1fr}.dvt-artifact-meta{align-items:flex-start;flex-direction:column}.dvt-panel-title{flex-direction:column}}
 `;
 function installStyles() {
     const id = '@anionex/dsh-vision-toolkit/client';