@mars-sea/dsh-commandcode-provider 0.11.16 → 0.12.0

package/lib/client.js

@@ -40,16 +40,12 @@ window.__ModuleLoader__.load({
 		/**
 		* Backoff before re-reading a directory whose FIRST read failed, in millis.
 		*
-		* A first read can lose to a Host that is still coming up (the gateway's WS
-		* handshake, a settings service mid-start): the failure is transient, but the
-		* scope has nothing held, so it keeps its initial `{ status: 'loading',
-		* writable: false }` snapshot — and every control on the settings page renders
-		* disabled behind a "read-only" banner. Nothing else would ever re-read it:
-		* the forwarded `settings/document-updated` and `connection/reset` signals need
-		* a live Host to fire, and the namespace only re-mounts on a page reload. So a
-		* failure with NOTHING held retries on this bounded ladder; a failure with a
-		* held view keeps it (no retry — the page is already showing the last good
-		* document, and `tests/settings-scope.test.ts` pins that).
+		* Only a failure with NOTHING held retries. With no view the scope keeps its
+		* initial `{ status: 'loading', writable: false }` snapshot and the settings
+		* page renders fully disabled, while the forwarded invalidation signals need a
+		* live Host to fire and the namespace only re-mounts on a reload. A failure
+		* with a held view retries nothing — the page already shows the last good
+		* document (`tests/settings-scope.test.ts` pins both).
 		*/
 		const SETTINGS_DESCRIBE_RETRY_MS = [
 			1e3,
@@ -95,10 +91,6 @@ window.__ModuleLoader__.load({
 			retryHandle;
 			retries = 0;
 			disposed = false;
-			/**
-			* @param resolveRemote - Reads the inject-captured `remote.settings` namespace.
-			* @param timer - Retry timer seam (see {@link SETTINGS_DESCRIBE_RETRY_MS}).
-			*/
 			constructor(resolveRemote, timer = REAL_SETTINGS_TIMER) {
 				this.resolveRemote = resolveRemote;
 				this.timer = timer;
@@ -229,9 +221,8 @@ window.__ModuleLoader__.load({
 		};
 		/**
 		* One namespace's derived scope over the shared mirror, plus its serialized
-		* Host writes. This is the face `CommandCodeSettingsController` consumes
-		* (`getSnapshot` / `subscribe` / `set` / `unset`), so the controller itself
-		* needs no changes for either generation.
+		* Host writes — the face `CommandCodeSettingsController` consumes
+		* (`getSnapshot` / `subscribe` / `set` / `unset`).
 		*/
 		var RemoteSettingsScope = class {
 			resolveRemote;
@@ -392,22 +383,17 @@ window.__ModuleLoader__.load({
 		*
 		* Subscribes the two signals that can move the Host view — the forwarded
 		* `settings/document-updated` invalidation and (when the client exposes it)
-		* `connection/reset` — kicks the first describe read, and derives the
-		* namespace row on every mirror change.
+		* `connection/reset` — kicks the first describe read, and derives the namespace
+		* row on every mirror change.
 		*
-		* `resolveRemote` is the INJECT-CAPTURED namespace (see
-		* {@link SettingsRemoteResolver}): `remote.settings` is a Cordis service nested
-		* under `remote`, so a read through our own context throws and has to be
-		* replaced by an object captured inside `ctx.inject(['remote.settings'], …)`.
-		* The caller that owns that inject calls {@link ManagedSettingsScope.refresh}
-		* once the namespace lands, which is what turns the first, namespace-less read
-		* into a served one; a profile that never mounts the namespace leaves the page
-		* in its degraded (`unavailable`, read-only) state instead of throwing.
+		* `resolveRemote` must be the INJECT-CAPTURED namespace (see
+		* {@link SettingsRemoteResolver}), and the caller that owns that inject calls
+		* {@link ManagedSettingsScope.refresh} once the namespace lands — that is what
+		* turns the first, namespace-less read into a served one. A profile that never
+		* mounts the namespace leaves the page in its degraded (`unavailable`,
+		* read-only) state instead of throwing.
 		*
-		* @param context - The client context slice (only the declared `remote` service is read).
 		* @param namespace - Settings namespace (profile entry id) this scope binds.
-		* @param resolveRemote - Reads the inject-captured `remote.settings` namespace.
-		* @returns The scope plus the refresh/dispose handles the entry wires into its fiber.
 		*/
 		function createSettingsScope(context, namespace, resolveRemote, timer = REAL_SETTINGS_TIMER) {
 			const mirror = new SettingsDescribeMirror(resolveRemote, timer);
@@ -444,38 +430,22 @@ window.__ModuleLoader__.load({
 		//#endregion
 		//#region src/client/settings.ts
 		/**
-		* Browser controller for the "Command Code" settings page.
-		*
-		* The page lives at the same settings-nav level as General / Models / Plugins
-		* (a `settings.section` entry, id `commandcode`). It exists because the
-		* Models page renders an unknown-adapter-family card for the `commandcode`
-		* provider and deliberately disables its submit — the API key cannot be
-		* configured there. This page owns the connection facts the plugin resolves
-		* per request:
+		* Browser controller for the "Command Code" settings page (a `settings.section`
+		* entry, id `commandcode`). React-free: it only produces the state face
+		* `section.tsx` renders, so node tests can drive it.
 		*
-		*   - API key   -> written through the credentials domain under the reference
-		*                  the plugin resolves (`apiKeyEnv`, default
-		*                  `COMMANDCODE_API_KEY`). The literal never rides a response,
-		*                  so the control only reports whether one is configured.
-		*   - API base  -> the `llm-commandcode` settings namespace (`apiBase`), same
-		*                  namespace the Models page card addresses.
-		*   - Timeouts, behavior switches, model visibility -> the same namespace,
-		*                  staged and written on save.
-		*   - Accounts  -> `accounts`, `activeAccount`, `modelAccountRules` and the
-		*                  per-account credentials, committed immediately.
-		*
-		* The controller mirrors the plugin-card pattern from the harness's own
-		* settings UI: it binds the `llm-commandcode` namespace through a
-		* `SettingsScope` — this plugin's own binding of `remote.settings` (see
-		* `./settings-scope.ts`; the harness's `settingsScope` wrapper existed only
-		* through 0.1.6 and was removed with the 0.1.7 settings rewrite, while the
-		* wire underneath spans every supported release) — keeps a staged draft of
-		* edits, and writes them on save through `scope.set` / the credentials
-		* domain. The Host stays the single fact source; the snapshot is republished
-		* after each accepted write.
+		* Two write paths with different contracts:
+		*   - The staged form (connection facts, behavior switches, model visibility,
+		*     plus the Models-page card's default key draft) lands on `save()`.
+		*   - Account management commits IMMEDIATELY and serially.
 		*
-		* This module is deliberately free of JSX — it only produces the state face
-		* the React component renders.
+		* The API key is written through the CREDENTIALS domain under the reference the
+		* plugin resolves (`apiKeyEnv`), never through the settings document, so the
+		* literal cannot leak into a document; the control only reports whether one is
+		* configured. Everything else rides the `llm-commandcode` namespace through this
+		* plugin's own `SettingsScope` over `remote.settings` (see `./settings-scope.ts`).
+		* The Host stays the single fact source; the snapshot is republished after each
+		* accepted write.
 		*/
 		/** The settings namespace the plugin registers (host half, src/index.ts). */
 		const COMMANDCODE_NS = "llm-commandcode";
@@ -500,8 +470,7 @@ window.__ModuleLoader__.load({
 		* save, and an optional inclusive `bounds` range rejects out-of-range values
 		* with a specific reason (the Host schema would reject them at save time with
 		* only a generic failure — catching it here names the problem while typing).
-		* Decimals pass: the Host schema is `z.number()` too, and a fractional
-		* millisecond value is harmless even if pointless.
+		* Decimals pass, like the Host schema's `z.number()`.
 		*/
 		function numberField$1(field, bounds) {
 			return {
@@ -530,24 +499,6 @@ window.__ModuleLoader__.load({
 				}
 			};
 		}
-		/** A field limited to fixed string choices; an empty draft clears it. */
-		function choiceField(field, choices) {
-			return {
-				field,
-				format: (value) => typeof value === "string" && choices.includes(value) ? value : "",
-				parse: (text) => {
-					const trimmed = text.trim();
-					if (trimmed === "") return { kind: "clear" };
-					return choices.includes(trimmed) ? {
-						kind: "set",
-						value: trimmed
-					} : {
-						kind: "invalid",
-						reason: "format"
-					};
-				}
-			};
-		}
 		/**
 		* A boolean field, staged as the strings `'true'`/`'false'` (an empty draft
 		* clears it). The component renders a toggle and only ever stages these two
@@ -575,35 +526,65 @@ window.__ModuleLoader__.load({
 				}
 			};
 		}
-		const MAX_TIMEOUT_MS = 2147483647;
-		/** The command guard's auto-approve levels, strictest first. */
-		const COMMAND_GUARD_LEVEL_CHOICES = [
-			"high",
-			"medium",
-			"low"
-		];
-		/** The level an unset `commandGuardLevel` reads as on the Host. */
-		const COMMAND_GUARD_DEFAULT_LEVEL_CHOICE = "medium";
+		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"),
-			booleanField$1("commandGuard"),
-			choiceField("commandGuardLevel", COMMAND_GUARD_LEVEL_CHOICES),
 			booleanField$1("zdr")
 		];
 		/** Whether two model-id lists are equal as sets (order-insensitive). */
@@ -643,17 +624,12 @@ window.__ModuleLoader__.load({
 		}
 		/**
 		* Controller bridging the `llm-commandcode` scope and the credentials domain
-		* onto the page.
+		* onto the page. See the module header for the two write paths.
 		*
-		* Two write paths with different contracts:
-		* - The staged form (connection, behavior and model-visibility fields, plus
-		*   the Models-page card's default key draft) lands on `save()`.
-		* - Account management (create, rename, remove, key replacement, pinning and
-		*   per-account models) commits IMMEDIATELY and serially. A new account had to
-		*   be saved before browser sign-in could target it (the Host refuses a login
-		*   for a reference the stored `accounts` list does not name), which turned
-		*   "add an account" into edit → save → sign in; committing each operation
-		*   removes that dance and keeps unrelated staged edits out of it.
+		* Account ops commit immediately, so a new account can be created, signed into
+		* and pinned in one gesture — the Host refuses a login for a reference the
+		* stored `accounts` list does not name, so a staged row could not be signed
+		* into at all.
 		*/
 		var CommandCodeSettingsController = class {
 			scope;
@@ -663,13 +639,11 @@ window.__ModuleLoader__.load({
 			listeners = /* @__PURE__ */ new Set();
 			disposers = [];
 			disposed = false;
-			/** The credential reference the default account resolves. */
 			credentialRef = DEFAULT_API_KEY_REF;
 			/** Host-reported configured/writable state per credential reference. */
 			credentialStates = /* @__PURE__ */ new Map();
 			/** Staged visible-model allowlist (undefined = no draft). */
 			visibleModelsDraft = void 0;
-			/** The catalog the model editors offer (Host-side). */
 			catalogModels = [];
 			catalogFailed = false;
 			saving = false;
@@ -679,10 +653,6 @@ window.__ModuleLoader__.load({
 			accountQueue = Promise.resolve();
 			accountPending = 0;
 			accountFailed = void 0;
-			/**
-			* @param scope - bound scope for the `llm-commandcode` namespace.
-			* @param api - credentials wire face.
-			*/
 			constructor(scope, api) {
 				this.scope = scope;
 				this.api = api;
@@ -745,11 +715,10 @@ 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"),
-					commandGuard: this.field("commandGuard"),
-					commandGuardLevel: this.field("commandGuardLevel"),
 					zdr: this.field("zdr"),
 					sidebarQuota: this.sectionValue("showSidebarQuota") === true,
 					activeAccount: typeof active === "string" ? active : "",
@@ -973,9 +942,8 @@ window.__ModuleLoader__.load({
 				return target === "default" ? this.credentialRef : target;
 			}
 			/**
-			* The first free `<credentialRef>_<n>` reference. Derived from the default
-			* reference's name, so a renamed `apiKeyEnv` yields `MY_KEY_2`-style refs
-			* consistent with the default slot.
+			* The first free `<credentialRef>_<n>` reference, so a renamed `apiKeyEnv`
+			* yields `MY_KEY_2`-style refs consistent with the default slot.
 			*/
 			nextAccountRef() {
 				const used = /* @__PURE__ */ new Set([this.credentialRef, ...this.storedExtras().map((extra) => extra.ref)]);
@@ -1133,10 +1101,10 @@ window.__ModuleLoader__.load({
 				if (changed) this.publish();
 			}
 			/**
-			* Fetch the model catalog for the settings page's model editors through
-			* the Host Remote. Runs once at construction; call again (e.g. from the
-			* client entry once the Remote mount lands) to (re)try — a later success
-			* clears a prior failure flag so the editors recover without a page reload.
+			* Fetch the model catalog through the Host Remote. Runs once at construction;
+			* call again (e.g. from the client entry once the Remote mount lands) to
+			* (re)try — a later success clears a prior failure flag, so the editors
+			* recover without a page reload.
 			*/
 			refreshCatalog() {
 				const models = this.api.models;
@@ -1155,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;
@@ -1257,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",
@@ -1339,41 +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);
-		}
-		/**
-		* Format a 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 the raw upstream float `99.965552876334` becomes `99.97`.
-		* The `%` suffix is appended by the caller (the card and the dashboard line
-		* both compose it).
-		*/
-		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 ?? [];
@@ -1402,15 +1364,12 @@ window.__ModuleLoader__.load({
 		};
 		/**
 		* Cache over the `commandcode/prices` Remote, with a bounded transient-retry
-		* budget. Public API mirrors {@link CommandCodeUsageController}: `state()`,
-		* `subscribe`, and `ensure()`; `reload()` additionally drops the cache and
-		* restarts the budget when the Host namespace rebinds.
-		*
-		* Not a one-shot: the last fetch is cached until `reload()`, a transient
-		* failure is retried three times at 1/2/4 s (the delays are bounded, not a
-		* poll), and a MANUAL `ensure()` still fetches after that budget is spent. A
-		* PERMANENT failure — the Host serving no such endpoint — is terminal for the
-		* binding and is only cleared by `reload()`.
+		* budget (three retries at 1/2/4 s — bounded, not a poll). Public API mirrors
+		* {@link CommandCodeUsageController}: `state()`, `subscribe` and `ensure()`;
+		* `reload()` additionally drops the cache and restarts the budget when the
+		* Host namespace rebinds. A MANUAL `ensure()` still fetches after the budget
+		* is spent, and a PERMANENT failure — the Host serving no such endpoint — is
+		* terminal for the binding until `reload()`.
 		*/
 		var CommandCodePricesController = class {
 			remote;
@@ -1444,12 +1403,9 @@ window.__ModuleLoader__.load({
 			}
 			/**
 			* Fetch the table unless it is already loaded, permanent, or in flight — and
-			* unless a bounded retry already owns the next attempt.
-			*
-			* The only callers are the client entry: `reload()` when the Remote namespace
-			* lands or rebinds, and a manual refresh. Nothing in the composer calls it, so
-			* a mounted readout does not trigger a fetch of its own — it renders whatever
-			* the table's state currently is.
+			* unless a bounded retry already owns the next attempt. Only the client
+			* entry calls this (on rebind and on a manual refresh), so a mounted readout
+			* renders the current state instead of triggering a fetch of its own.
 			*/
 			ensure() {
 				if (this.disposed || this.permanent || this.inFlight || this.current.status === "ready") return;
@@ -1575,12 +1531,11 @@ window.__ModuleLoader__.load({
 				this.remote = remote;
 				this.pollMs = pollMs;
 			}
-			/** Subscribe to state projections. @returns the disposer. */
+			/** Subscribe to state projections. */
 			subscribe(listener) {
 				this.listeners.add(listener);
 				return () => this.listeners.delete(listener);
 			}
-			/** Build the current panel state face. */
 			state() {
 				return {
 					phase: this.phase,
@@ -1773,9 +1728,9 @@ window.__ModuleLoader__.load({
 			return new Promise((resolve) => setTimeout(resolve, ms));
 		}
 		/**
-		* The per-reason copy for a failed login attempt. Shared by the settings
-		* page's login panel and the Models-page card's login row — the same reasons
-		* can surface from either surface.
+		* The per-reason copy for a failed attempt. Shared by the settings page's login
+		* panel and the Models-page card's login row — the same reason can surface from
+		* either.
 		*/
 		function loginFailureCopy(reason, t) {
 			if (reason === "denied") return t("loginDenied");
@@ -1788,8 +1743,8 @@ window.__ModuleLoader__.load({
 		}
 		/**
 		* The hint text + class for one login panel state, shared by the settings
-		* page's `LoginPanel` and the Models-page card's login row so both surfaces
-		* can never drift apart. Pure: no timers, no state — the components render it.
+		* page's login panel and the Models-page card's login row so both surfaces
+		* can never drift apart. Pure: no timers, no state.
 		*/
 		function loginHint(state, t) {
 			if (state.phase === "starting" || state.phase === "waiting") return {
@@ -1830,16 +1785,16 @@ window.__ModuleLoader__.load({
 		/** The wire namespace all Command Code endpoints share. */
 		const REMOTE_NAMESPACE = "commandcode";
 		/**
-		* Build the validator helpers one endpoint uses. `prefix` names the
-		* endpoint in the rejection message (e.g. `commandcode/report result:`), so
-		* each wire file keeps its own diagnostic phrasing while sharing the helper
-		* bodies.
+		* Build the validator helpers one endpoint uses. `prefix` names the endpoint
+		* in the rejection message (e.g. `commandcode/report result:`), so each wire
+		* file keeps its own diagnostic phrasing while sharing the helper bodies.
 		*
 		* The helpers return the reject call directly in the failure branch: since
 		* `reject` is typed `never`, the ternary's union collapses to the success type
 		* without relying on TypeScript's control-flow analysis of a never-returning
 		* call (which only recognizes function declarations, not the destructured
-		* arrow `reject` callers receive from this factory).
+		* arrow `reject` callers receive from this factory). Callers that need the
+		* narrowing in an `if` must therefore assign inside the positive branch.
 		*/
 		function makeBoundaryValidator(prefix) {
 			const reject = (field) => {
@@ -1867,10 +1822,8 @@ window.__ModuleLoader__.load({
 		}
 		/**
 		* Build one strict invocation descriptor. Every Command Code Remote shares the
-		* `commandcode` namespace, the `commandcodeUsage` service, and a strict
-		* `mode: 'strict'` result — only the endpoint, method, result type symbol, and
-		* schema differ — so the boilerplate lives here once and each endpoint supplies
-		* only its own facts.
+		* `commandcode` namespace, the `commandcodeUsage` service, and a strict result
+		* — only the endpoint, method, result type symbol, and schema differ.
 		*/
 		function makeRemoteDescriptor(endpoint, method, typeSymbol, schema) {
 			return {
@@ -1894,7 +1847,6 @@ window.__ModuleLoader__.load({
 		* so rejection messages name the offending boundary.
 		*/
 		const { reject: reject$1, record: record$1, stringField: stringField$1, numberField, booleanField } = makeBoundaryValidator("commandcode/report result:");
-		/** Validate one window-limit block (`fiveHour` / `weekly`). */
 		/**
 		* Parse one quota window, or undefined when the frame carries no such window.
 		*
@@ -2010,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");
@@ -2019,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}. */
@@ -2170,38 +2123,40 @@ 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).
 		*
-		* The routing-rule editor and the visible-models filter both pick catalog
-		* models through the same checkbox multi-select dropdown (`ModelMultiSelect`
-		* in section.tsx). The dropdown's data shaping — search filtering, stale-id
+		* The routing-rule editor and the visible-models filter both pick catalog models
+		* through the same checkbox multi-select dropdown (`ModelMultiSelect` in
+		* section.tsx). The dropdown's data shaping — search filtering, stale-id
 		* 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` values + `PLAN_LABELS` in src/capabilities.ts (kept as a
-		* vendored copy because the client bundle cannot import host modules).
-		* Covers every tier key `KNOWN_PLANS` uses today; 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
@@ -2210,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
@@ -2222,21 +2177,19 @@ window.__ModuleLoader__.load({
 			return model.id.toLowerCase().includes(needle) || model.name.toLowerCase().includes(needle);
 		}
 		/**
-		* Build the dropdown options: the catalog (already in picker order) plus
-		* any selected ids the catalog no longer carries, flagged stale so the UI
-		* can mark them — a saved selection never silently loses an entry, and the
-		* user can see which ones went stale upstream.
-		*
-		* When `query` is non-blank, catalog rows are filtered by
-		* {@link matchesModelQuery}; stale rows are kept only while they match too,
-		* so a search for a live model does not surface unrelated stale ids.
+		* Build the dropdown options: the catalog (already in picker order) plus any
+		* selected ids the catalog no longer carries, flagged stale so a saved
+		* selection never silently loses an entry. Stale rows survive a non-blank
+		* {@link matchesModelQuery} search only while they match too, so a search for
+		* a live model does not surface unrelated stale ids.
 		*/
 		function buildModelSelectOptions(catalog, selected, query = "") {
 			const catalogIds = new Set(catalog.map((model) => model.id));
 			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) {
@@ -2256,12 +2209,10 @@ window.__ModuleLoader__.load({
 			return options;
 		}
 		/**
-		* Group dropdown options under plan-tier headings (`tierOf` maps a model id
-		* to its tier heading, or undefined for unmapped models — see
-		* {@link tierHeadingFor}). Live rows keep their relative order; stale ids
-		* and unmapped live rows share one trailing unheaded group. Groups merge
-		* repeats, so a catalog interleaving two tiers still renders one section
-		* per tier.
+		* Group dropdown options under plan-tier headings (`tierOf` maps a model id to
+		* its heading, or undefined for unmapped models — see {@link tierHeadingFor}).
+		* Live rows keep their relative order and repeats merge, so a catalog
+		* interleaving two tiers still renders one section per tier.
 		*/
 		function groupModelSelectOptions(options, tierOf) {
 			const groups = [];
@@ -2291,13 +2242,11 @@ window.__ModuleLoader__.load({
 		}
 		/**
 		* Whether the catalog is trustworthy enough to call an unlisted selection
-		* "retired". FALSE while the first fetch is still in flight and after a
-		* failure, because the catalog is empty then and every selected id would look
-		* stale — which turns the one-click stale cleanup into a button that silently
-		* empties the allowlist. A successfully loaded but empty catalog is treated as
-		* untrustworthy too: an empty list is far more likely a Host problem than every
-		* model being retired at once, and the explicit "show all" entry covers the
-		* user who really wants to clear the list.
+		* "retired". FALSE while the first fetch is in flight, after a failure, and
+		* for a loaded-but-empty catalog — an empty list makes every selected id look
+		* stale, which would turn the one-click stale cleanup into a button that
+		* silently empties the allowlist. Users who really want it cleared have the
+		* explicit "show all" entry.
 		*/
 		function catalogIsReady(readiness) {
 			return readiness.catalogIds.length > 0 && !readiness.catalogFailed;
@@ -2313,7 +2262,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region package.json
-		var version = "0.11.16";
+		var version = "0.12.0";
 		var repository = {
 			"type": "git",
 			"url": "git+https://github.com/Mars-Sea/dsh-commandcode-provider.git"
@@ -2321,17 +2270,15 @@ window.__ModuleLoader__.load({
 		//#endregion
 		//#region src/client/version.ts
 		/**
-		* The plugin's own version, read from package.json at build time.
-		*
-		* The client bundle inlines the JSON import (rolldown resolves it during the
-		* tsdown build; node tests read it through tsx), so the rendered value always
-		* matches the published package version with no second constant to keep in
-		* sync. Rendered as a muted footer line on the settings page so a user can
-		* report the exact build they run.
+		* The plugin's own version, read from package.json at build time. The client
+		* bundle inlines the JSON import (rolldown resolves it during the tsdown
+		* build; node tests read it through tsx), so the rendered value always matches
+		* the published package version with no second constant to keep in sync —
+		* rendered as a muted footer line so a user can report the exact build.
 		*
 		* @module dsh-commandcode-provider/client/version
 		*/
-		/** The published package version (e.g. `'0.6.0'`). */
+		/** The published package version. */
 		const PLUGIN_VERSION = version;
 		/**
 		* This package's GitHub releases page, derived from the repository field so
@@ -2351,14 +2298,12 @@ window.__ModuleLoader__.load({
 		*/
 		const NPM_LATEST_URL = "https://registry.npmjs.org/@mars-sea%2Fdsh-commandcode-provider/latest";
 		/**
-		* Compare two version strings (`major.minor.patch[-pre]`). Returns a negative
-		* number when `a` sorts before `b`, positive when after, zero when equal.
+		* Compare two version strings (`major.minor.patch[-pre]`): negative when `a`
+		* sorts before `b`, positive when after, zero when equal.
 		*
-		* Tolerant by design: a leading `v` is stripped, unparsable numeric parts
-		* count as `0`, and semver prerelease rules apply (release > prerelease;
-		* numeric identifiers compare numerically, everything else lexically, a
-		* shorter identifier list sorts first). Enough for release tags; not a full
-		* semver validator.
+		* Tolerant by design — a leading `v` is stripped, unparsable numeric parts
+		* count as `0`, and semver prerelease rules apply. Enough for release tags,
+		* not a full semver validator.
 		*/
 		function compareVersions(a, b) {
 			const left = splitVersion(a);
@@ -2494,21 +2439,17 @@ window.__ModuleLoader__.load({
 		* React component for the "Command Code" settings page (browser half).
 		*
 		* Renders as a `settings.section` entry — a page at the same settings-nav
-		* level as General / Models / Plugins. The shell supplies the nav row and
-		* renders this body inside the content column. All copy comes from the
+		* level as General / Models / Plugins. All copy comes from the
 		* `settings.commandcode` locale namespace; all state comes from the
 		* `CommandCodeSettingsController` injected by the slot registration.
 		*
-		* Layout, top to bottom:
-		*   1. Accounts — one card per account with its status, quota, actions and
-		*      dedicated models. Every account operation commits immediately.
-		*   2. Models — the plan filter and the visible-model allowlist.
-		*   3. Privacy & security — zero data retention and the command guard.
-		*   4. Integrations & display — web search and the sidebar quota card.
-		*   5. Advanced (collapsed) — API base and the network limits.
-		* Sections 2–5 are flat groups of rows (title and description left, control
-		* right, as on the harness's own settings pages), a staged form written by
-		* the floating save bar.
+		* Layout, top to bottom: Accounts (one card per account, status, quota,
+		* actions and dedicated models — every operation commits immediately), Models
+		* (plan filter + visible-model allowlist), Privacy & security (ZDR),
+		* Integrations & display (web search, sidebar quota card), and a collapsed
+		* Advanced card (API base + network limits). Everything below Accounts is a
+		* flat group of rows (title/description left, control right) inside the staged
+		* form the floating save bar writes.
 		*
 		* Styles are injected once by the client entry (see src/client/index.ts) and
 		* class-prefixed `cc-` to stay local.
@@ -2517,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 }) {
@@ -2645,53 +2587,6 @@ window.__ModuleLoader__.load({
 				})] })
 			});
 		}
-		/**
-		* One fixed-choice field rendered as a segmented control. The staged text is
-		* one of `options`' values or `''` (unset → `defaultValue`); picking the
-		* default while unset stages nothing new.
-		*/
-		function SegmentedField({ label, hint, state, disabled, options, defaultValue, className, onEdit, onReset, t }) {
-			const current = state.text === "" ? defaultValue : state.text;
-			const index = Math.max(0, options.findIndex((option) => option.value === current));
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingRow, {
-				title: label,
-				tag: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(OverrideTag, {
-					state,
-					t
-				}),
-				description: hint,
-				...className === void 0 ? {} : { className },
-				control: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldOverride, {
-					label,
-					state,
-					disabled,
-					t,
-					onReset
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					className: "cc-segmented",
-					role: "radiogroup",
-					"aria-label": label,
-					style: {
-						"--cc-segment-count": options.length,
-						"--cc-segment-index": index
-					},
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: "cc-segmentIndicator",
-						"aria-hidden": "true"
-					}), options.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-						type: "button",
-						role: "radio",
-						"aria-checked": current === option.value,
-						className: "cc-segment",
-						disabled,
-						onClick: () => {
-							if (current !== option.value) onEdit(option.value);
-						},
-						children: option.label
-					}, option.value))]
-				})] })
-			});
-		}
 		/** One stat tile in the account card's summary grid. */
 		function UsageStat({ label, value, sub }) {
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -2760,11 +2655,8 @@ window.__ModuleLoader__.load({
 				]
 			});
 		}
-		/**
-		* One pool account's facts (identity, totals, credits, window limits)
-		* rendered inside an account row's details.
-		*/
-		function AccountReport({ entry, fetchedAt, t, summaryOnly = false, headless = false }) {
+		/** One pool account's facts (identity, totals, credits, window limits). */
+		function AccountReport({ entry, fetchedAt, t, headless = false }) {
 			const report = entry.report;
 			const account = report.account;
 			const accountName = account === void 0 ? "" : account.userName || account.name;
@@ -2821,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, {
@@ -2845,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, {
@@ -2919,16 +2811,12 @@ window.__ModuleLoader__.load({
 			return t("usageNetworkHint");
 		}
 		/**
-		* A checkbox multi-select dropdown for picking catalog models (the
-		* routing-rule rows and the visible-models filter share it). The trigger
-		* shows the selection count; the Menu lists every catalog model with a
-		* checkbox, toggled by clicking the row. A search box under the trigger
-		* (inside the Menu anchor, so focusing it never trips the outside-click
-		* close) filters the list by id/display-name substring, and items group
-		* under plan-tier headings in picker order. Selected ids the catalog no
-		* longer carries still render — flagged stale — so a saved selection never
-		* silently loses an entry, and the VisibleModelsCard offers a one-click
-		* cleanup.
+		* A checkbox multi-select dropdown for picking catalog models (the routing-rule
+		* rows and the visible-models filter share it). The trigger shows the selection
+		* count; the Menu lists every catalog model, grouping under plan-tier headings
+		* and flagging selected ids the catalog no longer carries as stale, so a saved
+		* selection never silently loses an entry (the VisibleModelsCard offers a
+		* one-click cleanup).
 		*
 		* With `deferCommit` the toggles collect in a local draft that is handed to
 		* `onSelect` once, when the menu closes: the per-account picker writes
@@ -2975,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) })
@@ -3073,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",
@@ -3098,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"),
@@ -3118,70 +3014,31 @@ window.__ModuleLoader__.load({
 			});
 		}
 		/**
-		* Privacy & security: the two opt-ins that change where data goes. ZDR
-		* restricts which upstream serves a request; the command guard sends command
-		* text to a decision model with no ZDR upstream and can skip an approval the
-		* user would otherwise have seen, so both start off.
+		* Privacy & security: the opt-in that changes where data goes. ZDR restricts
+		* which upstream serves a request, so it starts off.
 		*/
 		function PrivacyCard({ state, disabled, t, onEdit, onReset }) {
-			const showGuardLevel = state.commandGuard.text === "true" || state.commandGuardLevel.overridden || state.commandGuardLevel.clear;
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(SettingsGroup, {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingsGroup, {
 				title: t("privacyTitle"),
-				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToggleField, {
-						id: "cc-zdr",
-						label: t("zdr"),
-						hint: t("zdrHint"),
-						state: state.zdr,
-						disabled,
-						defaultChecked: false,
-						onEdit: (text) => onEdit("zdr", text),
-						onReset: () => onReset("zdr"),
-						t
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToggleField, {
-						id: "cc-command-guard",
-						label: t("commandGuard"),
-						hint: t("commandGuardHint"),
-						state: state.commandGuard,
-						disabled,
-						defaultChecked: false,
-						onEdit: (text) => onEdit("commandGuard", text),
-						onReset: () => onReset("commandGuard"),
-						t
-					}),
-					showGuardLevel ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SegmentedField, {
-						className: "cc-rowNested",
-						label: t("commandGuardLevel"),
-						hint: t("commandGuardLevelHint"),
-						state: state.commandGuardLevel,
-						disabled,
-						options: [
-							{
-								value: "high",
-								label: t("commandGuardLevelHigh")
-							},
-							{
-								value: "medium",
-								label: t("commandGuardLevelMedium")
-							},
-							{
-								value: "low",
-								label: t("commandGuardLevelLow")
-							}
-						],
-						defaultValue: COMMAND_GUARD_DEFAULT_LEVEL_CHOICE,
-						onEdit: (text) => onEdit("commandGuardLevel", text),
-						onReset: () => onReset("commandGuardLevel"),
-						t
-					}) : null
-				]
+				divided: true,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToggleField, {
+					id: "cc-zdr",
+					label: t("zdr"),
+					hint: t("zdrHint"),
+					state: state.zdr,
+					disabled,
+					defaultChecked: false,
+					onEdit: (text) => onEdit("zdr", text),
+					onReset: () => onReset("zdr"),
+					t
+				})
 			});
 		}
 		/** Integrations & display: surfaces outside chat that reuse this provider. */
 		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"),
@@ -3215,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", {
@@ -3295,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,
@@ -3358,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 }) {
@@ -3587,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", {
@@ -3927,9 +3817,8 @@ window.__ModuleLoader__.load({
 		}
 		/**
 		* The unified account card: every account the pool rotates through, one row
-		* each, with its status and quota inline. Replaces the former split between
-		* a credentials card, a usage card and a routing-rules card, so one account's
-		* facts no longer have to be cross-read across three surfaces.
+		* each, with its status and quota inline — so one account's facts no longer
+		* have to be cross-read across separate surfaces.
 		*/
 		function AccountsCard({ t, state, usage, login, disabled, actions, onRefresh }) {
 			const [adding, setAdding] = (0, react.useState)(false);
@@ -4278,7 +4167,6 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region src/client/login-row.tsx
-		/** The sign-in alternative to pasting a key (settings page + Models card). */
 		function LoginRow({ state, targetRef, disabled, disabledHint, t, onBegin, onCancel }) {
 			const { visible: visibleState, busyElsewhere } = loginStateForTarget(state, targetRef);
 			const busy = visibleState.phase === "starting" || visibleState.phase === "waiting";
@@ -4329,11 +4217,11 @@ window.__ModuleLoader__.load({
 		* Find the official editor card among the slot outlet's siblings, or null
 		* while it is closed. The Models page renders the editor as an immediate
 		* sibling of the outlet wrapper — after it in a provider row (the target of
-		* the row's 编辑 toggle), before it in the first-run setup card and the
-		* add-provider card, where it is always open. The editor is the only such
-		* sibling whose CSS module class carries the `editor` stem
-		* (`<hash>_editor`); the row header and the add card's provider select
-		* never do, so the lookup needs no hash knowledge.
+		* the row's 编辑 toggle), before it in the first-run setup and add-provider
+		* cards, where it is always open. The editor is the only such sibling whose
+		* CSS module class carries the `editor` stem (`<hash>_editor`); the row header
+		* and the add card's provider select never do, so the lookup needs no hash
+		* knowledge.
 		*/
 		function adjacentEditorCard(wrapper) {
 			if (wrapper === null) return null;
@@ -4358,14 +4246,14 @@ window.__ModuleLoader__.load({
 				apiKeyWritable: snapshot.apiKeyWritable
 			};
 		}
-		/** Status badge for the credential state (green when configured). */
+		/** Credential-state badge: the solid pill when set, the muted outline when not. */
 		function StatusBadge({ ok, okLabel, pendingLabel }) {
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 				className: ok ? "cc-badge" : "cc-badgeMuted",
 				children: ok ? okLabel : pendingLabel
 			});
 		}
-		/** Compact key field for the not-configured card. */
+		/** The key paste field, with the show/hide toggle over it. */
 		function CardKeyField({ state, disabled, t, onEdit }) {
 			const [visible, setVisible] = (0, react.useState)(false);
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
@@ -4407,16 +4295,12 @@ window.__ModuleLoader__.load({
 		}
 		/**
 		* The slot component body. Dispatched on every Command Code provider card of
-		* the Models page (saved row, first-run setup posture, and add-provider
-		* draft).
+		* the Models page (saved row, first-run setup posture, add-provider draft).
 		*
-		* Closed (the official 编辑 toggle off) the panel renders nothing: the row
-		* head the Models page owns already names the provider and shows the
-		* credential dot, so a page full of providers stays compact. Opening the
-		* official editor mounts the editor shell as the outlet's sibling; the panel
-		* watches for it, hides the shell (it carries only the settings.yaml hint and
-		* a disabled apply for this namespace), and shows the real controls — badges,
-		* API-key field, sign-in, discard/save.
+		* Closed (the official 编辑 toggle off) it renders nothing: the row head the
+		* Models page owns already names the provider and shows the credential dot, so
+		* a page full of providers stays compact. Open, it hides that editor shell and
+		* shows the real controls — badges, API-key field, sign-in, discard/save.
 		*/
 		function CommandCodeProviderCard(props) {
 			const { t } = props;
@@ -4663,15 +4547,14 @@ window.__ModuleLoader__.load({
 			return Math.abs(value) < .01 ? formatMoneyExact(value) : formatMoney(value);
 		}
 		/**
-		* What a figure shows when the endpoint that carries it did not report one.
-		* A dash, never a zero: the panel exists to state what the account has spent,
-		* so "we were not told" has to look different from "nothing".
+		* What a figure shows when the endpoint that carries it did not report one. A
+		* dash, never a zero: the panel exists to state what the account has spent, so
+		* "we were not told" has to look different from "nothing".
 		*/
 		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) {
@@ -4714,18 +4597,17 @@ window.__ModuleLoader__.load({
 		* Build the monthly credit view from the two endpoints that carry it.
 		*
 		* The limit is the PLAN's credit total, not the billing endpoint's
-		* `monthlyCredits` — that field is a remaining balance (see
-		* {@link PanelMonthlyView}). Unknown plans (no `monthlyCredits` on the plan
-		* record) therefore still show their balances, just without a ratio.
+		* `monthlyCredits` (that field is a remaining balance — see
+		* {@link PanelMonthlyView}), so a plan that publishes no total still shows its
+		* balances, just without a ratio.
 		*
 		* The trap this guards: a MISSING balance is not a consumed one. The billing
 		* endpoint is one of four the report fetches in parallel, so it fails on its
-		* own while the plan still arrives — and reading the absent balance as 0 would
-		* turn that partial failure into `limit - 0 = limit`, i.e. a confident "100%
-		* used, quota exhausted" for an account that may have spent nothing. The
-		* official CLI draws no meter unless the credits payload is present at all
-		* (`hasCreditsInfo`), so "unreported" is the upstream-faithful reading here
-		* too. Every derived figure stays a placeholder until the balance reported.
+		* own while the plan still arrives, and reading the absent balance as 0 turns
+		* that partial failure into `limit - 0 = limit` — a confident "100% used" for
+		* an account that may have spent nothing. The official CLI draws no meter unless
+		* the credits payload is present at all (`hasCreditsInfo`); every derived figure
+		* here stays a placeholder until the balance reported.
 		*/
 		function monthlyView(report) {
 			const credits = report.credits;
@@ -4835,10 +4717,10 @@ window.__ModuleLoader__.load({
 			};
 		}
 		/**
-		* Every panel string, resolved once per projection through the translator.
-		* One object with all keys (rather than per-field lookups in the components)
-		* keeps the copy table and the render sites in lockstep: a key cannot be read
-		* from `text` unless {@link PANEL_KEYS} declares it.
+		* Every panel string, resolved once per projection through the translator. One
+		* object with all keys (rather than per-field lookups in the components) keeps
+		* the copy table and the render sites in lockstep: a key cannot be read from
+		* `text` unless {@link PANEL_KEYS} declares it.
 		*/
 		function panelStrings(t) {
 			const out = {};
@@ -4908,9 +4790,9 @@ window.__ModuleLoader__.load({
 			};
 		}
 		/**
-		* How often the panel re-reads the report while a surface is mounted. The
-		* quota windows move slowly and one report costs four upstream calls, so this
-		* is a background freshness tick, not a live meter.
+		* How often the panel re-reads the report while a surface is mounted. The quota
+		* windows move slowly and one report costs four upstream calls, so this is a
+		* background freshness tick, not a live meter.
 		*/
 		const PANEL_AUTO_REFRESH_MS = 12e4;
 		/** The default timer (the client bundle runs in a browser; node tests inject one). */
@@ -4927,21 +4809,18 @@ window.__ModuleLoader__.load({
 		/** Pending timer handle of the running loop. */
 		let handle;
 		/**
-		* Start the shared auto refresh. One fetch when the surface appears (the
-		* sidebar row is the point of the panel — it must be current, not wait for a
-		* click), then a tick every {@link PANEL_AUTO_REFRESH_MS} while a surface
-		* stays mounted.
+		* Start the shared auto refresh. One fetch when the surface appears (the sidebar
+		* row is the point of the panel — it must be current, not wait for a click), then
+		* a tick every {@link PANEL_AUTO_REFRESH_MS} while a surface stays mounted.
 		*
-		* Reference-counted: the sidebar entry and the dashboard can be mounted at
-		* once, so only the first start fetches and only the last stop halts the loop.
-		* Every tick goes through `usage.refresh()`, which already collapses a
-		* concurrent fetch onto the in-flight one — a tick never double-fetches
-		* against the settings page's own refresh.
+		* Reference-counted: the sidebar entry and the dashboard can be mounted at once,
+		* so only the first start fetches and only the last stop halts the loop. Every
+		* tick goes through `usage.refresh()`, which collapses a concurrent fetch onto
+		* the in-flight one. Returns the disposer that drops this surface's reference.
 		*
 		* @param usage - the shared usage controller.
 		* @param isConfigured - whether a credential exists right now (re-read per tick).
 		* @param timer - timer seam for tests.
-		* @returns the disposer that drops this surface's reference.
 		*/
 		function startPanelAutoRefresh(usage, isConfigured, timer = REAL_TIMER) {
 			references += 1;
@@ -4972,26 +4851,20 @@ window.__ModuleLoader__.load({
 		//#endregion
 		//#region src/client/panel-view.tsx
 		/**
-		* React components for the Command Code plans & quota panel (browser half):
-		* the sidebar footer card and the dashboard it opens in the center column.
+		* React components for the Command Code plans & quota panel: the sidebar footer
+		* card and the dashboard it opens in the center column.
 		*
 		* Both render one {@link PanelView} projected by `./panel.ts` — no fact is
 		* derived here. Strings arrive already localized in `view.text`: the slots
 		* declare the `panel.commandcode` locale namespace, so the renderer hands this
-		* component a `t` seat that is passed into `buildPanelView` — the panel follows
-		* the harness's active language (a language switch mints a new `t`, so the
-		* surfaces re-render without an extra channel).
-		*
-		* The footer card is the panel's home: the sidebar shell renders it in the foot
-		* area directly above the Settings seat, so each quota window's own spend and
-		* limit — the 5-hour and the weekly one — are on screen without opening
-		* anything. Clicking it selects the `main` panel this file also renders — and
-		* unlike a `sidebar.panellist` row, whose button chrome and label the SHELL
-		* owns, this entry owns its whole surface and therefore calls `open()` itself.
+		* component a `t` seat that is passed into `buildPanelView`, and a language
+		* switch mints a new `t` identity, which re-renders both surfaces.
 		*
-		* Styles ride the stylesheet `./panel-styles.ts` returns, injected once by
-		* the client entry; classes are `ccp-` prefixed to stay clear of the settings
-		* page's `cc-` set.
+		* The footer card is the panel's home — the shell renders it in the foot area
+		* directly above the Settings seat, and unlike a `sidebar.panellist` row (whose
+		* chrome and label the SHELL owns) this entry owns its whole surface and
+		* therefore calls `open()` itself. Styles ride the stylesheet
+		* `./panel-styles.ts` returns; classes are `ccp-` prefixed.
 		*
 		* @module dsh-commandcode-provider/client/panel-view
 		*/
@@ -5114,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 "";
@@ -5268,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
@@ -5409,27 +5275,24 @@ window.__ModuleLoader__.load({
 		}
 		/**
 		* The sidebar footer card, registered into `sidebar.footer.action` — the list
-		* the shell renders in the sidebar's foot area directly ABOVE the Settings
-		* seat, so the panel reads as a bottom-pinned sibling of Settings rather than
-		* a global panel icon at the top of the column.
+		* the shell renders in the foot area directly ABOVE the Settings seat, so the
+		* panel reads as a bottom-pinned sibling of Settings rather than a global panel
+		* icon at the top of the column.
 		*
-		* The shell wraps nothing here, so this component owns the surface: the
-		* button, its chrome and its accessible name. In the expanded column it draws
-		* the title row, then one block per quota window (5-hour, then weekly) — the
-		* window's own spend and limit (`$1.32 / $6.00`), its percentage and its bar —
-		* and nothing else: the card's figures are the two windows the account runs
-		* into, so the period total stays in the tooltip rather than taking a third
-		* line. In the 56px rail it collapses to a 36px icon button carrying the ring,
-		* matching the shell's own rail geometry. `wide` comes from the shell as an
-		* owner prop — unlike the old `sidebar.panellist` row, this slot really does
-		* supply it.
+		* The shell wraps nothing here, so this component owns the surface: the button,
+		* its chrome and its accessible name. Expanded, it draws the title row and one
+		* block per quota window (5-hour, then weekly) — the window's own spend and
+		* limit, its percentage and its bar — and nothing else, because those two
+		* windows are the figures an account runs into, so the period total stays in the
+		* tooltip. In the 56px rail it collapses to a 36px icon button carrying the ring,
+		* matching the shell's own rail geometry; `wide` comes from the shell.
 		*
 		* Rendering is gated on the settings page's `showSidebarQuota` toggle, which
 		* defaults OFF: a fresh install shows no quota surface in the sidebar and runs
 		* no background poll. The gate reads the STORED document (the settings
-		* controller's `sidebarQuota` fact), so an unsaved draft cannot show the card,
-		* while a landed save flips it live. The entry is still REGISTERED — this is a
-		* render decision, not a slot registration, so nothing churns the slot ledger.
+		* controller's `sidebarQuota` fact), so an unsaved draft cannot show the card
+		* while a landed save flips it live. The entry stays REGISTERED — this is a
+		* render decision, so nothing churns the slot ledger.
 		*/
 		function CommandCodeFooterEntry(props) {
 			const visible = props.useCommandCodeSettings((snapshot) => snapshot.sidebarQuota);
@@ -5530,13 +5393,13 @@ window.__ModuleLoader__.load({
 			return time.getUTCDay() !== 0 && time.getUTCDay() !== 6 && windows.some(([start, end]) => time.getUTCHours() >= start && time.getUTCHours() < end);
 		}
 		/**
-		* All prompt billing buckets determine a request's band, never cumulative session input.
+		* All prompt billing buckets determine a request's band, never cumulative
+		* session input.
 		*
 		* A tiered model returns the matching band and does NOT then apply `peak`: the
-		* page publishes those two dimensions independently, no row carries both today,
-		* and the generator would report a tiered row on every sync — so the combination
-		* becoming real is visible before it reaches a user. This ordering is a latent
-		* choice, not a verified upstream rule.
+		* page publishes those two dimensions independently and no row carries both
+		* today, so the combination becoming real is visible before it reaches a user.
+		* This ordering is a latent choice, not a verified upstream rule.
 		*/
 		function requestRates(price, at, contextTokens, table) {
 			const tier = price.contextTiers?.find((tier) => tier.maxContext === void 0 || contextTokens <= tier.maxContext);
@@ -5572,31 +5435,27 @@ window.__ModuleLoader__.load({
 		/**
 		* Session-cost view model for the composer readout.
 		*
-		* Deliberately JSX-free and React-free, mirroring `./panel.ts`: it turns the
-		* session's token accounting plus the Host's price table into one presentation
-		* value AND the exact text the two surfaces of the harness's token-usage UI
-		* receive — the amount appended to the shipped pill, and the rows appended to
-		* the shipped usage dialog. Node tests therefore drive the whole calculation,
-		* and every user-visible string, without a DOM.
+		* JSX-free and React-free, mirroring `./panel.ts`: it turns the session's token
+		* accounting plus the Host's price table into one presentation value AND the
+		* exact text the two surfaces of the harness's token-usage UI receive — the
+		* amount appended to the shipped pill, and the rows appended to the shipped
+		* usage dialog. Node tests therefore drive the whole calculation, and every
+		* user-visible string, without a DOM.
 		*
-		* The figures it prices are the session's DURABLE cumulative buckets, which is
-		* what the composer's own "N tokens" pill reads too (`tokenUsage`), so the two
-		* surfaces can never disagree about how much was used. Dollars are computed
-		* here because Command Code publishes per-token rates and bills against
-		* dollar-denominated windows; the account's own reported `totalCost` is a
-		* billing PERIOD figure, not this session's.
+		* It prices the session's DURABLE cumulative buckets, which is what the
+		* composer's own "N tokens" pill reads too (`tokenUsage`), so the two surfaces
+		* can never disagree about how much was used. Dollars are computed here because
+		* Command Code publishes per-token rates and bills against dollar-denominated
+		* windows; the account's own reported `totalCost` is a billing PERIOD figure,
+		* not this session's.
 		*
-		* Three rules are load-bearing:
-		*
-		* 1. **Only Command Code usage is priced.** A session served by another
-		*    provider must render nothing, never a Command Code estimate.
-		* 2. **A missing rate is never invented.** The pricing page publishes
-		*    input/output/cache-read rates for every model but a cache-WRITE rate for
-		*    only some, so unpriced cache-write tokens are surfaced as such rather than
-		*    charged at a guessed multiple of the input rate.
-		* 3. **Unpriceable means invisible.** No usage, no model, no table, an unknown
-		*    model, or all-zero buckets renders nothing at all — a confident `$0.00`
-		*    would be a lie, and this module never returns one.
+		* Three rules are load-bearing: only Command Code usage is priced (a session
+		* served by another provider must render nothing, never a Command Code
+		* estimate); a missing rate is never invented (the pricing page publishes a
+		* cache-WRITE rate for only some models, so unpriced cache-write tokens are
+		* surfaced as such rather than charged at a guessed multiple of the input rate);
+		* and unpriceable means invisible — a confident `$0.00` would be a lie, and
+		* this module never returns one.
 		*
 		* @module dsh-commandcode-provider/client/session-cost
 		*/
@@ -5621,15 +5480,12 @@ window.__ModuleLoader__.load({
 			* between its own items.
 			*/
 			separator: "·",
-			/** The heading the tooltip leads with. */
 			panelTitle: "Session cost",
 			/** Marks an estimate from published rates rather than an invoice. */
 			approximate: "≈",
-			/** Tooltip line for the unpriced cache-write tokens. */
 			unpricedCacheWrite: "cache write tokens have no published rate",
 			/** Tooltip line naming the rate half in force. */
 			peakRates: "peak rates",
-			/** Tooltip line naming the rate half in force. */
 			offPeakRates: "off-peak rates",
 			/** Tooltip line explaining the approximate marker. */
 			approximateNote: "estimate from published rates, not the provider invoice",
@@ -5690,8 +5546,8 @@ window.__ModuleLoader__.load({
 		*
 		* The panel's `money()` convention (2 decimals, 4 below a cent) is right for
 		* billing windows, but a live session total starts far below a cent, where
-		* `toFixed(4)` would print a flat `$0.0000` — which reads as broken rather than
-		* as small. So a total under $0.0001 is stated as a bound instead.
+		* `toFixed(4)` would print a flat `$0.0000` — broken rather than small. So a
+		* total under $0.0001 is stated as a bound instead.
 		*/
 		function sessionCostAmount(total) {
 			if (!Number.isFinite(total) || total <= 0) return formatMoney(0);
@@ -5899,15 +5755,14 @@ window.__ModuleLoader__.load({
 		* and never the outlet's parent, because the parent is the composer footer,
 		* which holds the `ContextMeter` as well, and that meter's trigger is itself a
 		* `button[aria-haspopup="dialog"]` rendered AFTER the dock. A parent-scoped
-		* "last trigger wins" would therefore append the cost to the context ring
-		* instead of the token pill.
+		* "last trigger wins" would append the cost to the context ring instead.
 		*/
 		const STATS_ROOT = "[data-composer-stats]";
 		/**
 		* The shipped token-usage dialog's `<dl>`. Unique WITHIN one `StatsPills`
-		* render: the per-message turn-usage panel has its own dialog with different
-		* markup, so a single composer's usage dialog is unambiguous. It is not unique
-		* across the document once two composers are live — see {@link resolveDialog}.
+		* render (the per-message turn-usage panel has its own dialog with different
+		* markup), but not across the document once two composers are live — see
+		* {@link resolveDialog}.
 		*/
 		const USAGE_DIALOG = "[data-session-stats-usage]";
 		/**
@@ -5917,8 +5772,8 @@ window.__ModuleLoader__.load({
 		*/
 		const DIALOG_TRIGGER = "button[aria-haspopup=\"dialog\"]";
 		/**
-		* Stable id for the hidden node the appended cost is described by. The pill's
-		* own `aria-label` is computed by the harness on every render and cannot be
+		* Stable id for the hidden node the appended cost is described by. The pill's own
+		* `aria-label` is recomputed by the harness on every render and cannot be
 		* extended, so a description is how the cost reaches assistive technology.
 		*/
 		const A11Y_ID = "dsh-commandcode-session-cost";
@@ -6040,11 +5895,9 @@ window.__ModuleLoader__.load({
 			* registration order. {@link STATS_ROOT} narrows that to the stats row where
 			* the markup marks it; where it does not, the outlet is already the narrowest
 			* correct container, because the composer footer's `ContextMeter` sits BESIDE
-			* the outlet rather than inside it.
-			*
-			* A missing scope is "no pill", never a document-wide search: the outlet is
-			* what makes this lookup per-composer, and a second composer can be live at
-			* once (the sidebar can mount an embedded Conversation).
+			* the outlet rather than inside it. A missing scope is "no pill", never a
+			* document-wide search: the outlet is what makes this lookup per-composer, and
+			* two composers can be live at once.
 			*/
 			resolvePillButton() {
 				const scope = this.scope();
@@ -6176,20 +6029,18 @@ window.__ModuleLoader__.load({
 			*
 			* The dialog is portaled onto `body`, so unlike the pill it cannot be scoped
 			* from this entry, and the attribute is unique per DIALOG rather than per
-			* document. While one composer was guaranteed, a document-level lookup was
-			* exact. 0.1.6-alpha.2 ends that guarantee: it mounts an embedded Conversation
-			* in the sidebar, so a second composer — with its own session, its own dock
-			* and its own dialog — can be live and open at the same time.
+			* document. While one composer was guaranteed a document-level lookup was
+			* exact; 0.1.6-alpha.2 ended that guarantee by mounting an embedded
+			* Conversation in the sidebar, so a second composer — its own session, dock and
+			* dialog — can be live and open at the same time.
 			*
 			* There is no DOM link from a dialog back to its trigger (the portaled panel
-			* carries no id and no `aria-controls`), so with two dialogs open document
-			* order says nothing about ownership. The shape confirmation in
-			* {@link dialogShapeMatches} would usually reject the stranger, but it compares
-			* against THIS entry's counts, so a coincidentally matching dialog would be
-			* priced with another session's figures. Ambiguity is therefore answered by
-			* declining to decorate at all — the same rule the shape check already
-			* follows, applied one level up: a dialog we cannot prove is ours is left
-			* alone.
+			* carries no id and no `aria-controls`), so document order says nothing about
+			* ownership. The shape confirmation in {@link dialogShapeMatches} would usually
+			* reject the stranger, but it compares against THIS entry's counts, so a
+			* coincidentally matching dialog would be priced with another session's
+			* figures. Ambiguity is therefore answered by declining to decorate at all:
+			* a dialog we cannot prove is ours is left alone.
 			*/
 			resolveDialog() {
 				if (this.dialogHost?.isConnected === true) return this.dialogHost;
@@ -6231,12 +6082,11 @@ window.__ModuleLoader__.load({
 		/**
 		* Whether the dialog really holds the rows this session's buckets predict.
 		*
-		* The shipped labels belong to the `chat` locale — they are `Uncached input` in
-		* English and something else entirely in Chinese — so rows are matched by
-		* POSITION, and this is what makes that safe: the row count must agree, the
-		* cache-hit row must be the percentage it is, and every other value must carry
-		* exactly the token count of the bucket predicted for it. A mismatch means the
-		* dialog is not what this view describes, and nothing is decorated.
+		* The shipped labels belong to the `chat` locale and differ per language, so rows
+		* are matched by POSITION, and this is what makes that safe: the row count must
+		* agree, the cache-hit row must be the percentage it is, and every other value
+		* must carry exactly the token count of the bucket predicted for it. A mismatch
+		* means the dialog is not what this view describes, and nothing is decorated.
 		*/
 		function dialogShapeMatches(pairs, plan, prices) {
 			if (pairs.length !== plan.length) return false;
@@ -6269,13 +6119,13 @@ window.__ModuleLoader__.load({
 		/**
 		* The dock outlet this entry renders inside, i.e. what it scopes itself from.
 		*
-		* The OUTLET itself, not its parent. The outlet is one `display:contents` div
-		* holding exactly this slot's entries (the shipped `stats` cell and ours), so it
-		* is the narrowest container that is still per-composer. Its parent is NOT:
-		* from 0.1.6-alpha.2 the composer stacks the dock inside a footer that also
-		* holds the `ContextMeter`, whose trigger is another
-		* `button[aria-haspopup="dialog"]` rendered after the dock — scoping to the
-		* parent would let the cost land on the context ring.
+		* The OUTLET, not its parent. The outlet is one `display:contents` div holding
+		* exactly this slot's entries (the shipped `stats` cell and ours), so it is the
+		* narrowest container that is still per-composer. Its parent is NOT: from
+		* 0.1.6-alpha.2 the composer stacks the dock inside a footer that also holds the
+		* `ContextMeter`, whose trigger is another `button[aria-haspopup="dialog"]`
+		* rendered after the dock — scoping to the parent would let the cost land on the
+		* context ring.
 		*/
 		const DOCK_ANCHOR = "[data-slot=\"conversation.composer.dock\"]";
 		/** Module-level constant so the marker's `style` prop never diffs. */
@@ -6339,30 +6189,24 @@ window.__ModuleLoader__.load({
 		* Stylesheet for the Command Code settings page — and the Models-page provider
 		* card, which shares its `cc-` classes.
 		*
-		* Returned as a string rather than injected here so the modules stay free of
-		* DOM side effects at import time: `./index.ts` installs it once, keyed by
-		* `PAGE_CSS_ID`. It is a module of its own rather than a literal inside the
-		* client entry so `tests/styles.test.ts` can audit every rule without importing
-		* the React tree (which pulls `*.module.css` through the primitives package and
-		* needs a loader registered first).
-		*
-		* Every colour comes from a harness theme alias with a neutral fallback, so the
-		* page follows the active theme (light/dark and any brand pack) without
-		* hardcoded values. Classes are `cc-` prefixed to stay clear of the panel's
-		* `ccp-` set.
+		* Returned as a string, not injected here, so importing this module has no DOM
+		* side effect: `./index.ts` installs it once under {@link PAGE_CSS_ID}. It is a
+		* module of its own rather than a literal in the entry so `tests/styles.test.ts`
+		* can audit every rule without importing the React tree (which pulls
+		* `*.module.css` through the primitives package and needs a loader registered
+		* first). The rules are GLOBAL CSS, so containment is a contract (issue #48):
+		* every selector is qualified by one of our own `cc-` classes. Colours are
+		* harness theme aliases with neutral fallbacks, and the `cc-` prefix keeps
+		* these clear of the panel's `ccp-` set.
 		*
 		* @module dsh-commandcode-provider/client/page-styles
 		*/
 		/**
-		* Stylesheet id (the `data-plugin-css` value that makes injection idempotent).
+		* Stylesheet id — the `data-plugin-css` value that makes injection idempotent.
 		*
-		* The package prefix must match the one the panel stylesheet uses
-		* (`PANEL_CSS_ID` in `./panel-styles.ts`) and this package's real name: an id is
-		* the injection's identity, so a stale fork prefix would let a second copy of
-		* the plugin inject the same rules twice and would misreport the owner in the
-		* DOM. The two ids must also stay distinct from each other — they key two
-		* separate style tags, and a shared id would make the second injection a no-op
-		* that silently drops one stylesheet.
+		* The prefix must match this package's real name and the panel stylesheet's
+		* (`PANEL_CSS_ID`); the two ids must also stay DISTINCT, since they key two
+		* separate style tags and a shared id would make the second injection a no-op.
 		*/
 		const PAGE_CSS_ID = "@mars-sea/dsh-commandcode-provider/CommandCodeSettingsPage.module.css";
 		/**
@@ -6370,13 +6214,14 @@ window.__ModuleLoader__.load({
 		*
 		* 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
+		* 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,
-		* the platform's error colour (label-error is its text-only sibling).
+		* bg-module-platform fill with a 12px radius. Errors use state-error-primary.
 		*/
 		const PAGE_CSS = `
 .cc-section{max-width:720px;color:var(--dsw-alias-label-primary);flex-direction:column;display:flex}
@@ -6384,8 +6229,8 @@ window.__ModuleLoader__.load({
 .cc-intro{margin:4px 0 0;color:var(--dsw-alias-label-tertiary);font-size:14px;line-height:22px}
 .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}
-/* Groups: a heading over hairline-separated rows, no card surface. */
 .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}
@@ -6393,10 +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-rowNested{padding-left:16px}
-.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}
@@ -6407,19 +6250,15 @@ window.__ModuleLoader__.load({
 .cc-rowControl{flex:none;align-items:center;justify-content:flex-end;gap:8px;display:inline-flex;max-width:60%}
 .cc-rowInput{width:200px}
 .cc-rowInputWide{width:280px}
-/* The platform's link button: a compact capsule with no fill until hovered. */
 .cc-linkButton{box-sizing:border-box;flex:none;align-items:center;display:inline-flex;height:28px;padding:0 10px;border:0;border-radius:14px;background:0 0;color:var(--dsw-alias-label-tertiary);font:inherit;font-size:12px;line-height:18px;white-space:nowrap;cursor:pointer}
 .cc-linkButton:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-secondary)}
 .cc-linkButton:disabled{cursor:default;opacity:.4}
 .cc-linkButton:focus-visible{outline:none;box-shadow:0 0 0 2px var(--dsw-alias-border-l3)}
-/* Tags: the platform Tag's capsule (11/17, weight 500). */
 .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))}
-/* The stacked field (the Models-page provider card and the account forms):
- * the platform SettingsForm field's metrics. */
 .cc-field{flex-direction:column;gap:6px;padding:12px 0;display:flex}
 .cc-field+.cc-field{border-top:.5px solid var(--dsw-alias-border-l2)}
 .cc-fieldHead{align-items:center;gap:8px;display:flex}
@@ -6432,10 +6271,7 @@ window.__ModuleLoader__.load({
 .cc-input:focus-visible{border-color:var(--dsw-alias-brand-primary);outline:none}
 .cc-input:disabled{opacity:.6;cursor:default}
 .cc-inputInvalid{border-color:var(--dsw-alias-state-error-primary)}
-.cc-invalid{color:var(--dsw-alias-state-error-primary);margin:0;font-size:12px;line-height:18px}
 .cc-hint{color:var(--dsw-alias-label-tertiary);margin:0;font-size:12px;line-height:18px}
-/* The model multi-select trigger: the platform's selector capsule (the
- * language / permission pickers on General). */
 .cc-modelSelectAnchor{flex-direction:column;align-items:stretch;gap:6px;display:inline-flex;min-width:160px}
 .cc-selector{box-sizing:border-box;align-items:center;gap:12px;display:inline-flex;height:36px;padding:0 14px;border:0;border-radius:18px;background:var(--dsw-alias-bg-module-platform);color:var(--dsw-alias-label-primary);font:inherit;font-size:14px;line-height:22px;text-align:left;cursor:pointer}
 .cc-selector:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}
@@ -6449,51 +6285,34 @@ window.__ModuleLoader__.load({
 .cc-modelSearch::-webkit-search-cancel-button{cursor:pointer}
 .cc-checkRow{align-items:center;gap:8px;display:inline-flex;min-width:0}
 .cc-checkRow:hover{cursor:pointer}
-/* A hand-drawn box rather than the platform's accent-color checkbox: the
- * native control's colours come from color-scheme, which the theme sets once
- * at BOOT (it is not re-applied when the theme is switched in-session), so a
- * native box can paint light-chrome white on a dark page. Drawn from tokens it
- * cannot. The mark rides a brand-primary fill, so it takes the theme's brand
- * foreground — the platform's pairing for anything painted on that fill, and
- * the only one that survives the dark mode's near-white brand. The box
- * outline is a border-l3 hairline: border-l2 (#ffffff1f in dark) leaves an
- * unchecked box all but invisible against the menu surface. */
+/* A hand-drawn box, not the platform's accent-color checkbox: the native
+ * control's colours come from color-scheme, which the theme sets once at BOOT
+ * and never re-applies in-session, so a native box can paint light-chrome white
+ * on a dark page. The mark rides a brand-primary fill, so it takes the brand
+ * foreground (the only pairing that survives dark mode's near-white brand), and
+ * the outline is a border-l3 hairline because border-l2 leaves an unchecked box
+ * invisible against the menu surface. */
 .cc-check{box-sizing:border-box;appearance:none;flex-shrink:0;width:16px;height:16px;margin:0;border:1px solid var(--dsw-alias-border-l3);border-radius:4px;background:0 0;position:relative}
 .cc-check:checked{background:var(--dsw-alias-brand-primary);border-color:var(--dsw-alias-brand-primary)}
 .cc-check:checked::after{content:'';position:absolute;top:3px;left:5px;width:3px;height:7px;border:solid var(--dsw-alias-label-primary-foreground,#fff);border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
 .cc-checkName{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
-/* The platform SegmentedControl: a translucent track and one raised pill that
- * slides under the picked segment. Segments are equal grid tracks, so the
- * indicator's width and offset follow from the count and the index alone. */
-.cc-segmented{position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:2px;padding:3px;border-radius:9px;background:var(--dsw-alias-interactive-bg-hover)}
-.cc-segmentIndicator{position:absolute;top:3px;left:3px;width:calc((100% - 6px - 2px * (var(--cc-segment-count) - 1)) / var(--cc-segment-count));height:calc(100% - 6px);border-radius:7px;background:var(--dsw-alias-bg-layer-1);box-shadow:var(--dsw-elevation-soft,0 1px 2px rgba(0,0,0,.12));transform:translateX(calc(var(--cc-segment-index) * (100% + 2px)));transition:transform .16s ease;pointer-events:none}
-.cc-segment{box-sizing:border-box;position:relative;z-index:1;height:28px;padding:0 16px;border:0;border-radius:7px;background:0 0;color:var(--dsw-alias-label-secondary);font:inherit;font-size:13px;font-weight:500;line-height:20px;white-space:nowrap;cursor:pointer;transition:color .12s ease}
-.cc-segment:hover:not(:disabled),.cc-segment[aria-checked=true]{color:var(--dsw-alias-label-primary)}
-.cc-segment:disabled{cursor:default;opacity:.4}
-.cc-segment:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:-2px}
 /* Modelled on the platform's own Switch primitive (ui-primitives
- * Switch.module.css): a 36x20 capsule that pads its track by 2px and slides a
- * 16px thumb across the 32px content box.
- *
- * Three things are load-bearing. (1) corner-shape:round on BOTH the track and
- * the thumb: the theme sets a global superellipse corner shape on every
- * element, and a superellipse capsule squares its ends off around a round
- * thumb. (2) No literal colours. --dsw-alias-brand-primary INVERTS between the
- * two modes (near-black in light, near-white in dark), so a hardcoded white
- * thumb vanishes on the checked track in dark mode; the brand foreground is the
- * token the platform paints on that fill. (3) --dsw-alias-border-l3 as the off
- * track: border-l2 (#ffffff1f in dark) leaves it indistinguishable from the
- * page. */
+ * Switch.module.css): a 36x20 capsule padding its track by 2px and sliding a
+ * 16px thumb across the 32px content box. Three things are load-bearing.
+ * (1) corner-shape:round on BOTH track and thumb — the theme sets a global
+ * superellipse corner shape, which squares a capsule's ends off around a round
+ * thumb. (2) No literal colours: brand-primary INVERTS between the modes, so a
+ * hardcoded white thumb vanishes on the checked track in dark mode; the brand
+ * foreground is what the platform paints on that fill. (3) border-l3 as the
+ * off track — border-l2 leaves it indistinguishable from the page. */
 .cc-toggle{box-sizing:border-box;appearance:none;flex-shrink:0;width:36px;height:20px;margin:0;padding:2px;border:0;border-radius:10px;corner-shape:round;background:var(--dsw-alias-border-l3);cursor:pointer;position:relative}
 .cc-toggle:checked{background:var(--dsw-alias-brand-primary)}
 .cc-toggle::after{content:'';display:block;width:16px;height:16px;border-radius:50%;corner-shape:round;background:var(--dsw-alias-label-primary-foreground);transition:transform .12s ease}
-/* 32px content box minus the 16px thumb. */
 .cc-toggle:checked::after{transform:translateX(16px)}
 .cc-toggle:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:2px}
 .cc-toggle:disabled{cursor:default;opacity:.5}
 .cc-chevron{flex-shrink:0;border-right:1.5px solid var(--dsw-alias-label-tertiary);border-bottom:1.5px solid var(--dsw-alias-label-tertiary);width:7px;height:7px;margin-right:6px;margin-bottom:3px;transform:rotate(45deg);transition:transform .15s ease}
 .cc-chevronUp{transform:rotate(-135deg);margin-bottom:-3px}
-/* Accounts: one outlined card per account, the Models page's provider card. */
 .cc-accountMode{align-items:center;gap:4px;display:flex;margin:-4px 0 12px;color:var(--dsw-alias-label-secondary);font-size:12px;line-height:18px}
 .cc-accountList{flex-direction:column;gap:8px;display:flex}
 .cc-accountList+.cc-addButton,.cc-accountList+.cc-addPanel{margin-top:8px}
@@ -6506,10 +6325,11 @@ window.__ModuleLoader__.load({
 .cc-iconButton{flex-shrink:0;align-items:center;justify-content:center;display:inline-flex;width:28px;height:28px;padding:0;background:0 0;border:0;border-radius:6px;color:var(--dsw-alias-label-tertiary);cursor:pointer}
 .cc-iconButton:hover{background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-primary)}
 .cc-iconButton:focus-visible{outline:none;box-shadow:0 0 0 2px var(--dsw-alias-border-l3)}
-/* Three dots from one element: the dot itself plus two box-shadow copies. */
+/* Three dots from one element: the dot plus two box-shadow copies. */
 .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}
@@ -6528,20 +6348,16 @@ window.__ModuleLoader__.load({
 .cc-confirmText{color:var(--dsw-alias-label-primary);margin:0;font-size:14px;line-height:22px}
 .cc-dangerButton{color:var(--dsw-alias-state-error-primary);border-color:var(--dsw-alias-state-error-primary)}
 .cc-dangerButton:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover-danger)}
-/* Adding an account: the Models page's dashed add button, opening a filled
- * panel in its place. */
 .cc-addButton{box-sizing:border-box;align-items:center;justify-content:center;gap:6px;display:flex;width:100%;height:44px;border:1px dashed var(--dsw-alias-border-l3);border-radius:16px;background:0 0;color:var(--dsw-alias-label-primary);font:inherit;font-size:14px;line-height:22px;cursor:pointer}
 .cc-addButton:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}
 .cc-addButton:disabled{cursor:default;opacity:.4}
 .cc-addButton:focus-visible{outline:none;box-shadow:0 0 0 2px var(--dsw-alias-border-l3)}
-/* A plus from two crossed bars. */
 .cc-addGlyph{position:relative;width:12px;height:12px}
 .cc-addGlyph::before,.cc-addGlyph::after{content:'';position:absolute;background:currentColor;border-radius:1px}
 .cc-addGlyph::before{left:0;right:0;top:5.25px;height:1.5px}
 .cc-addGlyph::after{top:0;bottom:0;left:5.25px;width:1.5px}
 .cc-addPanel{flex-direction:column;gap:12px;display:flex;padding:14px 16px;border-radius:12px;background:var(--dsw-alias-bg-module-platform)}
 .cc-panelTitle{color:var(--dsw-alias-label-primary);font-size:14px;font-weight:500;line-height:22px}
-/* Account report: stat tiles are filled panels, like the platform's editors. */
 .cc-accountReport{flex-direction:column;gap:14px;display:flex}
 .cc-usageHead{align-items:center;gap:8px;display:flex}
 .cc-usageTitle{color:var(--dsw-alias-label-primary);flex:1;margin:0;font-size:14px;font-weight:500;line-height:22px}
@@ -6549,10 +6365,9 @@ window.__ModuleLoader__.load({
 .cc-usagePlan{flex:none;white-space:nowrap;border:.5px solid var(--dsw-alias-border-l3);color:var(--dsw-alias-label-secondary);border-radius:999px;corner-shape:round;padding:0 7px;font-size:11px;font-weight:500;line-height:17px}
 .cc-usagePlanStatus{flex:none;margin:0;white-space:nowrap;color:var(--dsw-alias-state-error-primary);font-size:12px;line-height:18px}
 .cc-usageHint{color:var(--dsw-alias-label-tertiary);margin:0;font-size:12px;line-height:18px}
-/* Two fixed grids instead of one auto-fit track: auto-fit wrapped the four
- * activity tiles 3 + 1 at the details' width. Each group fills its own row
- * (four activity tiles, three balances) and the activity row folds to 2 × 2
- * in a narrow details panel. */
+/* Two fixed grids, not one auto-fit track: auto-fit wrapped the four activity
+ * tiles 3 + 1 at the details' width. The activity row folds to 2 × 2 in a
+ * narrow details panel. */
 .cc-usageStats{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;display:grid}
 .cc-usageStatsActivity{grid-template-columns:repeat(4,minmax(0,1fr))}
 .cc-usageStatsBalance{grid-template-columns:repeat(3,minmax(0,1fr))}
@@ -6580,31 +6395,25 @@ window.__ModuleLoader__.load({
 .cc-usageBlockedHint{color:var(--dsw-alias-label-secondary);margin:0;font-size:12px;line-height:18px}
 .cc-usageBlockedDetail{color:var(--dsw-alias-label-tertiary);margin:0;font-size:12px;line-height:18px;word-break:break-word}
 .cc-version{margin:32px 0 0;text-align:center;color:var(--dsw-alias-label-tertiary);font-size:12px;line-height:18px}
-/* The update hint rides the footer version line, quiet until hovered. */
 .cc-versionLink{color:var(--dsw-alias-state-warn-label,var(--dsw-alias-label-secondary));text-decoration:none}
 .cc-versionLink:hover{color:var(--dsw-alias-label-primary);text-decoration:underline;text-underline-position:under}
-/* The Models-page provider panel root: unstyled by design — the row card the
- * Models page owns supplies the surface, the panel only stacks its controls. */
 .cc-providerCard{flex-direction:column;display:flex}
 .cc-footer{justify-content:flex-end;align-items:center;gap:8px;display:flex}
 .cc-failed{display:inline-block;max-width:260px;min-width:0;color:var(--dsw-alias-state-error-primary);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;line-height:18px}
-/* The authorization link is the only link-coloured element on a login row. */
 .cc-loginLink{color:var(--dsw-alias-link,var(--dsw-alias-brand-primary));text-decoration:none;font-size:12px;line-height:18px}
 .cc-loginLink:hover{text-decoration:underline;text-underline-position:under}
 .cc-loginDone{color:var(--dsw-alias-state-success-primary,var(--dsw-alias-label-secondary))}
 .cc-loginError{color:var(--dsw-alias-state-error-primary)}
 /* The floating save bar: a centered capsule pinned to the bottom of the
- * settings scrollport. The dock is a zero-height sticky strip at the end of
- * the page, so the bar overlays the scrolling content instead of taking a row
- * of its own; while it is shown the section reserves room at its end so the
- * last line can still scroll clear of it. Hidden, it sinks and fades, and
- * visibility (switched after the transition) takes its buttons out of the tab
- * order.
- *
- * Its surface is an elevated layer (bg-layer-1 over the settings panel's
- * layer-2) with the platform's prominent elevation and no stroke. The corners
- * are concentric: a 44px capsule around 36px capsule buttons inset by 4px, so
- * the gap around each button is even. */
+ * settings scrollport. The dock is a zero-height sticky strip at the end of the
+ * page, so the bar overlays the scrolling content instead of taking a row of
+ * its own; while shown, the section reserves room at its end so the last line
+ * can scroll clear. Hidden, it sinks and fades, and visibility (switched after
+ * the transition) takes its buttons out of the tab order. Its surface is an
+ * elevated layer (bg-layer-1 over the settings panel's layer-2) with the
+ * platform's prominent elevation and no stroke, and its corners are concentric
+ * (a 44px capsule around 36px buttons inset by 4px) so the gap around each
+ * button is even. */
 .cc-sectionWithBar{padding-bottom:80px}
 .cc-saveBarDock{position:sticky;bottom:0;z-index:2;height:0;pointer-events:none}
 .cc-saveBar{--cc-saveBar-tone:var(--dsw-alias-state-warn-primary,#d97706);position:absolute;left:50%;bottom:20px;box-sizing:border-box;width:max-content;max-width:calc(100% - 24px);align-items:center;gap:10px;display:flex;height:44px;padding:4px 4px 4px 16px;border:0;border-radius:22px;corner-shape:round;background:var(--dsw-alias-bg-layer-1);box-shadow:var(--dsw-elevation-prominent,0 12px 32px -8px rgba(0,0,0,.24),0 2px 8px rgba(0,0,0,.08));opacity:0;visibility:hidden;transform:translate(-50%,12px);transition:opacity .16s ease,transform .16s ease,visibility 0s linear .16s}
@@ -6623,7 +6432,7 @@ window.__ModuleLoader__.load({
 .cc-saveBarGhost:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}
 .cc-saveBarPrimary{background:var(--dsw-alias-button-primary-fill,var(--dsw-alias-brand-primary));color:var(--dsw-alias-label-primary-foreground,#fff)}
 .cc-saveBarPrimary:hover:not(:disabled){background:var(--dsw-alias-button-primary-hover,var(--dsw-alias-button-primary-fill,var(--dsw-alias-brand-primary)))}
-@media (prefers-reduced-motion:reduce){.cc-chevron,.cc-toggle::after,.cc-usageBarFill,.cc-saveBar,.cc-saveBarShown,.cc-segmentIndicator,.cc-segment{transition:none}}
+@media (prefers-reduced-motion:reduce){.cc-chevron,.cc-toggle::after,.cc-usageBarFill,.cc-saveBar,.cc-saveBarShown{transition:none}}
 `;
 		//#endregion
 		//#region src/client/panel-styles.ts
@@ -6631,70 +6440,48 @@ window.__ModuleLoader__.load({
 		* Stylesheet for the Command Code plans & quota panel (the sidebar footer card
 		* and the dashboard it opens).
 		*
-		* Returned as a string rather than injected here so the modules stay free of
-		* DOM side effects at import time — the client entry installs it once, keyed
-		* by the same `data-plugin-css` attribute the settings-page stylesheet
-		* (`./page-styles.ts`) uses, and removes it again when the plugin's fiber
-		* unwinds.
-		*
-		* These rules are GLOBAL CSS: every selector in here can match markup this
-		* plugin did not render. So each one is either qualified by a `ccp-` class of
-		* our own, or anchored to the sidebar region it has to lay out — and the one
-		* foreign anchor carries its justification in place (see the footer card
-		* block; issue #48). `tests/styles.test.ts` audits that containment for both
-		* stylesheets and simulates it against the real foreign class stems.
+		* Returned as a string, not injected here, so importing this module has no DOM
+		* side effect: `./index.ts` installs it once under {@link PANEL_CSS_ID} and
+		* removes it when the fiber unwinds.
 		*
-		* Every colour comes from a harness theme alias with a neutral fallback, so
-		* the panel follows the active theme (light/dark and any brand pack) without
-		* hardcoded values. Classes are `ccp-` prefixed to stay clear of the settings
-		* page's `cc-` set.
+		* These rules are GLOBAL CSS, so containment is a contract (issue #48): every
+		* selector is qualified by one of our own `ccp-` classes except the sidebar
+		* anchor below, which carries its justification in place. `tests/styles.test.ts`
+		* audits both stylesheets against the real foreign class stems. Colours are
+		* harness theme aliases with neutral fallbacks; the `ccp-` prefix keeps these
+		* clear of the settings page's `cc-` set.
 		*
 		* @module dsh-commandcode-provider/client/panel-styles
 		*/
 		/**
-		* Stylesheet id (the `data-plugin-css` value that makes injection idempotent).
+		* Stylesheet id — the `data-plugin-css` value that makes injection idempotent.
 		*
-		* The package prefix must match the one the settings-page stylesheet uses
-		* (`PAGE_CSS_ID` in `./page-styles.ts`) and this package's real name: an id is
-		* the injection's identity, so a stale fork prefix would let a second copy of
-		* the plugin inject the same rules twice and would misreport the owner in the
-		* DOM. The two ids must also stay distinct from each other — they key two
-		* separate style tags, and a shared id would make the second injection a no-op
-		* that silently drops one stylesheet.
+		* The prefix must match this package's real name and the settings-page sheet's
+		* (`PAGE_CSS_ID`); the two ids must also stay DISTINCT, since they key two
+		* separate style tags and a shared id would make the second injection a no-op.
 		*/
 		const PANEL_CSS_ID = "@mars-sea/dsh-commandcode-provider/CommandCodePanel.module.css";
 		/** The panel stylesheet. */
 		const PANEL_CSS = `
 /* ------------------------------------------------- sidebar footer card */
-/* The shell's foot area renders this list ABOVE the Settings seat, so the card
-   is the sidebar's bottom-most content. The shell supplies no chrome: the entry
-   is the button. It is deliberately quiet — a surface that sits beside Settings
-   should read as part of the column, not as a call to action — with one hover
-   step and a hairline border.
-
-   The shell's container is a flex ROW whose occupants (this card and ui-cordis's
-   footer chip) each declare a full-width line and shrink-proof flex, so as a row
-   it would overflow the column: this card's flex:0 0 auto cannot shrink, and the
-   chip's width:100% basis would absorb the whole overflow and collapse to
-   nothing. Both were written for a full-width line, which is exactly what a
-   column gives them. Matched by the CSS-module class STEM — never a hashed name
-   — so a dsh that renames it degrades to the shell's own row rather than
-   breaking.
+/* The shell renders this list ABOVE the Settings seat, so the card is the
+   sidebar's bottom-most content, and supplies no chrome: the entry IS the
+   button. Deliberately quiet — a surface beside Settings should read as part of
+   the column — with one hover step and a hairline border.
 
-   THE ANCHOR IS LOAD-BEARING, and it is the whole reason this selector is not
-   just [class*="_footerActions"] (issue #48). "footerActions" is NOT a stem this
-   shell owns alone: @deepseek-ai/dsh-client-ui-user-questions renders the
-   ask-user-question dialog's button row as Mbwy4a_footerActions, so the
-   unanchored rule forced THAT row into a column too and stacked the dialog's
+   The shell's container is a flex ROW whose occupants each declare a full-width
+   line and shrink-proof flex, so as a row it would overflow the column: this
+   card cannot shrink and the neighbouring chip would absorb the overflow and
+   collapse to nothing. The first rule is that fix, and THE ANCHOR IS
+   LOAD-BEARING (issue #48): "footerActions" is not a stem this shell owns alone
+   — dsh-client-ui-user-questions renders the ask-user-question dialog's button
+   row as Mbwy4a_footerActions, and the unanchored rule stacked THAT row's
    side-by-side buttons on every page. "footArea" is declared by
-   dsh-client-ui-sidebar alone — verified against every client bundle of the
-   0.1.6-alpha.1 engine, and against our own cc-/ccp- class names, which collide
-   with no engine class — so anchoring under it keeps the sidebar layout fix and
-   cannot reach another component's markup. The descendant combinator (rather
-   than a child one) deliberately survives a wrapper element appearing between
-   the two: a renamed or restructured shell should degrade to its own row, not
-   lose the fix. tests/styles.test.ts pins both halves of this — the dialog row
-   is no longer matched, the sidebar row still is. */
+   dsh-client-ui-sidebar alone (audited across every client bundle of the
+   0.1.6-alpha.1 engine, and against our own cc-/ccp- names, which collide with
+   no engine class). The DESCENDANT combinator survives a wrapper element
+   appearing between the two, so a restructured shell degrades to its own row
+   rather than losing the fix. tests/styles.test.ts pins both halves. */
 [class*="_footArea"] [class*="_footerActions"]{flex-direction:column}
 .ccp-foot{box-sizing:border-box;flex:0 0 auto;width:100%;min-width:0;font:inherit;color:var(--dsw-alias-label-secondary);text-align:left;cursor:pointer;background:0 0;border:1px solid transparent;border-radius:10px;flex-direction:column;gap:6px;margin:0 0 4px;padding:8px;display:flex}
 .ccp-foot:hover{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-interactive-bg-hover);border-color:var(--dsw-alias-border-l2)}
@@ -6704,34 +6491,31 @@ window.__ModuleLoader__.load({
 /* One block per quota window: a head line carrying the window's own spend and
    limit, then the FULL-WIDTH bar under it. Stacking the two lets the card show
    the dollar figures — the reason this surface exists — without squeezing the
-   bar into what is left beside them. Mirrors the dashboard's own window block. */
+   bar into what is left beside them. Mirrors the dashboard's window block. */
 .ccp-footRow{flex-direction:column;gap:4px;min-width:0;display:flex}
 .ccp-footHead{align-items:baseline;gap:8px;min-width:0;display:flex}
 .ccp-footLabel{flex:1;color:var(--dsw-alias-label-tertiary);font-size:11px;line-height:16px}
 .ccp-footAmount{flex:none;color:var(--dsw-alias-label-secondary);font-size:11px;line-height:16px;font-variant-numeric:tabular-nums;white-space:nowrap}
 /* The card's markup must stay PHRASING content — it renders inside the shell's
-   own button — so these bars are spans, not divs. That makes display:block
-   load-bearing on BOTH: an inline box ignores width and height outright, so
-   without it the 5px track still painted (a flex item is blockified by its
-   container) while the fill collapsed to 0x0 and the bar showed no usage. */
+   own button — so these bars are spans, which makes display:block load-bearing:
+   an inline box ignores width outright, so the fill would collapse to 0x0 and
+   the bar would show no usage. */
 .ccp-footBar{display:block;background:var(--dsw-alias-bg-layer-2);border-radius:999px;height:5px;overflow:hidden}
 .ccp-footFill{display:block;background:var(--dsw-alias-brand-primary);border-radius:999px;height:100%;transition:width .3s ease}
 .ccp-footFillWarn{background:var(--dsw-alias-state-error-primary)}
 .ccp-footPct{flex:none;width:34px;color:var(--dsw-alias-label-secondary);text-align:right;font-size:11px;line-height:16px;font-variant-numeric:tabular-nums}
 
-/* The 56px rail: one icon button on the shell's own rail geometry (36px cell),
-   so the collapsed column keeps a single 18px glyph like its siblings. */
+/* The 56px rail: one icon button on the shell's own 36px rail cell, so the
+   collapsed column keeps a single 18px glyph like its siblings. */
 .ccp-railButton{box-sizing:border-box;width:36px;height:36px;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:1px solid transparent;border-radius:8px;flex:none;justify-content:center;align-items:center;margin:0 0 4px;padding:0;display:inline-flex}
 .ccp-railButton:hover{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-interactive-bg-hover)}
 .ccp-railButton:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:1px}
 
-/* The ring glyph. Sized entirely by its own width/height attribute, so the
+/* The ring glyph, sized entirely by its own width/height attribute, so the
    footer row, the rail button and the dashboard can each ask for their own. */
 .ccp-glyph{flex:none;justify-content:center;align-items:center;display:inline-flex;color:var(--dsw-alias-brand-primary)}
 
 /* ------------------------------------------------------------ dashboard */
-/* The center column in the layout frame: fill it, scroll the content column,
-   and cap the reading width like the harness's own panels. */
 .ccp-main{background:var(--dsw-alias-bg-layer-1);width:100%;height:100%;overflow:auto;display:block}
 .ccp-mainInner{max-width:760px;margin:0 auto;padding:24px 20px 40px;flex-direction:column;gap:14px;display:flex;color:var(--dsw-alias-label-primary)}
 .ccp-header{align-items:center;gap:10px;display:flex;flex-wrap:wrap}
@@ -6740,14 +6524,12 @@ window.__ModuleLoader__.load({
 .ccp-subtitle{margin:0;color:var(--dsw-alias-label-tertiary);font-size:12px;line-height:1.5}
 .ccp-spacer{flex:1}
 .ccp-meta{color:var(--dsw-alias-label-tertiary);font-size:11px;line-height:1.5;font-variant-numeric:tabular-nums}
-/* The dashboard's exit: an icon-sized glyph button. The primitive's own
-   geometry is kept (size="sm"); only the glyph is enlarged and optically
-   centred, so it reads as a dismiss control rather than a text button. */
+/* The dashboard's exit: the primitive's own size="sm" geometry is kept; only the
+   glyph is enlarged and optically centred, so it reads as a dismiss control. */
 .ccp-close{min-width:28px;justify-content:center;padding-left:0;padding-right:0}
 .ccp-close span{font-size:16px;line-height:1}
 .ccp-hint{color:var(--dsw-alias-label-tertiary);margin:0;font-size:12px;line-height:1.5}
 
-/* Notices: the no-key guidance, a blocked report, and a stale-data error. */
 .ccp-notice{border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-3);border-radius:12px;padding:12px 14px;flex-direction:column;gap:4px;display:flex}
 .ccp-noticeError{border-color:var(--dsw-alias-state-error-primary)}
 .ccp-noticeTitle{margin:0;font-size:13px;font-weight:600;line-height:1.5}
@@ -6767,15 +6549,14 @@ window.__ModuleLoader__.load({
 .ccp-fieldLabel{color:var(--dsw-alias-label-tertiary);font-size:12px;line-height:1.5}
 .ccp-planName{color:var(--dsw-alias-label-primary);font-size:13px;font-weight:600;line-height:1.5}
 
-/* Stat tiles: the monthly credits and the usage totals share one grid. */
+/* The monthly credits and the usage totals share one grid. */
 .ccp-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
 .ccp-tile{border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-1);border-radius:8px;padding:8px 10px;flex-direction:column;gap:2px;display:flex;min-width:0}
 .ccp-tileLabel{color:var(--dsw-alias-label-tertiary);font-size:11px;line-height:1.5}
 .ccp-tileValue{color:var(--dsw-alias-label-primary);font-size:15px;font-weight:600;line-height:1.4;font-variant-numeric:tabular-nums}
 .ccp-tileSub{color:var(--dsw-alias-label-tertiary);font-size:11px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 
-/* Quota bars: the monthly bar and the two windows stack in one column, each a
-   label row plus the track. */
+/* Quota bars: the monthly bar and the two windows. */
 .ccp-windows{flex-direction:column;gap:14px;display:flex}
 .ccp-window{flex-direction:column;gap:6px;display:flex}
 .ccp-windowHead{align-items:baseline;gap:8px;display:flex}
@@ -6788,7 +6569,6 @@ window.__ModuleLoader__.load({
 .ccp-barFillWarn{background:var(--dsw-alias-state-error-primary)}
 .ccp-windowReset{color:var(--dsw-alias-label-tertiary);margin:0;font-size:11px;line-height:1.5}
 
-/* Badges. */
 .ccp-badge{white-space:nowrap;background:var(--dsw-alias-bg-module-platform);color:var(--dsw-alias-brand-primary);border-radius:999px;padding:1px 8px;font-size:11px;font-weight:600;line-height:17px}
 .ccp-badgeError{background:transparent;color:var(--dsw-alias-state-error-primary)}
 .ccp-badgeWarn{background:var(--dsw-alias-state-warn-tertiary,var(--dsw-alias-bg-module-platform));color:var(--dsw-alias-state-warn-primary,var(--dsw-alias-label-secondary))}
@@ -6815,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 项",
@@ -6832,13 +6614,6 @@ window.__ModuleLoader__.load({
 			webSearchHint: "使用同一密钥承载 dsh 的 web_search；关闭后恢复原搜索后端。",
 			showSidebarQuota: "在侧边栏显示额度卡片",
 			showSidebarQuotaHint: "在侧边栏底部显示套餐与额度卡片，点击可打开完整仪表盘。默认关闭，关闭时不会为它后台刷新用量。",
-			commandGuard: "AI 命令安全预判",
-			commandGuardHint: "命令确认弹窗前，先由 typesafe/jev 判断它是否安全；沙箱提权还会额外判断范围与必要性。三项都足够确定才自动放行，其余照常弹窗。默认关闭。",
-			commandGuardLevel: "自动放行阈值",
-			commandGuardLevelHint: "阈值越高，需要越确定才放行，弹窗越多。高 = 0.95，中 = 0.9（默认），低 = 0.8。判定超过 3 秒未返回会照常弹窗。",
-			commandGuardLevelHigh: "高",
-			commandGuardLevelMedium: "中",
-			commandGuardLevelLow: "低",
 			zdr: "零数据保留（ZDR）",
 			zdrHint: "仅使用不留存、不训练的上游；可用模型可能更少且价格通常更高。",
 			accountsTitle: "账户",
@@ -6848,6 +6623,8 @@ window.__ModuleLoader__.load({
 			modelSearchPlaceholder: "搜索模型…",
 			modelSearchEmpty: "没有匹配的模型。",
 			modelStale: "已下架",
+			modelAllowance: "${amount}/月",
+			modelAllowanceTitle: "该模型每月可用的额度（美元）。套餐内所有模型共用同一个月度额度池，这不是额外赠送的额度。",
 			visibleModelsTitle: "模型白名单",
 			visibleModelsHint: "勾选要保留的模型，模型选择器就只列出这些；一个都不勾选时则显示全部模型。保存后，下次打开模型选择器生效。",
 			visibleModelsPick: "选择要保留的模型…",
@@ -6974,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",
@@ -6991,13 +6770,6 @@ window.__ModuleLoader__.load({
 			webSearchHint: "Use the same key for dsh web search; turning it off restores the previous backend.",
 			showSidebarQuota: "Show the quota card in the sidebar",
 			showSidebarQuotaHint: "Show a plan and quota card at the bottom of the sidebar that opens the full dashboard. Off by default; while off, no background usage refresh runs for it.",
-			commandGuard: "AI command guard",
-			commandGuardHint: "Before a shell command asks for approval, typesafe/jev judges whether it is safe. A sandbox escalation also needs separate scope and necessity verdicts; all three must be confident enough to skip the prompt. Off by default.",
-			commandGuardLevel: "Auto-approve threshold",
-			commandGuardLevelHint: "A higher threshold needs more confidence to skip the prompt, so you see more prompts. High = 0.95, Medium = 0.9 (default), Low = 0.8. A judgement that takes longer than 3 seconds shows the normal prompt.",
-			commandGuardLevelHigh: "High",
-			commandGuardLevelMedium: "Medium",
-			commandGuardLevelLow: "Low",
 			zdr: "Zero data retention (ZDR)",
 			zdrHint: "Use only upstreams that retain no data and do not train on requests; availability and pricing may differ.",
 			accountsTitle: "Accounts",
@@ -7007,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…",
@@ -7124,56 +6898,42 @@ 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 the injection
-		* is idempotent even if a second surface asks for it later.
-		*/
-		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
 		* by the `sidebar.footer.action` card and the `main` slot cell, so the card
 		* selects this panel and nothing else. `dsh-client-ui-layout` is not a
-		* dependency of this bundle (its type is only a brand over `string`), so the
-		* brand is applied at the call site instead of importing the package.
+		* dependency of this bundle, so its brand is applied at the call site instead
+		* of importing the package.
 		*/
 		const PANEL_ID = "commandcode-panel";
 		/**
 		* The composer figure's entry id in `conversation.composer.dock`. Its own id,
-		* not the shipped `stats` cell's: reusing `stats` would REPLACE the tokens /
+		* never the shipped `stats` cell's: reusing that id would REPLACE the tokens /
 		* cache-hit / throughput readout rather than inject into it, and that readout
-		* is the harness's to format (see `./session-cost-display.ts`).
+		* is the harness's to format.
 		*/
 		const SESSION_COST_ID = "commandcode-session-cost";
 		/**
 		* Client plugin body. Gates on `slots`, `locale` and `remote` — never on
 		* `settingsScope`, whose wrapper service the 0.1.7 settings rewrite removed
-		* (the settings scope here speaks the `remote.settings` wire directly). The
-		* page mounts once `remote.credentials` appears.
+		* (the scope below speaks the `remote.settings` wire directly), because
+		* gating on a service 0.1.7 does not provide would park EVERY surface below
+		* into silence. `settingsScope` must never reappear in the exported inject
+		* 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
@@ -7422,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",