@mars-sea/dsh-commandcode-provider 0.11.17 → 0.12.1

package/lib/client.js

@@ -526,22 +526,62 @@ window.__ModuleLoader__.load({
 				}
 			};
 		}
-		const MAX_TIMEOUT_MS = 2147483647;
+		const MAX_TIMEOUT_SECONDS = 3600;
+		/**
+		* A duration field the user edits in WHOLE SECONDS.
+		*
+		* Milliseconds are the wrong unit to show: the defaults are 300000 and the
+		* ceiling is 2147483647, so the page asked users to do arithmetic to answer
+		* "how long is a reasonable wait". `format` divides, `parse` multiplies, and
+		* the stored value never leaves milliseconds.
+		*
+		* Decimals are refused rather than rounded. "1.5" is a format the control does
+		* not accept, and silently storing 1000 or 2000 for it would make the saved
+		* profile disagree with the box it was typed in.
+		*/
+		function secondsField(field, bounds) {
+			return {
+				field,
+				format: (value) => typeof value === "number" ? String(Math.round(value / 1e3)) : "",
+				parse: (text) => {
+					const trimmed = text.trim();
+					if (trimmed === "") return { kind: "clear" };
+					const parsed = Number(trimmed);
+					if (!Number.isFinite(parsed) || !Number.isInteger(parsed)) return {
+						kind: "invalid",
+						reason: "format"
+					};
+					if (parsed < bounds.min) return {
+						kind: "invalid",
+						reason: "tooSmall"
+					};
+					if (parsed > bounds.max) return {
+						kind: "invalid",
+						reason: "tooLarge"
+					};
+					return {
+						kind: "set",
+						value: parsed * 1e3
+					};
+				}
+			};
+		}
 		/** The fields this page edits inside the `llm-commandcode` namespace. */
 		const SECTION_FIELDS = [
 			textField("apiBase"),
-			numberField$1("requestTimeoutMs", {
+			secondsField("requestTimeoutMs", {
 				min: 1,
-				max: MAX_TIMEOUT_MS
+				max: MAX_TIMEOUT_SECONDS
 			}),
-			numberField$1("streamIdleTimeoutMs", {
+			secondsField("streamIdleTimeoutMs", {
 				min: 1,
-				max: MAX_TIMEOUT_MS
+				max: MAX_TIMEOUT_SECONDS
 			}),
 			numberField$1("transportMaxRetries", {
 				min: 0,
 				max: 50
 			}),
+			booleanField$1("offloadSeenImagesForCache"),
 			booleanField$1("filterModelsByPlan"),
 			booleanField$1("webSearch"),
 			booleanField$1("showSidebarQuota"),
@@ -675,6 +715,7 @@ window.__ModuleLoader__.load({
 					requestTimeoutMs: this.field("requestTimeoutMs"),
 					streamIdleTimeoutMs: this.field("streamIdleTimeoutMs"),
 					transportMaxRetries: this.field("transportMaxRetries"),
+					offloadSeenImagesForCache: this.field("offloadSeenImagesForCache"),
 					filterModelsByPlan: this.field("filterModelsByPlan"),
 					webSearch: this.field("webSearch"),
 					showSidebarQuota: this.field("showSidebarQuota"),
@@ -1082,7 +1123,8 @@ window.__ModuleLoader__.load({
 							shaped.push({
 								id: entry.id,
 								name: entry.name,
-								...typeof entry.tier === "string" ? { tier: entry.tier } : {}
+								...typeof entry.tier === "string" ? { tier: entry.tier } : {},
+								...typeof entry.allowance === "number" && Number.isFinite(entry.allowance) ? { allowance: entry.allowance } : {}
 							});
 						}
 						this.catalogModels = shaped;
@@ -1184,6 +1226,34 @@ window.__ModuleLoader__.load({
 			}
 		};
 		//#endregion
+		//#region src/display-format.ts
+		/** Shared, dependency-free formatting for Host commands and browser surfaces. */
+		function formatMoney(value) {
+			return `$${value.toFixed(2)}`;
+		}
+		function formatMoneyExact(value) {
+			return `$${value.toFixed(4)}`;
+		}
+		function formatTokensCompact(value) {
+			if (value >= 1e9) return `${(value / 1e9).toFixed(1)}B`;
+			if (value >= 1e6) return `${(value / 1e6).toFixed(1)}M`;
+			if (value >= 1e3) return `${(value / 1e3).toFixed(1)}K`;
+			return String(value);
+		}
+		/** The input is already in percent units; callers add the percent sign. */
+		function formatSuccessRate(value) {
+			return String(Number(value.toFixed(2)));
+		}
+		/** One window's fill ratio in [0, 1]; zero when uncapped. */
+		function windowRatio(used, cap) {
+			if (cap <= 0) return 0;
+			return Math.max(0, Math.min(1, used / cap));
+		}
+		/** Local date-time, with the empty state chosen by the caller. */
+		function formatResetAt(ms) {
+			return ms <= 0 ? "" : new Date(ms).toLocaleString();
+		}
+		//#endregion
 		//#region src/client/usage.ts
 		const IDLE$1 = {
 			status: "idle",
@@ -1266,39 +1336,6 @@ window.__ModuleLoader__.load({
 				for (const listener of this.listeners) listener();
 			}
 		};
-		/** Format a dollar amount compactly (2 decimals). */
-		function formatMoney(value) {
-			return `$${value.toFixed(2)}`;
-		}
-		/** Format a dollar amount precisely (4 decimals) for small totals. */
-		function formatMoneyExact(value) {
-			return `$${value.toFixed(4)}`;
-		}
-		/** Format a large token count compactly (1.9M style). */
-		function formatTokensCompact(value) {
-			if (value >= 1e9) return `${(value / 1e9).toFixed(1)}B`;
-			if (value >= 1e6) return `${(value / 1e6).toFixed(1)}M`;
-			if (value >= 1e3) return `${(value / 1e3).toFixed(1)}K`;
-			return String(value);
-		}
-		/**
-		* Success-rate percentage (already in percent units, e.g. 99.96): at most two
-		* decimals, trailing zeros trimmed — `100` stays `100`, not `100.00`, and
-		* `99.965552876334` becomes `99.97`. The `%` suffix is the caller's job.
-		*/
-		function formatSuccessRate(value) {
-			return String(Number(value.toFixed(2)));
-		}
-		/** One window's fill ratio in [0, 1]; 0 when uncapped. */
-		function windowRatio(used, cap) {
-			if (cap <= 0) return 0;
-			return Math.max(0, Math.min(1, used / cap));
-		}
-		/** Format a millis timestamp as a local short date-time; empty when unset. */
-		function formatResetAt(ms) {
-			if (ms <= 0) return "";
-			return new Date(ms).toLocaleString();
-		}
 		/** Host facts drive the usage card, including keys invisible to browser credentials. */
 		function usageCardState(usage) {
 			const accounts = usage.report?.accounts ?? [];
@@ -1925,7 +1962,7 @@ window.__ModuleLoader__.load({
 		* separate instance so catalog boundary errors name `commandcode/models`,
 		* not the report endpoint.
 		*/
-		const { record: catalogRecord, stringField: catalogString } = makeBoundaryValidator("commandcode/models result:");
+		const { record: catalogRecord, stringField: catalogString, numberField: catalogNumber } = makeBoundaryValidator("commandcode/models result:");
 		/** Parse one untrusted boundary value into a {@link CommandCodeCatalogModel}. */
 		function parseCatalogModel(value) {
 			const source = catalogRecord(value, "model");
@@ -1934,6 +1971,7 @@ window.__ModuleLoader__.load({
 				name: catalogString(source, "name", "model.name")
 			};
 			if (source.tier !== void 0) model.tier = catalogString(source, "tier", "model.tier");
+			if (source.allowance !== void 0) model.allowance = catalogNumber(source, "allowance", "model.allowance");
 			return model;
 		}
 		/** Parse the wire result into a {@link CommandCodeCatalog}. */
@@ -2085,6 +2123,24 @@ window.__ModuleLoader__.load({
 			]
 		};
 		//#endregion
+		//#region src/plan-tiers.ts
+		/** Shared plan-tier presentation facts; safe to inline into the browser bundle. */
+		const PLAN_TIER_ORDER = [
+			"go",
+			"goat",
+			"pro",
+			"provider",
+			"max"
+		];
+		const PLAN_LABELS = {
+			go: "Go",
+			goat: "GOAT",
+			pro: "Pro",
+			provider: "Provider",
+			max: "Max"
+		};
+		Object.fromEntries(PLAN_TIER_ORDER.map((tier, index) => [tier, index]));
+		//#endregion
 		//#region src/client/model-select.ts
 		/**
 		* Model-select helpers for the settings page's model editors (browser half).
@@ -2095,26 +2151,12 @@ window.__ModuleLoader__.load({
 		* detection, tier grouping — lives here, React-free, so node tests can drive
 		* it directly.
 		*
-		* Dependency-free by design: the client bundle may only import platform/seed
-		* modules, so the plan snapshot below is a deliberately small vendored copy
-		* (tier key → heading label) rather than an import of src/capabilities.ts.
-		* When upstream adds a plan tier, extend BOTH tables.
+		* The shared tier module is dependency-free and inlined into the client bundle;
+		* importing the Host's full capability snapshot here would bloat that bundle.
 		*
 		* @module dsh-commandcode-provider/model-select
 		*/
 		/**
-		* Minimum plan tier → dropdown section heading. Mirrors the Host-side
-		* `KNOWN_PLANS` tiers + `PLAN_LABELS` in src/capabilities.ts; an unknown tier
-		* key falls back to the raw key rather than vanishing the row.
-		*/
-		const TIER_HEADINGS = {
-			go: "Go",
-			goat: "GOAT",
-			pro: "Pro",
-			provider: "Provider",
-			max: "Max"
-		};
-		/**
 		* The dropdown section heading for a catalog model id, or undefined for
 		* models outside the known plan tiers (unmapped models and stale ids render
 		* unheaded). `knownPlans` is the Host-side `KNOWN_PLANS` table, threaded in
@@ -2123,7 +2165,7 @@ window.__ModuleLoader__.load({
 		function tierHeadingFor(modelId, knownPlans) {
 			const tier = knownPlans[modelId];
 			if (tier === void 0) return void 0;
-			return TIER_HEADINGS[tier] ?? tier;
+			return PLAN_LABELS[tier] ?? tier;
 		}
 		/**
 		* Whether `text` matches `query` as a case-insensitive substring over the
@@ -2146,7 +2188,8 @@ window.__ModuleLoader__.load({
 			const options = catalog.filter((model) => matchesModelQuery(model, query)).map((model) => ({
 				value: model.id,
 				label: model.name,
-				stale: false
+				stale: false,
+				...model.allowance === void 0 ? {} : { allowance: model.allowance }
 			}));
 			const seen = new Set(catalogIds);
 			for (const id of selected) {
@@ -2219,7 +2262,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region package.json
-		var version = "0.11.17";
+		var version = "0.12.1";
 		var repository = {
 			"type": "git",
 			"url": "git+https://github.com/Mars-Sea/dsh-commandcode-provider.git"
@@ -2415,7 +2458,8 @@ window.__ModuleLoader__.load({
 			"apiBase",
 			"requestTimeoutMs",
 			"streamIdleTimeoutMs",
-			"transportMaxRetries"
+			"transportMaxRetries",
+			"offloadSeenImagesForCache"
 		];
 		/** The "customized" tag and reset link a staged field shows once it differs from the default. */
 		function FieldOverride({ label, state, disabled, t, onReset }) {
@@ -2612,7 +2656,7 @@ window.__ModuleLoader__.load({
 			});
 		}
 		/** One pool account's facts (identity, totals, credits, window limits). */
-		function AccountReport({ entry, fetchedAt, t, summaryOnly = false, headless = false }) {
+		function AccountReport({ entry, fetchedAt, t, headless = false }) {
 			const report = entry.report;
 			const account = report.account;
 			const accountName = account === void 0 ? "" : account.userName || account.name;
@@ -2669,7 +2713,7 @@ window.__ModuleLoader__.load({
 							}) : null
 						]
 					}) : null,
-					!summaryOnly && report.usage !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					report.usage !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						className: "cc-usageStats cc-usageStatsActivity",
 						children: [
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(UsageStat, {
@@ -2693,7 +2737,7 @@ window.__ModuleLoader__.load({
 							})
 						]
 					}) : null,
-					!summaryOnly && credits !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					credits !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						className: "cc-usageStats cc-usageStatsBalance",
 						children: [
 							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(UsageStat, {
@@ -2819,6 +2863,11 @@ window.__ModuleLoader__.load({
 							className: "cc-badge",
 							children: t("modelStale")
 						}) : null,
+						option.allowance !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "cc-badgeMuted",
+							title: t("modelAllowanceTitle"),
+							children: t("modelAllowance", { amount: option.allowance })
+						}) : null,
 						!selected.includes(option.value) && ownerOf?.(option.value) !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 							className: "cc-badgeMuted",
 							children: t("accountModelOwner", { name: ownerOf(option.value) })
@@ -2917,11 +2966,13 @@ window.__ModuleLoader__.load({
 		}
 		/**
 		* One titled group of rows. No card surface: like the harness's own settings
-		* pages, a group is a heading over hairline-separated rows.
+		* pages, a group is a heading over its rows. The hairline between sections is
+		* `cc-groupDivided`, so it belongs to every group but the first one on the page
+		* (accounts opens it) and never to the rows inside a group.
 		*/
-		function SettingsGroup({ title, action, children }) {
+		function SettingsGroup({ title, action, divided = false, children }) {
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-				className: "cc-group",
+				className: divided ? "cc-group cc-groupDivided" : "cc-group",
 				"aria-label": title,
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: "cc-groupHead",
@@ -2942,6 +2993,7 @@ window.__ModuleLoader__.load({
 		function ModelsCard({ state, disabled, t, onEdit, onReset, onSelect, onClear }) {
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(SettingsGroup, {
 				title: t("modelsTitle"),
+				divided: true,
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToggleField, {
 					id: "cc-filter-models-by-plan",
 					label: t("filterModelsByPlan"),
@@ -2968,6 +3020,7 @@ window.__ModuleLoader__.load({
 		function PrivacyCard({ state, disabled, t, onEdit, onReset }) {
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingsGroup, {
 				title: t("privacyTitle"),
+				divided: true,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToggleField, {
 					id: "cc-zdr",
 					label: t("zdr"),
@@ -2985,6 +3038,7 @@ window.__ModuleLoader__.load({
 		function IntegrationsCard({ state, disabled, t, onEdit, onReset }) {
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(SettingsGroup, {
 				title: t("integrationsTitle"),
+				divided: true,
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToggleField, {
 					id: "cc-web-search",
 					label: t("webSearch"),
@@ -3018,7 +3072,7 @@ window.__ModuleLoader__.load({
 			const overridden = ADVANCED_FIELDS.filter((field) => state[field].overridden).length;
 			const invalid = ADVANCED_FIELDS.some((field) => state[field].invalid);
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-				className: "cc-group",
+				className: "cc-group cc-groupDivided",
 				"aria-label": t("advancedSettings"),
 				children: [
 					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
@@ -3098,6 +3152,17 @@ window.__ModuleLoader__.load({
 								onEdit: (text) => onEdit("transportMaxRetries", text),
 								onReset: () => onReset("transportMaxRetries"),
 								t
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToggleField, {
+								id: "cc-offload-seen-images-for-cache",
+								label: t("offloadSeenImagesForCache"),
+								hint: t("offloadSeenImagesForCacheHint"),
+								state: state.offloadSeenImagesForCache,
+								disabled,
+								defaultChecked: false,
+								onEdit: (text) => onEdit("offloadSeenImagesForCache", text),
+								onReset: () => onReset("offloadSeenImagesForCache"),
+								t
 							})
 						]
 					}) : null,
@@ -3161,12 +3226,33 @@ window.__ModuleLoader__.load({
 			}
 			return rows;
 		}
-		/** The row's status dot: error for a rejected key, warning while cooling down. */
+		/**
+		* The row's status dot. Read top-down, so a problem always outranks "serving":
+		* red for a key the Host rejected, amber while a rate limit is cooling down,
+		* green for the account that is actually serving requests. A standby (or not
+		* yet configured) account draws NOTHING — `cc-tabDotBlank` is an unfilled,
+		* borderless dot that only holds the column so the account names stay aligned
+		* with the rows that do have a verdict. Green therefore means "in use", not
+		* "healthy": a wall of green dots would say nothing.
+		*/
 		function statusDotClass(row) {
 			const entry = row.usage;
-			if (!row.configured || entry?.mark === "invalid-credential") return "cc-tabDot cc-tabDotError";
+			if (entry?.mark === "invalid-credential") return "cc-tabDot cc-tabDotError";
 			if (entry !== void 0 && (entry.mark !== "" || entry.cooldownUntil > 0)) return "cc-tabDot cc-tabDotWarn";
-			return "cc-tabDot cc-tabDotOk";
+			if (row.configured && entry?.active === true) return "cc-tabDot cc-tabDotOk";
+			return "cc-tabDot cc-tabDotBlank";
+		}
+		/**
+		* The same verdict as a sentence, for the dot's tooltip. Undefined on a blank
+		* dot: there is no verdict to read out, and a hover hotspot on an invisible
+		* 8px mark would only invite the question it cannot usefully answer.
+		*/
+		function statusDotTitle(row, t) {
+			const entry = row.usage;
+			if (entry?.mark === "invalid-credential") return t("usageInvalidKey");
+			if (entry !== void 0 && (entry.mark !== "" || entry.cooldownUntil > 0)) return t("usageCooldown");
+			if (!row.configured) return t("apiKeyUnset");
+			return entry?.active === true ? t("usageActive") : void 0;
 		}
 		/** One compact quota meter for a row's summary line. */
 		function MiniMeter({ label, limit }) {
@@ -3390,6 +3476,7 @@ window.__ModuleLoader__.load({
 							children: [
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 									className: statusDotClass(row),
+									title: statusDotTitle(row, t),
 									"aria-hidden": "true"
 								}),
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
@@ -4467,8 +4554,7 @@ window.__ModuleLoader__.load({
 		const UNREPORTED = "—";
 		/** Local reset time; empty when the endpoint reported none. */
 		function resetText(ms) {
-			if (ms <= 0) return "";
-			return new Date(ms).toLocaleString();
+			return formatResetAt(ms);
 		}
 		/** Local short date; empty when unset. */
 		function dateText(ms) {
@@ -4901,14 +4987,6 @@ window.__ModuleLoader__.load({
 				]
 			});
 		}
-		/** One usage tile. */
-		function StatTile({ stat, label }) {
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Tile, {
-				label,
-				value: stat.value,
-				sub: stat.sub
-			});
-		}
 		/** The rotation/credential badge line for one account. */
 		function markText(account, text) {
 			if (account.mark === void 0) return "";
@@ -5055,9 +5133,10 @@ window.__ModuleLoader__.load({
 							children: text("usage")
 						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 							className: "ccp-tiles",
-							children: account.stats.map((stat) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StatTile, {
-								stat,
-								label: text(stat.label)
+							children: account.stats.map((stat) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Tile, {
+								label: text(stat.label),
+								value: stat.value,
+								sub: stat.sub
 							}, stat.label))
 						})]
 					}) : null
@@ -6134,10 +6213,12 @@ window.__ModuleLoader__.load({
 		* The settings-page stylesheet.
 		*
 		* The metrics are the harness's own settings pages', read out of the 0.1.7
-		* bundles so the page sits beside General and Models without looking foreign: a
-		* row is 16px of padding over a 0.5px border-l2 hairline, its title 14/22
-		* label-primary and its description 12/18 label-tertiary, the control on the
-		* right. Selectors and buttons are capsules (36px / 28px compact), inputs are
+		* bundles so the page sits beside General and Models without looking foreign:
+		* a row is 12px of padding, its title 14/22 label-primary and its description
+		* 12/18 label-tertiary, the control on the right. The hairline rhythm is
+		* section-level: a 0.5px border-l2 rule separates the GROUPS (see
+		* `cc-groupDivided`), never the rows inside one, so a group's rows read as one
+		* list. Selectors and buttons are capsules (36px / 28px compact), inputs are
 		* 32px with an 8px radius and a 0.5px border-l4 edge, a card is a 0.5px
 		* border-l4 outline with a 16px radius, and a nested panel is a
 		* bg-module-platform fill with a 12px radius. Errors use state-error-primary.
@@ -6149,6 +6230,7 @@ window.__ModuleLoader__.load({
 .cc-readOnly{margin:8px 0 0;color:var(--dsw-alias-state-warn-label,var(--dsw-alias-label-tertiary));font-size:12px;line-height:18px}
 .cc-spacer{flex:1}
 .cc-group{flex-direction:column;display:flex;margin-top:28px}
+.cc-groupDivided{margin-top:24px;padding-top:20px;border-top:.5px solid var(--dsw-alias-border-l2)}
 .cc-groupHead{align-items:center;gap:8px;display:flex;min-height:28px;padding-bottom:4px}
 .cc-groupTitle{margin:0;color:var(--dsw-alias-label-primary);font-size:14px;font-weight:500;line-height:22px}
 .cc-groupDesc{margin:0 0 12px;color:var(--dsw-alias-label-tertiary);font-size:12px;line-height:18px}
@@ -6156,9 +6238,8 @@ window.__ModuleLoader__.load({
 .cc-disclosure{width:100%;padding:0 0 4px;border:0;background:0 0;font:inherit;text-align:left;cursor:pointer;border-radius:6px}
 .cc-disclosure:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:2px}
 .cc-rows{flex-direction:column;display:flex}
-.cc-row{align-items:center;gap:8px;display:flex;padding:16px 0;border-bottom:.5px solid var(--dsw-alias-border-l2)}
-.cc-rows>.cc-row:last-child{border-bottom:0}
-.cc-rowFlush{padding:0;border-bottom:0}
+.cc-row{align-items:center;gap:8px;display:flex;padding:12px 0}
+.cc-rowFlush{padding:0}
 .cc-rowText{flex-direction:column;flex:1;gap:4px;min-width:0;padding-right:32px;display:flex}
 .cc-rowTitleLine{align-items:center;gap:8px;display:flex;min-width:0}
 .cc-rowTitle{min-width:0;color:var(--dsw-alias-label-primary);font-size:14px;font-weight:400;line-height:22px}
@@ -6174,7 +6255,7 @@ window.__ModuleLoader__.load({
 .cc-linkButton:disabled{cursor:default;opacity:.4}
 .cc-linkButton:focus-visible{outline:none;box-shadow:0 0 0 2px var(--dsw-alias-border-l3)}
 .cc-badges{align-items:center;gap:8px;display:inline-flex}
-.cc-badge,.cc-badgeMuted{flex:none;align-items:center;display:inline-flex;white-space:nowrap;border-radius:999px;corner-shape:round;padding:1px 8px;font-size:11px;font-weight:500;line-height:17px}
+.cc-badge,.cc-badgeMuted{flex:none;align-items:center;display:inline-flex;white-space:nowrap;border-radius:999px;corner-shape:round;padding:1px 8px;font-size:12px;font-weight:500;line-height:17px}
 .cc-badge{background:var(--dsw-alias-bg-module-platform);color:var(--dsw-alias-label-secondary)}
 .cc-badgeMuted{border:.5px solid var(--dsw-alias-border-l4);color:var(--dsw-alias-label-tertiary)}
 .cc-badgeWarn{background:var(--dsw-alias-state-warn-tertiary,var(--dsw-alias-bg-module-platform));color:var(--dsw-alias-state-warn-label,var(--dsw-alias-label-secondary))}
@@ -6248,6 +6329,7 @@ window.__ModuleLoader__.load({
 .cc-kebab{width:3px;height:3px;border-radius:50%;corner-shape:round;background:currentColor;box-shadow:0 -5px 0 currentColor,0 5px 0 currentColor}
 .cc-tabDot{flex-shrink:0;width:8px;height:8px;border-radius:50%;corner-shape:round}
 .cc-tabDotOk{background:var(--dsw-alias-state-success-primary)}
+.cc-tabDotBlank{background:0 0;border:0}
 .cc-tabDotWarn{background:var(--dsw-alias-state-warn-primary,#d97706)}
 .cc-tabDotError{background:var(--dsw-alias-state-error-primary)}
 .cc-accountMeters{flex-wrap:wrap;gap:6px 20px;display:flex;padding-left:16px}
@@ -6513,12 +6595,14 @@ window.__ModuleLoader__.load({
 			apiKeyLocked: "密钥由只读来源提供",
 			apiBase: "API 地址",
 			apiBaseHint: "默认 https://api.commandcode.ai，一般无需修改。",
-			requestTimeoutMs: "请求超时（毫秒）",
-			requestTimeoutMsHint: "等待响应首个字节的超时；默认 60000。",
-			streamIdleTimeoutMs: "流空闲超时（毫秒）",
-			streamIdleTimeoutMsHint: "生成流停滞多久视为断连；默认 300000（长思考模型可静默数分钟，默认值刻意放宽）。",
+			requestTimeoutMs: "请求超时（秒）",
+			requestTimeoutMsHint: "等待响应首个字节的超时；默认 300 秒（与官方 CLI 一致）。Provider API 路由要等上游模型吐出第一个 token 才返回响应头，上游慢时仍可能不够；报超时时可按提示调高。",
+			streamIdleTimeoutMs: "流空闲超时（秒）",
+			streamIdleTimeoutMsHint: "生成流停滞多久视为断连；默认 300 秒（长思考模型可静默数分钟，默认值刻意放宽）。",
 			transportMaxRetries: "网络失败重试次数",
 			transportMaxRetriesHint: "连接失败时自动重试几次，默认 5（各次等待 0.5+1+2+4+8 秒，合计约 15 秒）。超过后直接报错，不再按指数退避长时间等待；填 0 表示不重试。限流、5xx 等由服务端要求重试的失败不受此项影响。",
+			offloadSeenImagesForCache: "已看过的图片不再重复发送",
+			offloadSeenImagesForCacheHint: "仅 CLI 传输。模型看过图片并回复后，永久用文字占位替代旧图片，以减少新增图片时的缓存回退。模型如需重看旧图，必须重新读取文件或让用户重新附加。默认关闭。",
 			advancedSettings: "高级设置",
 			advancedSettingsHint: "API 地址和网络参数，一般无需修改。",
 			advancedOverriddenOne: "已自定义 1 项",
@@ -6539,6 +6623,8 @@ window.__ModuleLoader__.load({
 			modelSearchPlaceholder: "搜索模型…",
 			modelSearchEmpty: "没有匹配的模型。",
 			modelStale: "已下架",
+			modelAllowance: "${amount}/月",
+			modelAllowanceTitle: "该模型每月可用的额度（美元）。套餐内所有模型共用同一个月度额度池，这不是额外赠送的额度。",
 			visibleModelsTitle: "模型白名单",
 			visibleModelsHint: "勾选要保留的模型，模型选择器就只列出这些；一个都不勾选时则显示全部模型。保存后，下次打开模型选择器生效。",
 			visibleModelsPick: "选择要保留的模型…",
@@ -6665,12 +6751,14 @@ window.__ModuleLoader__.load({
 			apiKeyLocked: "Key provided by a read-only source",
 			apiBase: "API base URL",
 			apiBaseHint: "Defaults to https://api.commandcode.ai; usually leave as-is.",
-			requestTimeoutMs: "Request timeout (ms)",
-			requestTimeoutMsHint: "Time to wait for the first response byte; default 60000.",
-			streamIdleTimeoutMs: "Stream idle timeout (ms)",
-			streamIdleTimeoutMsHint: "How long a stalled stream is treated as dead; default 300000 (deliberately generous — long-thinking models can stay silent for minutes).",
+			requestTimeoutMs: "Request timeout (seconds)",
+			requestTimeoutMsHint: "Time to wait for the first response byte; default 300 s (the official CLI’s). The Provider API route withholds headers until the upstream model emits its first token, so a slow upstream can still outlast the default; raise it when a timeout message suggests it.",
+			streamIdleTimeoutMs: "Stream idle timeout (seconds)",
+			streamIdleTimeoutMsHint: "How long a stalled stream is treated as dead; default 300 s (deliberately generous — long-thinking models can stay silent for minutes).",
 			transportMaxRetries: "Transport retries",
 			transportMaxRetriesHint: "How many times a failed connection is retried automatically; default 5 (waits of 0.5+1+2+4+8s, ~15s in total). After that the failure is reported instead of waiting on the exponential backoff. 0 disables the retries. Rate limits and 5xx answers keep their own, longer retry window.",
+			offloadSeenImagesForCache: "Stop replaying images already seen",
+			offloadSeenImagesForCacheHint: "CLI transport only. After this model responds to an image, durably replace older pixels with text to avoid cache rollback when another image arrives. To inspect an old image again, the model must reread its file or the user must attach it again. Off by default.",
 			advancedSettings: "Advanced",
 			advancedSettingsHint: "API base URL and network limits; usually leave as-is.",
 			advancedOverriddenOne: "1 customized",
@@ -6691,6 +6779,8 @@ window.__ModuleLoader__.load({
 			modelSearchPlaceholder: "Search models…",
 			modelSearchEmpty: "No matching models.",
 			modelStale: "Retired",
+			modelAllowance: "${amount}/mo",
+			modelAllowanceTitle: "Monthly usage this model can draw, in USD. Every model shares one monthly pool — this is not extra credit on top of the plan.",
 			visibleModelsTitle: "Model allowlist",
 			visibleModelsHint: "Check the models you want to keep, and model pickers will list only those. If nothing is checked, every model is shown. After saving, the change applies the next time you open a model picker.",
 			visibleModelsPick: "Select models to keep…",
@@ -6808,32 +6898,16 @@ window.__ModuleLoader__.load({
 		};
 		//#endregion
 		//#region src/client/index.ts
-		/** Inject the page stylesheet once (idempotent per tag). */
-		function injectPageCss() {
-			if (typeof document === "undefined") return;
-			if (document.querySelector(`style[data-plugin-css="@mars-sea/dsh-commandcode-provider/CommandCodeSettingsPage.module.css"]`) !== null) return;
-			const tag = document.createElement("style");
-			tag.dataset.plugin = "@mars-sea/dsh-commandcode-provider";
-			tag.dataset.pluginCss = PAGE_CSS_ID;
-			tag.textContent = PAGE_CSS;
-			document.head.appendChild(tag);
-		}
-		/**
-		* Install the plans & quota panel's stylesheet and return its disposer, for
-		* `ctx.effect` to own. Keyed by its own `data-plugin-css` id, so a second
-		* surface asking for it later is a no-op.
-		*/
-		function injectPanelCss() {
+		/** Install one stylesheet by id and return a disposer for its owning effect. */
+		function injectCss(id, css) {
 			if (typeof document === "undefined") return () => {};
-			if (document.querySelector(`style[data-plugin-css="@mars-sea/dsh-commandcode-provider/CommandCodePanel.module.css"]`) !== null) return () => {};
+			if (document.querySelector(`style[data-plugin-css="${id}"]`) !== null) return () => {};
 			const tag = document.createElement("style");
 			tag.dataset.plugin = "@mars-sea/dsh-commandcode-provider";
-			tag.dataset.pluginCss = PANEL_CSS_ID;
-			tag.textContent = PANEL_CSS;
+			tag.dataset.pluginCss = id;
+			tag.textContent = css;
 			document.head.appendChild(tag);
-			return () => {
-				tag.remove();
-			};
+			return () => tag.remove();
 		}
 		/**
 		* Plans & quota panel id. It is the layout's `MainPanelId`: one string shared
@@ -6859,7 +6933,7 @@ window.__ModuleLoader__.load({
 		* list at the bottom of this file.
 		*/
 		function apply(ctx) {
-			injectPageCss();
+			injectCss(PAGE_CSS_ID, PAGE_CSS);
 			ctx.effect(() => ctx.locale.register("settings.commandcode", {
 				zh,
 				en
@@ -7108,7 +7182,7 @@ window.__ModuleLoader__.load({
 					ctx.get("layout")?.selectPanel(null);
 				}
 			});
-			ctx.effect(() => injectPanelCss(), "dsh-commandcode-provider: panel styles");
+			ctx.effect(() => injectCss(PANEL_CSS_ID, PANEL_CSS), "dsh-commandcode-provider: panel styles");
 			try {
 				ctx.slots.inject("main", () => ctx.slots.register({
 					name: "main",