dsh-plugin-subscription-usage 0.0.0-stage → 0.2.0

package/lib/client.js

@@ -0,0 +1,3933 @@
+window.__ModuleLoader__.load({ id: "dsh-plugin-subscription-usage", factory: (require) => {
+var module = { exports: {} }; var exports = module.exports;
+//#region rolldown:runtime
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+
+//#endregion
+let react = require("react");
+react = __toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = __toESM(react_jsx_runtime);
+let react_dom = require("react-dom");
+react_dom = __toESM(react_dom);
+
+//#region src/client/locales.ts
+/** Copy for every Client surface of this plugin, in one locale namespace. */
+const en = {
+	signIn: "Sign in",
+	signInAgain: "Sign in",
+	noApiKey: "No API key needed",
+	signInExpired: "Sign-in expired",
+	signedIn: "Signed in",
+	signInNeeded: "Sign-in needed",
+	manage: "Manage",
+	modelsCount: "{visible}/{total} models",
+	modelsCountTitle: "Models shown in the picker",
+	refreshUsage: "Refresh usage",
+	refreshUsageNamed: "Refresh {name} usage",
+	refreshedWait: "Refreshed. Again in {seconds}s",
+	defaultAccount: "Default account",
+	servingAccount: "Serving this session",
+	live: "live",
+	liveTitle: "Updates with every response",
+	agoShort: "{time} ago",
+	staleShort: "{time} old",
+	staleTitle: "Refresh failed. Retrying {when}",
+	noUsageData: "No usage data",
+	noUsageDataTitle: "This provider does not publish usage",
+	usageUnavailable: "Usage unavailable",
+	moreAccounts: "{count} more accounts",
+	stepTabOpened: "Tab opened",
+	stepApprove: "Approve access",
+	stepLoadModels: "Load models",
+	stepCodeIssued: "Code issued",
+	stepWaitingGithub: "Waiting for GitHub",
+	pasteRedirect: "Paste redirect URL instead",
+	pastePlaceholder: "Redirect URL or code",
+	continue: "Continue",
+	cancel: "Cancel",
+	copyCode: "Copy code",
+	claudeImport: "Import Claude Code",
+	claudeBrowser: "Browser sign-in",
+	tabAccounts: "Accounts",
+	tabModels: "Models",
+	tabTools: "Tools",
+	pool: "Pool",
+	poolInclude: "Include {account} in the pool",
+	makeDefault: "Make default",
+	signOut: "Sign out",
+	addAccount: "Add account",
+	searchModels: "Search {count} models",
+	showInPicker: "Show {model} in the picker",
+	pickerCount: "{visible} of {total} in the picker",
+	autoShowNew: "Show new models automatically",
+	selectAll: "Select all",
+	deselectAll: "Deselect all",
+	effortFor: "Default effort for {model}",
+	effortAuto: "Auto",
+	toolWebSearch: "Web search",
+	toolImage: "Image generation",
+	toolVideo: "Video generation",
+	toolXSearch: "X search",
+	toolsNote: "Applies to new sessions",
+	save: "Save",
+	saving: "Saving…",
+	saveFailed: "Could not save: {message}",
+	loadFailed: "Could not load: {message}",
+	window5h: "5h",
+	window7d: "7d",
+	windowOther: "limit",
+	resetsIn: "in {time}",
+	emptyAt: "empty {time}",
+	backAt: "back {time}",
+	tipUsedLeft: "{used}% used · {left}% left",
+	tipElapsed: "{percent}% of the window has passed",
+	tipPace: "Pace: ~{percent}% by reset",
+	tipResets: "Resets {time}",
+	tipCount: "{used} of {limit} used",
+	notReported: "Not reported",
+	subscriptions: "Subscriptions",
+	addProvider: "Add a provider",
+	apiKey: "API key",
+	addKey: "Add",
+	removeKey: "Remove key",
+	keyHelp: "Paste an API key. It is checked once, then stored on this machine.",
+	keyChecking: "Checking key…",
+	usageEmpty: "Sign in to a subscription in Models to see its usage here.",
+	composerUsage: "Composer usage",
+	composerUsageNote: "Current model plus pinned",
+	showQuotaAs: "Show quota as",
+	displayLeft: "Left",
+	displayUsed: "Used",
+	paceWarnings: "Pace warnings",
+	proxy: "Proxy",
+	proxyOff: "Off",
+	proxyOn: "On",
+	configure: "Configure",
+	proxyUrl: "Proxy URL",
+	proxyBypass: "Bypass hosts, comma separated",
+	proxyEnabled: "Use this proxy",
+	proxyTest: "Test",
+	proxyTestOk: "HTTP {status} in {ms} ms",
+	usage: "Usage",
+	usageLabel: "Subscription usage",
+	refreshNow: "Refresh now",
+	usageSettings: "Usage settings",
+	pin: "Pin to composer",
+	unpin: "Unpin from composer",
+	otherProviders: "{count} more",
+	noticeEmpty: "{provider} {window} empty around {time}",
+	noticeOut: "{provider} {window} limit reached",
+	noticeSwitched: "{provider} limit reached. Switched to {account}",
+	dismiss: "Dismiss",
+	generating: "Generating image…",
+	generatingVideo: "Generating video…",
+	image: "image",
+	imageClose: "Close",
+	imageLoadFailed: "Retry",
+	imageLoading: "Loading…",
+	imagePreview: "Image preview",
+	speed: "Speed",
+	speedStandard: "Standard",
+	speedStandardDescription: "Default speed",
+	speedFast: "Fast",
+	speedFastDescription: "1.5x speed, more usage",
+	videoLoadFailed: "Video failed to load: {message}",
+	videoLoading: "Loading video…",
+	viewImage: "View image",
+	viewImageNamed: "View {name}",
+	commandFast: "Switch the Codex speed tier (Standard/Fast)",
+	commandFastUnavailable: "The current model has no fast tier; /fast only works on Codex models whose catalog advertises one"
+};
+/** The locale namespace this plugin registers. */
+const LOCALE_NS = "subscription-models";
+const zh = {
+	signIn: "登录",
+	signInAgain: "重新登录",
+	noApiKey: "无需 API 密钥",
+	signInExpired: "登录已过期",
+	signedIn: "已登录",
+	signInNeeded: "需要登录",
+	manage: "管理",
+	modelsCount: "{visible}/{total} 个模型",
+	modelsCountTitle: "模型选择器中显示的模型",
+	refreshUsage: "刷新用量",
+	refreshUsageNamed: "刷新 {name} 用量",
+	refreshedWait: "已刷新，{seconds} 秒后可再次刷新",
+	defaultAccount: "默认账号",
+	servingAccount: "正在为本会话服务",
+	live: "实时",
+	liveTitle: "每次回复后更新",
+	agoShort: "{time}前",
+	staleShort: "已过 {time}",
+	staleTitle: "刷新失败，{when}重试",
+	noUsageData: "无用量数据",
+	noUsageDataTitle: "该服务商不提供用量数据",
+	usageUnavailable: "用量不可用",
+	moreAccounts: "另外 {count} 个账号",
+	stepTabOpened: "已打开标签页",
+	stepApprove: "批准访问",
+	stepLoadModels: "加载模型",
+	stepCodeIssued: "已生成代码",
+	stepWaitingGithub: "等待 GitHub",
+	pasteRedirect: "改为粘贴回调 URL",
+	pastePlaceholder: "回调 URL 或授权码",
+	continue: "继续",
+	cancel: "取消",
+	copyCode: "复制代码",
+	claudeImport: "导入 Claude Code",
+	claudeBrowser: "浏览器登录",
+	tabAccounts: "账号",
+	tabModels: "模型",
+	tabTools: "工具",
+	pool: "账号池",
+	poolInclude: "将 {account} 加入账号池",
+	makeDefault: "设为默认",
+	signOut: "退出登录",
+	addAccount: "添加账号",
+	searchModels: "搜索 {count} 个模型",
+	showInPicker: "在选择器中显示 {model}",
+	pickerCount: "选择器中显示 {visible}/{total}",
+	autoShowNew: "自动显示新模型",
+	selectAll: "全选",
+	deselectAll: "全不选",
+	effortFor: "{model} 的默认推理强度",
+	effortAuto: "自动",
+	toolWebSearch: "网页搜索",
+	toolImage: "图片生成",
+	toolVideo: "视频生成",
+	toolXSearch: "X 搜索",
+	toolsNote: "对新会话生效",
+	save: "保存",
+	saving: "保存中…",
+	saveFailed: "保存失败：{message}",
+	loadFailed: "加载失败：{message}",
+	window5h: "5h",
+	window7d: "7d",
+	windowOther: "限额",
+	resetsIn: "{time}后",
+	emptyAt: "{time} 用尽",
+	backAt: "{time} 恢复",
+	tipUsedLeft: "已用 {used}% · 剩余 {left}%",
+	tipElapsed: "窗口已过 {percent}%",
+	tipPace: "按当前速度：重置前约用 {percent}%",
+	tipResets: "{time} 重置",
+	tipCount: "已用 {used} / {limit}",
+	notReported: "未提供",
+	subscriptions: "订阅",
+	addProvider: "添加提供商",
+	apiKey: "API 密钥",
+	addKey: "添加",
+	removeKey: "移除密钥",
+	keyHelp: "粘贴 API 密钥。验证一次后保存在本机。",
+	keyChecking: "正在验证密钥…",
+	usageEmpty: "在“模型”中登录订阅后，可在此查看用量。",
+	composerUsage: "输入框用量",
+	composerUsageNote: "当前模型和已固定",
+	showQuotaAs: "额度显示为",
+	displayLeft: "剩余",
+	displayUsed: "已用",
+	paceWarnings: "速度预警",
+	proxy: "代理",
+	proxyOff: "关闭",
+	proxyOn: "开启",
+	configure: "配置",
+	proxyUrl: "代理 URL",
+	proxyBypass: "绕过的主机，逗号分隔",
+	proxyEnabled: "使用此代理",
+	proxyTest: "测试",
+	proxyTestOk: "HTTP {status}，耗时 {ms} ms",
+	usage: "用量",
+	usageLabel: "订阅用量",
+	refreshNow: "立即刷新",
+	usageSettings: "用量设置",
+	pin: "固定到输入框",
+	unpin: "从输入框取消固定",
+	otherProviders: "另外 {count} 个",
+	noticeEmpty: "{provider} {window} 预计 {time} 用尽",
+	noticeOut: "{provider} {window} 已达上限",
+	noticeSwitched: "{provider} 已达上限，已切换到 {account}",
+	dismiss: "关闭",
+	generating: "正在生成图片…",
+	generatingVideo: "正在生成视频…",
+	image: "图片",
+	imageClose: "关闭",
+	imageLoadFailed: "重试",
+	imageLoading: "加载中…",
+	imagePreview: "图片预览",
+	speed: "速度",
+	speedStandard: "标准",
+	speedStandardDescription: "默认速度",
+	speedFast: "快速",
+	speedFastDescription: "约 1.5 倍速度，消耗更多用量",
+	videoLoadFailed: "视频加载失败：{message}",
+	videoLoading: "视频加载中…",
+	viewImage: "查看图片",
+	viewImageNamed: "查看 {name}",
+	commandFast: "切换 Codex 速度档（标准/快速）",
+	commandFastUnavailable: "当前模型不支持快速档；/fast 仅对目录声明了 fast tier 的 Codex 模型可用"
+};
+/** Fill `{name}` placeholders. */
+function format(text, params = {}) {
+	return text.replace(/\{(\w+)\}/g, (match, key) => key in params ? String(params[key]) : match);
+}
+
+//#endregion
+//#region src/client/styles.ts
+/**
+* One stylesheet for every surface, prefixed `dsm-`, colored only through
+* `--dsw-alias-*` tokens. Card and button values copy the Models page
+* (`dsh-client-ui-settings-models` 0.2.2-rc.1); meters follow
+* design/usage-draft.html v3.
+*/
+const css = `
+.dsm-sub { display: flex; flex-direction: column; gap: 8px; min-width: 0; font-size: 13px; line-height: 20px; color: var(--dsw-alias-label-primary); }
+.dsm-sub .dsm-card-error { color: var(--dsw-alias-state-error-primary); font-size: 12px; }
+.dsm-num, .dsm-w, .dsm-mini, .dsm-fresh { font-variant-numeric: tabular-nums; }
+
+.dsm-btn { box-sizing: border-box; height: 28px; padding: 0 10px; border-radius: var(--dsw-radius-sm); font: inherit; font-size: 12px; line-height: 18px;
+  cursor: pointer; border: .5px solid var(--dsw-alias-border-l3); background: transparent; color: var(--dsw-alias-label-primary);
+  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
+.dsm-btn:hover:not(:disabled) { background: var(--dsw-alias-interactive-bg-hover-solid, var(--dsw-alias-interactive-bg-hover)); }
+.dsm-btn:disabled { opacity: .4; cursor: default; }
+.dsm-btn:focus-visible, .dsm-fold:focus-visible, .dsm-seg button:focus-visible, .dsm-switch:focus-visible, .dsm-chip:focus-visible, .dsm-gauge:focus-visible, .dsm-tab:focus-visible {
+  box-shadow: 0 0 0 2px var(--dsw-focus-ring-color, var(--dsw-alias-state-business-primary)); outline: none; }
+.dsm-btn.dsm-primary { background: var(--dsw-alias-button-primary-fill, var(--dsw-alias-label-primary)); color: var(--dsw-alias-label-primary-foreground, var(--dsw-alias-bg-base)); border-color: transparent; }
+.dsm-btn.dsm-primary:hover:not(:disabled) { background: var(--dsw-alias-button-primary-hover, var(--dsw-alias-label-primary)); }
+.dsm-btn.dsm-ghost { border-color: transparent; color: var(--dsw-alias-label-secondary); }
+.dsm-btn.dsm-danger { border-color: transparent; color: var(--dsw-alias-state-error-primary); }
+.dsm-btn.dsm-danger:hover:not(:disabled) { background: var(--dsw-alias-interactive-bg-hover-danger, var(--dsw-alias-interactive-bg-hover)); }
+.dsm-btn.dsm-icon { width: 28px; padding: 0; justify-content: center; border-color: transparent; color: var(--dsw-alias-label-secondary); }
+.dsm-btn.dsm-icon.dsm-sm { width: 24px; height: 24px; }
+.dsm-spinning svg { animation: dsm-spin .7s linear infinite; }
+@keyframes dsm-spin { to { transform: rotate(360deg); } }
+
+.dsm-acct { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
+.dsm-acct-head { display: flex; align-items: center; gap: 6px; min-width: 0; color: var(--dsw-alias-label-secondary); }
+.dsm-acct-name { color: var(--dsw-alias-label-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
+.dsm-tag { flex: none; font-size: 11px; line-height: 16px; padding: 0 5px; border-radius: var(--dsw-radius-xs); border: .5px solid var(--dsw-alias-border-l3); color: var(--dsw-alias-label-secondary); }
+.dsm-glyph { display: inline-flex; flex: none; color: var(--dsw-alias-label-tertiary); }
+.dsm-glyph.dsm-star { color: var(--dsw-alias-state-warn-primary); }
+.dsm-glyph.dsm-live { color: var(--dsw-alias-state-business-primary); }
+.dsm-fresh { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--dsw-alias-label-tertiary); white-space: nowrap; flex: none; }
+.dsm-fresh.dsm-stale { color: var(--dsw-alias-state-warn-primary); }
+.dsm-live-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--dsw-alias-state-success-primary); }
+
+/* Fixed label, value and time columns, so bars line up across accounts and providers. */
+.dsm-wins { display: grid; grid-template-columns: fit-content(132px) minmax(48px, 1fr) 40px 92px; column-gap: 12px; row-gap: 6px; align-items: center; }
+.dsm-w { display: contents; font-size: 12px; line-height: 18px; }
+.dsm-wl { color: var(--dsw-alias-label-tertiary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; line-height: 18px; }
+.dsm-wv { text-align: right; font-weight: 600; font-size: 13px; line-height: 18px; color: var(--dsw-alias-label-primary); }
+.dsm-wt { text-align: right; color: var(--dsw-alias-label-tertiary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; line-height: 18px; }
+.dsm-w.dsm-tight .dsm-wv, .dsm-w.dsm-tight .dsm-wt { color: var(--dsw-alias-state-warn-primary); }
+.dsm-w.dsm-over .dsm-wv, .dsm-w.dsm-over .dsm-wt, .dsm-w.dsm-out .dsm-wv, .dsm-w.dsm-out .dsm-wt { color: var(--dsw-alias-state-error-primary); }
+
+.dsm-bar { position: relative; display: block; border-radius: 3px; background: color-mix(in srgb, var(--dsw-alias-label-primary) 9%, transparent); color: var(--dsw-alias-state-success-primary); }
+.dsm-fill { position: absolute; top: 0; bottom: 0; left: 0; border-radius: inherit; background: currentColor; transition: width .5s cubic-bezier(.16, 1, .3, 1); }
+.dsm-proj { position: absolute; top: 0; bottom: 0; background: repeating-linear-gradient(90deg, transparent 0 2px, color-mix(in srgb, currentColor 55%, transparent) 2px 3px); }
+.dsm-bar.dsm-tight { color: var(--dsw-alias-state-warn-primary); }
+.dsm-bar.dsm-over, .dsm-bar.dsm-out { color: var(--dsw-alias-state-error-primary); }
+.dsm-bar.dsm-unknown .dsm-fill { display: none; }
+
+.dsm-minis { display: inline-flex; gap: 14px; flex: none; }
+.dsm-mini { display: inline-grid; grid-template-columns: auto 32px 34px; align-items: center; gap: 5px; font-size: 11px; line-height: 16px; }
+.dsm-mini i { font-style: normal; color: var(--dsw-alias-label-tertiary); max-width: 96px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dsm-mini b { font-weight: 500; text-align: right; color: var(--dsw-alias-label-primary); font-size: 12px; }
+.dsm-mini.dsm-tight b { color: var(--dsw-alias-state-warn-primary); }
+.dsm-mini.dsm-over b, .dsm-mini.dsm-out b { color: var(--dsw-alias-state-error-primary); }
+
+.dsm-fold { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; width: 100%; min-height: 32px; padding: 0 6px 0 2px;
+  border: 0; background: none; text-align: left; cursor: pointer; border-radius: var(--dsw-radius-md); font: inherit; font-size: 12px; color: var(--dsw-alias-label-secondary); }
+.dsm-fold:hover { background: var(--dsw-alias-interactive-bg-hover); }
+.dsm-fold .dsm-chev { color: var(--dsw-alias-label-tertiary); transition: transform .2s cubic-bezier(.16, 1, .3, 1); }
+.dsm-fold[aria-expanded="true"] .dsm-chev { transform: rotate(90deg); }
+.dsm-fold-name { display: flex; align-items: center; gap: 6px; min-width: 0; }
+.dsm-fold-name > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dsm-fold-body { display: flex; flex-direction: column; gap: 8px; padding: 2px 0 4px 24px; min-width: 0; }
+
+.dsm-foot { display: flex; align-items: center; gap: 6px; }
+.dsm-muted { color: var(--dsw-alias-label-tertiary); font-size: 12px; line-height: 18px; margin: 0; display: inline-flex; align-items: center; gap: 6px; }
+.dsm-alert { display: flex; gap: 8px; align-items: center; padding: 6px 6px 6px 10px; border-radius: var(--dsw-radius-lg);
+  background: color-mix(in srgb, var(--dsw-alias-state-error-primary) 10%, transparent); }
+.dsm-alert > svg { color: var(--dsw-alias-state-error-primary); }
+.dsm-alert .dsm-btn { margin-left: auto; }
+
+.dsm-panel { border-radius: var(--dsw-radius-lg); background: var(--dsw-alias-bg-module-platform, var(--dsw-alias-bg-layer-2)); padding: 2px 12px 12px; display: flex; flex-direction: column; gap: 8px; }
+.dsm-tabs { display: flex; gap: 2px; border-bottom: .5px solid var(--dsw-alias-border-l2); margin: 0 -12px; padding: 0 8px; }
+.dsm-tab { border: 0; background: none; padding: 9px 8px 8px; font: inherit; font-size: 13px; color: var(--dsw-alias-label-tertiary); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -.5px; }
+.dsm-tab[aria-selected="true"] { color: var(--dsw-alias-label-primary); border-bottom-color: var(--dsw-alias-label-primary); }
+.dsm-row { display: flex; align-items: center; gap: 10px; min-height: 36px; font-size: 13px; }
+.dsm-row + .dsm-row { border-top: .5px solid var(--dsw-alias-border-l1); }
+.dsm-grow { flex: 1; min-width: 0; display: flex; align-items: center; gap: 6px; }
+.dsm-grow > .dsm-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
+.dsm-note { color: var(--dsw-alias-label-tertiary); font-size: 12px; }
+.dsm-list { max-height: 280px; overflow-y: auto; }
+.dsm-switch { width: 30px; height: 18px; border-radius: 9px; background: var(--dsw-alias-state-idle-primary); border: 0; position: relative; cursor: pointer; flex: none; padding: 0; }
+.dsm-switch::after { content: ""; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: transform .2s cubic-bezier(.16, 1, .3, 1); }
+.dsm-switch[aria-checked="true"] { background: var(--dsw-alias-state-success-primary); }
+.dsm-switch[aria-checked="true"]::after { transform: translateX(12px); }
+.dsm-switch:disabled { opacity: .4; cursor: default; }
+.dsm-input { box-sizing: border-box; height: 30px; width: 100%; border-radius: var(--dsw-radius-md); border: .5px solid var(--dsw-alias-border-l3);
+  background: var(--dsw-alias-bg-layer-1); color: var(--dsw-alias-label-primary); padding: 0 10px; font: inherit; font-size: 13px; }
+.dsm-select { height: 26px; border-radius: var(--dsw-radius-sm); border: .5px solid var(--dsw-alias-border-l3); background: var(--dsw-alias-bg-layer-1);
+  color: var(--dsw-alias-label-primary); font: inherit; font-size: 12px; padding: 0 4px; max-width: 160px; }
+.dsm-panel-foot { display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding-top: 4px; }
+.dsm-panel-foot .dsm-card-error { margin-right: auto; }
+.dsm-seg { display: inline-flex; padding: 2px; border-radius: 7px; background: color-mix(in srgb, var(--dsw-alias-label-primary) 9%, transparent); gap: 2px; flex: none; }
+.dsm-seg button { border: 0; background: transparent; height: 22px; padding: 0 9px; border-radius: 5px; font: inherit; font-size: 12px; color: var(--dsw-alias-label-secondary); cursor: pointer; }
+.dsm-seg button[aria-pressed="true"] { background: var(--dsw-alias-bg-layer-1); color: var(--dsw-alias-label-primary); box-shadow: 0 1px 2px #0000002e; }
+.dsm-chips { display: flex; flex-wrap: wrap; gap: 6px; }
+.dsm-chip { height: 26px; padding: 0 10px 0 8px; border-radius: 13px; border: .5px solid var(--dsw-alias-border-l3); background: transparent; font: inherit; font-size: 12px;
+  cursor: pointer; display: inline-flex; align-items: center; gap: 5px; color: var(--dsw-alias-label-secondary); }
+.dsm-chip[aria-pressed="true"] { background: var(--dsw-alias-label-primary); color: var(--dsw-alias-bg-base); border-color: transparent; }
+.dsm-chip:disabled { opacity: .4; cursor: default; }
+
+.dsm-signin { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; border-radius: var(--dsw-radius-lg); background: var(--dsw-alias-bg-module-platform, var(--dsw-alias-bg-layer-2)); }
+.dsm-steps { display: flex; gap: 16px; margin: 0; padding: 0; list-style: none; font-size: 12px; flex-wrap: wrap; }
+.dsm-steps li { display: inline-flex; gap: 6px; align-items: center; color: var(--dsw-alias-label-tertiary); }
+.dsm-steps li[data-s="done"] { color: var(--dsw-alias-state-success-primary); }
+.dsm-steps li[data-s="now"] { color: var(--dsw-alias-label-primary); }
+.dsm-spin { width: 12px; height: 12px; border-radius: 50%; border: 1.5px solid var(--dsw-alias-border-l3); border-top-color: currentColor; animation: dsm-spin .8s linear infinite; flex: none; box-sizing: border-box; }
+.dsm-code { font: 600 20px/28px var(--dsw-font-family-mono, ui-monospace, Menlo, monospace); letter-spacing: .12em; padding: 4px 12px; border-radius: var(--dsw-radius-md);
+  background: var(--dsw-alias-bg-layer-1); border: .5px solid var(--dsw-alias-border-l2); }
+.dsm-fallback summary { cursor: pointer; color: var(--dsw-alias-label-tertiary); font-size: 12px; list-style: none; display: inline-flex; gap: 4px; align-items: center; }
+.dsm-fallback summary::-webkit-details-marker { display: none; }
+.dsm-fallback[open] summary { margin-bottom: 6px; }
+
+.dsm-footer-block { margin-top: 18px; padding-top: 14px; border-top: .5px solid var(--dsw-alias-border-l2); display: flex; flex-direction: column; max-width: 720px; }
+.dsm-footer-block h3 { margin: 0 0 4px; font-size: 14px; font-weight: 500; line-height: 22px; color: var(--dsw-alias-label-primary); }
+.dsm-footer-block .dsm-row { min-height: 40px; color: var(--dsw-alias-label-primary); }
+
+.dsm-gauge-slot { position: relative; display: inline-flex; }
+.dsm-gauge { display: inline-flex; align-items: center; gap: 10px; height: 24px; padding: 0 8px; border-radius: 12px; border: 0; background: transparent; cursor: pointer;
+  color: var(--dsw-alias-label-secondary); font: inherit; font-size: 12px; }
+.dsm-gauge:hover, .dsm-gauge[aria-expanded="true"] { background: var(--dsw-alias-interactive-bg-hover); }
+.dsm-gp { display: inline-flex; align-items: center; gap: 8px; }
+.dsm-gp + .dsm-gp { padding-left: 10px; border-left: .5px solid var(--dsw-alias-border-l3); }
+.dsm-gp-name { color: var(--dsw-alias-label-primary); }
+.dsm-gp .dsm-minis { gap: 10px; }
+.dsm-gp .dsm-mini { grid-template-columns: auto 26px auto; }
+
+.dsm-pop { position: fixed; z-index: 1000; width: 420px; max-width: calc(100vw - 20px); box-sizing: border-box; background: var(--dsw-specific-menu, var(--dsw-alias-bg-overlay));
+  backdrop-filter: var(--dsw-menu-backdrop-filter, none); border-radius: var(--dsw-radius-xl); box-shadow: var(--dsw-elevation-panel, 0 12px 32px #0006);
+  border: .5px solid var(--dsw-alias-border-l2); padding: 6px; display: flex; flex-direction: column; color: var(--dsw-alias-label-primary);
+  text-align: left; font-size: 13px; line-height: 20px; max-height: min(560px, calc(100vh - 24px)); overflow: hidden auto; }
+.dsm-pop-head { display: flex; align-items: center; gap: 2px; padding: 2px 2px 6px 8px; }
+.dsm-pop-head b { font-weight: 600; font-size: 13px; margin-right: auto; }
+.dsm-psec { border-top: .5px solid var(--dsw-alias-border-l2); padding: 4px 0; }
+.dsm-psec-head { display: flex; align-items: center; gap: 2px; }
+.dsm-psec-head .dsm-fold { flex: 1; }
+.dsm-psec-name { color: var(--dsw-alias-label-primary); font-weight: 500; font-size: 13px; }
+.dsm-psec .dsm-fold-body { padding: 0 8px 6px 26px; gap: 6px; }
+.dsm-psec .dsm-fold-body .dsm-fold-body { padding: 4px 0 0; }
+.dsm-psec .dsm-fold-body .dsm-fold { margin-left: -24px; width: calc(100% + 24px); }
+.dsm-pacct { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
+.dsm-pacct .dsm-acct-head { font-size: 12px; line-height: 18px; }
+.dsm-others { padding-bottom: 0; }
+.dsm-others .dsm-psec { border-top: 0; padding: 0 0 0 16px; }
+.dsm-gauge > svg { color: var(--dsw-alias-label-secondary); }
+.dsm-pin { color: var(--dsw-alias-label-tertiary); }
+.dsm-pin[aria-pressed="true"] { color: var(--dsw-alias-label-primary); }
+
+.dsm-notice { display: flex; gap: 8px; align-items: center; padding: 6px 6px 6px 12px; font-size: 13px; line-height: 20px; color: var(--dsw-alias-label-primary);
+  background: var(--dsw-specific-menu, var(--dsw-alias-bg-overlay)); border-radius: var(--dsw-radius-lg); border: .5px solid var(--dsw-alias-border-l2);
+  box-shadow: var(--dsw-elevation-panel, 0 12px 32px #0006); animation: dsm-drop .45s cubic-bezier(.16, 1, .3, 1); }
+.dsm-notice > svg { color: var(--dsw-alias-state-warn-primary); }
+.dsm-notice.dsm-err > svg { color: var(--dsw-alias-state-error-primary); }
+.dsm-notice-host { position: fixed; top: 52px; right: 20px; z-index: 1000; max-width: calc(100vw - 40px); }
+@keyframes dsm-drop { from { opacity: 0; transform: translateY(-8px); filter: blur(4px); } }
+
+.dsh-subscription-speed button:hover:not(:disabled) { --dsh-subscription-speed-hover: var(--dsw-alias-interactive-bg-hover); }
+.dsh-subscription-speed button:active:not(:disabled) { --dsh-subscription-speed-hover: var(--dsw-alias-interactive-bg-active); }
+.dsh-subscription-speed button:disabled { opacity: .4; cursor: default; }
+.dsh-subscription-speed button:focus-visible { outline: var(--dsw-focus-ring-width, 2px) solid var(--dsw-focus-ring-color, var(--dsw-alias-state-business-primary)); outline-offset: 2px; }
+
+@media (prefers-reduced-motion: reduce) { .dsm-sub *, .dsm-pop *, .dsm-notice, .dsm-fill { animation: none !important; transition: none !important; } }
+@media (max-width: 640px) {
+  .dsm-wins { column-gap: 8px; grid-template-columns: fit-content(96px) minmax(40px, 1fr) 36px 84px; }
+  .dsm-minis { gap: 8px; } .dsm-mini { grid-template-columns: auto 22px 32px; } .dsm-mini i { max-width: 56px; }
+  .dsm-gp-name { display: none; }
+  .dsm-footer-block .dsm-row { flex-wrap: wrap; padding: 6px 0; }
+}
+`;
+
+//#endregion
+//#region src/client/rpc.ts
+/** Every provider this plugin can route, in Models-page order. Names and metering come from `status`. */
+const PROVIDERS = [
+	"codex",
+	"claude",
+	"grok",
+	"copilot",
+	"antigravity"
+];
+/** Providers that read usage with a pasted key, in Usage-page order. Mirrors the Host's `KEY_PROVIDER_IDS`. */
+const KEY_PROVIDERS = [
+	"zai",
+	"ollama-cloud",
+	"kimi"
+];
+const USAGE_PROVIDERS = [...PROVIDERS, ...KEY_PROVIDERS];
+const isUsageProviderId = (value) => typeof value === "string" && USAGE_PROVIDERS.includes(value);
+const isProviderId = (value) => typeof value === "string" && PROVIDERS.includes(value);
+/** The provider's short name from `status`, else its id. */
+const shortName = (status, provider) => status?.providers[provider]?.shortName ?? provider;
+/** Whether the Host reports usage for this provider. */
+const isMetered = (status, provider) => status?.providers[provider]?.metered === true;
+/** The Host's business error text. */
+var SubscriptionsAuthError = class extends Error {};
+/**
+* Call one endpoint and unwrap its business result.
+* @throws SubscriptionsAuthError with the Host's message on transport or business failure.
+*/
+async function call(rpc, endpoint, payload) {
+	let result;
+	try {
+		result = await rpc.call("/api", `subscriptions-auth.${endpoint}`, payload);
+	} catch (error) {
+		throw new SubscriptionsAuthError(error instanceof Error ? error.message : String(error));
+	}
+	if (!result.ok) throw new SubscriptionsAuthError(result.error.message);
+	return result.value;
+}
+
+//#endregion
+//#region src/client/store.ts
+const POLL_MS = 5 * 6e4;
+const usageKey = (provider, account) => `${provider}/${account}`;
+var SubscriptionsStore = class {
+	snapshot = {
+		status: void 0,
+		statusError: void 0,
+		usage: /* @__PURE__ */ new Map(),
+		refreshing: /* @__PURE__ */ new Set()
+	};
+	listeners = /* @__PURE__ */ new Set();
+	lastRevision = -1;
+	statusInFlight;
+	timer;
+	/** The session the gauge is showing, so `status` reports its serving account. */
+	sessionId;
+	constructor(rpc) {
+		this.rpc = rpc;
+	}
+	getSnapshot = () => this.snapshot;
+	subscribe = (listener) => {
+		this.listeners.add(listener);
+		if (this.listeners.size === 1) this.start();
+		return () => {
+			this.listeners.delete(listener);
+			if (this.listeners.size === 0) this.stop();
+		};
+	};
+	/** Report the session whose serving account the `status` read should name. */
+	focusSession(sessionId) {
+		if (this.sessionId === sessionId) return;
+		this.sessionId = sessionId;
+		this.refreshStatus();
+	}
+	/** Re-read login status; usage follows when the Host's revision moved. */
+	refreshStatus() {
+		this.statusInFlight ??= this.readStatus().finally(() => {
+			this.statusInFlight = void 0;
+		});
+		return this.statusInFlight;
+	}
+	/** Read every signed-in account's usage under one reason. */
+	async refreshUsage(reason, only) {
+		const status = this.snapshot.status;
+		if (status === void 0) return;
+		await Promise.all(USAGE_PROVIDERS.filter((p) => (only === void 0 || p === only) && isMetered(status, p)).flatMap((provider) => (status.providers[provider]?.accounts ?? []).map((account) => this.readUsage(provider, account.key, reason))));
+	}
+	async readStatus() {
+		try {
+			const status = await call(this.rpc, "status", this.sessionId === void 0 ? {} : { sessionId: this.sessionId });
+			const known = new Set(USAGE_PROVIDERS.flatMap((p) => (status.providers[p]?.accounts ?? []).map((a) => usageKey(p, a.key))));
+			const usage = new Map([...this.snapshot.usage].filter(([key]) => known.has(key)));
+			this.publish({
+				...this.snapshot,
+				status,
+				statusError: void 0,
+				usage
+			});
+			if (status.usageRevision !== this.lastRevision) {
+				this.lastRevision = status.usageRevision;
+				await this.refreshUsage("poll");
+			}
+		} catch (error) {
+			this.publish({
+				...this.snapshot,
+				statusError: error instanceof Error ? error.message : String(error)
+			});
+		}
+	}
+	async readUsage(provider, account, reason) {
+		const key = usageKey(provider, account);
+		if (!this.snapshot.usage.has(key)) this.setUsage(key, { kind: "loading" });
+		this.publish({
+			...this.snapshot,
+			refreshing: new Set([...this.snapshot.refreshing, key])
+		});
+		try {
+			const usage = await call(this.rpc, "usage", {
+				provider,
+				account,
+				reason
+			});
+			this.setUsage(key, {
+				kind: "ready",
+				usage,
+				receivedAt: Date.now()
+			});
+		} catch (error) {
+			if (this.snapshot.usage.get(key)?.kind !== "ready") this.setUsage(key, {
+				kind: "error",
+				message: error instanceof Error ? error.message : String(error)
+			});
+		} finally {
+			const refreshing = new Set(this.snapshot.refreshing);
+			refreshing.delete(key);
+			this.publish({
+				...this.snapshot,
+				refreshing
+			});
+		}
+	}
+	setUsage(key, entry) {
+		const usage = new Map(this.snapshot.usage);
+		usage.set(key, entry);
+		this.publish({
+			...this.snapshot,
+			usage
+		});
+	}
+	publish(next) {
+		this.snapshot = next;
+		for (const listener of this.listeners) listener();
+	}
+	onVisibility = () => {
+		if (document.visibilityState === "visible") this.refreshStatus();
+	};
+	start() {
+		this.refreshStatus();
+		this.timer = setInterval(() => {
+			if (document.visibilityState !== "visible") return;
+			this.refreshStatus().then(() => this.refreshUsage("poll"));
+		}, POLL_MS);
+		document.addEventListener("visibilitychange", this.onVisibility);
+	}
+	stop() {
+		if (this.timer !== void 0) clearInterval(this.timer);
+		this.timer = void 0;
+		document.removeEventListener("visibilitychange", this.onVisibility);
+	}
+};
+/** The account a provider is using now: the one that served last, else the default, else the first. */
+function activeAccountKey(status) {
+	if (status === void 0 || status.accounts.length === 0) return void 0;
+	const served = status.servingAccount;
+	if (served !== void 0 && status.accounts.some((a) => a.key === served)) return served;
+	return (status.accounts.find((a) => a.isDefault) ?? status.accounts[0])?.key;
+}
+/** The active account shown in full, and the others that fold behind one row. */
+function splitAccounts(status) {
+	const key = activeAccountKey(status);
+	const active = status.accounts.find((a) => a.key === key);
+	if (active === void 0) return void 0;
+	return {
+		active,
+		rest: status.accounts.filter((a) => a !== active)
+	};
+}
+
+//#endregion
+//#region src/client/prefs.ts
+const DEFAULT_PREFS = {
+	composer: true,
+	pinned: [],
+	display: "left",
+	paceWarnings: true,
+	writable: false
+};
+/** Narrow the namespace section's `usage` field, falling back field by field. */
+function parsePrefs(section, writable) {
+	const usage = section !== null && typeof section === "object" && "usage" in section ? section.usage : void 0;
+	if (usage === null || typeof usage !== "object") return {
+		...DEFAULT_PREFS,
+		writable
+	};
+	const read = (key) => key in usage ? usage[key] : void 0;
+	const composer = read("composer");
+	const legacyGauge = read("gauge");
+	const display = read("display");
+	const pinned = read("pinned");
+	const pace$1 = read("paceWarnings");
+	return {
+		composer: typeof composer === "boolean" ? composer : legacyGauge !== "off",
+		pinned: Array.isArray(pinned) ? pinned.filter(isUsageProviderId) : [],
+		display: display === "used" ? "used" : "left",
+		paceWarnings: typeof pace$1 === "boolean" ? pace$1 : true,
+		writable
+	};
+}
+var PrefsStore = class {
+	snapshot = DEFAULT_PREFS;
+	listeners = /* @__PURE__ */ new Set();
+	unsubscribe;
+	form;
+	getSnapshot = () => this.snapshot;
+	subscribe = (listener) => {
+		this.listeners.add(listener);
+		return () => {
+			this.listeners.delete(listener);
+		};
+	};
+	/** Bind the form once the settings service is available; returns the unbinder. */
+	bind(form) {
+		this.form = form;
+		const sync = () => {
+			const view = form.getSnapshot();
+			if (view.status !== "ready") return;
+			this.publish(parsePrefs(view.value, view.writable));
+		};
+		this.unsubscribe = form.subscribe(sync);
+		sync();
+		return () => {
+			this.unsubscribe?.();
+			this.form = void 0;
+		};
+	}
+	/** Change some preferences; the shown value updates at once and settles on the Host's answer. */
+	async set(patch) {
+		const next = {
+			...this.snapshot,
+			...patch
+		};
+		this.publish(next);
+		if (this.form === void 0) return false;
+		const ops = Object.entries(patch).map(([key, value]) => ({
+			op: "set",
+			path: ["usage", key],
+			value
+		}));
+		ops.push({
+			op: "unset",
+			path: ["usage", "gauge"]
+		});
+		return this.form.mutate(ops);
+	}
+	togglePinned(provider) {
+		const pinned = this.snapshot.pinned.includes(provider) ? this.snapshot.pinned.filter((p) => p !== provider) : [...this.snapshot.pinned, provider];
+		return this.set({ pinned });
+	}
+	publish(next) {
+		this.snapshot = next;
+		for (const listener of this.listeners) listener();
+	}
+};
+
+//#endregion
+//#region src/usage/pace.ts
+/** Below this share of elapsed window a burst says little about the whole window. */
+const MIN_FORECAST_ELAPSED = .2;
+/** Below this usage the projection is noise. */
+const MIN_FORECAST_USED_PERCENT = 3;
+/** Projected use above this percent turns a window `tight`. */
+const TIGHT_PROJECTED_PERCENT = 85;
+/**
+* Compute the pace of one window at `now`.
+* @param window - the provider-reported window.
+* @param now - epoch milliseconds.
+* @returns the pace; `elapsed` is the share of the window passed, 0 to 1.
+*/
+function pace(window$1, now) {
+	const used = window$1.usedPercent;
+	if (!Number.isFinite(used)) return { state: "unknown" };
+	const usedPercent = Math.max(0, Math.min(100, used));
+	if (usedPercent >= 100) return {
+		state: "out",
+		usedPercent
+	};
+	const { durationMs, resetsAt } = window$1;
+	if (durationMs === void 0 || resetsAt === void 0 || !(durationMs > 0) || !Number.isFinite(resetsAt)) return {
+		state: "calm",
+		usedPercent
+	};
+	const elapsed = Math.min(1, Math.max(0, 1 - (resetsAt - now) / durationMs));
+	if (elapsed < MIN_FORECAST_ELAPSED || usedPercent < MIN_FORECAST_USED_PERCENT) return {
+		state: "calm",
+		usedPercent,
+		elapsed
+	};
+	const projectedPercent = usedPercent / elapsed;
+	if (projectedPercent > 100) {
+		const ratePerMs = usedPercent / (elapsed * durationMs);
+		return {
+			state: "over",
+			usedPercent,
+			elapsed,
+			projectedPercent,
+			emptyAt: now + (100 - usedPercent) / ratePerMs
+		};
+	}
+	if (projectedPercent > TIGHT_PROJECTED_PERCENT) return {
+		state: "tight",
+		usedPercent,
+		elapsed,
+		projectedPercent
+	};
+	return {
+		state: "calm",
+		usedPercent,
+		elapsed,
+		projectedPercent
+	};
+}
+/**
+* The percent a meter shows.
+* @param window - the window to show.
+* @param display - left or used.
+* @returns an integer percent, or undefined when the provider reported none.
+*/
+function displayPercent(window$1, display) {
+	if (!Number.isFinite(window$1.usedPercent)) return void 0;
+	const used = Math.round(Math.max(0, Math.min(100, window$1.usedPercent)));
+	return display === "left" ? 100 - used : used;
+}
+
+//#endregion
+//#region src/client/meter.tsx
+/** Translate with placeholders. */
+function tf(t, key, params) {
+	return format(t(key), params);
+}
+const PATHS = {
+	refresh: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M13.5 8a5.5 5.5 0 1 1-1.6-3.9" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M13.5 2.5v3h-3" })] }),
+	alert: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 1.8 15 14H1z" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 6.3v3.4M8 11.8v.01" })] }),
+	check: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m3.5 8.3 3 3 6-6.6" }),
+	star: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "m8 2 1.8 3.8 4.2.5-3.1 2.9.8 4.1L8 11.3 4.3 13.3l.8-4.1L2 6.3l4.2-.5z",
+		fill: "currentColor"
+	}),
+	bolt: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M9 1.8 3.5 9H8l-1 5.2L12.5 7H8z",
+		fill: "currentColor",
+		stroke: "none"
+	}),
+	pin: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M6 2.5h4l-.6 4 2.1 2.2v1H4.5v-1l2.1-2.2z" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 9.7v3.8" })] }),
+	pinFilled: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M6 2.5h4l-.6 4 2.1 2.2v1H4.5v-1l2.1-2.2z",
+		fill: "currentColor"
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 9.7v3.8" })] }),
+	gear: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+		cx: "8",
+		cy: "8",
+		r: "2.2"
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M8 1.8v1.6M8 12.6v1.6M1.8 8h1.6M12.6 8h1.6M3.6 3.6l1.1 1.1M11.3 11.3l1.1 1.1M3.6 12.4l1.1-1.1M11.3 4.7l1.1-1.1" })] }),
+	ext: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M9 3h4v4M13 3 7.5 8.5M12 9.5V13H3V4h3.5" }),
+	copy: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+		x: "5",
+		y: "5",
+		width: "8.5",
+		height: "8.5",
+		rx: "1.5"
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M11 5V3.5A1.5 1.5 0 0 0 9.5 2h-6A1.5 1.5 0 0 0 2 3.5v6A1.5 1.5 0 0 0 3.5 11H5" })] }),
+	x: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m4 4 8 8M12 4l-8 8" }),
+	right: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m6 4 4 4-4 4" }),
+	down: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m5 6.5 3 3 3-3" }),
+	meter: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M2.5 11a5.5 5.5 0 0 1 11 0" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m8 11 2.6-3.2" })] }),
+	sparkle: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		d: "M8 1.5 9.4 6.6 14.5 8 9.4 9.4 8 14.5 6.6 9.4 1.5 8 6.6 6.6z",
+		fill: "currentColor",
+		stroke: "none"
+	})
+};
+/** One 16-unit stroke icon. */
+function Icon({ name, size = 14, className }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+		className,
+		width: size,
+		height: size,
+		viewBox: "0 0 16 16",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 1.5,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		"aria-hidden": "true",
+		style: {
+			flex: "none",
+			display: "block"
+		},
+		children: PATHS[name]
+	});
+}
+const D = 24 * 36e5;
+/** "3h 6m", "2d 12h", "42m". */
+function shortDuration(ms) {
+	const total = Math.max(1, Math.round(ms / 6e4));
+	const days = Math.floor(total / 1440);
+	const hours = Math.floor(total % 1440 / 60);
+	const minutes = total % 60;
+	if (days > 0) return hours > 0 ? `${days}d ${hours}h` : `${days}d`;
+	if (hours > 0) return minutes > 0 ? `${hours}h ${minutes}m` : `${hours}h`;
+	return `${Math.max(1, minutes)}m`;
+}
+/**
+* A short point in time in the browser's locale: "6:04 PM" today, "Wed" within
+* the week, "12 Nov" beyond. The day alone keeps the time column narrow; the
+* tooltip carries the exact reset time.
+*/
+function clockTime(at, now) {
+	const date = new Date(at);
+	if (date.toDateString() === new Date(now).toDateString()) return date.toLocaleTimeString(void 0, {
+		hour: "numeric",
+		minute: "2-digit"
+	});
+	if (Math.abs(at - now) < 6 * D) return date.toLocaleDateString(void 0, { weekday: "short" });
+	return date.toLocaleDateString(void 0, {
+		day: "numeric",
+		month: "short"
+	});
+}
+/** Weekday and time, for tooltips. */
+function fullTime(at) {
+	return new Date(at).toLocaleString(void 0, {
+		weekday: "short",
+		hour: "numeric",
+		minute: "2-digit"
+	});
+}
+/** The window's length as "5h", "7d" or "30d", rounded to a whole unit; undefined when unknown. */
+function lengthLabel(durationMs) {
+	if (durationMs === void 0 || !Number.isFinite(durationMs) || durationMs <= 0) return void 0;
+	const hours = Math.round(durationMs / 36e5);
+	if (hours < 1) return `${Math.max(1, Math.round(durationMs / 6e4))}m`;
+	return hours < 48 ? `${hours}h` : `${Math.round(hours / 24)}d`;
+}
+/** "5h", "7d", "30d": the window's own length, else its kind, else "limit". */
+function kindLabel(t, kind, durationMs) {
+	const length = lengthLabel(durationMs);
+	if (length !== void 0) return length;
+	return kind === "session" ? t("window5h") : kind === "weekly" ? t("window7d") : t("windowOther");
+}
+/** The length label, with a model scope when the window has one. A per-model quota is named by its scope alone. */
+function windowLabel(t, window$1) {
+	if (window$1.scope === void 0) return kindLabel(t, window$1.kind, window$1.durationMs);
+	return window$1.kind === "other" ? window$1.scope : `${kindLabel(t, window$1.kind, window$1.durationMs)} ${window$1.scope}`;
+}
+const FAMILY_NAMES = {
+	gemini: "Gemini",
+	claude: "Claude",
+	gpt: "GPT"
+};
+/** "claude-opus-4-6-thinking" becomes "Claude"; "tab_flash_lite" becomes "Tab". */
+function modelFamily(id) {
+	const head = id.split(/[-_]/)[0] ?? id;
+	return FAMILY_NAMES[head.toLowerCase()] ?? head.charAt(0).toUpperCase() + head.slice(1);
+}
+/**
+* Per-model windows that report the same usage and reset share one quota pool
+* (Antigravity reports one window per model), so they merge into one row named
+* by model family. A per-model window at 0% with no reset carries no information
+* and is hidden. Unscoped windows pass through unchanged.
+*/
+function shownWindows(windows) {
+	const out = [];
+	const groups = /* @__PURE__ */ new Map();
+	for (const window$1 of windows ?? []) {
+		if (window$1.scope === void 0 || window$1.kind !== "other") {
+			out.push(window$1);
+			continue;
+		}
+		if (window$1.resetsAt === void 0 && window$1.usedPercent === 0) continue;
+		const minute = window$1.resetsAt === void 0 ? "" : String(Math.round(window$1.resetsAt / 6e4));
+		const key = `${Math.round(window$1.usedPercent)}/${minute}`;
+		const group = groups.get(key);
+		if (group === void 0) {
+			const entry = {
+				window: window$1,
+				models: [window$1.scope]
+			};
+			groups.set(key, entry);
+		} else group.models.push(window$1.scope);
+	}
+	for (const { window: window$1, models } of groups.values()) {
+		const families = [...new Set(models.map(modelFamily))];
+		out.push({
+			...window$1,
+			scope: families.join(" · "),
+			models
+		});
+	}
+	return out;
+}
+/**
+* What compact surfaces show: unscoped windows, session first. A provider that
+* only reports per-model windows (Antigravity) shows its two most used instead.
+*/
+function primaryWindows(windows) {
+	const order = {
+		session: 0,
+		weekly: 1,
+		other: 2
+	};
+	const all = shownWindows(windows);
+	const unscoped = all.filter((w) => w.scope === void 0).sort((a, b) => order[a.kind] - order[b.kind]);
+	if (unscoped.length > 0) return unscoped;
+	return [...all].sort((a, b) => b.usedPercent - a.usedPercent).slice(0, 2);
+}
+/** The pace bar: fill is quota, hatch is the forecast, color is the pace state. Drains in `left` mode. */
+function Bar({ window: window$1, p, display, height = 6 }) {
+	const used = p.state === "unknown" ? 0 : p.usedPercent;
+	const left = display === "left";
+	const fill = left ? 100 - used : used;
+	let projection = null;
+	if (p.state === "over" || p.state === "tight") {
+		const end = Math.min(100, p.projectedPercent);
+		projection = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dsm-proj",
+			style: left ? {
+				left: `${100 - end}%`,
+				width: `${end - used}%`
+			} : {
+				left: `${used}%`,
+				width: `${end - used}%`
+			}
+		});
+	}
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		className: `dsm-bar dsm-${p.state}`,
+		style: { height },
+		role: "meter",
+		"aria-valuemin": 0,
+		"aria-valuemax": 100,
+		"aria-valuenow": displayPercent(window$1, display) ?? 0,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dsm-fill",
+			style: { width: `${fill}%` }
+		}), projection]
+	});
+}
+function valueText(window$1, display) {
+	const value = displayPercent(window$1, display);
+	return value === void 0 ? "–" : `${value}%`;
+}
+/** The time column: when this changes next. */
+function timeText(t, window$1, p, now) {
+	if (p.state === "out" && window$1.resetsAt !== void 0) return tf(t, "backAt", { time: clockTime(window$1.resetsAt, now) });
+	if (p.state === "over") return tf(t, "emptyAt", { time: clockTime(p.emptyAt, now) });
+	return window$1.resetsAt === void 0 ? "" : tf(t, "resetsIn", { time: shortDuration(Math.max(0, window$1.resetsAt - now)) });
+}
+function tooltip(t, window$1, p, now) {
+	if (p.state === "unknown") return t("notReported");
+	const used = Math.round(p.usedPercent);
+	const lines = [...window$1.models ?? [], tf(t, "tipUsedLeft", {
+		used,
+		left: 100 - used
+	})];
+	if (window$1.used !== void 0 && window$1.limit !== void 0) lines.push(tf(t, "tipCount", {
+		used: Math.round(window$1.used),
+		limit: window$1.limit
+	}));
+	if ((p.state === "calm" || p.state === "tight" || p.state === "over") && p.elapsed !== void 0) lines.push(tf(t, "tipElapsed", { percent: Math.round(p.elapsed * 100) }));
+	if (p.state === "tight") lines.push(tf(t, "tipPace", { percent: Math.round(p.projectedPercent) }));
+	if (p.state === "over") lines.push(tf(t, "emptyAt", { time: fullTime(p.emptyAt) }));
+	if (window$1.resetsAt !== void 0) lines.push(tf(t, "tipResets", { time: fullTime(window$1.resetsAt) }));
+	return lines.join("\n");
+}
+/** One window on the shared grid: label | bar | value | time. */
+function WindowRow({ t, window: window$1, display, now }) {
+	const p = pace(window$1, now);
+	const tip = tooltip(t, window$1, p, now);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: `dsm-w dsm-${p.state}`,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsm-wl",
+				title: window$1.scope === void 0 ? tip : `${windowLabel(t, window$1)}\n${tip}`,
+				children: windowLabel(t, window$1)
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				title: tip,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Bar, {
+					window: window$1,
+					p,
+					display
+				})
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsm-wv",
+				title: tip,
+				children: valueText(window$1, display)
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsm-wt",
+				title: tip,
+				children: timeText(t, window$1, p, now)
+			})
+		]
+	});
+}
+/** Label, small bar and value, for summary rows and the gauge. */
+function Mini({ t, window: window$1, display, now }) {
+	const p = pace(window$1, now);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		className: `dsm-mini dsm-${p.state}`,
+		title: window$1.scope === void 0 ? tooltip(t, window$1, p, now) : `${window$1.scope}\n${tooltip(t, window$1, p, now)}`,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("i", { children: window$1.kind === "other" && window$1.scope !== void 0 ? window$1.scope : kindLabel(t, window$1.kind, window$1.durationMs) }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Bar, {
+				window: window$1,
+				p,
+				display,
+				height: 4
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("b", { children: valueText(window$1, display) })
+		]
+	});
+}
+/** The mini meters of an account's unscoped windows. */
+function Minis({ t, windows, display, now }) {
+	const shown = primaryWindows(windows);
+	if (shown.length === 0) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: "dsm-minis",
+		children: shown.map((w, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Mini, {
+			t,
+			window: w,
+			display,
+			now
+		}, i))
+	});
+}
+
+//#endregion
+//#region src/client/hooks.ts
+/** The current time, re-read every `intervalMs`, so countdowns advance without a fetch. */
+function useNow(intervalMs) {
+	const [now, setNow] = (0, react.useState)(() => Date.now());
+	(0, react.useEffect)(() => {
+		const timer = setInterval(() => {
+			setNow(Date.now());
+		}, intervalMs);
+		return () => {
+			clearInterval(timer);
+		};
+	}, [intervalMs]);
+	return now;
+}
+
+//#endregion
+//#region src/client/context.ts
+function useStore(store) {
+	return (0, react.useSyncExternalStore)(store.subscribe, store.getSnapshot);
+}
+function usePrefs(prefs) {
+	return (0, react.useSyncExternalStore)(prefs.subscribe, prefs.getSnapshot);
+}
+
+//#endregion
+//#region src/client/ProviderCard.tsx
+/** How often a busy sign-in re-reads status until the account lands. */
+const SIGN_IN_POLL_MS = 2e3;
+function ProviderCard(props) {
+	const { store, prefs, rpc, t } = props;
+	const provider = props.provider.provider;
+	if (store === void 0 || prefs === void 0 || rpc === void 0 || t === void 0 || !isProviderId(provider)) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CardBody, {
+		provider,
+		store,
+		prefs,
+		rpc,
+		t
+	});
+}
+function CardBody({ provider, store, prefs, rpc, t }) {
+	const snapshot = useStore(store);
+	const prefView = usePrefs(prefs);
+	const now = useNow(3e4);
+	const status = snapshot.status?.providers[provider];
+	const [mode, setMode] = (0, react.useState)({ kind: "view" });
+	const [error, setError] = (0, react.useState)();
+	const [moreOpen, setMoreOpen] = (0, react.useState)(false);
+	const busy = status?.busy === true;
+	(0, react.useEffect)(() => {
+		if (mode.kind !== "signin" && !busy) return;
+		const timer = setInterval(() => {
+			store.refreshStatus();
+		}, SIGN_IN_POLL_MS);
+		return () => {
+			clearInterval(timer);
+		};
+	}, [
+		mode.kind,
+		busy,
+		store
+	]);
+	const accountCount = status?.accounts.length ?? 0;
+	const startCount = (0, react.useRef)(accountCount);
+	(0, react.useEffect)(() => {
+		if (mode.kind === "signin" && !busy && accountCount !== startCount.current) setMode({ kind: "view" });
+	}, [
+		mode.kind,
+		busy,
+		accountCount
+	]);
+	(0, react.useEffect)(() => {
+		if (status?.detail !== void 0) setError(status.detail);
+	}, [status?.detail]);
+	const signIn = async (method) => {
+		setError(void 0);
+		startCount.current = accountCount;
+		try {
+			const response = await call(rpc, "login", {
+				provider,
+				...method === void 0 ? {} : { method }
+			});
+			if (response.authorizeUrl === "") {
+				await store.refreshStatus();
+				return;
+			}
+			if (response.userCode !== void 0 && response.userCode !== "") setMode({
+				kind: "signin",
+				userCode: response.userCode,
+				url: response.authorizeUrl
+			});
+			else {
+				window.open(response.authorizeUrl, "_blank", "noopener");
+				setMode({ kind: "signin" });
+			}
+			store.refreshStatus();
+		} catch (failure) {
+			setError(failure instanceof Error ? failure.message : String(failure));
+		}
+	};
+	const cancel = async () => {
+		setMode({ kind: "view" });
+		await call(rpc, "cancel", { provider }).catch(() => void 0);
+		await store.refreshStatus();
+	};
+	if (status === void 0) return snapshot.statusError === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dsm-sub",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dsm-card-error",
+			children: snapshot.statusError
+		})
+	});
+	if (mode.kind === "signin") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsm-sub",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SignIn, {
+			t,
+			provider,
+			mode,
+			rpc,
+			onCancel: () => {
+				cancel();
+			},
+			onError: setError
+		}), error === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dsm-card-error",
+			role: "alert",
+			children: error
+		})]
+	});
+	if (status.accounts.length === 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsm-sub",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dsm-foot",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: "dsm-btn dsm-primary",
+				onClick: () => {
+					signIn();
+				},
+				children: t("signIn")
+			}), provider === "claude" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: "dsm-btn dsm-ghost",
+				onClick: () => {
+					signIn("keychain");
+				},
+				children: t("claudeImport")
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsm-muted",
+				children: t("noApiKey")
+			})]
+		}), error === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dsm-card-error",
+			role: "alert",
+			children: error
+		})]
+	});
+	const split = splitAccounts(status);
+	if (split === void 0) return null;
+	const { active, rest } = split;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsm-sub",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Account, {
+				t,
+				provider,
+				account: active,
+				status,
+				snapshot,
+				prefs: prefView,
+				now,
+				hideUsage: true,
+				onSignIn: () => {
+					signIn();
+				}
+			}),
+			rest.length === 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: "dsm-fold",
+				"aria-expanded": moreOpen,
+				onClick: () => {
+					setMoreOpen((open) => !open);
+				},
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "dsm-fold-name",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+							name: "right",
+							size: 12,
+							className: "dsm-chev"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: rest.length === 1 ? label(rest[0]) : tf(t, "moreAccounts", { count: rest.length }) }),
+						rest.length === 1 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AccountTags, {
+							t,
+							account: rest[0],
+							status
+						}) : null
+					]
+				})
+			}), moreOpen ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dsm-fold-body",
+				children: rest.map((account) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Account, {
+					t,
+					provider,
+					account,
+					status,
+					snapshot,
+					prefs: prefView,
+					now,
+					hideUsage: true,
+					onSignIn: () => {
+						signIn();
+					}
+				}, account.key))
+			}) : null] }),
+			mode.kind === "manage" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ManagePanel, {
+				t,
+				provider,
+				status,
+				rpc,
+				onClose: () => {
+					setMode({ kind: "view" });
+					store.refreshStatus();
+				},
+				onAddAccount: () => {
+					signIn();
+				}
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-foot",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsm-btn",
+					onClick: () => {
+						setMode({ kind: "manage" });
+					},
+					children: t("manage")
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PickerCount, {
+					t,
+					status
+				})]
+			}),
+			error === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsm-card-error",
+				role: "alert",
+				children: error
+			})
+		]
+	});
+}
+const label = (account) => account.account ?? account.key;
+function usageOf(snapshot, provider, account) {
+	const entry = snapshot.usage.get(usageKey(provider, account));
+	return entry?.kind === "ready" ? entry.usage : void 0;
+}
+/** Plan tag, default star, and serving bolt. */
+function AccountTags({ t, account, status }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		account.plan === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dsm-tag",
+			children: account.plan
+		}),
+		account.isDefault ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dsm-glyph dsm-star",
+			title: t("defaultAccount"),
+			"aria-label": t("defaultAccount"),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+				name: "star",
+				size: 12
+			})
+		}) : null,
+		status.servingAccount === account.key ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "dsm-glyph dsm-live",
+			title: t("servingAccount"),
+			"aria-label": t("servingAccount"),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+				name: "bolt",
+				size: 12
+			})
+		}) : null
+	] });
+}
+/** "live", "4m ago", or a stale warning, at the end of an account header. */
+function Freshness({ t, snapshot, provider, account, now }) {
+	if (!isMetered(snapshot.status, provider)) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: "dsm-fresh",
+		title: t("noUsageDataTitle"),
+		children: t("noUsageData")
+	});
+	const entry = snapshot.usage.get(usageKey(provider, account));
+	if (entry === void 0 || entry.kind === "loading") return null;
+	if (entry.kind === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		className: "dsm-fresh dsm-stale",
+		title: entry.message,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+			name: "alert",
+			size: 12
+		}), t("usageUnavailable")]
+	});
+	const usage = entry.usage;
+	const fetchedAt = usage.fetchedAt ?? entry.receivedAt;
+	if (usage.refreshFailed === true || usage.stale === true && usage.retryAt !== void 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		className: "dsm-fresh dsm-stale",
+		title: tf(t, "staleTitle", { when: usage.retryAt === void 0 ? "" : tf(t, "resetsIn", { time: shortDuration(Math.max(0, usage.retryAt - now)) }) }),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+			name: "alert",
+			size: 12
+		}), tf(t, "staleShort", { time: shortDuration(Math.max(0, now - fetchedAt)) })]
+	});
+	if (usage.source === "live" && now - fetchedAt < 10 * 6e4) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		className: "dsm-fresh",
+		title: t("liveTitle"),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "dsm-live-dot" }), t("live")]
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: "dsm-fresh",
+		children: tf(t, "agoShort", { time: shortDuration(Math.max(0, now - fetchedAt)) })
+	});
+}
+/** One account: header, then its windows on the shared grid. */
+function Account({ t, provider, account, status, snapshot, prefs, now, onSignIn, compact, hideUsage }) {
+	const usage = usageOf(snapshot, provider, account.key);
+	const expired = usage === void 0 && snapshot.usage.get(usageKey(provider, account.key))?.kind === "error" && account.expiresAt !== void 0 && account.expiresAt < now;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: compact === true ? "dsm-pacct" : "dsm-acct",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dsm-acct-head",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-acct-name",
+					children: label(account)
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(AccountTags, {
+					t,
+					account,
+					status
+				}),
+				hideUsage === true ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Freshness, {
+					t,
+					snapshot,
+					provider,
+					account: account.key,
+					now
+				})
+			]
+		}), expired && onSignIn !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dsm-alert",
+			role: "alert",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "alert" }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("signInExpired") }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsm-btn dsm-primary",
+					onClick: onSignIn,
+					children: t("signInAgain")
+				})
+			]
+		}) : hideUsage === true || usage?.windows === void 0 || usage.windows.length === 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "dsm-wins",
+			children: shownWindows(usage.windows).map((window$1, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WindowRow, {
+				t,
+				window: window$1,
+				display: prefs.display,
+				now
+			}, index))
+		})]
+	});
+}
+function PickerCount({ t, status }) {
+	const total = status.catalogSize;
+	if (total === void 0) return null;
+	const visible = status.visibleModels === void 0 ? total : status.visibleModels.length;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: "dsm-muted dsm-num",
+		title: t("modelsCountTitle"),
+		children: tf(t, "modelsCount", {
+			visible,
+			total
+		})
+	});
+}
+function SignIn({ t, provider, mode, rpc, onCancel, onError }) {
+	const [draft, setDraft] = (0, react.useState)("");
+	if (mode.userCode !== void 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsm-signin",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("ol", {
+			className: "dsm-steps",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
+				"data-s": "done",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+					name: "check",
+					size: 12
+				}), t("stepCodeIssued")]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
+				"data-s": "now",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "dsm-spin" }), t("stepWaitingGithub")]
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dsm-foot",
+			style: { flexWrap: "wrap" },
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-code",
+					children: mode.userCode
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsm-btn dsm-icon",
+					"aria-label": t("copyCode"),
+					title: t("copyCode"),
+					onClick: () => {
+						navigator.clipboard?.writeText(mode.userCode ?? "");
+					},
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "copy" })
+				}),
+				mode.url === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("a", {
+					className: "dsm-btn",
+					href: mode.url,
+					target: "_blank",
+					rel: "noopener noreferrer",
+					children: [new URL(mode.url).host + new URL(mode.url).pathname, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: "ext",
+						size: 12
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsm-btn dsm-ghost",
+					style: { marginLeft: "auto" },
+					onClick: onCancel,
+					children: t("cancel")
+				})
+			]
+		})]
+	});
+	const submit = async () => {
+		const input = draft.trim();
+		if (input === "") return;
+		onError(void 0);
+		try {
+			await call(rpc, "manual", {
+				provider,
+				input
+			});
+			setDraft("");
+		} catch (failure) {
+			onError(failure instanceof Error ? failure.message : String(failure));
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsm-signin",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("ol", {
+			className: "dsm-steps",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
+					"data-s": "done",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: "check",
+						size: 12
+					}), t("stepTabOpened")]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
+					"data-s": "now",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { className: "dsm-spin" }), t("stepApprove")]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+					name: "check",
+					size: 12
+				}), t("stepLoadModels")] })
+			]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dsm-foot",
+			style: { alignItems: "flex-start" },
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("details", {
+				className: "dsm-fallback",
+				style: { flex: 1 },
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("summary", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+					name: "down",
+					size: 12
+				}), t("pasteRedirect")] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+					className: "dsm-foot",
+					onSubmit: (event) => {
+						event.preventDefault();
+						submit();
+					},
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						className: "dsm-input",
+						value: draft,
+						placeholder: t("pastePlaceholder"),
+						onChange: (event) => {
+							setDraft(event.target.value);
+						}
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "submit",
+						className: "dsm-btn",
+						disabled: draft.trim() === "",
+						children: t("continue")
+					})]
+				})]
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: "dsm-btn dsm-ghost",
+				onClick: onCancel,
+				children: t("cancel")
+			})]
+		})]
+	});
+}
+const TOOL_LABEL = {
+	web_search: "toolWebSearch",
+	image_generate: "toolImage",
+	video_generate: "toolVideo",
+	x_search: "toolXSearch"
+};
+function ManagePanel({ t, provider, status, rpc, onClose, onAddAccount }) {
+	const [tab, setTab] = (0, react.useState)("accounts");
+	const [loaded, setLoaded] = (0, react.useState)();
+	const [draft, setDraft] = (0, react.useState)();
+	const [efforts, setEfforts] = (0, react.useState)({});
+	const [search, setSearch] = (0, react.useState)("");
+	const [saving, setSaving] = (0, react.useState)(false);
+	const [error, setError] = (0, react.useState)();
+	(0, react.useEffect)(() => {
+		let live = true;
+		call(rpc, "providerSettings", { provider }).then((value) => {
+			if (!live) return;
+			setLoaded(value);
+			setDraft(value.settings);
+		}, (failure) => {
+			if (live) setError(tf(t, "loadFailed", { message: failure instanceof Error ? failure.message : String(failure) }));
+		});
+		return () => {
+			live = false;
+		};
+	}, [
+		rpc,
+		provider,
+		t
+	]);
+	const accountAction = async (endpoint, account) => {
+		setError(void 0);
+		try {
+			await call(rpc, endpoint, {
+				provider,
+				account
+			});
+			onClose();
+		} catch (failure) {
+			setError(failure instanceof Error ? failure.message : String(failure));
+		}
+	};
+	const save = async () => {
+		if (draft === void 0 || loaded === void 0) return;
+		setSaving(true);
+		setError(void 0);
+		try {
+			await call(rpc, "setProviderSettings", {
+				provider,
+				settings: draft
+			});
+			for (const [model, effort] of Object.entries(efforts)) await call(rpc, "setModelDefault", {
+				provider,
+				model,
+				...effort === void 0 ? {} : { effort }
+			});
+			onClose();
+		} catch (failure) {
+			setError(tf(t, "saveFailed", { message: failure instanceof Error ? failure.message : String(failure) }));
+		} finally {
+			setSaving(false);
+		}
+	};
+	const models = loaded?.models ?? [];
+	const allIds = models.map((m) => m.id);
+	const visible = new Set(draft?.visibleModels ?? allIds);
+	const automatic = draft?.visibleModels === void 0;
+	const setVisible = (ids) => {
+		setDraft((current) => {
+			const next = { ...current };
+			if (ids === void 0) delete next.visibleModels;
+			else next.visibleModels = ids;
+			return next;
+		});
+	};
+	const accountPrefs = draft?.accounts ?? {};
+	const setPool = (account, enabled) => {
+		setDraft((current) => ({
+			...current,
+			accounts: {
+				...current?.accounts,
+				[account]: {
+					...current?.accounts?.[account],
+					poolEnabled: enabled
+				}
+			}
+		}));
+	};
+	const toolsOn = draft?.tools ?? {};
+	const shown = models.filter((m) => search === "" || m.id.toLowerCase().includes(search.toLowerCase()) || m.name.toLowerCase().includes(search.toLowerCase()));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsm-panel",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dsm-tabs",
+				role: "tablist",
+				children: [
+					"accounts",
+					"models",
+					"tools"
+				].filter((id) => id !== "tools" || (loaded?.tools.length ?? 0) > 0).map((id) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					role: "tab",
+					className: "dsm-tab",
+					"aria-selected": tab === id,
+					onClick: () => {
+						setTab(id);
+					},
+					children: t(id === "accounts" ? "tabAccounts" : id === "models" ? "tabModels" : "tabTools")
+				}, id))
+			}),
+			tab === "accounts" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [status.accounts.map((account) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-row",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "dsm-grow",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "dsm-ellipsis",
+							children: label(account)
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AccountTags, {
+							t,
+							account,
+							status
+						})]
+					}),
+					status.accounts.length > 1 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsm-note",
+						children: t("pool")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						role: "switch",
+						className: "dsm-switch",
+						"aria-checked": accountPrefs[account.key]?.poolEnabled !== false,
+						"aria-label": tf(t, "poolInclude", { account: label(account) }),
+						onClick: () => {
+							setPool(account.key, accountPrefs[account.key]?.poolEnabled === false);
+						}
+					})] }) : null,
+					account.isDefault ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsm-btn dsm-icon",
+						title: t("makeDefault"),
+						"aria-label": t("makeDefault"),
+						onClick: () => {
+							accountAction("setDefault", account.key);
+						},
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "star" })
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsm-btn dsm-danger",
+						onClick: () => {
+							accountAction("logout", account.key);
+						},
+						children: t("signOut")
+					})
+				]
+			}, account.key)), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dsm-row",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					className: "dsm-btn",
+					onClick: onAddAccount,
+					children: ["+ ", t("addAccount")]
+				})
+			})] }) : null,
+			tab === "models" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+					className: "dsm-input",
+					value: search,
+					placeholder: tf(t, "searchModels", { count: models.length }),
+					onChange: (event) => {
+						setSearch(event.target.value);
+					}
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "dsm-row",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsm-grow",
+						children: t("autoShowNew")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						role: "switch",
+						className: "dsm-switch",
+						"aria-checked": automatic,
+						"aria-label": t("autoShowNew"),
+						onClick: () => {
+							setVisible(automatic ? allIds : void 0);
+						}
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "dsm-row",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsm-btn",
+						onClick: () => {
+							setVisible(allIds);
+						},
+						children: t("selectAll")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsm-btn",
+						onClick: () => {
+							setVisible([]);
+						},
+						children: t("deselectAll")
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "dsm-list",
+					children: shown.map((model) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModelRow, {
+						t,
+						model,
+						on: visible.has(model.id),
+						effort: model.id in efforts ? efforts[model.id] : model.configured,
+						onToggle: () => {
+							const next = new Set(visible);
+							if (next.has(model.id)) next.delete(model.id);
+							else next.add(model.id);
+							setVisible(allIds.filter((id) => next.has(id)));
+						},
+						onEffort: (effort) => {
+							setEfforts((current) => ({
+								...current,
+								[model.id]: effort
+							}));
+						}
+					}, model.id))
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-note",
+					children: tf(t, "pickerCount", {
+						visible: visible.size,
+						total: models.length
+					})
+				})
+			] }) : null,
+			tab === "tools" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [(loaded?.tools ?? []).map((tool) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-row",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-grow",
+					children: t(TOOL_LABEL[tool])
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					role: "switch",
+					className: "dsm-switch",
+					"aria-checked": toolsOn[tool] !== false,
+					"aria-label": t(TOOL_LABEL[tool]),
+					onClick: () => {
+						setDraft((current) => ({
+							...current,
+							tools: {
+								...current?.tools,
+								[tool]: current?.tools?.[tool] === false
+							}
+						}));
+					}
+				})]
+			}, tool)), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsm-note",
+				children: t("toolsNote")
+			})] }) : null,
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-panel-foot",
+				children: [
+					error === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsm-card-error",
+						role: "alert",
+						children: error
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsm-btn dsm-ghost",
+						onClick: onClose,
+						children: t("cancel")
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsm-btn dsm-primary",
+						disabled: saving || draft === void 0,
+						onClick: () => {
+							save();
+						},
+						children: saving ? t("saving") : t("save")
+					})
+				]
+			})
+		]
+	});
+}
+function ModelRow({ t, model, on, effort, onToggle, onEffort }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsm-row",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				role: "switch",
+				className: "dsm-switch",
+				"aria-checked": on,
+				"aria-label": tf(t, "showInPicker", { model: model.id }),
+				onClick: onToggle
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+				className: "dsm-grow",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-ellipsis dsm-num",
+					children: model.id
+				}), model.contextWindow === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "dsm-note",
+					children: [Math.round(model.contextWindow / 1e3), "K"]
+				})]
+			}),
+			model.efforts.length === 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("select", {
+				className: "dsm-select",
+				"aria-label": tf(t, "effortFor", { model: model.id }),
+				value: effort ?? "",
+				onChange: (event) => {
+					onEffort(event.target.value === "" ? void 0 : event.target.value);
+				},
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+					value: "",
+					children: t("effortAuto")
+				}), model.efforts.map((level) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
+					value: level.id,
+					children: level.name
+				}, level.id))]
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/client/Footer.tsx
+function Footer(props) {
+	const { store, prefs, rpc, t } = props;
+	if (store === void 0 || prefs === void 0 || rpc === void 0 || t === void 0) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FooterBody, {
+		rpc,
+		t
+	});
+}
+function FooterBody({ rpc, t }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+		className: "dsm-footer-block",
+		"aria-labelledby": "dsm-footer-title",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+			id: "dsm-footer-title",
+			children: t("subscriptions")
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProxyRow, {
+			t,
+			rpc
+		})]
+	});
+}
+function ProxyRow({ t, rpc }) {
+	const [config, setConfig] = (0, react.useState)();
+	const [open, setOpen] = (0, react.useState)(false);
+	const [url, setUrl] = (0, react.useState)("");
+	const [bypass, setBypass] = (0, react.useState)("");
+	const [enabled, setEnabled] = (0, react.useState)(false);
+	const [message, setMessage] = (0, react.useState)();
+	const [busy, setBusy] = (0, react.useState)(false);
+	(0, react.useEffect)(() => {
+		let live = true;
+		call(rpc, "proxyGet", {}).then((value) => {
+			if (live) setConfig(value);
+		}, () => void 0);
+		return () => {
+			live = false;
+		};
+	}, [rpc]);
+	const edit = () => {
+		setUrl(config?.url ?? "");
+		setBypass((config?.bypass ?? []).join(", "));
+		setEnabled(config?.enabled ?? false);
+		setMessage(void 0);
+		setOpen(true);
+	};
+	const save = async () => {
+		setBusy(true);
+		setMessage(void 0);
+		try {
+			setConfig(await call(rpc, "proxySet", {
+				enabled,
+				url: url.trim(),
+				bypass: bypass.split(",").map((entry) => entry.trim()).filter((entry) => entry !== "")
+			}));
+			setOpen(false);
+		} catch (failure) {
+			setMessage(tf(t, "saveFailed", { message: failure instanceof Error ? failure.message : String(failure) }));
+		} finally {
+			setBusy(false);
+		}
+	};
+	const test = async () => {
+		setBusy(true);
+		setMessage(void 0);
+		try {
+			const result = await call(rpc, "proxyTest", url.trim() === "" ? {} : { proxy: { url: url.trim() } });
+			setMessage(result.ok && result.status !== void 0 ? tf(t, "proxyTestOk", {
+				status: result.status,
+				ms: result.latencyMs ?? 0
+			}) : result.error ?? "");
+		} catch (failure) {
+			setMessage(failure instanceof Error ? failure.message : String(failure));
+		} finally {
+			setBusy(false);
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsm-row",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+			className: "dsm-grow",
+			children: [
+				t("proxy"),
+				" ",
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-note",
+					children: config?.enabled === true ? config.url : t("proxyOff")
+				})
+			]
+		}), open ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			className: "dsm-btn",
+			onClick: edit,
+			children: t("configure")
+		})]
+	}), open ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsm-panel",
+		style: { paddingTop: 12 },
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-row",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-grow",
+					children: t("proxyEnabled")
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					role: "switch",
+					className: "dsm-switch",
+					"aria-checked": enabled,
+					"aria-label": t("proxyEnabled"),
+					onClick: () => {
+						setEnabled((value) => !value);
+					}
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				className: "dsm-input",
+				value: url,
+				placeholder: "http://127.0.0.1:7890",
+				"aria-label": t("proxyUrl"),
+				onChange: (event) => {
+					setUrl(event.target.value);
+				}
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				className: "dsm-input",
+				value: bypass,
+				placeholder: t("proxyBypass"),
+				"aria-label": t("proxyBypass"),
+				onChange: (event) => {
+					setBypass(event.target.value);
+				}
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-panel-foot",
+				children: [
+					message === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "dsm-note",
+						role: "status",
+						style: { marginRight: "auto" },
+						children: message
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsm-btn dsm-ghost",
+						disabled: busy,
+						onClick: () => {
+							test();
+						},
+						children: t("proxyTest")
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsm-btn dsm-ghost",
+						onClick: () => {
+							setOpen(false);
+						},
+						children: t("cancel")
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsm-btn dsm-primary",
+						disabled: busy,
+						onClick: () => {
+							save();
+						},
+						children: t("save")
+					})
+				]
+			})
+		]
+	}) : null] });
+}
+
+//#endregion
+//#region src/client/Usage.tsx
+/** The Usage row's icon in the settings nav; the shell passes the edge size. */
+function UsageNavIcon({ size }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+		name: "meter",
+		size
+	});
+}
+function Usage(props) {
+	const { store, prefs, rpc, t } = props;
+	if (store === void 0 || prefs === void 0 || rpc === void 0 || t === void 0) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UsageBody, {
+		store,
+		prefs,
+		rpc,
+		t
+	});
+}
+function Segmented({ label: label$1, value, options, disabled, onChange }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: "dsm-seg",
+		role: "group",
+		"aria-label": label$1,
+		children: options.map(([option, text]) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			"aria-pressed": value === option,
+			disabled,
+			onClick: () => {
+				onChange(option);
+			},
+			children: text
+		}, option))
+	});
+}
+function maxManualReady(snapshot, provider, status) {
+	const times = status.accounts.map((a) => {
+		const entry = snapshot.usage.get(usageKey(provider, a.key));
+		return entry?.kind === "ready" ? entry.usage.manualReadyAt : void 0;
+	}).filter((at) => at !== void 0);
+	return times.length === 0 ? void 0 : Math.max(...times);
+}
+function UsageBody({ store, prefs, rpc, t }) {
+	const snapshot = useStore(store);
+	const view = usePrefs(prefs);
+	const now = useNow(3e4);
+	const readOnly = !view.writable;
+	const providers = USAGE_PROVIDERS.filter((provider) => {
+		const status = snapshot.status?.providers[provider];
+		return status !== void 0 && status.accounts.length > 0 && isMetered(snapshot.status, provider);
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+		className: "dsm-footer-block dsm-usage",
+		"aria-labelledby": "dsm-usage-title",
+		style: {
+			marginTop: 0,
+			borderTop: "none",
+			paddingTop: 0
+		},
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+				id: "dsm-usage-title",
+				children: t("usage")
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-row",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-grow",
+					children: t("showQuotaAs")
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Segmented, {
+					label: t("showQuotaAs"),
+					value: view.display,
+					disabled: readOnly,
+					options: [["left", t("displayLeft")], ["used", t("displayUsed")]],
+					onChange: (display) => {
+						prefs.set({ display });
+					}
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-row",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-grow",
+					children: t("paceWarnings")
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					role: "switch",
+					className: "dsm-switch",
+					"aria-checked": view.paceWarnings,
+					"aria-label": t("paceWarnings"),
+					disabled: readOnly,
+					onClick: () => {
+						prefs.set({ paceWarnings: !view.paceWarnings });
+					}
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-row",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "dsm-grow",
+					children: [
+						t("composerUsage"),
+						" ",
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "dsm-note",
+							children: t("composerUsageNote")
+						})
+					]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					role: "switch",
+					className: "dsm-switch",
+					"aria-checked": view.composer,
+					"aria-label": t("composerUsage"),
+					disabled: readOnly,
+					onClick: () => {
+						prefs.set({ composer: !view.composer });
+					}
+				})]
+			}),
+			providers.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "dsm-muted",
+				style: { margin: "12px 0 0" },
+				children: t("usageEmpty")
+			}) : null,
+			providers.map((provider) => {
+				const status = snapshot.status?.providers[provider];
+				const split = status === void 0 ? void 0 : splitAccounts(status);
+				if (status === void 0 || split === void 0) return null;
+				const pinned = view.pinned.includes(provider);
+				const pinLabel = pinned ? t("unpin") : t("pin");
+				const refreshing = status.accounts.some((a) => snapshot.refreshing.has(usageKey(provider, a.key)));
+				const readyAt = maxManualReady(snapshot, provider, status);
+				const cooling = readyAt !== void 0 && readyAt > now;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "dsm-usage-block",
+					style: {
+						borderTop: ".5px solid var(--dsw-alias-border-l1)",
+						padding: "10px 0"
+					},
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "dsm-row",
+							style: { minHeight: 28 },
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "dsm-grow",
+									style: { fontWeight: 500 },
+									children: shortName(snapshot.status, provider)
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									className: "dsm-btn dsm-icon dsm-pin",
+									"aria-pressed": pinned,
+									title: pinLabel,
+									"aria-label": pinLabel,
+									disabled: readOnly,
+									onClick: () => {
+										prefs.togglePinned(provider);
+									},
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: pinned ? "pinFilled" : "pin" })
+								}),
+								isKey(provider) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									className: "dsm-btn dsm-ghost",
+									onClick: () => {
+										call(rpc, "keysRemove", { provider }).then(() => store.refreshStatus());
+									},
+									children: t("removeKey")
+								}) : null,
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									className: `dsm-btn dsm-icon${refreshing ? " dsm-spinning" : ""}`,
+									disabled: refreshing || cooling,
+									title: cooling ? tf(t, "refreshedWait", { seconds: Math.ceil((readyAt - now) / 1e3) }) : t("refreshUsage"),
+									"aria-label": tf(t, "refreshUsageNamed", { name: provider }),
+									onClick: () => {
+										store.refreshUsage("manual", provider);
+									},
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "refresh" })
+								})
+							]
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Account, {
+							t,
+							provider,
+							account: split.active,
+							status,
+							snapshot,
+							prefs: view,
+							now,
+							compact: true
+						}),
+						split.rest.map((account) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Account, {
+							t,
+							provider,
+							account,
+							status,
+							snapshot,
+							prefs: view,
+							now,
+							compact: true
+						}, account.key))
+					]
+				}, provider);
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(AddProvider, {
+				t,
+				store,
+				rpc,
+				unconfigured: KEY_PROVIDERS.filter((id) => snapshot.status?.keyProviders?.find((v) => v.id === id)?.configured !== true),
+				names: snapshot.status?.keyProviders ?? []
+			})
+		]
+	});
+}
+const isKey = (provider) => KEY_PROVIDERS.includes(provider);
+function AddProvider({ t, store, rpc, unconfigured, names }) {
+	const [picked, setPicked] = (0, react.useState)();
+	const [key, setKey] = (0, react.useState)("");
+	const [busy, setBusy] = (0, react.useState)(false);
+	const [error, setError] = (0, react.useState)();
+	if (unconfigured.length === 0) return null;
+	const save = async (id) => {
+		setBusy(true);
+		setError(void 0);
+		try {
+			await call(rpc, "keysSet", {
+				provider: id,
+				key
+			});
+			setKey("");
+			setPicked(void 0);
+			await store.refreshStatus();
+		} catch (failure) {
+			setError(failure instanceof Error ? failure.message : String(failure));
+		} finally {
+			setBusy(false);
+		}
+	};
+	const nameOf = (id) => names.find((v) => v.id === id)?.name ?? id;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "dsm-usage-block",
+		style: {
+			borderTop: ".5px solid var(--dsw-alias-border-l1)",
+			padding: "10px 0"
+		},
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dsm-row",
+			style: { minHeight: 28 },
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "dsm-grow dsm-muted",
+				children: t("addProvider")
+			}), unconfigured.map((id) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: "dsm-btn",
+				"aria-pressed": picked === id,
+				onClick: () => {
+					setPicked(picked === id ? void 0 : id);
+					setError(void 0);
+				},
+				children: nameOf(id)
+			}, id))]
+		}), picked === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dsm-panel",
+			style: { paddingTop: 8 },
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				className: "dsm-input",
+				type: "password",
+				autoComplete: "off",
+				value: key,
+				placeholder: t("apiKey"),
+				"aria-label": `${nameOf(picked)} ${t("apiKey")}`,
+				onChange: (event) => {
+					setKey(event.target.value);
+				}
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-panel-foot",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-note",
+					role: "status",
+					style: { marginRight: "auto" },
+					children: busy ? t("keyChecking") : error ?? t("keyHelp")
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsm-btn dsm-primary",
+					disabled: busy || key.trim() === "",
+					onClick: () => {
+						save(picked);
+					},
+					children: t("addKey")
+				})]
+			})]
+		})]
+	});
+}
+
+//#endregion
+//#region src/client/Gauge.tsx
+const noSubscribe = () => () => void 0;
+/** Select the provider string itself, so the snapshot compares by value. */
+function useCurrentProvider(source) {
+	return (0, react.useSyncExternalStore)(source?.subscribe ?? noSubscribe, () => source?.getSnapshot().current?.provider);
+}
+/** A provider the composer can show: signed in and reporting usage. */
+const showable = (snapshot, id) => isMetered(snapshot.status, id) && (snapshot.status?.providers[id]?.accounts.length ?? 0) > 0;
+/** Providers the gauge shows: the current model's provider first, then the pinned ones. */
+function gaugeProviders(prefs, current, snapshot) {
+	if (snapshot.status === void 0) return [];
+	return [...new Set(isUsageProviderId(current) ? [current, ...prefs.pinned] : prefs.pinned)].filter((id) => showable(snapshot, id));
+}
+/** Every provider the popover can list: the shown ones first, then the rest in page order. */
+function popoverProviders(shown, snapshot) {
+	return {
+		shown: [...shown],
+		others: USAGE_PROVIDERS.filter((id) => !shown.includes(id) && showable(snapshot, id))
+	};
+}
+function windowsOf(snapshot, provider) {
+	const key = activeAccountKey(snapshot.status?.providers[provider]);
+	if (key === void 0) return void 0;
+	const entry = snapshot.usage.get(usageKey(provider, key));
+	return entry?.kind === "ready" ? entry.usage.windows : void 0;
+}
+function Gauge(props) {
+	const { store, prefs, rpc, t, sessionId } = props;
+	if (store === void 0 || prefs === void 0 || rpc === void 0 || t === void 0 || sessionId === void 0) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(GaugeBody, {
+		...props,
+		store,
+		prefs,
+		rpc,
+		t,
+		sessionId,
+		currentModel: props.currentModel
+	});
+}
+function GaugeBody({ store, prefs, t, sessionId, currentModel, openSettings }) {
+	const snapshot = useStore(store);
+	const prefView = usePrefs(prefs);
+	const current = useCurrentProvider(currentModel);
+	const now = useNow(3e4);
+	const [open, setOpen] = (0, react.useState)(false);
+	const anchor = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		store.focusSession(sessionId);
+	}, [store, sessionId]);
+	if (!prefView.composer || snapshot.status === void 0) return null;
+	const shown = gaugeProviders(prefView, current, snapshot);
+	if (shown.length === 0 && popoverProviders(shown, snapshot).others.length === 0) return null;
+	const toggle = () => {
+		setOpen((value) => {
+			if (!value) store.refreshUsage("open");
+			return !value;
+		});
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		className: "dsm-gauge-slot",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			ref: anchor,
+			type: "button",
+			className: "dsm-gauge",
+			"aria-expanded": open,
+			"aria-haspopup": "dialog",
+			"aria-label": t("usageLabel"),
+			title: shown.length === 0 ? t("usageLabel") : void 0,
+			onClick: toggle,
+			children: shown.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "meter" }) : shown.map((provider) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+				className: "dsm-gp",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "dsm-gp-name",
+					children: shortName(snapshot.status, provider)
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Minis, {
+					t,
+					windows: windowsOf(snapshot, provider),
+					display: prefView.display,
+					now
+				})]
+			}, provider))
+		}), open ? (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Popover, {
+			t,
+			store,
+			prefs,
+			snapshot,
+			prefView,
+			shown,
+			now,
+			anchor,
+			onClose: () => {
+				setOpen(false);
+				anchor.current?.focus();
+			},
+			...openSettings === void 0 ? {} : { onOpenSettings: () => {
+				setOpen(false);
+				openSettings();
+			} }
+		}), document.body) : null]
+	});
+}
+function Popover({ t, store, prefs, snapshot, prefView, shown, now, anchor, onClose, onOpenSettings }) {
+	const panel = (0, react.useRef)(null);
+	const [position, setPosition] = (0, react.useState)();
+	const [openSections, setOpenSections] = (0, react.useState)(() => new Set(shown));
+	const [othersOpen, setOthersOpen] = (0, react.useState)(false);
+	const [openMore, setOpenMore] = (0, react.useState)(() => /* @__PURE__ */ new Set());
+	const [manualAt, setManualAt] = (0, react.useState)();
+	(0, react.useLayoutEffect)(() => {
+		const place = () => {
+			const a = anchor.current?.getBoundingClientRect();
+			const p = panel.current?.getBoundingClientRect();
+			if (a === void 0 || p === void 0) return;
+			const left = Math.min(Math.max(8, a.left + a.width / 2 - p.width / 2), window.innerWidth - p.width - 8);
+			const above = a.top - p.height - 8;
+			setPosition({
+				left,
+				top: above >= 8 ? above : a.bottom + 8
+			});
+		};
+		place();
+		window.addEventListener("resize", place);
+		return () => {
+			window.removeEventListener("resize", place);
+		};
+	}, [
+		anchor,
+		openSections,
+		openMore,
+		othersOpen,
+		snapshot
+	]);
+	(0, react.useEffect)(() => {
+		const onKey = (event) => {
+			if (event.key === "Escape") onClose();
+		};
+		const onPointer = (event) => {
+			const target = event.target;
+			if (!(target instanceof Node)) return;
+			if (panel.current?.contains(target) === true || anchor.current?.contains(target) === true) return;
+			onClose();
+		};
+		document.addEventListener("keydown", onKey);
+		document.addEventListener("pointerdown", onPointer, true);
+		return () => {
+			document.removeEventListener("keydown", onKey);
+			document.removeEventListener("pointerdown", onPointer, true);
+		};
+	}, [anchor, onClose]);
+	const { others } = popoverProviders(shown, snapshot);
+	const refreshing = snapshot.refreshing.size > 0;
+	const cooling = manualAt !== void 0 && now - manualAt < 3e4;
+	const toggleIn = (set, id) => {
+		const next = new Set(set);
+		if (next.has(id)) next.delete(id);
+		else next.add(id);
+		return next;
+	};
+	const renderSection = (provider) => {
+		const status = snapshot.status?.providers[provider];
+		if (status === void 0) return null;
+		const split = splitAccounts(status);
+		if (split === void 0) return null;
+		const { active, rest } = split;
+		const sectionOpen = openSections.has(provider);
+		const pinned = prefView.pinned.includes(provider);
+		const pinLabel = pinned ? t("unpin") : t("pin");
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "dsm-psec",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-psec-head",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					className: "dsm-fold",
+					"aria-expanded": sectionOpen,
+					onClick: () => {
+						setOpenSections((s) => toggleIn(s, provider));
+					},
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "dsm-fold-name",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+							name: "right",
+							size: 12,
+							className: "dsm-chev"
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "dsm-psec-name",
+							children: shortName(snapshot.status, provider)
+						})]
+					}), sectionOpen ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Minis, {
+						t,
+						windows: windowsOf(snapshot, provider),
+						display: prefView.display,
+						now
+					})]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsm-btn dsm-icon dsm-sm dsm-pin",
+					"aria-pressed": pinned,
+					title: pinLabel,
+					"aria-label": pinLabel,
+					onClick: () => {
+						prefs.togglePinned(provider);
+					},
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: pinned ? "pinFilled" : "pin",
+						size: 12
+					})
+				})]
+			}), sectionOpen ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-fold-body",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Account, {
+					t,
+					provider,
+					account: active,
+					status,
+					snapshot,
+					prefs: prefView,
+					now,
+					compact: true
+				}), rest.length === 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					className: "dsm-fold",
+					"aria-expanded": openMore.has(provider),
+					onClick: () => {
+						setOpenMore((s) => toggleIn(s, provider));
+					},
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "dsm-fold-name",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+							name: "right",
+							size: 12,
+							className: "dsm-chev"
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: rest.length === 1 ? rest[0].account ?? rest[0].key : tf(t, "moreAccounts", { count: rest.length }) })]
+					}), rest.length === 1 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MinisFor, {
+						t,
+						snapshot,
+						provider,
+						account: rest[0].key,
+						prefs: prefView,
+						now
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {})]
+				}), openMore.has(provider) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "dsm-fold-body",
+					children: rest.map((account) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Account, {
+						t,
+						provider,
+						account,
+						status,
+						snapshot,
+						prefs: prefView,
+						now,
+						compact: true
+					}, account.key))
+				}) : null] })]
+			}) : null]
+		}, provider);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		ref: panel,
+		className: "dsm-pop",
+		role: "dialog",
+		"aria-label": t("usageLabel"),
+		style: position === void 0 ? {
+			visibility: "hidden",
+			left: 0,
+			top: 0
+		} : {
+			left: position.left,
+			top: position.top
+		},
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-pop-head",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("b", { children: t("usage") }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: `dsm-btn dsm-icon${refreshing ? " dsm-spinning" : ""}`,
+						disabled: refreshing || cooling,
+						title: cooling ? tf(t, "refreshedWait", { seconds: Math.ceil((3e4 - (now - (manualAt ?? now))) / 1e3) }) : t("refreshNow"),
+						"aria-label": t("refreshNow"),
+						onClick: () => {
+							setManualAt(Date.now());
+							store.refreshUsage("manual");
+						},
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: cooling && !refreshing ? "check" : "refresh" })
+					}),
+					onOpenSettings === void 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "dsm-btn dsm-icon",
+						title: t("usageSettings"),
+						"aria-label": t("usageSettings"),
+						onClick: onOpenSettings,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "gear" })
+					})
+				]
+			}),
+			shown.map(renderSection),
+			shown.length === 0 ? others.map(renderSection) : others.length === 0 ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "dsm-psec dsm-others",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+					type: "button",
+					className: "dsm-fold",
+					"aria-expanded": othersOpen,
+					onClick: () => {
+						setOthersOpen((value) => !value);
+					},
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "dsm-fold-name",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+							name: "right",
+							size: 12,
+							className: "dsm-chev"
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "dsm-psec-name",
+							children: tf(t, "otherProviders", { count: others.length })
+						})]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {})]
+				}), othersOpen ? others.map(renderSection) : null]
+			})
+		]
+	});
+}
+function MinisFor({ t, snapshot, provider, account, prefs, now }) {
+	const entry = snapshot.usage.get(usageKey(provider, account));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Minis, {
+		t,
+		windows: entry?.kind === "ready" ? entry.usage.windows : void 0,
+		display: prefs.display,
+		now
+	});
+}
+
+//#endregion
+//#region src/client/Notice.tsx
+const DISMISSED_KEY = "dsh-plugin-subscription-usage.dismissed-notices";
+/** Dismissals survive reloads; one entry per window crossing. */
+function readDismissed() {
+	try {
+		const raw = JSON.parse(localStorage.getItem(DISMISSED_KEY) ?? "[]");
+		return new Set(Array.isArray(raw) ? raw.filter((id) => typeof id === "string") : []);
+	} catch {
+		return /* @__PURE__ */ new Set();
+	}
+}
+/**
+* The most urgent notice across the serving accounts, or undefined.
+* Only serving or default accounts warn; an idle account's pace is not the user's problem yet.
+*/
+function currentNotice(t, snapshot, now, dismissed) {
+	const candidates = [];
+	for (const provider of USAGE_PROVIDERS) {
+		if (!isMetered(snapshot.status, provider)) continue;
+		const status = snapshot.status?.providers[provider];
+		if (status === void 0) continue;
+		for (const account of status.accounts) {
+			if (account.key !== status.servingAccount && !account.isDefault) continue;
+			const entry = snapshot.usage.get(usageKey(provider, account.key));
+			if (entry?.kind !== "ready") continue;
+			for (const window$1 of entry.usage.windows ?? []) {
+				const notice = noticeFor(t, shortName(snapshot.status, provider), provider, account.key, window$1, now);
+				if (notice !== void 0 && !dismissed.has(notice.id)) candidates.push(notice);
+			}
+		}
+	}
+	candidates.sort((a, b) => a.rank - b.rank);
+	const top = candidates[0];
+	return top === void 0 ? void 0 : {
+		id: top.id,
+		tone: top.tone,
+		text: top.text
+	};
+}
+function noticeFor(t, name, provider, account, window$1, now) {
+	const p = pace(window$1, now);
+	const id = `${provider}/${account}/${window$1.kind}/${window$1.scope ?? ""}/${window$1.resetsAt ?? ""}`;
+	const label$1 = windowLabel(t, window$1);
+	if (p.state === "out") return {
+		id: `${id}/out`,
+		tone: "error",
+		rank: 0,
+		text: tf(t, "noticeOut", {
+			provider: name,
+			window: label$1
+		})
+	};
+	if (p.state === "over") return {
+		id: `${id}/over`,
+		tone: "warn",
+		rank: p.emptyAt - now,
+		text: tf(t, "noticeEmpty", {
+			provider: name,
+			window: label$1,
+			time: clockTime(p.emptyAt, now)
+		})
+	};
+}
+function Notice(props) {
+	const { store, prefs, t } = props;
+	if (store === void 0 || prefs === void 0 || t === void 0) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NoticeBody, {
+		store,
+		prefs,
+		t
+	});
+}
+function NoticeBody({ store, prefs, t }) {
+	const snapshot = useStore(store);
+	const view = usePrefs(prefs);
+	const now = useNow(6e4);
+	const [dismissed, setDismissed] = (0, react.useState)(readDismissed);
+	const notice = (0, react.useMemo)(() => view.paceWarnings ? currentNotice(t, snapshot, now, dismissed) : void 0, [
+		view.paceWarnings,
+		t,
+		snapshot,
+		now,
+		dismissed
+	]);
+	(0, react.useEffect)(() => {
+		const onStorage = (event) => {
+			if (event.key === DISMISSED_KEY) setDismissed(readDismissed());
+		};
+		window.addEventListener("storage", onStorage);
+		return () => {
+			window.removeEventListener("storage", onStorage);
+		};
+	}, []);
+	if (notice === void 0) return null;
+	const dismiss = () => {
+		const next = new Set(dismissed);
+		next.add(notice.id);
+		localStorage.setItem(DISMISSED_KEY, JSON.stringify([...next].slice(-50)));
+		setDismissed(next);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "dsm-notice-host",
+		style: { pointerEvents: "auto" },
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: `dsm-notice${notice.tone === "error" ? " dsm-err" : ""}`,
+			role: "status",
+			"aria-live": "polite",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "alert" }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: notice.text }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "dsm-btn dsm-icon",
+					"aria-label": t("dismiss"),
+					title: t("dismiss"),
+					onClick: dismiss,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { name: "x" })
+				})
+			]
+		})
+	});
+}
+
+//#endregion
+//#region src/client/ImageGallery.tsx
+/** Display box for a lone image (platform rule): long edge 240px with the
+* rendered aspect ratio clamped to [0.25, 4] — the overflow is cropped by
+* `object-fit: cover` — and never upscaled past the image's natural size. The
+* crop anchor keeps the top of very tall images and the left of very wide
+* ones, where the informative content usually starts. */
+function singleFit(attachment) {
+	const natural = attachment.width / attachment.height;
+	const ratio = Math.min(4, Math.max(.25, natural));
+	const box = ratio >= 1 ? {
+		width: 240,
+		height: 240 / ratio
+	} : {
+		width: 240 * ratio,
+		height: 240
+	};
+	const scale = Math.min(1, attachment.width / box.width, attachment.height / box.height);
+	return {
+		width: Math.max(1, Math.round(box.width * scale)),
+		height: Math.max(1, Math.round(box.height * scale)),
+		objectPosition: natural < .25 ? "center top" : natural > 4 ? "left center" : "center"
+	};
+}
+const styles$3 = {
+	gallery: {
+		display: "flex",
+		flexWrap: "wrap",
+		gap: 8,
+		justifyContent: "flex-start"
+	},
+	frame: {
+		display: "grid",
+		placeItems: "center",
+		overflow: "hidden",
+		padding: 0,
+		border: "1px solid var(--dsw-alias-border-l2-darkmode-thin)",
+		borderRadius: 8,
+		background: "var(--dsw-alias-interactive-bg-hover-solid)",
+		cursor: "zoom-in"
+	},
+	tile: {
+		width: 64,
+		height: 64
+	},
+	img: {
+		width: "100%",
+		height: "100%",
+		objectFit: "cover",
+		display: "block"
+	},
+	loading: {
+		fontSize: 12,
+		color: "var(--dsw-alias-label-tertiary)",
+		padding: "0 8px"
+	},
+	error: {
+		fontSize: 12,
+		color: "var(--dsw-alias-state-error-primary)",
+		cursor: "pointer",
+		border: "1px solid var(--dsw-alias-border-l2-darkmode-thin)",
+		borderRadius: 8,
+		background: "transparent",
+		padding: "6px 10px"
+	},
+	overlay: {
+		position: "fixed",
+		inset: 0,
+		zIndex: 1e3,
+		display: "grid",
+		placeItems: "center",
+		background: "rgba(0, 0, 0, 0.72)",
+		padding: 24
+	},
+	overlayImg: {
+		maxWidth: "92vw",
+		maxHeight: "92vh",
+		objectFit: "contain",
+		borderRadius: 4
+	},
+	close: {
+		position: "absolute",
+		top: 12,
+		right: 12,
+		width: 32,
+		height: 32,
+		display: "grid",
+		placeItems: "center",
+		border: "none",
+		borderRadius: "50%",
+		cursor: "pointer",
+		background: "rgba(255, 255, 255, 0.16)",
+		color: "#fff",
+		fontSize: 16,
+		lineHeight: 1
+	}
+};
+/**
+* Full-viewport original-image preview: backdrop or close-control click and
+* Escape all dismiss; the image itself is inert so a click on it does not
+* fall through to the backdrop dismissal.
+*/
+function ImageLightbox({ src, alt, labels, onClose }) {
+	(0, react.useEffect)(() => {
+		const onKey = (event) => {
+			if (event.key === "Escape") onClose();
+		};
+		window.addEventListener("keydown", onKey);
+		return () => {
+			window.removeEventListener("keydown", onKey);
+		};
+	}, [onClose]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		role: "dialog",
+		"aria-label": labels.dialog,
+		style: styles$3.overlay,
+		onClick: onClose,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+			src,
+			alt,
+			style: styles$3.overlayImg,
+			onClick: (event) => {
+				event.stopPropagation();
+			}
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			"aria-label": labels.close,
+			style: styles$3.close,
+			onClick: onClose,
+			children: "×"
+		})]
+	});
+}
+/**
+* Compact history renderer with retryable loading and click-to-open original
+* preview. A lone image renders at its `singleFit` size; an image among
+* several renders as a fixed 64px square tile.
+*/
+function MessageImage({ attachment, load, variant, labels }) {
+	const [src, setSrc] = (0, react.useState)(null);
+	const [error, setError] = (0, react.useState)(false);
+	const [open, setOpen] = (0, react.useState)(false);
+	const [attempt, setAttempt] = (0, react.useState)(0);
+	const retry = (0, react.useCallback)(() => {
+		setAttempt((a) => a + 1);
+	}, []);
+	const close = (0, react.useCallback)(() => {
+		setOpen(false);
+	}, []);
+	const fit = (0, react.useMemo)(() => variant === "single" ? singleFit(attachment) : void 0, [attachment, variant]);
+	(0, react.useEffect)(() => {
+		let live = true;
+		setError(false);
+		setSrc(null);
+		load(attachment).then((url) => {
+			if (live) setSrc(url);
+		}).catch(() => {
+			if (live) setError(true);
+		});
+		return () => {
+			live = false;
+		};
+	}, [
+		attachment,
+		load,
+		attempt
+	]);
+	const label$1 = attachment.name ?? labels.image;
+	if (error) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		style: styles$3.error,
+		onClick: retry,
+		children: labels.loadFailed
+	});
+	const box = fit === void 0 ? styles$3.tile : {
+		width: fit.width,
+		height: fit.height
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+		type: "button",
+		style: {
+			...styles$3.frame,
+			...box
+		},
+		title: labels.open,
+		"aria-label": labels.openNamed(label$1),
+		onClick: () => {
+			if (src !== null) setOpen(true);
+		},
+		children: src === null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			style: styles$3.loading,
+			children: labels.loading
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+			src,
+			alt: label$1,
+			style: {
+				...styles$3.img,
+				objectPosition: fit?.objectPosition
+			}
+		})
+	}), open && src !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ImageLightbox, {
+		src,
+		alt: label$1,
+		labels: labels.lightbox,
+		onClose: close
+	})] });
+}
+/** Wrapping image group: a lone image renders large, several render as 64px
+* square tiles (same rule as the platform gallery). */
+function ImageGallery({ images, load, labels }) {
+	if (images.length === 0) return null;
+	const variant = images.length === 1 ? "single" : "tile";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		style: styles$3.gallery,
+		children: images.map((image, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MessageImage, {
+			attachment: image.attachment,
+			load,
+			variant,
+			labels
+		}, `${image.attachment.attachmentId}:${index}`))
+	});
+}
+
+//#endregion
+//#region src/client/ImageGenerateToolview.tsx
+/** Title prompt truncation budget (characters). */
+const PROMPT_MAX_LENGTH$1 = 60;
+/**
+* Build the ImageGallery loader over the `image` endpoint.
+* @param rpc - Connection RPC caller.
+* @returns loader resolving an attachment ref to a data URL.
+*/
+function createImageLoader(rpc) {
+	return (attachment) => call(rpc, "image", { ...attachment }).then((result) => `data:${result.mediaType};base64,${result.dataBase64}`);
+}
+/**
+* English-dictionary fallback for a missing locale seat (standalone renders);
+* the framework always supplies the namespace-bound one.
+* @param key - dictionary key.
+* @param params - `{name}` template params.
+* @returns the template with params substituted.
+*/
+function fallbackTranslate$2(key, params) {
+	let text = en[key];
+	for (const [name, value] of Object.entries(params ?? {})) text = text.replaceAll(`{${name}}`, String(value));
+	return text;
+}
+/** Extract the prompt from the call's raw args JSON; falls back to the first string value, then the raw line. */
+function derivePrompt$1(argsRaw) {
+	let parsed;
+	try {
+		parsed = JSON.parse(argsRaw);
+	} catch {
+		parsed = void 0;
+	}
+	let prompt;
+	if (typeof parsed === "object" && parsed !== null) {
+		const args = parsed;
+		if (typeof args.prompt === "string" && args.prompt !== "") prompt = args.prompt;
+		else for (const value of Object.values(args)) if (typeof value === "string" && value !== "") {
+			prompt = value;
+			break;
+		}
+	}
+	const line = (prompt ?? argsRaw).split("\n", 1)[0] ?? "";
+	return line.length > PROMPT_MAX_LENGTH$1 ? `${line.slice(0, PROMPT_MAX_LENGTH$1)}…` : line;
+}
+/** Flatten a settled result's text blocks (the degraded text-only route and the error line). */
+function resultText$1(block) {
+	if (!("kind" in block)) return "";
+	const parts = [];
+	for (const part of block.content) if (part.type === "text") parts.push(part.text);
+	if (parts.length === 0 && block.error !== void 0) parts.push(`${block.error.name}: ${block.error.code}`);
+	return parts.join("\n");
+}
+/** Image attachments of a settled result; empty while running or on the text-only route. */
+function resultImages(block) {
+	if (!("kind" in block)) return [];
+	const images = [];
+	for (const part of block.content) if (part.type === "image") images.push({ attachment: part.attachment });
+	return images;
+}
+const styles$2 = {
+	container: {
+		display: "flex",
+		flexDirection: "column",
+		gap: 6,
+		padding: "4px 0"
+	},
+	row: {
+		display: "flex",
+		alignItems: "center",
+		gap: 6,
+		minWidth: 0
+	},
+	icon: {
+		display: "inline-flex",
+		flexShrink: 0,
+		color: "var(--dsw-alias-label-tertiary)"
+	},
+	title: {
+		fontSize: 13,
+		lineHeight: "20px",
+		color: "var(--dsw-alias-label-primary)",
+		overflow: "hidden",
+		textOverflow: "ellipsis",
+		whiteSpace: "nowrap"
+	},
+	subtle: {
+		margin: 0,
+		fontSize: 12,
+		lineHeight: "18px",
+		color: "var(--dsw-alias-label-tertiary)"
+	},
+	output: {
+		margin: 0,
+		fontSize: 12,
+		lineHeight: "18px",
+		color: "var(--dsw-alias-label-secondary)",
+		whiteSpace: "pre-wrap",
+		overflowWrap: "anywhere"
+	},
+	error: {
+		margin: 0,
+		fontSize: 12,
+		lineHeight: "18px",
+		color: "var(--dsw-alias-state-error-primary)"
+	}
+};
+/**
+* The `image_generate` keyed toolview component.
+* @param props - owner share, inject face, and locale seat (spread flat).
+* @returns the call row plus, once settled, the gallery / text / error body.
+*/
+function ImageGenerateToolview(props) {
+	const { block, load } = props;
+	const t = props.t ?? fallbackTranslate$2;
+	if (block === void 0) return null;
+	const settled = "kind" in block;
+	const argsRaw = (settled ? block.call?.argsRaw : "argsRaw" in block ? block.argsRaw : void 0) ?? "";
+	let references = 0;
+	try {
+		const args = JSON.parse(argsRaw);
+		if (Array.isArray(args?.referenceImages)) references = args.referenceImages.length;
+	} catch {}
+	const title = `image_generate${references > 0 ? ` (${references} ref)` : ""}: ${derivePrompt$1(argsRaw)}`;
+	const images = resultImages(block);
+	const text = settled ? resultText$1(block) : "";
+	const labels = {
+		image: t("image"),
+		open: t("viewImage"),
+		openNamed: (name) => t("viewImageNamed", { name }),
+		loading: t("imageLoading"),
+		loadFailed: t("imageLoadFailed"),
+		lightbox: {
+			dialog: t("imagePreview"),
+			close: t("imageClose")
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		style: styles$2.container,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				style: styles$2.row,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					style: styles$2.icon,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: "sparkle",
+						size: 14
+					})
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					style: styles$2.title,
+					children: title
+				})]
+			}),
+			!settled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				style: styles$2.subtle,
+				children: t("generating")
+			}),
+			settled && block.isError && text !== "" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				style: styles$2.error,
+				children: text.split("\n", 1)[0]
+			}),
+			settled && !block.isError && images.length > 0 && load !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ImageGallery, {
+				images,
+				load,
+				labels
+			}),
+			settled && !block.isError && images.length === 0 && text !== "" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				style: styles$2.output,
+				children: text
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/client/VideoGenerateToolview.tsx
+/** Title prompt truncation budget (characters). */
+const PROMPT_MAX_LENGTH = 60;
+/**
+* Build the video loader over the `/subscriptions-auth` `video` endpoint.
+* @param rpc - Connection RPC caller.
+* @returns loader resolving a bare file name to the decoded bytes.
+*/
+function createVideoLoader(rpc) {
+	return (name) => call(rpc, "video", { name });
+}
+/**
+* English-dictionary fallback for a missing locale seat (standalone renders);
+* the framework always supplies the namespace-bound one.
+*/
+function fallbackTranslate$1(key, params) {
+	let text = en[key];
+	for (const [name, value] of Object.entries(params ?? {})) text = text.replaceAll(`{${name}}`, String(value));
+	return text;
+}
+/** Extract the prompt from the call's raw args JSON; falls back to the first string value, then the raw line. */
+function derivePrompt(argsRaw) {
+	let parsed;
+	try {
+		parsed = JSON.parse(argsRaw);
+	} catch {
+		parsed = void 0;
+	}
+	let prompt;
+	if (typeof parsed === "object" && parsed !== null) {
+		const args = parsed;
+		if (typeof args.prompt === "string" && args.prompt !== "") prompt = args.prompt;
+		else for (const value of Object.values(args)) if (typeof value === "string" && value !== "") {
+			prompt = value;
+			break;
+		}
+	}
+	const line = (prompt ?? argsRaw).split("\n", 1)[0] ?? "";
+	return line.length > PROMPT_MAX_LENGTH ? `${line.slice(0, PROMPT_MAX_LENGTH)}…` : line;
+}
+/** Flatten a settled result's text blocks (the fallback body and the error line). */
+function resultText(block) {
+	if (!("kind" in block)) return "";
+	const parts = [];
+	for (const part of block.content) if (part.type === "text") parts.push(part.text);
+	if (parts.length === 0 && block.error !== void 0) parts.push(`${block.error.name}: ${block.error.code}`);
+	return parts.join("\n");
+}
+/**
+* The generated video's bare file name: presentation meta first (top-level
+* dispatches), then the render text's "Saved video to …" line (nested
+* dispatches compute no meta).
+*/
+function resolveFileName(block) {
+	if (!("kind" in block)) return void 0;
+	const meta = block.meta;
+	if (typeof meta === "object" && meta !== null) {
+		const fileName = meta.fileName;
+		if (typeof fileName === "string" && fileName.length > 0) return fileName;
+	}
+	const match = /^Saved video to (.+\.mp4)/m.exec(resultText(block));
+	if (match === null) return void 0;
+	const path = match[1];
+	return path.slice(path.lastIndexOf("/") + 1);
+}
+/** Decode a base64 payload into bytes (browser-side; no Buffer). */
+function base64Bytes(dataBase64) {
+	const binary = atob(dataBase64);
+	const bytes = new Uint8Array(binary.length);
+	for (let index = 0; index < binary.length; index++) bytes[index] = binary.charCodeAt(index);
+	return bytes;
+}
+const styles$1 = {
+	container: {
+		display: "flex",
+		flexDirection: "column",
+		gap: 6,
+		padding: "4px 0"
+	},
+	row: {
+		display: "flex",
+		alignItems: "center",
+		gap: 6,
+		minWidth: 0
+	},
+	icon: {
+		display: "inline-flex",
+		flexShrink: 0,
+		color: "var(--dsw-alias-label-tertiary)"
+	},
+	title: {
+		fontSize: 13,
+		lineHeight: "20px",
+		color: "var(--dsw-alias-label-primary)",
+		overflow: "hidden",
+		textOverflow: "ellipsis",
+		whiteSpace: "nowrap"
+	},
+	subtle: {
+		margin: 0,
+		fontSize: 12,
+		lineHeight: "18px",
+		color: "var(--dsw-alias-label-tertiary)"
+	},
+	output: {
+		margin: 0,
+		fontSize: 12,
+		lineHeight: "18px",
+		color: "var(--dsw-alias-label-secondary)",
+		whiteSpace: "pre-wrap",
+		overflowWrap: "anywhere"
+	},
+	error: {
+		margin: 0,
+		fontSize: 12,
+		lineHeight: "18px",
+		color: "var(--dsw-alias-state-error-primary)"
+	},
+	video: {
+		display: "block",
+		maxWidth: 480,
+		width: "100%",
+		borderRadius: 8,
+		backgroundColor: "var(--dsw-alias-fill-tertiary)"
+	}
+};
+/**
+* The `video_generate` keyed toolview component.
+* @param props - owner share, inject face, and locale seat (spread flat).
+* @returns the call row plus, once settled, the player / text / error body.
+*/
+function VideoGenerateToolview(props) {
+	const { block, loadVideo } = props;
+	const t = props.t ?? fallbackTranslate$1;
+	const settled = block !== void 0 && "kind" in block;
+	const isError = settled && block.isError;
+	const fileName = block !== void 0 && settled && !isError ? resolveFileName(block) : void 0;
+	const [load, setLoad] = (0, react.useState)({ phase: "loading" });
+	(0, react.useEffect)(() => {
+		if (fileName === void 0 || loadVideo === void 0) return;
+		let cancelled = false;
+		let objectUrl;
+		setLoad({ phase: "loading" });
+		loadVideo(fileName).then((video) => {
+			if (cancelled) return;
+			objectUrl = URL.createObjectURL(new Blob([base64Bytes(video.dataBase64).slice()], { type: video.mediaType }));
+			setLoad({
+				phase: "ready",
+				url: objectUrl
+			});
+		}, (error) => {
+			if (cancelled) return;
+			setLoad({
+				phase: "failed",
+				message: error instanceof Error ? error.message : String(error)
+			});
+		});
+		return () => {
+			cancelled = true;
+			if (objectUrl !== void 0) URL.revokeObjectURL(objectUrl);
+		};
+	}, [fileName, loadVideo]);
+	if (block === void 0) return null;
+	const title = `video_generate: ${derivePrompt((settled ? block.call?.argsRaw : "argsRaw" in block ? block.argsRaw : void 0) ?? "")}`;
+	const text = settled ? resultText(block) : "";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		style: styles$1.container,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				style: styles$1.row,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					style: styles$1.icon,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+						name: "sparkle",
+						size: 14
+					})
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					style: styles$1.title,
+					children: title
+				})]
+			}),
+			!settled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				style: styles$1.subtle,
+				children: t("generatingVideo")
+			}),
+			settled && isError && text !== "" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				style: styles$1.error,
+				children: text.split("\n", 1)[0]
+			}),
+			settled && !isError && fileName !== void 0 && load.phase === "loading" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				style: styles$1.subtle,
+				children: t("videoLoading")
+			}),
+			settled && !isError && fileName !== void 0 && load.phase === "failed" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				style: styles$1.error,
+				children: t("videoLoadFailed", { message: load.message })
+			}),
+			settled && !isError && fileName !== void 0 && load.phase === "ready" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("video", {
+				style: styles$1.video,
+				src: load.url,
+				controls: true,
+				preload: "metadata"
+			}),
+			settled && !isError && fileName === void 0 && text !== "" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				style: styles$1.output,
+				children: text
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/client/SpeedSelect.tsx
+/**
+* The `loadSpeed` half of the inject face: the plugin's own speed state plus
+* the host's current model selection (the visibility gate). A model-RPC
+* failure throws rather than answering "hidden" — the caller keeps its last
+* known state, so a transient failure never locks the toggle away.
+*
+* `sessionId` is a plain string: slot and command contexts brand it through
+* different dsh-session copies, and only the service boundary needs one.
+*
+* `models` resolves lazily per call: the ui-model-selection service may
+* register after this plugin applies, and a shell without it (no model seat
+* at all) simply keeps the toggle hidden.
+*/
+function createSpeedLoader(connection, models, sessionId) {
+	return async () => {
+		const directory = models()?.directoryFor(sessionId);
+		const current = (await directory?.load())?.current ?? null;
+		const state = await call(connection.rpc, "speed", {
+			sessionId,
+			...current?.provider === "codex" ? { model: current.model } : {}
+		});
+		const visible = current !== null && current.provider === "codex" && state.fastModels.includes(current.model);
+		const latest = (await directory?.load())?.current ?? null;
+		if (latest?.provider !== current?.provider || latest?.model !== current?.model) throw new Error("Model changed while loading speed");
+		return {
+			visible,
+			tier: state.tier,
+			...visible && current ? { model: current.model } : {}
+		};
+	};
+}
+/** The `setSpeed` half of the inject face: boolean outcome for the component's busy state. */
+function createSpeedSetter(connection, sessionId, models) {
+	return async (tier, displayedModel) => {
+		try {
+			const directories = models?.();
+			const current = directories === void 0 ? null : (await directories.directoryFor(sessionId).load()).current;
+			if (models !== void 0 && current?.provider !== "codex") return false;
+			if (displayedModel !== void 0 && current?.model !== displayedModel) return false;
+			await call(connection.rpc, "setSpeed", {
+				sessionId,
+				tier,
+				...current?.provider === "codex" ? { model: current.model } : {}
+			});
+			return true;
+		} catch {
+			return false;
+		}
+	};
+}
+/** English-dictionary fallback for a missing inject `t` (standalone renders). */
+function fallbackTranslate(key) {
+	return en[key];
+}
+const TIERS = ["standard", "fast"];
+/**
+* The composer Speed control: a trigger reading `速度 · 快速`/`速度 · 标准`
+* that opens a two-row menu (standard/fast with descriptions, check mark on
+* the current tier). Mount and every open reload the host state so a model
+* switch made since the last open self-corrects.
+*/
+/** How often the control re-reads the host state (model switches arrive only by asking). */
+const POLL_INTERVAL_MS = 3e3;
+/**
+* The composer Speed control: a trigger reading `速度 · 快速`/`速度 · 标准`
+* that opens a two-row menu (standard/fast with descriptions, check mark on
+* the current tier). The host pushes nothing on a model switch, so the
+* control re-reads on a slow poll with a single-flight guard; a failed read
+* keeps the last known state, so a transient RPC failure can never lock the
+* toggle away (the earlier mount-only load had no recovery path).
+*/
+function SpeedSelect({ loadSpeed, setSpeed, t }) {
+	const translate = t ?? fallbackTranslate;
+	const [state, setState] = (0, react.useState)(null);
+	const [open, setOpen] = (0, react.useState)(false);
+	const [busy, setBusy] = (0, react.useState)(false);
+	const rootRef = (0, react.useRef)(null);
+	const loadRef = (0, react.useRef)(loadSpeed);
+	loadRef.current = loadSpeed;
+	const generation = (0, react.useRef)(0);
+	const mounted = (0, react.useRef)(false);
+	const refresh = async () => {
+		if (!mounted.current) return;
+		const id = ++generation.current;
+		try {
+			const loaded = await loadRef.current?.();
+			if (loaded && id === generation.current) setState(loaded);
+		} catch {}
+	};
+	(0, react.useEffect)(() => {
+		if (loadRef.current === void 0) return;
+		mounted.current = true;
+		let cancelled = false;
+		let inflight = false;
+		const reload = () => {
+			if (loadRef.current === void 0 || inflight || cancelled) return;
+			inflight = true;
+			refresh().finally(() => {
+				inflight = false;
+			});
+		};
+		reload();
+		const timer = setInterval(reload, POLL_INTERVAL_MS);
+		return () => {
+			mounted.current = false;
+			++generation.current;
+			cancelled = true;
+			clearInterval(timer);
+		};
+	}, []);
+	(0, react.useEffect)(() => {
+		if (!open) return;
+		const closeOutside = (event) => {
+			if (!rootRef.current?.contains(event.target)) setOpen(false);
+		};
+		document.addEventListener("mousedown", closeOutside);
+		return () => {
+			document.removeEventListener("mousedown", closeOutside);
+		};
+	}, [open]);
+	if (loadSpeed === void 0 || setSpeed === void 0 || state === null || !state.visible) return null;
+	const choose = (tier) => {
+		if (busy) return;
+		if (tier === state.tier) {
+			setOpen(false);
+			return;
+		}
+		setBusy(true);
+		setSpeed(tier, state.model).then((ok) => {
+			if (!mounted.current) return;
+			setBusy(false);
+			if (ok) setOpen(false);
+			refresh();
+		}, () => {
+			if (mounted.current) {
+				setBusy(false);
+				refresh();
+			}
+		});
+	};
+	const show = () => {
+		setOpen(true);
+		refresh();
+	};
+	const tierName = (tier) => translate(tier === "fast" ? "speedFast" : "speedStandard");
+	const tierDescription = (tier) => translate(tier === "fast" ? "speedFastDescription" : "speedStandardDescription");
+	const triggerLabel = `${translate("speed")} · ${tierName(state.tier)}`;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		ref: rootRef,
+		className: "dsh-subscription-speed",
+		style: styles.root,
+		onKeyDown: (event) => {
+			if (event.key === "Escape" && open) {
+				event.preventDefault();
+				setOpen(false);
+			}
+		},
+		children: [open && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			style: styles.menu,
+			role: "menu",
+			"aria-label": translate("speed"),
+			children: TIERS.map((tier) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+				type: "button",
+				role: "menuitemradio",
+				"aria-checked": tier === state.tier,
+				style: styles.item,
+				disabled: busy,
+				onClick: () => {
+					choose(tier);
+				},
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					style: styles.itemCheck,
+					children: tier === state.tier ? "✓" : ""
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					style: styles.itemText,
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						style: styles.itemName,
+						children: tierName(tier)
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						style: styles.itemDescription,
+						children: tierDescription(tier)
+					})]
+				})]
+			}, tier))
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			type: "button",
+			style: styles.trigger,
+			"aria-haspopup": "menu",
+			"aria-expanded": open,
+			title: triggerLabel,
+			disabled: busy,
+			onClick: () => {
+				if (open) setOpen(false);
+				else show();
+			},
+			children: triggerLabel
+		})]
+	});
+}
+const styles = {
+	root: {
+		position: "relative",
+		display: "inline-flex"
+	},
+	trigger: {
+		border: "0.5px solid var(--dsw-alias-border-l3)",
+		borderRadius: "var(--dsw-radius-sm, 8px)",
+		background: "var(--dsh-subscription-speed-hover, transparent)",
+		color: "var(--dsw-alias-label-secondary)",
+		font: "inherit",
+		fontSize: 12,
+		lineHeight: "18px",
+		padding: "2px 8px",
+		cursor: "pointer",
+		whiteSpace: "nowrap"
+	},
+	menu: {
+		position: "absolute",
+		bottom: "100%",
+		right: 0,
+		marginBottom: 4,
+		minWidth: 180,
+		padding: 4,
+		zIndex: 20,
+		background: "var(--dsw-specific-menu, var(--dsw-alias-bg-layer-2))",
+		border: 0,
+		boxShadow: "var(--dsw-elevation-prominent)",
+		borderRadius: "var(--dsw-radius-lg, 16px)",
+		display: "flex",
+		flexDirection: "column",
+		gap: 2
+	},
+	item: {
+		display: "flex",
+		alignItems: "flex-start",
+		gap: 6,
+		width: "100%",
+		border: "none",
+		borderRadius: "var(--dsw-radius-sm, 8px)",
+		background: "var(--dsh-subscription-speed-hover, transparent)",
+		padding: "6px 8px",
+		cursor: "pointer",
+		font: "inherit",
+		textAlign: "left"
+	},
+	itemCheck: {
+		width: 14,
+		flexShrink: 0,
+		fontSize: 12,
+		lineHeight: "18px",
+		color: "var(--dsw-alias-label-primary)"
+	},
+	itemText: {
+		display: "flex",
+		flexDirection: "column"
+	},
+	itemName: {
+		fontSize: 12,
+		lineHeight: "18px",
+		color: "var(--dsw-alias-label-primary)"
+	},
+	itemDescription: {
+		fontSize: 11,
+		lineHeight: "16px",
+		color: "var(--dsw-alias-label-tertiary)"
+	}
+};
+
+//#endregion
+//#region src/client/fast-command.ts
+/** Build the locale resolver used by the /fast command contribution. */
+function fastCommandDescription(t) {
+	return () => t();
+}
+
+//#endregion
+//#region src/client/index.ts
+/** The Host entry id from cordis.patch.yml; the Models page dispatches our card by it. */
+const ENTRY_ID = "subscription-models";
+const inject = [
+	"slots",
+	"connection",
+	"locale"
+];
+const hasMethod = (value, name) => typeof value === "object" && value !== null && name in value && typeof value[name] === "function";
+function apply(ctx) {
+	ctx.effect(() => ctx.locale.register(LOCALE_NS, {
+		en,
+		zh
+	}), "dsh-plugin-subscription-usage: copy");
+	ctx.effect(() => {
+		const style = document.createElement("style");
+		style.dataset.plugin = "dsh-plugin-subscription-usage";
+		style.textContent = css;
+		document.head.appendChild(style);
+		return () => {
+			style.remove();
+		};
+	}, "dsh-plugin-subscription-usage: stylesheet");
+	const connection = ctx.get("connection");
+	const t = ctx.locale.bind(LOCALE_NS);
+	const store = new SubscriptionsStore(connection.rpc);
+	const prefs = new PrefsStore();
+	const surface = () => ({
+		store,
+		prefs,
+		rpc: connection.rpc,
+		t
+	});
+	ctx.inject(["configForms"], (scope) => {
+		const forms = scope.get("configForms");
+		if (!hasMethod(forms, "get")) return;
+		scope.effect(() => prefs.bind(forms.get(ENTRY_ID)), "dsh-plugin-subscription-usage: usage preferences");
+	});
+	ctx.slots.inject("settings.models.provider-card", () => ctx.slots.register({
+		name: "settings.models.provider-card",
+		key: ENTRY_ID,
+		inject: surface
+	}, ProviderCard));
+	ctx.slots.inject("settings.models.footer", () => ctx.slots.register({
+		name: "settings.models.footer",
+		id: "subscription-models",
+		order: 10,
+		inject: surface
+	}, Footer));
+	ctx.slots.inject("settings.section", () => ctx.slots.register({
+		name: "settings.section",
+		id: "subscription-usage",
+		order: 11,
+		label: () => t("usage"),
+		inject: surface
+	}, Usage));
+	ctx.slots.inject("settings.section.icon", () => ctx.slots.register({
+		name: "settings.section.icon",
+		id: "subscription-usage"
+	}, UsageNavIcon));
+	const models = () => {
+		const service = ctx.get("modelDirectories");
+		return hasMethod(service, "directoryFor") ? service : void 0;
+	};
+	const gaugeInject = (sessionId) => {
+		let currentModel;
+		try {
+			currentModel = models()?.directoryFor(sessionId).store;
+		} catch {}
+		return {
+			...surface(),
+			sessionId,
+			currentModel
+		};
+	};
+	ctx.slots.inject("conversation.composer.dock", () => ctx.slots.register({
+		name: "conversation.composer.dock",
+		id: "subscription-models.gauge",
+		order: 10,
+		inject: gaugeInject
+	}, Gauge));
+	ctx.slots.inject("conversation.hero.options", () => ctx.slots.register({
+		name: "conversation.hero.options",
+		id: "subscription-models.gauge",
+		order: 10,
+		inject: gaugeInject
+	}, Gauge));
+	ctx.slots.inject("shell.overlay", () => ctx.slots.register({
+		name: "shell.overlay",
+		id: "subscription-models.notice",
+		order: 50,
+		inject: surface
+	}, Notice));
+	ctx.slots.inject("tool.call.toolview", () => ctx.slots.register({
+		name: "tool.call.toolview",
+		key: "image_generate",
+		locale: LOCALE_NS,
+		inject: () => ({ load: createImageLoader(connection.rpc) })
+	}, ImageGenerateToolview));
+	ctx.slots.inject("tool.call.toolview", () => ctx.slots.register({
+		name: "tool.call.toolview",
+		key: "video_generate",
+		locale: LOCALE_NS,
+		inject: () => ({ loadVideo: createVideoLoader(connection.rpc) })
+	}, VideoGenerateToolview));
+	ctx.slots.inject("conversation.input.right", () => ctx.slots.register({
+		name: "conversation.input.right",
+		id: "codex-speed",
+		order: 0,
+		locale: LOCALE_NS,
+		inject: (sessionId) => ({
+			loadSpeed: createSpeedLoader(connection, models, sessionId),
+			setSpeed: createSpeedSetter(connection, sessionId, models)
+		})
+	}, SpeedSelect));
+	ctx.inject(["commandUi"], (scope) => {
+		const command = scope.get("commandUi");
+		scope.effect(() => command.register({
+			name: "fast",
+			description: fastCommandDescription(() => t("commandFast")),
+			available: () => true,
+			ui: {
+				kind: "popupSelect",
+				options: async (session) => {
+					const state = await createSpeedLoader(connection, models, session.sessionId)();
+					if (!state.visible) throw new Error(t("commandFastUnavailable"));
+					return [{
+						id: "standard",
+						label: t("speedStandard"),
+						detail: t("speedStandardDescription")
+					}, {
+						id: "fast",
+						label: t("speedFast"),
+						detail: t("speedFastDescription")
+					}].map((option) => ({
+						...option,
+						active: option.id === state.tier
+					}));
+				},
+				onSelect: async (option, session) => {
+					await createSpeedSetter(connection, session.sessionId, models)(option.id === "fast" ? "fast" : "standard");
+				}
+			}
+		}), "dsh-plugin-subscription-usage: /fast");
+	});
+}
+
+//#endregion
+exports.apply = apply;
+exports.inject = inject;
+return module.exports; } });
+//# sourceMappingURL=client.js.map