@liberseek/boft-cli-win32-arm64 0.6.5 → 0.6.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -15526,6 +15526,9 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
15526
15526
  accountCredits: accountCreditsSnapshotSchema.optional()
15527
15527
  }).strict();
15528
15528
 
15529
+ // ../shared-contracts/dist/reasoning-transcript.js
15530
+ var REASONING_TRANSCRIPT_COMMAND = "thinking";
15531
+
15529
15532
  // ../shared-contracts/dist/harness-session-import.js
15530
15533
  var HARNESS_SESSION_IMPORT_ID_MAX_LENGTH = 1024;
15531
15534
  var HARNESS_SESSION_IMPORT_CWD_MAX_LENGTH = 16384;
@@ -17079,13 +17082,7 @@ ${error51.stderrTail}`] : []
17079
17082
  copyPrompt.setAttribute("aria-describedby", `${item.key}-install-prompt-tooltip`);
17080
17083
  setActionButtonLabel(copyPrompt, "copy", messages.connectionCopyPrompt);
17081
17084
  copyPrompt.addEventListener("click", () => {
17082
- copyTextToClipboard(
17083
- document2,
17084
- copyPrompt,
17085
- prompt,
17086
- messages,
17087
- messages.connectionCopyPrompt
17088
- );
17085
+ copyTextToClipboard(document2, copyPrompt, prompt, messages, messages.connectionCopyPrompt);
17089
17086
  });
17090
17087
  const tooltip = document2.createElement("div");
17091
17088
  tooltip.id = `${item.key}-install-prompt-tooltip`;
@@ -17693,6 +17690,9 @@ ${error51.stderrTail}`] : []
17693
17690
  connectionSection: "Connections",
17694
17691
  generalSection: "General",
17695
17692
  otherSection: "Other",
17693
+ appearanceDescription: "Adjust how thinking text is displayed in the conversation.",
17694
+ reasoningSoftWrapTitle: "Wrap thinking text",
17695
+ reasoningSoftWrapDescription: "Wrap long thinking lines in the transcript. Ordinary shell output is unaffected. Off by default.",
17696
17696
  pageUnavailable: "Page unavailable",
17697
17697
  inDevelopment: "In development",
17698
17698
  notAvailable: "Not available",
@@ -17729,30 +17729,30 @@ ${error51.stderrTail}`] : []
17729
17729
  sessionImportPathCopyFailed: "Copy failed",
17730
17730
  sessionImportRetryOpen: "Try opening again",
17731
17731
  sessionImportRetrying: "Opening...",
17732
- connectionsDescription: "Add and configure Agent Harnesses supported by the system.",
17733
17732
  pluginsDescription: "Extend and manage Codex plugins.",
17734
17733
  pluginsRefresh: "Scan environment",
17735
17734
  pluginsRefreshing: "Scanning...",
17736
- accountsDescription: "Choose the default account for new Codex tasks and check account limits.",
17737
- accountTaskHint: "Existing tasks keep the account they were created with. Multi-account is currently available for Codex.",
17738
- accountConnected: "Connected accounts",
17739
- accountDefaultBadge: "Default",
17740
- accountAdd: "Add Account",
17735
+ connectionsDescription: "View runtime status by Host. Select an item to inspect details or complete its setup.",
17736
+ accountsDescription: "View accounts and limits across Agents, and manage your Codex default account.",
17737
+ accountConnected: "Accounts",
17738
+ accountDefaultBadge: "Codex default",
17739
+ accountAdd: "Add Codex account",
17741
17740
  accountColumnAccount: "Account",
17742
- accountColumnUsage: "Limits",
17743
- accountColumnActions: "Actions",
17744
- accountSearch: "Search accounts\u2026",
17745
- accountEmpty: "No accounts yet. Add an account to get started.",
17741
+ accountColumnActions: "Manage",
17742
+ accountSearch: "Search accounts or Agents\u2026",
17743
+ accountEmpty: "No accounts yet. Add a Codex account or sign in to an Agent in its native client.",
17746
17744
  accountNoMatches: "No matching accounts.",
17747
- accountLoginHelp: "Before signing in",
17748
- harnessAccountsTitle: "Other detected accounts",
17745
+ accountNativeManaged: "Native management",
17746
+ accountNativeManagementHint: "This account comes from {harness}'s native authentication. This page only displays identity and limits; manage sign-in, sign-out and switching in the native client.",
17747
+ accountMore: "Codex account actions",
17748
+ accountDetailsClose: "Close account details",
17749
+ accountDefaultHint: "Use as the default for new Codex tasks only",
17749
17750
  accountCreditsRemaining: "Remaining",
17750
17751
  accountCreditsLoading: "Loading limits\u2026",
17751
17752
  accountCreditsEmpty: "No limit data available",
17752
17753
  accountCreditsFailed: "Could not load limits",
17753
17754
  accountCreditsRetry: "Retry",
17754
17755
  accountCreditsRefresh: "Refresh limits",
17755
- accountResetCreditsUnknown: "No reset card data available",
17756
17756
  accountCreateFailed: "Could not add the Account.",
17757
17757
  accountDelete: "Delete",
17758
17758
  accountDeleteConfirm: "Delete this Account and its local data? This cannot be undone.",
@@ -17762,7 +17762,6 @@ ${error51.stderrTail}`] : []
17762
17762
  accountUse: "Set as default",
17763
17763
  accountSignIn: "Sign in",
17764
17764
  accountSigningIn: "Starting device sign-in...",
17765
- accountDeviceCodePrerequisite: "Before signing in, enable \u201CEnable device code authorization for Codex\u201D in Web Settings \u2192 Account security & sign-in.",
17766
17765
  accountVerificationDescription: "Open the verification page and enter this one-time code:",
17767
17766
  accountCopyCode: "Copy code",
17768
17767
  accountCopied: "Copied",
@@ -17773,8 +17772,13 @@ ${error51.stderrTail}`] : []
17773
17772
  accountAuthApiPrefix: "API",
17774
17773
  accountAuthChatPrefix: "Account",
17775
17774
  accountAuthApiIdentityFallback: "BANK OF TOKEN",
17775
+ accountSectionApi: "API",
17776
+ accountSectionChat: "Accounts",
17776
17777
  accountCreditsUsed: "Used",
17777
- accountCreditsReset: "reset",
17778
+ accountCreditsResetAt: "Quota resets: {time}",
17779
+ accountCreditsResetIn: "Quota resets in {time}",
17780
+ accountCreditsResetPending: "Awaiting refresh",
17781
+ accountCreditsResetPendingHint: "The reset time has passed; refresh to check the actual quota.",
17778
17782
  accountCreditsPeriodWeekly: "Weekly limit",
17779
17783
  accountCreditsPeriodMonthly: "Monthly limit",
17780
17784
  accountCreditsPeriodFiveHour: "5-hour",
@@ -17907,6 +17911,7 @@ ${error51.stderrTail}`] : []
17907
17911
  pageLabels: Object.freeze({
17908
17912
  connections: "Agents",
17909
17913
  plugins: "Plugins",
17914
+ appearance: "Appearance",
17910
17915
  accounts: "Accounts",
17911
17916
  "session-import": "Sessions",
17912
17917
  updates: "Updates",
@@ -17921,6 +17926,9 @@ ${error51.stderrTail}`] : []
17921
17926
  connectionSection: "\u8FDE\u63A5",
17922
17927
  generalSection: "\u901A\u7528",
17923
17928
  otherSection: "\u5176\u4ED6",
17929
+ appearanceDescription: "\u8C03\u6574\u4F1A\u8BDD\u4E2D\u601D\u8003\u6587\u672C\u7684\u663E\u793A\u65B9\u5F0F\u3002",
17930
+ reasoningSoftWrapTitle: "\u6362\u884C\u663E\u793A\u601D\u8003\u6587\u672C",
17931
+ reasoningSoftWrapDescription: "\u8BA9\u601D\u8003\u5757\u4E2D\u7684\u957F\u884C\u81EA\u52A8\u6362\u884C\u3002\u666E\u901A Shell \u8F93\u51FA\u4E0D\u53D7\u5F71\u54CD\u3002\u9ED8\u8BA4\u5173\u95ED\u3002",
17924
17932
  pageUnavailable: "\u9875\u9762\u4E0D\u53EF\u7528",
17925
17933
  inDevelopment: "\u5F00\u53D1\u4E2D",
17926
17934
  notAvailable: "\u6682\u4E0D\u53EF\u7528",
@@ -17957,30 +17965,30 @@ ${error51.stderrTail}`] : []
17957
17965
  sessionImportPathCopyFailed: "\u590D\u5236\u5931\u8D25",
17958
17966
  sessionImportRetryOpen: "\u91CD\u8BD5\u6253\u5F00",
17959
17967
  sessionImportRetrying: "\u6B63\u5728\u6253\u5F00\u2026\u2026",
17960
- connectionsDescription: "\u6DFB\u52A0\u548C\u914D\u7F6E\u7CFB\u7EDF\u4E2D\u652F\u6301\u7684 Agent Harness\u3002",
17961
17968
  pluginsDescription: "\u6269\u5C55\u548C\u7BA1\u7406 Codex \u7684\u63D2\u4EF6\u3002",
17962
17969
  pluginsRefresh: "\u626B\u63CF\u73AF\u5883",
17963
17970
  pluginsRefreshing: "\u6B63\u5728\u626B\u63CF...",
17964
- accountsDescription: "\u9009\u62E9\u65B0\u5EFA Codex \u4EFB\u52A1\u7684\u9ED8\u8BA4\u8D26\u53F7\uFF0C\u5E76\u67E5\u770B\u5404\u8D26\u53F7\u989D\u5EA6\u3002",
17965
- accountTaskHint: "\u5207\u6362\u9ED8\u8BA4\u8D26\u53F7\u4E0D\u4F1A\u5F71\u54CD\u5DF2\u5F00\u59CB\u7684\u4EFB\u52A1\u3002\u76EE\u524D\u4EC5\u652F\u6301 Codex \u591A\u8D26\u53F7\u3002",
17966
- accountConnected: "\u5DF2\u8FDE\u63A5\u8D26\u53F7",
17967
- accountDefaultBadge: "\u9ED8\u8BA4",
17968
- accountAdd: "\u6DFB\u52A0\u8D26\u53F7",
17971
+ connectionsDescription: "\u6309 Host \u67E5\u770B\u8FD0\u884C\u65F6\u72B6\u6001\u3002\u9009\u62E9\u4E00\u9879\uFF0C\u5728\u53F3\u4FA7\u68C0\u67E5\u8BE6\u60C5\u6216\u5B8C\u6210\u914D\u7F6E\u3002",
17972
+ accountsDescription: "\u67E5\u770B\u5404 Agent \u7684\u8D26\u53F7\u4E0E\u989D\u5EA6\uFF0C\u7BA1\u7406 Codex \u9ED8\u8BA4\u8D26\u53F7\u3002",
17973
+ accountConnected: "\u8D26\u53F7",
17974
+ accountDefaultBadge: "Codex \u9ED8\u8BA4",
17975
+ accountAdd: "\u6DFB\u52A0 Codex \u8D26\u53F7",
17969
17976
  accountColumnAccount: "\u8D26\u53F7",
17970
- accountColumnUsage: "\u989D\u5EA6",
17971
- accountColumnActions: "\u64CD\u4F5C",
17972
- accountSearch: "\u641C\u7D22\u8D26\u53F7\u2026",
17973
- accountEmpty: "\u8FD8\u6CA1\u6709\u8D26\u53F7\uFF0C\u6DFB\u52A0\u4E00\u4E2A\u8D26\u53F7\u5373\u53EF\u5F00\u59CB\u3002",
17977
+ accountColumnActions: "\u7BA1\u7406",
17978
+ accountSearch: "\u641C\u7D22\u8D26\u53F7\u6216 Agent\u2026",
17979
+ accountEmpty: "\u8FD8\u6CA1\u6709\u8D26\u53F7\uFF0C\u53EF\u6DFB\u52A0 Codex \u8D26\u53F7\u6216\u5728\u5176\u4ED6 Agent \u7684\u539F\u751F\u5BA2\u6237\u7AEF\u767B\u5F55\u3002",
17974
17980
  accountNoMatches: "\u6CA1\u6709\u5339\u914D\u7684\u8D26\u53F7\u3002",
17975
- accountLoginHelp: "\u767B\u5F55\u524D\u987B\u77E5",
17976
- harnessAccountsTitle: "\u5176\u4ED6\u5DF2\u8BC6\u522B\u8D26\u53F7",
17981
+ accountNativeManaged: "\u539F\u751F\u7BA1\u7406",
17982
+ accountNativeManagementHint: "\u6B64\u8D26\u53F7\u6765\u81EA {harness} \u7684\u539F\u751F\u767B\u5F55\u3002\u8FD9\u91CC\u53EA\u8BFB\u5C55\u793A\u8EAB\u4EFD\u4E0E\u989D\u5EA6\uFF1B\u767B\u5F55\u3001\u9000\u51FA\u548C\u5207\u6362\u8BF7\u5728\u5176\u539F\u751F\u5BA2\u6237\u7AEF\u4E2D\u5B8C\u6210\u3002",
17983
+ accountMore: "Codex \u8D26\u53F7\u64CD\u4F5C",
17984
+ accountDetailsClose: "\u5173\u95ED\u8D26\u53F7\u8BE6\u60C5",
17985
+ accountDefaultHint: "\u4EC5\u8BBE\u4E3A\u65B0 Codex \u4EFB\u52A1\u7684\u9ED8\u8BA4\u8D26\u53F7",
17977
17986
  accountCreditsRemaining: "\u5269\u4F59",
17978
17987
  accountCreditsLoading: "\u6B63\u5728\u8BFB\u53D6\u989D\u5EA6\u2026",
17979
17988
  accountCreditsEmpty: "\u6682\u65E0\u989D\u5EA6\u6570\u636E",
17980
17989
  accountCreditsFailed: "\u989D\u5EA6\u8BFB\u53D6\u5931\u8D25",
17981
17990
  accountCreditsRetry: "\u91CD\u8BD5",
17982
17991
  accountCreditsRefresh: "\u5237\u65B0\u989D\u5EA6",
17983
- accountResetCreditsUnknown: "\u6682\u65E0\u91CD\u7F6E\u5361\u6570\u636E",
17984
17992
  accountCreateFailed: "\u6DFB\u52A0\u8D26\u53F7\u5931\u8D25\u3002",
17985
17993
  accountDelete: "\u5220\u9664",
17986
17994
  accountDeleteConfirm: "\u5220\u9664\u6B64\u8D26\u53F7\u53CA\u5176\u672C\u5730\u6570\u636E\uFF1F\u6B64\u64CD\u4F5C\u65E0\u6CD5\u64A4\u9500\u3002",
@@ -17990,7 +17998,6 @@ ${error51.stderrTail}`] : []
17990
17998
  accountUse: "\u8BBE\u4E3A\u9ED8\u8BA4",
17991
17999
  accountSignIn: "\u767B\u5F55",
17992
18000
  accountSigningIn: "\u6B63\u5728\u542F\u52A8\u8BBE\u5907\u767B\u5F55...",
17993
- accountDeviceCodePrerequisite: "\u767B\u5F55\u524D\uFF0C\u8BF7\u5148\u5728 Web \u7AEF\u7684\u201C\u8BBE\u7F6E \u2192 \u8D26\u53F7\u5B89\u5168\u4E0E\u767B\u5F55\u201D\u4E2D\u5F00\u542F\u201C\u4E3A Codex \u542F\u7528\u8BBE\u5907\u4EE3\u7801\u6388\u6743\u201D\u3002",
17994
18001
  accountVerificationDescription: "\u6253\u5F00\u9A8C\u8BC1\u9875\u9762\u5E76\u8F93\u5165\u4EE5\u4E0B\u4E00\u6B21\u6027\u4EE3\u7801\uFF1A",
17995
18002
  accountCopyCode: "\u590D\u5236\u4EE3\u7801",
17996
18003
  accountCopied: "\u5DF2\u590D\u5236",
@@ -18001,8 +18008,13 @@ ${error51.stderrTail}`] : []
18001
18008
  accountAuthApiPrefix: "API",
18002
18009
  accountAuthChatPrefix: "\u8D26\u53F7",
18003
18010
  accountAuthApiIdentityFallback: "BANK OF TOKEN",
18011
+ accountSectionApi: "API \u63A5\u5165",
18012
+ accountSectionChat: "\u8D26\u53F7\u63A5\u5165",
18004
18013
  accountCreditsUsed: "\u5DF2\u7528",
18005
- accountCreditsReset: "\u91CD\u7F6E",
18014
+ accountCreditsResetAt: "\u989D\u5EA6\u91CD\u7F6E\u65F6\u95F4\uFF1A{time}",
18015
+ accountCreditsResetIn: "\u8DDD\u91CD\u7F6E\u8FD8\u6709 {time}",
18016
+ accountCreditsResetPending: "\u5F85\u5237\u65B0",
18017
+ accountCreditsResetPendingHint: "\u91CD\u7F6E\u65F6\u95F4\u5DF2\u5230\uFF0C\u8BF7\u5237\u65B0\u4EE5\u786E\u8BA4\u5B9E\u9645\u989D\u5EA6\u3002",
18006
18018
  accountCreditsPeriodWeekly: "\u5468\u989D\u5EA6",
18007
18019
  accountCreditsPeriodMonthly: "\u6708\u989D\u5EA6",
18008
18020
  accountCreditsPeriodFiveHour: "5 \u5C0F\u65F6",
@@ -18135,6 +18147,7 @@ ${error51.stderrTail}`] : []
18135
18147
  pageLabels: Object.freeze({
18136
18148
  connections: "Agents",
18137
18149
  plugins: "\u63D2\u4EF6",
18150
+ appearance: "\u5916\u89C2",
18138
18151
  accounts: "\u8D26\u53F7",
18139
18152
  "session-import": "\u4F1A\u8BDD",
18140
18153
  updates: "\u66F4\u65B0",
@@ -19997,6 +20010,36 @@ ${error51.stderrTail}`] : []
19997
20010
  function rendererUsageTriggerMaxWidth() {
19998
20011
  return "min(180px, 30vw)";
19999
20012
  }
20013
+ function rendererUsageCompactParts(usage, locale = "en", mode = "default") {
20014
+ const messages = rendererUsageMessages(locale);
20015
+ const hasContext = usage?.contextUsedTokens !== void 0 && usage.contextWindowTokens !== void 0 && usage.contextWindowTokens > 0;
20016
+ if (mode === "context" && usage && hasContext) {
20017
+ return [
20018
+ formatRendererContextSummary(usage.contextUsedTokens ?? 0, usage.contextWindowTokens ?? 0)
20019
+ ];
20020
+ }
20021
+ const parts = [
20022
+ usage?.totalCredits !== void 0 ? formatRendererCredits(usage.totalCredits) : null,
20023
+ usage?.cacheHitRatePercent !== void 0 ? formatRendererCacheHitRate(usage.cacheHitRatePercent) : null,
20024
+ usage?.outputTokensPerSecond !== void 0 ? formatRendererTokenRate(usage.outputTokensPerSecond, locale) : null,
20025
+ usage?.totalCostUsd !== void 0 ? formatRendererCost(usage.totalCostUsd) : null
20026
+ ].filter((value) => value !== null);
20027
+ if (usage?.contextUsagePercent !== void 0 && parts.length === 0) parts.push(messages.usage);
20028
+ if (parts.length === 0 && hasContext && usage?.contextWindowTokens !== void 0) {
20029
+ parts.push(
20030
+ formatRendererContextSummary(usage.contextUsedTokens ?? 0, usage.contextWindowTokens)
20031
+ );
20032
+ }
20033
+ if (parts.length === 0 && usage?.totalTokens !== void 0) {
20034
+ parts.push(`${formatRendererTokenCount(usage.totalTokens)} ${messages.tokensSummary}`);
20035
+ }
20036
+ if (parts.length === 0 && (usage?.inputTokens !== void 0 || usage?.outputTokens !== void 0)) {
20037
+ parts.push(
20038
+ `${formatRendererTokenCount((usage?.inputTokens ?? 0) + (usage?.outputTokens ?? 0))} ${messages.tokensSummary}`
20039
+ );
20040
+ }
20041
+ return parts;
20042
+ }
20000
20043
  function rendererUsageHasDisplayData(usage) {
20001
20044
  return usage?.cacheHitRatePercent !== void 0 || usage?.outputTokensPerSecond !== void 0 || usage?.totalCostUsd !== void 0 || usage?.totalCredits !== void 0 || usage?.contextUsagePercent !== void 0 || usage?.contextUsedTokens !== void 0 && usage.contextWindowTokens !== void 0 || usage?.totalTokens !== void 0 || usage?.inputTokens !== void 0 || usage?.cachedInputTokens !== void 0 || usage?.cacheWriteInputTokens !== void 0 || usage?.outputTokens !== void 0 || usage?.reasoningOutputTokens !== void 0;
20002
20045
  }
@@ -20244,42 +20287,18 @@ ${error51.stderrTail}`] : []
20244
20287
  document.body.append(popover);
20245
20288
  return control;
20246
20289
  }
20247
- function renderRendererUsageControl(control, usage, locale = control.locale, accountName = null) {
20290
+ function renderRendererUsageControl(control, usage, locale = control.locale, accountName = null, compactMode = "default") {
20248
20291
  control.locale = locale;
20249
20292
  const messages = rendererUsageMessages(locale);
20250
20293
  control.popover.setAttribute("aria-label", messages.threadUsageDetails);
20251
- const cacheHitRatePercent = usage?.cacheHitRatePercent;
20252
- const outputTokensPerSecond = usage?.outputTokensPerSecond;
20253
- const totalCostUsd = usage?.totalCostUsd;
20254
- const hasContext = usage?.contextUsedTokens !== void 0 && usage.contextWindowTokens !== void 0;
20255
- const hasTokenUsage = usage?.totalTokens !== void 0 || usage?.inputTokens !== void 0 || usage?.cachedInputTokens !== void 0 || usage?.cacheWriteInputTokens !== void 0 || usage?.outputTokens !== void 0 || usage?.reasoningOutputTokens !== void 0;
20256
20294
  const visible = rendererUsageHasDisplayData(usage) || Boolean(accountName);
20257
20295
  control.root.style.display = visible ? "inline-flex" : "none";
20258
20296
  if (!visible) {
20259
20297
  closePopover(control);
20260
20298
  return false;
20261
20299
  }
20262
- const summary = [
20263
- usage?.totalCredits !== void 0 ? formatRendererCredits(usage.totalCredits) : null,
20264
- cacheHitRatePercent !== void 0 ? formatRendererCacheHitRate(cacheHitRatePercent) : null,
20265
- outputTokensPerSecond !== void 0 ? formatRendererTokenRate(outputTokensPerSecond, locale) : null,
20266
- totalCostUsd !== void 0 ? formatRendererCost(totalCostUsd) : null
20267
- ].filter((value) => value !== null);
20300
+ const summary = rendererUsageCompactParts(usage, locale, compactMode);
20268
20301
  const contextPercent = usage?.contextUsagePercent;
20269
- if (contextPercent !== void 0 && summary.length === 0) summary.push(messages.usage);
20270
- if (summary.length === 0 && hasContext && usage?.contextWindowTokens !== void 0 && usage.contextWindowTokens > 0) {
20271
- summary.push(
20272
- formatRendererContextSummary(usage.contextUsedTokens ?? 0, usage.contextWindowTokens)
20273
- );
20274
- }
20275
- if (summary.length === 0 && usage?.totalTokens !== void 0) {
20276
- summary.push(`${formatRendererTokenCount(usage.totalTokens)} ${messages.tokensSummary}`);
20277
- }
20278
- if (summary.length === 0 && hasTokenUsage) {
20279
- summary.push(
20280
- `${formatRendererTokenCount((usage?.inputTokens ?? 0) + (usage?.outputTokens ?? 0))} ${messages.tokensSummary}`
20281
- );
20282
- }
20283
20302
  const compactSummary = summary.join(" \xB7 ") || messages.usage;
20284
20303
  const accessibleSummary = `${messages.threadUsage}: ${compactSummary}${contextPercent !== void 0 ? `; ${messages.context} ${decimal(contextPercent, 1)}%` : ""}`;
20285
20304
  control.trigger.style.maxWidth = rendererUsageTriggerMaxWidth();
@@ -21108,9 +21127,20 @@ ${error51.stderrTail}`] : []
21108
21127
  function buttonText(button) {
21109
21128
  return controlDescription(button);
21110
21129
  }
21130
+ var OWNED_RENDERER_CONTROL_SELECTOR = [
21131
+ `[${CONTROL_ATTRIBUTE}]`,
21132
+ "[data-codexhost-model-control]",
21133
+ "[data-codexhost-permission-mode-control]",
21134
+ "[data-codexhost-usage-control]",
21135
+ "[data-codexhost-credits-control]",
21136
+ "[data-codexhost-harness-command-control]"
21137
+ ].join(", ");
21111
21138
  function isOwnedRendererControl(element) {
21112
21139
  return element.hasAttribute(CONTROL_ATTRIBUTE) || element.hasAttribute("data-codexhost-model-control") || element.hasAttribute("data-codexhost-permission-mode-control") || element.hasAttribute("data-codexhost-usage-control") || element.hasAttribute("data-codexhost-credits-control") || element.hasAttribute("data-codexhost-harness-command-control");
21113
21140
  }
21141
+ function isInsideOwnedRendererControl(element) {
21142
+ return typeof element.closest === "function" ? Boolean(element.closest(OWNED_RENDERER_CONTROL_SELECTOR)) : isOwnedRendererControl(element);
21143
+ }
21114
21144
  function isComposerSubmitButton(button) {
21115
21145
  if (button.type === "submit") return true;
21116
21146
  return /(^|\s)(send|submit|发送|提交)(\s|$)/u.test(buttonText(button));
@@ -21359,6 +21389,33 @@ ${error51.stderrTail}`] : []
21359
21389
  parent.insertBefore(control.permissionModePicker.root, candidate);
21360
21390
  }
21361
21391
  }
21392
+ function leftoverNativeModelButtons(composer) {
21393
+ return [...composer.querySelectorAll('button[aria-haspopup="menu"]')].filter(
21394
+ (element) => !isInsideOwnedRendererControl(element) && !isNativeModelControlCandidate(element)
21395
+ );
21396
+ }
21397
+ function syncLeftoverNativeModelControls(control, hide) {
21398
+ control.leftoverNativeModelControls ??= [];
21399
+ if (!hide) {
21400
+ for (const state of control.leftoverNativeModelControls) restoreNativeControl(state);
21401
+ control.leftoverNativeModelControls = [];
21402
+ return;
21403
+ }
21404
+ const buttons = leftoverNativeModelButtons(control.composer);
21405
+ const keep = new Set(buttons);
21406
+ control.leftoverNativeModelControls = control.leftoverNativeModelControls.filter((state) => {
21407
+ if (keep.has(state.element)) return true;
21408
+ restoreNativeControl(state);
21409
+ return false;
21410
+ });
21411
+ const known = new Set(control.leftoverNativeModelControls.map((state) => state.element));
21412
+ for (const button of buttons) {
21413
+ if (known.has(button)) continue;
21414
+ const captured = captureNativeControl(button);
21415
+ if (captured) control.leftoverNativeModelControls.push(captured);
21416
+ }
21417
+ for (const state of control.leftoverNativeModelControls) setNativeControlHidden(state, true);
21418
+ }
21362
21419
  function setNativeControlHidden(state, hidden) {
21363
21420
  if (!state) return;
21364
21421
  if (!hidden) {
@@ -21382,6 +21439,7 @@ ${error51.stderrTail}`] : []
21382
21439
  refreshUsagePlacement(control);
21383
21440
  refreshCreditsPlacement(control);
21384
21441
  setNativeControlHidden(control.nativeModelControl, hideModel);
21442
+ syncLeftoverNativeModelControls(control, hideModel);
21385
21443
  setNativeControlHidden(control.nativeContextUsageControl, false);
21386
21444
  setNativeControlHidden(control.nativePermissionModeControl, hidePermissionMode);
21387
21445
  }
@@ -21435,7 +21493,8 @@ ${error51.stderrTail}`] : []
21435
21493
  usage: null,
21436
21494
  harnessCommands,
21437
21495
  sendButton,
21438
- sendDisabledBeforeSwitch: null
21496
+ sendDisabledBeforeSwitch: null,
21497
+ leftoverNativeModelControls: []
21439
21498
  };
21440
21499
  refreshTrailingClusterPlacement(control);
21441
21500
  refreshUsagePlacement(control);
@@ -21491,7 +21550,8 @@ ${error51.stderrTail}`] : []
21491
21550
  control.usage,
21492
21551
  usage,
21493
21552
  locale,
21494
- selectedCodexAccount?.email ?? selectedCodexAccount?.label ?? null
21553
+ selectedCodexAccount?.email ?? selectedCodexAccount?.label ?? null,
21554
+ state.agent === "codex" ? "default" : "context"
21495
21555
  );
21496
21556
  }
21497
21557
  control.harnessCommands.setLocale(locale);
@@ -21511,6 +21571,8 @@ ${error51.stderrTail}`] : []
21511
21571
  restoreNativeControl(control.nativeModelControl);
21512
21572
  restoreNativeControl(control.nativeContextUsageControl);
21513
21573
  restoreNativeControl(control.nativePermissionModeControl);
21574
+ for (const state of control.leftoverNativeModelControls) restoreNativeControl(state);
21575
+ control.leftoverNativeModelControls = [];
21514
21576
  control.credits.dispose();
21515
21577
  control.usage?.dispose();
21516
21578
  control.usage = null;
@@ -21520,6 +21582,51 @@ ${error51.stderrTail}`] : []
21520
21582
  control.picker.dispose();
21521
21583
  }
21522
21584
 
21585
+ // src/renderer-transcript-dom.ts
21586
+ var TRANSCRIPT_TEXT_BODY_SELECTOR = '[data-testid="exec-shell-body"]';
21587
+ var REASONING_SOFT_WRAP_STORAGE_KEY = "codexhost.reasoning-soft-wrap.v1";
21588
+ var REASONING_SOFT_WRAP_CHANGE_EVENT = "codexhost:reasoning-soft-wrap-changed";
21589
+ function readReasoningTranscriptSoftWrap(ownerWindow) {
21590
+ return ownerWindow.localStorage.getItem(REASONING_SOFT_WRAP_STORAGE_KEY) === "true";
21591
+ }
21592
+ function setReasoningTranscriptSoftWrap(ownerWindow, enabled) {
21593
+ ownerWindow.localStorage.setItem(REASONING_SOFT_WRAP_STORAGE_KEY, String(enabled));
21594
+ ownerWindow.dispatchEvent(new Event(REASONING_SOFT_WRAP_CHANGE_EVENT));
21595
+ }
21596
+ function installReasoningTranscriptSoftWrap(ownerDocument) {
21597
+ const ownerWindow = ownerDocument.defaultView;
21598
+ if (!ownerWindow) return () => {
21599
+ };
21600
+ const style = ownerDocument.createElement("style");
21601
+ style.setAttribute("data-codexhost-reasoning-soft-wrap", "true");
21602
+ const body = `${TRANSCRIPT_TEXT_BODY_SELECTOR}:has([aria-label="$ ${REASONING_TRANSCRIPT_COMMAND}"])`;
21603
+ style.textContent = `
21604
+ ${body} .whitespace-pre {
21605
+ white-space: pre-wrap;
21606
+ overflow-wrap: anywhere;
21607
+ }
21608
+ ${body} .whitespace-pre > .w-max {
21609
+ width: 100%;
21610
+ min-width: 0;
21611
+ }
21612
+ `;
21613
+ ownerDocument.head.append(style);
21614
+ const refresh = () => {
21615
+ style.disabled = !readReasoningTranscriptSoftWrap(ownerWindow);
21616
+ };
21617
+ const onStorage = (event) => {
21618
+ if (event.key === REASONING_SOFT_WRAP_STORAGE_KEY || event.key === null) refresh();
21619
+ };
21620
+ refresh();
21621
+ ownerWindow.addEventListener(REASONING_SOFT_WRAP_CHANGE_EVENT, refresh);
21622
+ ownerWindow.addEventListener("storage", onStorage);
21623
+ return () => {
21624
+ ownerWindow.removeEventListener(REASONING_SOFT_WRAP_CHANGE_EVENT, refresh);
21625
+ ownerWindow.removeEventListener("storage", onStorage);
21626
+ style.remove();
21627
+ };
21628
+ }
21629
+
21523
21630
  // src/renderer-codex-account-state.ts
21524
21631
  function resolveCodexAccountSelection(accounts, overrideAccountId) {
21525
21632
  const activeAccountId = accounts.find((account) => account.active)?.accountId ?? null;
@@ -25239,6 +25346,50 @@ ${error51.stderrTail}`] : []
25239
25346
  });
25240
25347
  }
25241
25348
 
25349
+ // src/settings/appearance-page.ts
25350
+ function createAppearanceSettingsPage(messages) {
25351
+ return Object.freeze({
25352
+ id: "appearance",
25353
+ label: messages.pageLabels.appearance,
25354
+ icon: "settings",
25355
+ mount(context) {
25356
+ const document2 = context.content.ownerDocument;
25357
+ const ownerWindow = document2.defaultView;
25358
+ if (!ownerWindow) return;
25359
+ const heading = document2.createElement("div");
25360
+ heading.className = "settings-section-label";
25361
+ heading.textContent = messages.pageLabels.appearance;
25362
+ const description = document2.createElement("p");
25363
+ description.className = "settings-page-description";
25364
+ description.textContent = messages.appearanceDescription;
25365
+ const row = document2.createElement("label");
25366
+ row.className = "settings-preference-row";
25367
+ const copy = document2.createElement("span");
25368
+ copy.className = "settings-preference-row__copy";
25369
+ const title = document2.createElement("strong");
25370
+ title.textContent = messages.reasoningSoftWrapTitle;
25371
+ const detail = document2.createElement("span");
25372
+ detail.textContent = messages.reasoningSoftWrapDescription;
25373
+ copy.append(title, detail);
25374
+ const checkbox = document2.createElement("input");
25375
+ checkbox.type = "checkbox";
25376
+ checkbox.className = "settings-preference-checkbox";
25377
+ checkbox.checked = readReasoningTranscriptSoftWrap(ownerWindow);
25378
+ checkbox.setAttribute("aria-label", messages.reasoningSoftWrapTitle);
25379
+ checkbox.addEventListener("change", () => {
25380
+ setReasoningTranscriptSoftWrap(ownerWindow, checkbox.checked);
25381
+ });
25382
+ const sync = () => {
25383
+ checkbox.checked = readReasoningTranscriptSoftWrap(ownerWindow);
25384
+ };
25385
+ ownerWindow.addEventListener(REASONING_SOFT_WRAP_CHANGE_EVENT, sync);
25386
+ row.append(copy, checkbox);
25387
+ context.content.append(heading, description, row);
25388
+ return () => ownerWindow.removeEventListener(REASONING_SOFT_WRAP_CHANGE_EVENT, sync);
25389
+ }
25390
+ });
25391
+ }
25392
+
25242
25393
  // src/settings/release-notes.ts
25243
25394
  var HEADING_PATTERN = /^(#{1,6})[ \t]+(.+?)\s*$/u;
25244
25395
  var BLOCKQUOTE_PATTERN = /^>[ \t]?(.*?)\s*$/u;
@@ -25414,6 +25565,140 @@ ${error51.stderrTail}`] : []
25414
25565
  }
25415
25566
  }
25416
25567
 
25568
+ // src/settings/accounts-details.ts
25569
+ function createAccountDetails(document2, messages, input) {
25570
+ const root = document2.createElement("div");
25571
+ root.className = "settings-account-details";
25572
+ const trigger = document2.createElement("button");
25573
+ trigger.type = "button";
25574
+ trigger.className = "settings-icon-button";
25575
+ trigger.title = input.triggerLabel ?? input.label;
25576
+ trigger.disabled = input.disabled ?? false;
25577
+ trigger.dataset.accountFocus = input.focusKey;
25578
+ trigger.setAttribute("aria-label", trigger.title);
25579
+ trigger.setAttribute("aria-haspopup", "dialog");
25580
+ trigger.append(createRendererSettingsIcon(input.icon, 16));
25581
+ const dialog = document2.createElement("dialog");
25582
+ dialog.className = "settings-account-dialog";
25583
+ dialog.id = `settings-account-${input.focusKey}-dialog`;
25584
+ dialog.setAttribute("aria-label", input.label);
25585
+ trigger.setAttribute("aria-controls", dialog.id);
25586
+ const heading = document2.createElement("h2");
25587
+ heading.textContent = input.label;
25588
+ const description = document2.createElement("p");
25589
+ description.textContent = input.description;
25590
+ description.id = `${dialog.id}-description`;
25591
+ dialog.setAttribute("aria-describedby", description.id);
25592
+ const close = document2.createElement("button");
25593
+ close.type = "button";
25594
+ close.className = "settings-icon-button settings-account-dialog__close";
25595
+ close.dataset.accountFocus = `${input.focusKey}:close`;
25596
+ close.setAttribute("aria-label", messages.accountDetailsClose);
25597
+ close.append(createRendererSettingsIcon("close", 16));
25598
+ close.addEventListener("click", () => dialog.close());
25599
+ dialog.addEventListener("close", () => {
25600
+ if (trigger.isConnected && !trigger.disabled) trigger.focus({ preventScroll: true });
25601
+ });
25602
+ dialog.addEventListener(
25603
+ "click",
25604
+ (event) => {
25605
+ if (input.actions.some((action) => action.contains(event.target))) {
25606
+ trigger.focus({ preventScroll: true });
25607
+ dialog.close();
25608
+ }
25609
+ },
25610
+ { capture: true }
25611
+ );
25612
+ const actions = document2.createElement("div");
25613
+ actions.className = "settings-account-dialog__actions";
25614
+ actions.append(...input.actions);
25615
+ dialog.append(close, heading, description, actions);
25616
+ trigger.addEventListener("click", () => dialog.showModal());
25617
+ root.append(trigger, dialog);
25618
+ return root;
25619
+ }
25620
+
25621
+ // src/settings/accounts-reset-time.ts
25622
+ function formatAccountResetCountdown(value, messages, now = Date.now()) {
25623
+ const timestamp = Date.parse(value);
25624
+ if (!Number.isFinite(timestamp)) return null;
25625
+ const minutes = Math.max(0, Math.ceil((timestamp - now) / 6e4));
25626
+ if (minutes === 0) {
25627
+ return {
25628
+ text: messages.accountCreditsResetPending,
25629
+ description: messages.accountCreditsResetPendingHint
25630
+ };
25631
+ }
25632
+ const chinese = messages.locale === "zh-CN";
25633
+ const parts = [
25634
+ { value: Math.floor(minutes / 1440), unit: "d", label: chinese ? "\u5929" : " days" },
25635
+ { value: Math.floor(minutes % 1440 / 60), unit: "h", label: chinese ? "\u5C0F\u65F6" : " hours" },
25636
+ { value: minutes % 60, unit: "m", label: chinese ? "\u5206\u949F" : " minutes" }
25637
+ ].filter((part, index) => part.value > 0 && (minutes < 1440 || index < 2));
25638
+ return {
25639
+ text: parts.map((part) => `${part.value}${part.unit}`).join(""),
25640
+ description: messages.accountCreditsResetIn.replace(
25641
+ "{time}",
25642
+ parts.map(
25643
+ (part) => `${part.value}${!chinese && part.value === 1 ? part.label.slice(0, -1) : part.label}`
25644
+ ).join(chinese ? "" : " ")
25645
+ )
25646
+ };
25647
+ }
25648
+ function updateCountdown(element, messages) {
25649
+ const value = formatAccountResetCountdown(element.dataset.resetsAt ?? "", messages);
25650
+ if (!value) return;
25651
+ element.textContent = value.text;
25652
+ element.title = value.description;
25653
+ element.setAttribute("aria-label", value.description);
25654
+ }
25655
+ function renderAccountResetTime(document2, value, messages) {
25656
+ const date5 = new Date(value);
25657
+ if (!Number.isFinite(date5.getTime())) return null;
25658
+ const countdown = document2.createElement("span");
25659
+ countdown.className = "settings-account-usage__countdown";
25660
+ countdown.dataset.resetsAt = date5.toISOString();
25661
+ updateCountdown(countdown, messages);
25662
+ const timestamp = document2.createElement("time");
25663
+ timestamp.className = "settings-account-usage__sub";
25664
+ timestamp.dateTime = date5.toISOString();
25665
+ const pad = (number4) => String(number4).padStart(2, "0");
25666
+ timestamp.textContent = `${pad(date5.getMonth() + 1)}/${pad(date5.getDate())} ${pad(date5.getHours())}:${pad(date5.getMinutes())}`;
25667
+ timestamp.title = messages.accountCreditsResetAt.replace(
25668
+ "{time}",
25669
+ date5.toLocaleString(messages.locale, {
25670
+ year: "numeric",
25671
+ month: "long",
25672
+ day: "numeric",
25673
+ hour: "2-digit",
25674
+ minute: "2-digit",
25675
+ hour12: false,
25676
+ timeZoneName: "short"
25677
+ })
25678
+ );
25679
+ timestamp.setAttribute("aria-label", timestamp.title);
25680
+ return { countdown, timestamp };
25681
+ }
25682
+ function mountAccountResetCountdowns(list, messages, signal) {
25683
+ const window2 = list.ownerDocument.defaultView;
25684
+ if (!window2 || signal.aborted) return () => void 0;
25685
+ const refresh = () => {
25686
+ if (signal.aborted) return;
25687
+ for (const element of list.querySelectorAll("[data-resets-at]")) {
25688
+ updateCountdown(element, messages);
25689
+ }
25690
+ };
25691
+ const timer = window2.setInterval(refresh, 6e4);
25692
+ window2.addEventListener("focus", refresh);
25693
+ const stop = () => {
25694
+ window2.clearInterval(timer);
25695
+ window2.removeEventListener("focus", refresh);
25696
+ signal.removeEventListener("abort", stop);
25697
+ };
25698
+ signal.addEventListener("abort", stop, { once: true });
25699
+ return stop;
25700
+ }
25701
+
25417
25702
  // src/settings/accounts-usage.ts
25418
25703
  function creditsPeriodLabel2(periodType, messages) {
25419
25704
  if (periodType === "weekly") return messages.accountCreditsPeriodWeekly;
@@ -25448,17 +25733,82 @@ ${error51.stderrTail}`] : []
25448
25733
  function resetCreditDetailLine(index, expiresAt, messages, now = /* @__PURE__ */ new Date()) {
25449
25734
  return messages.accountResetCreditsCardExpiry.replace("{index}", String(index)).replace("{time}", formatAccountCreditsReset(expiresAt, messages.locale, now));
25450
25735
  }
25451
- function renderAccountUsage(document2, state, messages, display, onRetry) {
25452
- if (!state) return null;
25453
- const usage = document2.createElement("div");
25454
- usage.className = "settings-account-usage";
25455
- if (state.status !== "ready") {
25736
+ function accountUsageColumnLabel(period, display, messages) {
25737
+ const mode = display === "remaining" ? messages.accountCreditsRemaining : messages.accountCreditsUsed;
25738
+ return `${creditsPeriodLabel2(period, messages)}${messages.locale === "zh-CN" ? "" : " "}${mode}`;
25739
+ }
25740
+ function splitUsageWindows(credits, messages) {
25741
+ const columns = {};
25742
+ const additional = [];
25743
+ if (credits.usedPercent !== void 0) {
25744
+ const primary = {
25745
+ label: credits.label ?? creditsPeriodLabel2(credits.periodType, messages),
25746
+ usedPercent: credits.usedPercent,
25747
+ resetsAt: credits.resetsAt
25748
+ };
25749
+ if (!credits.label && credits.periodType === "five_hour") columns.five_hour = primary;
25750
+ else if (!credits.label && ["seven_day", "weekly"].includes(credits.periodType))
25751
+ columns.seven_day = { ...primary, label: messages.accountCreditsPeriodSevenDay };
25752
+ else additional.push(primary);
25753
+ }
25754
+ for (const product of credits.productUsage ?? []) {
25755
+ const window2 = {
25756
+ label: creditsProductLabel(product.product, messages),
25757
+ usedPercent: product.usagePercent,
25758
+ resetsAt: product.resetsAt
25759
+ };
25760
+ const period = product.product === "7-day window" ? "seven_day" : product.product === "5-hour window" ? "five_hour" : null;
25761
+ if (period && !columns[period])
25762
+ columns[period] = { ...window2, label: creditsPeriodLabel2(period, messages) };
25763
+ else additional.push(window2);
25764
+ }
25765
+ return { columns, additional };
25766
+ }
25767
+ function renderUsageWindow(document2, window2, messages, display) {
25768
+ const meter = document2.createElement("div");
25769
+ meter.className = "settings-account-usage__meter";
25770
+ const label = document2.createElement("span");
25771
+ label.className = "settings-account-usage__title";
25772
+ label.textContent = window2.label;
25773
+ label.title = window2.label;
25774
+ const value = display === "remaining" ? 100 - window2.usedPercent : window2.usedPercent;
25775
+ const valueLabel = display === "remaining" ? messages.accountCreditsRemaining : messages.accountCreditsUsed;
25776
+ const tone = rendererCreditsTone(window2.usedPercent);
25777
+ const percent = document2.createElement("div");
25778
+ percent.className = `settings-account-usage__percent settings-account-usage__percent--${tone}`;
25779
+ const number4 = document2.createElement("span");
25780
+ number4.textContent = formatRendererCreditsPercent(value);
25781
+ const reset = window2.resetsAt ? renderAccountResetTime(document2, window2.resetsAt, messages) : null;
25782
+ if (reset) percent.append(reset.countdown);
25783
+ percent.append(number4);
25784
+ const bar = document2.createElement("div");
25785
+ bar.className = `settings-account-usage__bar settings-account-usage__bar--${tone}`;
25786
+ bar.setAttribute("role", "meter");
25787
+ bar.setAttribute("aria-label", `${window2.label} \xB7 ${valueLabel}`);
25788
+ bar.setAttribute("aria-valuemin", "0");
25789
+ bar.setAttribute("aria-valuemax", "100");
25790
+ bar.setAttribute("aria-valuenow", String(value));
25791
+ const fill = document2.createElement("span");
25792
+ fill.style.width = `${Math.min(100, Math.max(0, value))}%`;
25793
+ bar.append(fill);
25794
+ meter.append(label, percent, bar);
25795
+ if (reset) meter.append(reset.timestamp);
25796
+ return meter;
25797
+ }
25798
+ function renderAccountUsage(document2, state, messages, display, onRetry, usageColumns = 2) {
25799
+ if (state?.status !== "ready") {
25800
+ const cell = document2.createElement("td");
25801
+ cell.colSpan = usageColumns;
25802
+ cell.className = "settings-account-usage-cell settings-account-usage-cell--message";
25803
+ const usage = document2.createElement("div");
25804
+ usage.className = "settings-account-usage";
25456
25805
  const message = document2.createElement("span");
25457
25806
  message.className = "settings-account-usage__message";
25458
- message.textContent = state.status === "loading" ? messages.accountCreditsLoading : state.status === "error" ? messages.accountCreditsFailed : messages.accountCreditsEmpty;
25807
+ message.textContent = !state ? "\u2014" : state.status === "loading" ? messages.accountCreditsLoading : state.status === "error" ? messages.accountCreditsFailed : messages.accountCreditsEmpty;
25808
+ if (!state) message.title = messages.accountCreditsEmpty;
25459
25809
  usage.append(message);
25460
- if (state.status === "loading") usage.setAttribute("aria-busy", "true");
25461
- if (state.status === "error") {
25810
+ if (state?.status === "loading") usage.setAttribute("aria-busy", "true");
25811
+ if (state?.status === "error") {
25462
25812
  const retry = document2.createElement("button");
25463
25813
  retry.type = "button";
25464
25814
  retry.className = "settings-command-button settings-command-button--secondary";
@@ -25466,10 +25816,16 @@ ${error51.stderrTail}`] : []
25466
25816
  retry.addEventListener("click", onRetry);
25467
25817
  usage.append(retry);
25468
25818
  }
25469
- return usage;
25819
+ cell.append(usage);
25820
+ return { cells: [cell], additional: null };
25470
25821
  }
25471
25822
  const credits = state.credits;
25472
- if (credits.remaining !== void 0 && credits.unit) {
25823
+ if (credits.remaining !== void 0 && credits.unit && credits.usedPercent === void 0) {
25824
+ const cell = document2.createElement("td");
25825
+ cell.colSpan = usageColumns;
25826
+ cell.className = "settings-account-usage-cell";
25827
+ const usage = document2.createElement("div");
25828
+ usage.className = "settings-account-usage";
25473
25829
  const meter = document2.createElement("div");
25474
25830
  meter.className = "settings-account-usage__meter settings-account-usage__meter--balance";
25475
25831
  const amount = formatAccountCreditsBalance(credits.remaining, credits.unit);
@@ -25484,59 +25840,35 @@ ${error51.stderrTail}`] : []
25484
25840
  value.title = `${amount} ${messages.accountCreditsRemaining}`;
25485
25841
  meter.append(value);
25486
25842
  usage.append(meter);
25487
- if (credits.usedPercent === void 0) return usage;
25488
- }
25489
- if (credits.usedPercent === void 0) return usage;
25490
- const windows = [
25491
- {
25492
- label: credits.label ?? creditsPeriodLabel2(credits.periodType, messages),
25493
- usedPercent: credits.usedPercent,
25494
- resetsAt: credits.resetsAt
25495
- },
25496
- ...(credits.productUsage ?? []).map((product) => ({
25497
- label: creditsProductLabel(product.product, messages),
25498
- usedPercent: product.usagePercent,
25499
- resetsAt: product.resetsAt
25500
- }))
25501
- ];
25502
- for (const window2 of windows) {
25503
- const meter = document2.createElement("div");
25504
- meter.className = "settings-account-usage__meter";
25505
- const label = document2.createElement("span");
25506
- label.className = "settings-account-usage__title";
25507
- label.textContent = window2.label;
25508
- label.title = window2.label;
25509
- const value = display === "remaining" ? 100 - window2.usedPercent : window2.usedPercent;
25510
- const valueLabel = display === "remaining" ? messages.accountCreditsRemaining : messages.accountCreditsUsed;
25511
- const tone = rendererCreditsTone(window2.usedPercent);
25512
- const bar = document2.createElement("div");
25513
- bar.className = `settings-account-usage__bar settings-account-usage__bar--${tone}`;
25514
- bar.setAttribute("role", "meter");
25515
- bar.setAttribute("aria-label", `${window2.label} \xB7 ${valueLabel}`);
25516
- bar.setAttribute("aria-valuemin", "0");
25517
- bar.setAttribute("aria-valuemax", "100");
25518
- bar.setAttribute("aria-valuenow", String(value));
25519
- const fill = document2.createElement("span");
25520
- fill.style.width = `${Math.min(100, Math.max(0, value))}%`;
25521
- bar.append(fill);
25522
- const percent = document2.createElement("span");
25523
- percent.className = `settings-account-usage__percent settings-account-usage__percent--${tone}`;
25524
- const prefix = document2.createElement("span");
25525
- prefix.textContent = valueLabel;
25526
- prefix.className = "settings-account-usage__value-label";
25527
- const number4 = document2.createElement("span");
25528
- number4.textContent = formatRendererCreditsPercent(value);
25529
- percent.append(prefix, number4);
25530
- meter.append(label, bar, percent);
25531
- if (window2.resetsAt) {
25532
- const reset = document2.createElement("span");
25533
- reset.className = "settings-account-usage__sub";
25534
- reset.textContent = `${formatAccountCreditsReset(window2.resetsAt, messages.locale)} ${messages.accountCreditsReset}`;
25535
- meter.append(reset);
25536
- }
25537
- usage.append(meter);
25538
- }
25539
- return usage;
25843
+ cell.append(usage);
25844
+ return { cells: [cell], additional: null };
25845
+ }
25846
+ const { columns, additional } = splitUsageWindows(credits, messages);
25847
+ const cells = ["five_hour", "seven_day"].map((period) => {
25848
+ const cell = document2.createElement("td");
25849
+ cell.className = "settings-account-usage-cell";
25850
+ const window2 = columns[period];
25851
+ if (window2) cell.append(renderUsageWindow(document2, window2, messages, display));
25852
+ else {
25853
+ const missing = document2.createElement("div");
25854
+ missing.className = "settings-account-usage__missing";
25855
+ const label = document2.createElement("span");
25856
+ label.className = "settings-account-usage__title";
25857
+ label.textContent = creditsPeriodLabel2(period, messages);
25858
+ const dash = document2.createElement("span");
25859
+ dash.textContent = "\u2014";
25860
+ dash.setAttribute("aria-hidden", "true");
25861
+ missing.append(label, dash);
25862
+ cell.append(missing);
25863
+ }
25864
+ return cell;
25865
+ });
25866
+ if (!additional.length) return { cells, additional: null };
25867
+ const extra = document2.createElement("div");
25868
+ extra.className = "settings-account-extra-usage";
25869
+ for (const window2 of additional)
25870
+ extra.append(renderUsageWindow(document2, window2, messages, display));
25871
+ return { cells, additional: extra };
25540
25872
  }
25541
25873
  function renderAccountResetCredits(document2, credits, messages, options) {
25542
25874
  const resetCredits = credits.resetCredits;
@@ -25548,8 +25880,11 @@ ${error51.stderrTail}`] : []
25548
25880
  summary.title = messages.accountResetCreditsDetails;
25549
25881
  const count = document2.createElement("span");
25550
25882
  count.textContent = messages.locale === "zh-CN" ? `${resetCredits.availableCount} \u5F20` : String(resetCredits.availableCount);
25883
+ const label = document2.createElement("span");
25884
+ label.textContent = messages.accountResetCredits;
25551
25885
  summary.append(
25552
25886
  createRendererSettingsIcon("ticket", 16),
25887
+ label,
25553
25888
  count,
25554
25889
  createRendererSettingsIcon("chevron-right", 14)
25555
25890
  );
@@ -25619,6 +25954,8 @@ ${error51.stderrTail}`] : []
25619
25954
  return () => {
25620
25955
  const target = key ? list.querySelector(`[data-account-focus="${CSS.escape(key)}"]`) : null;
25621
25956
  if (target && !target.matches(":disabled")) {
25957
+ const dialog = target.closest("dialog");
25958
+ if (dialog && !dialog.open) dialog.showModal();
25622
25959
  target.focus({ preventScroll: true });
25623
25960
  return;
25624
25961
  }
@@ -25628,97 +25965,139 @@ ${error51.stderrTail}`] : []
25628
25965
  (row ?? fallback).focus({ preventScroll: true });
25629
25966
  };
25630
25967
  }
25631
- function createAccountsTable(document2, messages) {
25968
+ function createAccountsTable(document2, messages, kind) {
25632
25969
  const table = document2.createElement("table");
25633
- table.className = "settings-account-table";
25634
- table.setAttribute("aria-label", messages.pageLabels.accounts);
25970
+ table.className = `settings-account-table settings-account-table--${kind}`;
25971
+ table.setAttribute(
25972
+ "aria-label",
25973
+ kind === "api" ? messages.accountSectionApi : messages.accountSectionChat
25974
+ );
25635
25975
  const head = document2.createElement("thead");
25636
25976
  const row = document2.createElement("tr");
25637
- for (const label of [
25638
- messages.accountColumnAccount,
25639
- messages.accountColumnUsage,
25640
- messages.accountResetCredits,
25641
- messages.accountColumnActions
25642
- ]) {
25977
+ const columnCount = kind === "api" ? 3 : 4;
25978
+ const headers = Array.from({ length: columnCount }, () => {
25643
25979
  const cell = document2.createElement("th");
25644
25980
  cell.scope = "col";
25645
- cell.textContent = label;
25646
25981
  row.append(cell);
25647
- }
25982
+ return cell;
25983
+ });
25984
+ const updateDisplay = (display) => {
25985
+ const labels = kind === "api" ? [
25986
+ messages.accountColumnAccount,
25987
+ messages.accountCreditsRemaining,
25988
+ messages.accountColumnActions
25989
+ ] : [
25990
+ messages.accountColumnAccount,
25991
+ accountUsageColumnLabel("five_hour", display, messages),
25992
+ accountUsageColumnLabel("seven_day", display, messages),
25993
+ messages.accountColumnActions
25994
+ ];
25995
+ headers.forEach((cell, index) => {
25996
+ cell.textContent = labels[index] ?? "";
25997
+ });
25998
+ };
25999
+ updateDisplay("remaining");
25648
26000
  head.append(row);
25649
26001
  const body = document2.createElement("tbody");
25650
26002
  table.append(head, body);
25651
- return { table, body };
26003
+ return { table, body, updateDisplay };
26004
+ }
26005
+ function createAccountsGroup(document2, messages, kind) {
26006
+ const root = document2.createElement("section");
26007
+ root.className = "settings-account-group";
26008
+ root.dataset.accountGroup = kind;
26009
+ const title = document2.createElement("h2");
26010
+ title.className = "settings-account-group__title";
26011
+ title.textContent = kind === "api" ? messages.accountSectionApi : messages.accountSectionChat;
26012
+ const list = document2.createElement("div");
26013
+ list.className = "settings-account-list";
26014
+ const { table, body, updateDisplay } = createAccountsTable(document2, messages, kind);
26015
+ list.append(table);
26016
+ root.append(title, list);
26017
+ return { root, body, updateDisplay };
25652
26018
  }
25653
- function renderAccountRows(document2, account, messages, input) {
25654
- const row = document2.createElement("tr");
25655
- row.className = "settings-account-row";
25656
- row.dataset.accountId = account.accountId;
25657
- row.dataset.accountFocus = `${account.accountId}:row`;
25658
- row.tabIndex = -1;
25659
- const name = codexAccountDisplayName(account);
25660
- const authKind = codexAccountAuthKind(account);
25661
- const authLabel = formatCodexAccountAuthLabel(account, messages);
25662
- const titleText = authKind === "api" ? authLabel : name.local;
25663
- const accessibleName = authKind === "api" ? authLabel : name.full;
25664
- row.setAttribute("aria-label", accessibleName);
25665
- const personCell = document2.createElement("td");
26019
+ function createAccountPerson(document2, messages, input) {
25666
26020
  const person = document2.createElement("div");
25667
26021
  person.className = "settings-account-row__person";
25668
- const mark = document2.createElement("div");
25669
- mark.className = "settings-account-row__mark";
25670
- mark.setAttribute("aria-hidden", "true");
25671
- mark.append(createRendererSettingsIcon("terminal", 17));
25672
26022
  const identity = document2.createElement("div");
25673
26023
  identity.className = "settings-account-row__identity";
25674
- const title = document2.createElement("div");
25675
- title.className = "settings-account-title";
25676
- const local = document2.createElement("strong");
25677
- local.className = "settings-account-email";
25678
- local.textContent = titleText;
25679
- local.title = accessibleName;
25680
- title.append(local);
25681
- if (account.active) {
25682
- const badge = document2.createElement("span");
25683
- badge.className = "settings-account-active";
25684
- badge.textContent = messages.accountDefaultBadge;
25685
- title.append(badge);
25686
- }
25687
- identity.append(title);
26024
+ const title = document2.createElement("strong");
26025
+ title.className = "settings-account-email";
26026
+ title.textContent = input.name;
26027
+ title.title = input.name;
26028
+ title.translate = false;
25688
26029
  const metadata = document2.createElement("div");
25689
26030
  metadata.className = "settings-account-metadata";
25690
- if (name.domain) {
25691
- const domain2 = document2.createElement("span");
25692
- domain2.className = "settings-account-domain";
25693
- domain2.textContent = `@${name.domain}`;
25694
- metadata.append(domain2);
25695
- }
25696
- const planLabel = accountPlanLabel(account.planType);
25697
- if (planLabel) {
25698
- if (name.domain) {
26031
+ const agent = document2.createElement("span");
26032
+ agent.textContent = input.agent;
26033
+ agent.translate = false;
26034
+ if (input.name !== input.agent) metadata.append(agent);
26035
+ if (input.plan) {
26036
+ if (metadata.childElementCount) {
25699
26037
  const separator = document2.createElement("span");
25700
- separator.className = "settings-account-plan-separator";
25701
26038
  separator.textContent = "\xB7";
25702
26039
  separator.setAttribute("aria-hidden", "true");
25703
26040
  metadata.append(separator);
25704
26041
  }
25705
26042
  const plan = document2.createElement("span");
25706
- plan.className = account.planType === "pro" || account.planType === "prolite" ? "settings-account-plan settings-account-plan--highlighted" : "settings-account-plan";
25707
- plan.textContent = planLabel;
26043
+ plan.className = input.highlighted ? "settings-account-plan settings-account-plan--highlighted" : "settings-account-plan";
26044
+ plan.textContent = input.plan;
26045
+ plan.translate = false;
25708
26046
  metadata.append(plan);
25709
26047
  }
25710
- if (metadata.childElementCount > 0) identity.append(metadata);
25711
- person.append(mark, identity);
25712
- personCell.append(person);
25713
- const usageCell = document2.createElement("td");
25714
- const usage = renderAccountUsage(document2, input.usage, messages, input.display, input.onRetry);
25715
- if (usage) usageCell.append(usage);
25716
- const resetCell = document2.createElement("td");
25717
- const resetLabel2 = document2.createElement("span");
25718
- resetLabel2.className = "settings-account-mobile-label";
25719
- resetLabel2.textContent = messages.accountResetCredits;
25720
- resetCell.append(resetLabel2);
26048
+ if (input.active) {
26049
+ const badge = document2.createElement("span");
26050
+ badge.className = "settings-account-active";
26051
+ badge.textContent = messages.accountDefaultBadge;
26052
+ badge.title = messages.accountDefaultHint;
26053
+ metadata.append(badge);
26054
+ }
26055
+ identity.append(title);
26056
+ if (metadata.childElementCount) identity.append(metadata);
26057
+ person.append(input.mark, identity);
26058
+ return person;
26059
+ }
26060
+ function renderAccountRows(document2, account, messages, input) {
26061
+ const row = document2.createElement("tr");
26062
+ row.className = "settings-account-row";
26063
+ row.dataset.accountId = account.accountId;
26064
+ row.dataset.accountFocus = `${account.accountId}:row`;
26065
+ row.tabIndex = -1;
26066
+ const name = codexAccountDisplayName(account);
26067
+ const authKind = codexAccountAuthKind(account);
26068
+ const authLabel = formatCodexAccountAuthLabel(account, messages);
26069
+ const titleName = authKind === "api" ? authLabel : name.full;
26070
+ row.setAttribute("aria-label", titleName);
26071
+ const personCell = document2.createElement("td");
26072
+ personCell.className = "settings-account-person-cell";
26073
+ const mark = document2.createElement("div");
26074
+ mark.className = "settings-account-row__mark";
26075
+ mark.setAttribute("aria-hidden", "true");
26076
+ mark.append(createRendererSettingsIcon("terminal", 17));
26077
+ personCell.append(
26078
+ createAccountPerson(document2, messages, {
26079
+ name: titleName,
26080
+ agent: "Codex",
26081
+ plan: accountPlanLabel(account.planType),
26082
+ highlighted: account.planType === "pro" || account.planType === "prolite",
26083
+ active: account.active,
26084
+ mark
26085
+ })
26086
+ );
26087
+ const usageColumns = authKind === "api" ? 1 : 2;
26088
+ const usage = renderAccountUsage(
26089
+ document2,
26090
+ input.usage,
26091
+ messages,
26092
+ input.display,
26093
+ input.onRetry,
26094
+ usageColumns
26095
+ );
26096
+ if (usage.additional) personCell.append(usage.additional);
25721
26097
  const actionsCell = document2.createElement("td");
26098
+ actionsCell.className = "settings-account-management-cell";
26099
+ const management = document2.createElement("div");
26100
+ management.className = "settings-account-management";
25722
26101
  const actions = document2.createElement("div");
25723
26102
  actions.className = "settings-account-actions";
25724
26103
  if (!account.active) {
@@ -25726,6 +26105,7 @@ ${error51.stderrTail}`] : []
25726
26105
  activate.type = "button";
25727
26106
  activate.className = "settings-account-action";
25728
26107
  activate.textContent = messages.accountUse;
26108
+ activate.title = messages.accountDefaultHint;
25729
26109
  activate.dataset.accountFocus = `${account.accountId}:activate`;
25730
26110
  activate.disabled = input.actionsDisabled;
25731
26111
  activate.addEventListener("click", input.onActivate);
@@ -25741,36 +26121,51 @@ ${error51.stderrTail}`] : []
25741
26121
  signIn.addEventListener("click", input.onSignIn);
25742
26122
  actions.append(signIn);
25743
26123
  }
26124
+ const more = [];
26125
+ if (account.email && input.usage) {
26126
+ const refresh = document2.createElement("button");
26127
+ refresh.type = "button";
26128
+ refresh.className = "settings-account-action";
26129
+ refresh.textContent = messages.accountCreditsRefresh;
26130
+ refresh.dataset.accountFocus = `${account.accountId}:refresh`;
26131
+ refresh.disabled = input.actionsDisabled || input.usage.status === "loading";
26132
+ refresh.addEventListener("click", input.onRetry);
26133
+ more.push(refresh);
26134
+ }
25744
26135
  if (!account.isDefault) {
25745
26136
  const remove = document2.createElement("button");
25746
26137
  remove.type = "button";
25747
- remove.className = "settings-icon-button settings-account-delete";
25748
- remove.title = messages.accountDelete;
26138
+ remove.className = "settings-account-action settings-account-delete";
26139
+ remove.textContent = messages.accountDelete;
25749
26140
  remove.dataset.accountFocus = `${account.accountId}:delete`;
25750
- remove.setAttribute("aria-label", `${messages.accountDelete}: ${accessibleName}`);
26141
+ remove.setAttribute("aria-label", `${messages.accountDelete}: ${name.full}`);
25751
26142
  remove.disabled = input.actionsDisabled;
25752
- remove.append(createRendererSettingsIcon("trash", 16));
25753
26143
  remove.addEventListener("click", input.onDelete);
25754
- actions.append(remove);
25755
- }
25756
- actionsCell.append(actions);
25757
- row.append(personCell, usageCell, resetCell, actionsCell);
26144
+ more.push(remove);
26145
+ }
26146
+ if (more.length)
26147
+ actions.append(
26148
+ createAccountDetails(document2, messages, {
26149
+ label: messages.accountMore,
26150
+ triggerLabel: `${name.full} \xB7 ${messages.accountMore}`,
26151
+ description: name.full,
26152
+ focusKey: `${account.accountId}:more`,
26153
+ icon: "ellipsis",
26154
+ disabled: input.actionsDisabled,
26155
+ actions: more
26156
+ })
26157
+ );
26158
+ management.append(actions);
26159
+ actionsCell.append(management);
26160
+ row.append(personCell, ...usage.cells, actionsCell);
25758
26161
  const reset = input.usage?.status === "ready" ? renderAccountResetCredits(document2, input.usage.credits, messages, input) : null;
25759
- if (!reset) {
25760
- const unknown2 = document2.createElement("span");
25761
- unknown2.className = "settings-account-unknown";
25762
- unknown2.textContent = "\u2014";
25763
- unknown2.title = messages.accountResetCreditsUnknown;
25764
- unknown2.setAttribute("aria-label", messages.accountResetCreditsUnknown);
25765
- resetCell.append(unknown2);
25766
- return [row];
25767
- }
26162
+ if (!reset) return [row];
25768
26163
  const detailsRow = document2.createElement("tr");
25769
26164
  detailsRow.className = "settings-account-details-row";
25770
26165
  detailsRow.id = `settings-account-reset-${++resetDetailsSequence}`;
25771
26166
  detailsRow.hidden = !input.resetExpanded;
25772
26167
  const detailsCell = document2.createElement("td");
25773
- detailsCell.colSpan = 4;
26168
+ detailsCell.colSpan = authKind === "api" ? 3 : 4;
25774
26169
  detailsCell.append(reset.details);
25775
26170
  detailsRow.append(detailsCell);
25776
26171
  reset.summary.dataset.accountFocus = `${account.accountId}:reset`;
@@ -25781,120 +26176,84 @@ ${error51.stderrTail}`] : []
25781
26176
  reset.summary.setAttribute("aria-expanded", String(!detailsRow.hidden));
25782
26177
  input.onResetExpanded(!detailsRow.hidden);
25783
26178
  });
25784
- resetCell.append(reset.summary);
26179
+ management.append(reset.summary);
25785
26180
  return [row, detailsRow];
25786
26181
  }
26182
+ function renderHarnessAccountRow(document2, account, messages, display) {
26183
+ const row = document2.createElement("tr");
26184
+ row.className = "settings-account-row";
26185
+ row.dataset.harnessId = account.harnessId;
26186
+ row.tabIndex = -1;
26187
+ const name = account.email ?? account.label ?? account.harnessName;
26188
+ row.setAttribute("aria-label", name);
26189
+ const personCell = document2.createElement("td");
26190
+ personCell.className = "settings-account-person-cell";
26191
+ const logo = document2.createElement("div");
26192
+ logo.className = "settings-harness-account__logo";
26193
+ logo.setAttribute("aria-hidden", "true");
26194
+ const agent = KNOWN_RENDERER_AGENTS.find((agent2) => agent2 === account.harnessId);
26195
+ if (agent) logo.append(createRendererAgentIcon(agent, 26, document2));
26196
+ personCell.append(
26197
+ createAccountPerson(document2, messages, {
26198
+ name,
26199
+ agent: account.harnessName,
26200
+ plan: account.plan ?? null,
26201
+ mark: logo
26202
+ })
26203
+ );
26204
+ const usage = renderAccountUsage(
26205
+ document2,
26206
+ { status: "ready", credits: account.credits },
26207
+ messages,
26208
+ display,
26209
+ () => void 0
26210
+ );
26211
+ if (usage.additional) personCell.append(usage.additional);
26212
+ const managementCell = document2.createElement("td");
26213
+ managementCell.className = "settings-account-management-cell";
26214
+ const management = document2.createElement("div");
26215
+ management.className = "settings-account-native";
26216
+ const label = document2.createElement("span");
26217
+ label.textContent = messages.accountNativeManaged;
26218
+ const info = createAccountDetails(document2, messages, {
26219
+ label: `${account.harnessName} \xB7 ${messages.accountNativeManaged}`,
26220
+ description: messages.accountNativeManagementHint.replace("{harness}", account.harnessName),
26221
+ focusKey: `harness:${account.harnessId}:info`,
26222
+ icon: "info",
26223
+ actions: []
26224
+ });
26225
+ management.append(label, info);
26226
+ managementCell.append(management);
26227
+ row.append(personCell, ...usage.cells, managementCell);
26228
+ return row;
26229
+ }
25787
26230
 
25788
26231
  // src/settings/harness-accounts.ts
25789
- function mountHarnessAccounts(context, messages, getClient, onChange) {
25790
- const document2 = context.content.ownerDocument;
25791
- const section = document2.createElement("section");
25792
- section.className = "settings-harness-accounts";
25793
- section.hidden = true;
25794
- const heading = document2.createElement("h2");
25795
- heading.className = "settings-harness-accounts__title";
25796
- heading.textContent = messages.harnessAccountsTitle;
25797
- const list = document2.createElement("div");
25798
- list.className = "settings-account-list";
25799
- section.append(heading, list);
25800
- context.content.append(section);
26232
+ function createHarnessAccounts(signal, getClient, onChange) {
25801
26233
  let accounts = [];
25802
26234
  let refreshing = false;
25803
- let query = "";
25804
- let display = "remaining";
25805
- const render = () => {
25806
- section.hidden = accounts.length === 0;
25807
- list.replaceChildren();
25808
- const visible = accounts.filter(
25809
- (account) => `${account.harnessName} ${account.email ?? ""} ${account.label ?? ""} ${account.plan ?? ""}`.toLocaleLowerCase().includes(query)
25810
- );
25811
- for (const account of visible) {
25812
- const row = document2.createElement("article");
25813
- row.className = "settings-harness-account";
25814
- row.dataset.harnessId = account.harnessId;
25815
- const identity = document2.createElement("div");
25816
- identity.className = "settings-harness-account__identity";
25817
- const name = document2.createElement("strong");
25818
- name.className = "settings-account-email";
25819
- const accountName = account.email ?? account.label;
25820
- name.textContent = accountName ?? account.harnessName;
25821
- name.title = name.textContent;
25822
- identity.append(name);
25823
- const metadata = document2.createElement("div");
25824
- metadata.className = "settings-account-metadata";
25825
- if (accountName) {
25826
- const harness = document2.createElement("span");
25827
- harness.textContent = account.harnessName;
25828
- metadata.append(harness);
25829
- }
25830
- if (account.plan) {
25831
- if (accountName) {
25832
- const separator = document2.createElement("span");
25833
- separator.textContent = "\xB7";
25834
- separator.setAttribute("aria-hidden", "true");
25835
- metadata.append(separator);
25836
- }
25837
- const plan = document2.createElement("span");
25838
- plan.className = "settings-account-plan";
25839
- plan.textContent = account.plan;
25840
- metadata.append(plan);
25841
- }
25842
- if (metadata.childElementCount) identity.append(metadata);
25843
- const usage = renderAccountUsage(
25844
- document2,
25845
- { status: "ready", credits: account.credits },
25846
- messages,
25847
- display,
25848
- () => void 0
25849
- );
25850
- const person = document2.createElement("div");
25851
- person.className = "settings-account-row__person";
25852
- const agent = KNOWN_RENDERER_AGENTS.find((agent2) => agent2 === account.harnessId);
25853
- if (agent) {
25854
- const logo = document2.createElement("div");
25855
- logo.className = "settings-harness-account__logo";
25856
- logo.setAttribute("aria-hidden", "true");
25857
- logo.append(createRendererAgentIcon(agent, 28, document2));
25858
- person.append(logo);
25859
- }
25860
- person.append(identity);
25861
- row.append(person);
25862
- if (usage) row.append(usage);
25863
- list.append(row);
25864
- }
25865
- if (accounts.length && !visible.length) {
25866
- const empty = document2.createElement("p");
25867
- empty.className = "settings-account-empty";
25868
- empty.textContent = messages.accountNoMatches;
25869
- list.append(empty);
25870
- }
25871
- };
25872
26235
  return {
26236
+ get accounts() {
26237
+ return accounts;
26238
+ },
25873
26239
  get refreshing() {
25874
26240
  return refreshing;
25875
26241
  },
25876
- update(nextQuery, nextDisplay) {
25877
- query = nextQuery;
25878
- display = nextDisplay;
25879
- render();
25880
- },
25881
26242
  async refresh() {
25882
- if (refreshing || context.signal.aborted) return;
26243
+ if (refreshing || signal.aborted) return;
25883
26244
  const client = getClient();
25884
26245
  if (!client?.listHarnessAccounts) return;
25885
26246
  refreshing = true;
25886
26247
  onChange();
25887
26248
  try {
25888
26249
  const result = await client.listHarnessAccounts();
25889
- if (!context.signal.aborted) accounts = result.accounts;
26250
+ if (!signal.aborted)
26251
+ accounts = [...result.accounts].sort((a, b) => a.harnessId.localeCompare(b.harnessId));
25890
26252
  } catch {
25891
- if (!context.signal.aborted) accounts = [];
26253
+ if (!signal.aborted) accounts = [];
25892
26254
  } finally {
25893
26255
  refreshing = false;
25894
- if (!context.signal.aborted) {
25895
- render();
25896
- onChange();
25897
- }
26256
+ if (!signal.aborted) onChange();
25898
26257
  }
25899
26258
  }
25900
26259
  };
@@ -25932,29 +26291,6 @@ ${error51.stderrTail}`] : []
25932
26291
  const status = document2.createElement("p");
25933
26292
  status.className = "settings-account-status";
25934
26293
  status.setAttribute("aria-live", "polite");
25935
- const helpRow = document2.createElement("div");
25936
- helpRow.className = "settings-account-help-row";
25937
- const taskHint = document2.createElement("p");
25938
- taskHint.className = "settings-account-task-hint";
25939
- const taskHintText = document2.createElement("span");
25940
- taskHintText.textContent = messages.accountTaskHint;
25941
- taskHint.append(createRendererSettingsIcon("info", 16), taskHintText);
25942
- const help = document2.createElement("button");
25943
- help.type = "button";
25944
- help.className = "settings-account-help-button";
25945
- help.append(createRendererSettingsIcon("help", 16), messages.accountLoginHelp);
25946
- help.setAttribute("aria-expanded", "false");
25947
- help.setAttribute("aria-controls", "settings-account-login-help");
25948
- const deviceCodeNote = document2.createElement("p");
25949
- deviceCodeNote.id = "settings-account-login-help";
25950
- deviceCodeNote.className = "settings-account-device-code-note";
25951
- deviceCodeNote.textContent = messages.accountDeviceCodePrerequisite;
25952
- deviceCodeNote.hidden = true;
25953
- help.addEventListener("click", () => {
25954
- deviceCodeNote.hidden = !deviceCodeNote.hidden;
25955
- help.setAttribute("aria-expanded", String(!deviceCodeNote.hidden));
25956
- });
25957
- helpRow.append(taskHint, help);
25958
26294
  const toolbar = document2.createElement("div");
25959
26295
  toolbar.className = "settings-account-toolbar";
25960
26296
  const connected = document2.createElement("div");
@@ -26000,11 +26336,12 @@ ${error51.stderrTail}`] : []
26000
26336
  });
26001
26337
  search.addEventListener("input", () => render());
26002
26338
  toolbar.append(connected, searchWrapper, displayControls, refreshUsage);
26003
- const list = document2.createElement("div");
26004
- list.className = "settings-account-list";
26005
- const { table, body } = createAccountsTable(document2, messages);
26006
- list.append(table);
26007
- context.content.append(header, helpRow, deviceCodeNote, status, toolbar, list);
26339
+ const groups = document2.createElement("div");
26340
+ groups.className = "settings-account-groups";
26341
+ const apiGroup = createAccountsGroup(document2, messages, "api");
26342
+ const chatGroup = createAccountsGroup(document2, messages, "chatgpt");
26343
+ context.content.append(header, status, toolbar, groups);
26344
+ const stopCountdowns = mountAccountResetCountdowns(groups, messages, context.signal);
26008
26345
  let accounts = [];
26009
26346
  let accountCreating = false;
26010
26347
  let accountActivating = false;
@@ -26050,104 +26387,130 @@ ${error51.stderrTail}`] : []
26050
26387
  );
26051
26388
  }, 750);
26052
26389
  };
26390
+ const appendCodexAccount = (body, account) => {
26391
+ body.append(
26392
+ ...renderAccountRows(document2, account, messages, {
26393
+ usage: usageByAccountId.get(account.accountId),
26394
+ display: usageDisplay,
26395
+ actionsDisabled: accountBusy(),
26396
+ usingReset: usingResetAccountId === account.accountId,
26397
+ resetDisabled: accountBusy(),
26398
+ resetExpanded: expandedResetAccounts.has(account.accountId),
26399
+ onActivate: () => mutate(() => client().activateCodexAccount({ accountId: account.accountId })),
26400
+ onSignIn: () => startLogin(account.accountId),
26401
+ onDelete: () => deleteAccount(account.accountId),
26402
+ onRetry: () => {
26403
+ usageByAccountId.delete(account.accountId);
26404
+ loadUsage(accounts);
26405
+ },
26406
+ onResetExpanded: (open) => {
26407
+ if (open) expandedResetAccounts.add(account.accountId);
26408
+ else expandedResetAccounts.delete(account.accountId);
26409
+ },
26410
+ ...getClient()?.consumeCodexAccountResetCredit ? { onUseReset: () => useReset(account.accountId) } : {}
26411
+ })
26412
+ );
26413
+ if (login?.accountId !== account.accountId) return;
26414
+ const verification = document2.createElement("div");
26415
+ verification.className = "settings-account-verification";
26416
+ const prompt = document2.createElement("span");
26417
+ prompt.textContent = messages.accountVerificationDescription;
26418
+ const link = document2.createElement("a");
26419
+ link.href = login.verificationUrl;
26420
+ link.target = "_blank";
26421
+ link.rel = "noopener noreferrer";
26422
+ link.textContent = login.verificationUrl;
26423
+ link.addEventListener("click", (event) => {
26424
+ const bridge = document2.defaultView?.electronBridge;
26425
+ if (typeof bridge?.sendMessageFromView !== "function") return;
26426
+ event.preventDefault();
26427
+ void Promise.resolve(
26428
+ bridge.sendMessageFromView({
26429
+ type: "open-in-browser",
26430
+ url: login?.verificationUrl ?? link.href,
26431
+ initiator: "open_in_browser_bridge",
26432
+ openTarget: "external-browser",
26433
+ source: "manual"
26434
+ })
26435
+ ).catch(() => void 0);
26436
+ });
26437
+ const code = document2.createElement("code");
26438
+ code.textContent = login.userCode;
26439
+ const copyCode = document2.createElement("button");
26440
+ copyCode.type = "button";
26441
+ copyCode.className = "settings-command-button settings-command-button--secondary";
26442
+ copyCode.textContent = messages.accountCopyCode;
26443
+ copyCode.addEventListener("click", () => {
26444
+ void document2.defaultView?.navigator.clipboard?.writeText(login?.userCode ?? "").then(() => {
26445
+ copyCode.textContent = messages.accountCopied;
26446
+ });
26447
+ });
26448
+ const cancel = document2.createElement("button");
26449
+ cancel.type = "button";
26450
+ cancel.className = "settings-command-button settings-command-button--secondary";
26451
+ cancel.textContent = messages.accountLoginCancel;
26452
+ cancel.addEventListener(
26453
+ "click",
26454
+ () => cancelLogin(login?.accountId ?? "", login?.loginId ?? "")
26455
+ );
26456
+ verification.append(prompt, link, code, copyCode, cancel);
26457
+ const verificationRow = document2.createElement("tr");
26458
+ const verificationCell = document2.createElement("td");
26459
+ verificationCell.colSpan = codexAccountAuthKind(account) === "api" ? 3 : 4;
26460
+ verificationCell.append(verification);
26461
+ verificationRow.append(verificationCell);
26462
+ body.append(verificationRow);
26463
+ };
26053
26464
  const render = () => {
26054
- const restoreFocus = accountListFocusRestorer(list, search);
26055
- body.replaceChildren();
26465
+ const restoreFocus = accountListFocusRestorer(groups, search);
26466
+ apiGroup.body.replaceChildren();
26467
+ chatGroup.body.replaceChildren();
26056
26468
  status.textContent = loginMessage ?? "";
26057
- connectedCount.textContent = String(accounts.filter((account) => account.email).length);
26469
+ connectedCount.textContent = String(accounts.length + harnessAccounts.accounts.length);
26470
+ apiGroup.updateDisplay(usageDisplay);
26471
+ chatGroup.updateDisplay(usageDisplay);
26058
26472
  search.disabled = login !== null || loginStartingAccountId !== null;
26059
26473
  for (const [display, button] of displayButtons) {
26060
26474
  button.setAttribute("aria-pressed", String(display === usageDisplay));
26061
26475
  }
26062
26476
  refreshUsage.disabled = (!getClient()?.inspectCodexAccountUsage || !accounts.some((account) => accountHasUsage(account))) && !getClient()?.listHarnessAccounts || harnessAccounts?.refreshing === true || [...usageByAccountId.values()].some((usage) => usage.status === "loading") || accountBusy();
26063
26477
  const query = search.value.trim().toLocaleLowerCase();
26064
- harnessAccounts?.update(query, usageDisplay);
26065
26478
  const visibleAccounts = accounts.filter(
26066
- (account) => `${account.email ?? ""} ${account.label} ${account.authIdentity ?? ""} ${account.authKind ?? ""}`.toLocaleLowerCase().includes(query)
26479
+ (account) => `Codex ${account.email ?? ""} ${account.label} ${account.authIdentity ?? ""} ${account.authKind ?? ""} ${accountPlanLabel(account.planType) ?? ""}`.toLocaleLowerCase().includes(query)
26067
26480
  );
26068
- if (visibleAccounts.length === 0) {
26069
- const emptyRow = document2.createElement("tr");
26070
- const emptyCell = document2.createElement("td");
26071
- emptyCell.colSpan = 4;
26072
- emptyCell.className = "settings-account-empty";
26073
- emptyCell.textContent = query ? messages.accountNoMatches : messages.accountEmpty;
26074
- emptyRow.append(emptyCell);
26075
- body.append(emptyRow);
26076
- }
26481
+ const visibleApi = visibleAccounts.filter(
26482
+ (account) => codexAccountAuthKind(account) === "api"
26483
+ );
26484
+ const visibleChat = visibleAccounts.filter(
26485
+ (account) => codexAccountAuthKind(account) !== "api"
26486
+ );
26487
+ const visibleHarnessAccounts = harnessAccounts.accounts.filter(
26488
+ (account) => `${account.harnessName} ${account.email ?? ""} ${account.label ?? ""} ${account.plan ?? ""}`.toLocaleLowerCase().includes(query)
26489
+ );
26490
+ displayControls.hidden = !accounts.some((account) => codexAccountAuthKind(account) !== "api") && harnessAccounts.accounts.length === 0;
26077
26491
  add.disabled = accountBusy();
26078
- for (const account of visibleAccounts) {
26079
- body.append(
26080
- ...renderAccountRows(document2, account, messages, {
26081
- usage: usageByAccountId.get(account.accountId),
26082
- display: usageDisplay,
26083
- actionsDisabled: accountBusy(),
26084
- usingReset: usingResetAccountId === account.accountId,
26085
- resetDisabled: accountBusy(),
26086
- resetExpanded: expandedResetAccounts.has(account.accountId),
26087
- onActivate: () => mutate(() => client().activateCodexAccount({ accountId: account.accountId })),
26088
- onSignIn: () => startLogin(account.accountId),
26089
- onDelete: () => deleteAccount(account.accountId),
26090
- onRetry: () => {
26091
- usageByAccountId.delete(account.accountId);
26092
- loadUsage(accounts);
26093
- },
26094
- onResetExpanded: (open) => {
26095
- if (open) expandedResetAccounts.add(account.accountId);
26096
- else expandedResetAccounts.delete(account.accountId);
26097
- },
26098
- ...getClient()?.consumeCodexAccountResetCredit ? { onUseReset: () => useReset(account.accountId) } : {}
26099
- })
26100
- );
26101
- if (login?.accountId === account.accountId) {
26102
- const verification = document2.createElement("div");
26103
- verification.className = "settings-account-verification";
26104
- const prompt = document2.createElement("span");
26105
- prompt.textContent = messages.accountVerificationDescription;
26106
- const link = document2.createElement("a");
26107
- link.href = login.verificationUrl;
26108
- link.target = "_blank";
26109
- link.rel = "noopener noreferrer";
26110
- link.textContent = login.verificationUrl;
26111
- link.addEventListener("click", (event) => {
26112
- const bridge = document2.defaultView?.electronBridge;
26113
- if (typeof bridge?.sendMessageFromView !== "function") return;
26114
- event.preventDefault();
26115
- void Promise.resolve(
26116
- bridge.sendMessageFromView({
26117
- type: "open-in-browser",
26118
- url: login?.verificationUrl ?? link.href,
26119
- initiator: "open_in_browser_bridge",
26120
- openTarget: "external-browser",
26121
- source: "manual"
26122
- })
26123
- ).catch(() => void 0);
26124
- });
26125
- const code = document2.createElement("code");
26126
- code.textContent = login.userCode;
26127
- const copyCode = document2.createElement("button");
26128
- copyCode.type = "button";
26129
- copyCode.className = "settings-command-button settings-command-button--secondary";
26130
- copyCode.textContent = messages.accountCopyCode;
26131
- copyCode.addEventListener("click", () => {
26132
- void document2.defaultView?.navigator.clipboard?.writeText(login?.userCode ?? "").then(() => {
26133
- copyCode.textContent = messages.accountCopied;
26134
- });
26135
- });
26136
- const cancel = document2.createElement("button");
26137
- cancel.type = "button";
26138
- cancel.className = "settings-command-button settings-command-button--secondary";
26139
- cancel.textContent = messages.accountLoginCancel;
26140
- cancel.addEventListener(
26141
- "click",
26142
- () => cancelLogin(login?.accountId ?? "", login?.loginId ?? "")
26143
- );
26144
- verification.append(prompt, link, code, copyCode, cancel);
26145
- const verificationRow = document2.createElement("tr");
26146
- const verificationCell = document2.createElement("td");
26147
- verificationCell.colSpan = 4;
26148
- verificationCell.append(verification);
26149
- verificationRow.append(verificationCell);
26150
- body.append(verificationRow);
26492
+ groups.replaceChildren();
26493
+ if (visibleApi.length + visibleChat.length + visibleHarnessAccounts.length === 0) {
26494
+ const empty = document2.createElement("div");
26495
+ empty.className = "settings-account-list";
26496
+ const emptyMessage = document2.createElement("p");
26497
+ emptyMessage.className = "settings-account-empty";
26498
+ emptyMessage.textContent = query ? messages.accountNoMatches : messages.accountEmpty;
26499
+ empty.append(emptyMessage);
26500
+ groups.append(empty);
26501
+ } else {
26502
+ if (visibleApi.length) {
26503
+ for (const account of visibleApi) appendCodexAccount(apiGroup.body, account);
26504
+ groups.append(apiGroup.root);
26505
+ }
26506
+ if (visibleChat.length + visibleHarnessAccounts.length) {
26507
+ for (const account of visibleChat) appendCodexAccount(chatGroup.body, account);
26508
+ for (const account of visibleHarnessAccounts) {
26509
+ chatGroup.body.append(
26510
+ renderHarnessAccountRow(document2, account, messages, usageDisplay)
26511
+ );
26512
+ }
26513
+ groups.append(chatGroup.root);
26151
26514
  }
26152
26515
  }
26153
26516
  restoreFocus();
@@ -26380,10 +26743,11 @@ ${error51.stderrTail}`] : []
26380
26743
  });
26381
26744
  } catch {
26382
26745
  }
26383
- const harnessAccounts = mountHarnessAccounts(context, messages, getClient, render);
26746
+ const harnessAccounts = createHarnessAccounts(context.signal, getClient, render);
26384
26747
  void harnessAccounts.refresh();
26385
26748
  load();
26386
26749
  return () => {
26750
+ stopCountdowns();
26387
26751
  clearLoginRefresh();
26388
26752
  unsubscribe?.();
26389
26753
  };
@@ -26466,7 +26830,7 @@ ${error51.stderrTail}`] : []
26466
26830
  },
26467
26831
  {
26468
26832
  id: "general",
26469
- pageIds: ["plugins", "updates"]
26833
+ pageIds: ["appearance", "plugins", "updates"]
26470
26834
  },
26471
26835
  {
26472
26836
  id: "other",
@@ -26493,6 +26857,14 @@ ${error51.stderrTail}`] : []
26493
26857
  head.append(createRendererSettingsIcon(panelIconName(view), 16), label);
26494
26858
  return head;
26495
26859
  }
26860
+ function appendUniqueUpdateError(document2, panel, error51, shown) {
26861
+ if (!error51 || shown.has(error51)) return;
26862
+ shown.add(error51);
26863
+ const detail = document2.createElement("p");
26864
+ detail.className = "settings-update-error";
26865
+ detail.textContent = error51;
26866
+ panel.append(detail);
26867
+ }
26496
26868
  function createPanelActions(document2, ...buttons) {
26497
26869
  const actions = document2.createElement("div");
26498
26870
  actions.className = "settings-update-actions";
@@ -26879,16 +27251,14 @@ ${error51.stderrTail}`] : []
26879
27251
  scheduleStatusPoll(client, true);
26880
27252
  return;
26881
27253
  }
26882
- const actionableStatus = result.status?.phase === "failed" && result.status.version === result.latestVersion ? result.status : null;
26883
- const view = result.error ? "error" : result.updateAvailable ? "available" : "current";
27254
+ const failedLatest = result.status?.phase === "failed" && result.status.version === result.latestVersion ? result.status : null;
27255
+ const actionableStatus = result.updateAvailable ? failedLatest : null;
27256
+ const view = result.error ? "error" : actionableStatus ? "failed" : result.updateAvailable ? "available" : "current";
26884
27257
  panel.dataset.updateState = view;
26885
27258
  panel.replaceChildren();
26886
27259
  setManualFallback(Boolean(result.error) || actionableStatus !== null);
26887
- const head = result.error || !result.updateAvailable || windows || actionableStatus ? createPanelHead(
26888
- document2,
26889
- view,
26890
- actionableStatus ? statusMessage(actionableStatus, messages) ?? messages.updateFailed : result.error ? messages.updateFailed : result.updateAvailable ? messages.updateWindowsManualRequired : messages.updateUpToDate
26891
- ) : null;
27260
+ const title = actionableStatus ? messages.updateFailed : result.error ? messages.updateFailed : result.updateAvailable ? messages.updateWindowsManualRequired : messages.updateUpToDate;
27261
+ const head = result.error || !result.updateAvailable || windows || actionableStatus ? createPanelHead(document2, view, title) : null;
26892
27262
  const buttons = [];
26893
27263
  if (!windows && result.updateAvailable && result.installationAvailable) {
26894
27264
  const update = document2.createElement("button");
@@ -26913,18 +27283,9 @@ ${error51.stderrTail}`] : []
26913
27283
  } else if (buttons.length > 0) {
26914
27284
  panel.append(createPanelActions(document2, ...buttons));
26915
27285
  }
26916
- if (actionableStatus?.error) {
26917
- const error51 = document2.createElement("p");
26918
- error51.className = "settings-update-error";
26919
- error51.textContent = actionableStatus.error;
26920
- panel.append(error51);
26921
- }
26922
- if (result.error) {
26923
- const error51 = document2.createElement("p");
26924
- error51.className = "settings-update-error";
26925
- error51.textContent = result.error;
26926
- panel.append(error51);
26927
- }
27286
+ const shownErrors = /* @__PURE__ */ new Set([title]);
27287
+ appendUniqueUpdateError(document2, panel, actionableStatus?.error, shownErrors);
27288
+ appendUniqueUpdateError(document2, panel, result.error, shownErrors);
26928
27289
  notes.replaceChildren();
26929
27290
  if (result.releaseNotes) {
26930
27291
  notes.append(createReleaseNotesElement(document2, result.releaseNotes));
@@ -26962,6 +27323,7 @@ ${error51.stderrTail}`] : []
26962
27323
  createConnectionsSettingsPage(messages, getDiagnostics),
26963
27324
  createAccountsSettingsPage(messages, getAccountClient),
26964
27325
  createSessionImportSettingsPage(messages, getSessionImportClient, openImportedThread),
27326
+ createAppearanceSettingsPage(messages),
26965
27327
  createPluginsSettingsPage(messages, getDiagnostics),
26966
27328
  updatesPage(messages, getUpdateClient),
26967
27329
  aboutPage(messages)
@@ -26981,10 +27343,10 @@ ${error51.stderrTail}`] : []
26981
27343
  }
26982
27344
 
26983
27345
  // src/settings/shell.css
26984
- var shell_default = ':host {\n /* Inherit Codex Desktop color-scheme; light-dark() tracks the host page. */\n --settings-bg: light-dark(#ffffff, #181818);\n --settings-sidebar: light-dark(#f4f4f5, #1c1c1c);\n --settings-panel: transparent;\n --settings-text: light-dark(#171717, #f5f5f5);\n --settings-muted: light-dark(#737373, #a1a1a1);\n --settings-subtle: light-dark(#8a8a8a, #777777);\n --settings-border: light-dark(rgb(15 23 42 / 10%), rgb(255 255 255 / 10%));\n --settings-divider: light-dark(rgb(15 23 42 / 10%), rgb(255 255 255 / 10%));\n --settings-hover: light-dark(rgb(15 23 42 / 5%), rgb(255 255 255 / 6%));\n --settings-active: light-dark(rgb(51 156 255 / 14%), rgb(51 156 255 / 12%));\n --settings-focus: #339cff;\n --settings-elevated: light-dark(#ffffff, #2c2c2e);\n --settings-inset: light-dark(rgb(15 23 42 / 4%), rgb(0 0 0 / 18%));\n --settings-surface: light-dark(rgb(15 23 42 / 3%), rgb(255 255 255 / 2%));\n --settings-surface-strong: light-dark(rgb(15 23 42 / 6%), rgb(255 255 255 / 6%));\n --settings-surface-hover: light-dark(#eeeeee, #303030);\n --settings-mark: light-dark(#52525b, #d4d8de);\n --settings-dialog-shadow: light-dark(\n 0 24px 64px rgb(15 23 42 / 16%),\n 0 24px 64px rgb(0 0 0 / 38%)\n );\n --settings-backdrop: light-dark(rgb(15 23 42 / 28%), rgb(0 0 0 / 52%));\n --settings-segmented-shadow:\n 0 0 0 0.5px light-dark(rgb(15 23 42 / 6%), rgb(0 0 0 / 4%)),\n 0 3px 1px 0 light-dark(rgb(15 23 42 / 4%), rgb(0 0 0 / 4%)),\n 0 3px 8px 0 light-dark(rgb(15 23 42 / 10%), rgb(0 0 0 / 12%));\n --settings-primary: light-dark(#171717, #f4f4f4);\n --settings-primary-hover: light-dark(#2f2f2f, #ffffff);\n --settings-primary-text: light-dark(#ffffff, #171717);\n --settings-warning: light-dark(#8a5500, #f5c96a);\n --settings-warning-bg: light-dark(#fff8e6, rgb(245 201 106 / 8%));\n --settings-warning-border: light-dark(#ead8a8, rgb(245 201 106 / 24%));\n --settings-danger: light-dark(#b42318, #f87171);\n --settings-danger-bg: light-dark(#fff1f0, rgb(239 68 68 / 8%));\n --settings-danger-border: light-dark(#f3c7c3, rgb(239 68 68 / 22%));\n --settings-success: light-dark(#16784a, #4ade80);\n color: var(--settings-text);\n color-scheme: inherit;\n font:\n 13px/1.5 system-ui,\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n sans-serif;\n letter-spacing: 0;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n letter-spacing: 0;\n}\n\nbutton,\ninput,\nselect {\n font: inherit;\n}\n\nbutton {\n color: inherit;\n}\n\n[hidden] {\n display: none !important;\n}\n\n.codexhost-settings-dialog {\n width: min(1120px, calc(100vw - 32px));\n height: min(780px, calc(100vh - 32px));\n max-width: none;\n max-height: none;\n margin: auto;\n padding: 0;\n overflow: hidden;\n color: var(--settings-text);\n background: var(--settings-bg);\n border: 1px solid var(--settings-border);\n border-radius: 12px;\n box-shadow: var(--settings-dialog-shadow);\n}\n\n.codexhost-settings-dialog::backdrop {\n background: var(--settings-backdrop);\n}\n\n.settings-frame,\n.settings-layout {\n width: 100%;\n height: 100%;\n min-width: 0;\n min-height: 0;\n}\n\n.settings-frame {\n display: flex;\n flex-direction: column;\n}\n\n.settings-layout {\n flex: 1;\n display: grid;\n grid-template-columns: 184px minmax(0, 1fr);\n background: var(--settings-bg);\n}\n\n.settings-sidebar {\n display: flex;\n min-width: 0;\n min-height: 0;\n flex-direction: column;\n overflow: hidden;\n background: var(--settings-sidebar);\n border-right: 1px solid var(--settings-border);\n padding-top: 14px;\n}\n\n.settings-header {\n display: flex;\n align-items: center;\n min-width: 0;\n height: 48px;\n flex: none;\n padding: 0 12px;\n border-bottom: 1px solid var(--settings-border);\n}\n\n.settings-header-actions {\n display: flex;\n align-items: center;\n flex: none;\n gap: 12px;\n margin-left: auto;\n}\n\n.settings-brand {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 7px;\n}\n\n.settings-brand__mark {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 26px;\n height: 26px;\n flex: none;\n color: var(--settings-text);\n}\n\n.settings-brand__mark .codexhost-settings-icon {\n width: 24px;\n height: 24px;\n object-fit: contain;\n}\n\n.settings-brand__copy {\n display: flex;\n min-width: 0;\n align-items: baseline;\n gap: 0;\n line-height: 20px;\n}\n\n.settings-brand__name {\n overflow: hidden;\n color: var(--settings-text);\n font-size: 13px;\n font-weight: 600;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.settings-brand__title {\n margin-left: 8px;\n padding-left: 8px;\n color: var(--settings-muted);\n font-size: 13px;\n font-weight: 400;\n border-left: 1px solid var(--settings-border);\n}\n\n.settings-nav {\n display: flex;\n min-width: 0;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 2px;\n padding: 0 7px 10px;\n overflow-y: auto;\n}\n\n.settings-nav-section-label {\n min-height: 28px;\n padding: 7px 9px 3px 4px;\n color: var(--settings-muted);\n font-size: 12px;\n font-weight: 600;\n line-height: 18px;\n}\n\n.settings-nav-section-label:not(:first-child) {\n margin-top: 8px;\n}\n\n.settings-nav-button {\n display: grid;\n grid-template-columns: 16px minmax(0, 1fr);\n align-items: center;\n width: 100%;\n position: relative;\n min-height: 34px;\n flex: none;\n gap: 9px;\n padding: 6px 9px;\n color: var(--settings-text);\n font-size: 14px;\n font-weight: 600;\n line-height: 21px;\n text-align: left;\n background: transparent;\n border: 0;\n border-radius: 8px;\n cursor: pointer;\n}\n\n.settings-nav-button .codexhost-settings-icon {\n width: 16px;\n height: 16px;\n opacity: 0.9;\n}\n\n.settings-nav-button:hover {\n background: var(--settings-hover);\n}\n\n.settings-nav-button[aria-current="page"] {\n background: var(--settings-active);\n color: var(--settings-text);\n font-weight: 500;\n}\n\n.settings-nav-button span {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.settings-icon-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n flex: none;\n padding: 0;\n color: var(--settings-muted);\n background: transparent;\n border: 0;\n border-radius: 8px;\n cursor: pointer;\n}\n\n.settings-icon-button:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-icon-button:focus-visible,\n.settings-nav-button:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 1px;\n}\n\n.settings-page {\n display: block;\n position: relative;\n min-width: 0;\n min-height: 0;\n overflow-y: auto;\n background: var(--settings-bg);\n scrollbar-gutter: stable;\n}\n\n.settings-page__content {\n width: min(930px, calc(100% - 80px));\n margin-inline: auto;\n}\n\n.settings-page__content {\n min-width: 0;\n padding: 28px 0 36px;\n}\n\n.settings-section-label {\n min-height: auto;\n padding: 0 0 28px;\n color: var(--settings-text);\n font-size: 18px;\n font-weight: 600;\n line-height: 26px;\n}\n\n.settings-status-list,\n.settings-empty {\n overflow: hidden;\n background: var(--settings-panel);\n}\n\n.settings-status-row {\n display: grid;\n grid-template-columns: minmax(170px, 1fr) auto minmax(280px, 1.45fr);\n position: relative;\n align-items: center;\n min-height: 72px;\n gap: 20px;\n padding: 12px 0;\n}\n\n.settings-status-row:not(:last-child)::after {\n content: "";\n position: absolute;\n right: 0;\n bottom: 0;\n left: 0;\n height: 1px;\n background: var(--settings-divider);\n}\n\n.settings-status-row__identity {\n display: inline-flex;\n align-items: center;\n min-width: 0;\n color: var(--settings-text);\n gap: 10px;\n font-size: 14px;\n font-weight: 500;\n line-height: 22px;\n}\n\n.settings-status-row__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 36px;\n height: 36px;\n flex: none;\n color: var(--settings-muted);\n background: var(--settings-surface-strong);\n border-radius: 50%;\n}\n\n.settings-status-badge {\n flex: none;\n padding: 3px 8px;\n color: var(--settings-muted);\n font-size: 11px;\n font-weight: 500;\n line-height: 18px;\n background: var(--settings-surface-strong);\n border: 1px solid var(--settings-border);\n border-radius: 6px;\n}\n\n.settings-status-row__detail {\n min-width: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-page-description {\n max-width: 760px;\n margin: -10px 0 20px;\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n.settings-session-import-header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 24px;\n}\n\n.settings-session-import-header .settings-section-label {\n min-width: 0;\n}\n\n.settings-session-import-harness {\n display: flex;\n min-width: 0;\n margin: 0 0 16px;\n}\n\n.settings-session-import-harness__options {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n width: fit-content;\n max-width: 100%;\n gap: 8px;\n}\n\n.settings-session-import-harness__option {\n min-height: 32px;\n flex: none;\n padding: 6px 10px;\n color: var(--settings-muted);\n font: inherit;\n font-size: 12px;\n white-space: nowrap;\n background: transparent;\n border: 1px solid var(--settings-border);\n border-radius: 6px;\n cursor: pointer;\n}\n\n.settings-session-import-harness__option[aria-pressed="true"] {\n color: var(--settings-text);\n background: var(--settings-active);\n border-color: rgb(51 156 255 / 50%);\n}\n\n.settings-session-import-harness__option:disabled {\n opacity: 0.38;\n cursor: not-allowed;\n}\n\n.settings-session-import-harness__option:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-session-import-search,\n.settings-session-import-pagination {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 10px;\n}\n\n.settings-session-import-search {\n align-items: stretch;\n margin: 16px 0 0;\n}\n\n.settings-session-import-pagination {\n margin: 16px 0 0;\n}\n\n.settings-session-import-search input {\n flex: 1;\n min-width: 160px;\n}\n\n.settings-session-import-search input,\n.settings-session-import-pagination select {\n box-sizing: border-box;\n color: var(--settings-text);\n background: var(--settings-bg);\n border: 1px solid var(--settings-border);\n border-radius: 6px;\n}\n\n.settings-session-import-search input,\n.settings-session-import-search .settings-command-button {\n box-sizing: border-box;\n height: 36px;\n min-height: 36px;\n padding: 6px 10px;\n border-radius: 6px;\n}\n\n.settings-session-import-pagination select {\n min-height: 28px;\n padding: 2px 8px;\n}\n\n.settings-session-import-search input:focus-visible,\n.settings-session-import-pagination select:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-session-import-pagination {\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n.settings-session-import-pagination label {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.settings-session-import-pagination > span {\n flex: none;\n min-width: 0;\n}\n\n.settings-session-import-pagination__navigation {\n display: flex;\n gap: 8px;\n margin-left: auto;\n}\n\n.settings-session-import-content,\n.settings-session-import-list {\n display: grid;\n gap: 10px;\n}\n\n.settings-session-import-content {\n margin-top: 16px;\n}\n\n.settings-session-import-status {\n display: flex;\n align-items: center;\n min-height: 0;\n gap: 12px;\n padding: 12px 16px;\n color: var(--settings-muted);\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 8px;\n}\n\n.settings-session-import-status.is-error {\n color: #ef4444;\n}\n\n.settings-session-import-recovery {\n display: grid;\n justify-items: start;\n gap: 14px;\n padding: 16px;\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 8px;\n}\n\n.settings-session-import-recovery:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-session-import-recovery__copy {\n display: grid;\n gap: 4px;\n}\n\n.settings-session-import-recovery__copy strong {\n color: var(--settings-text);\n font-size: 14px;\n}\n\n.settings-session-import-recovery__copy p {\n margin: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-session-import-recovery__path {\n display: flex;\n align-items: stretch;\n width: 100%;\n min-width: 0;\n overflow: hidden;\n border: 1px solid var(--settings-border);\n border-radius: 6px;\n}\n\n.settings-session-import-recovery__path code {\n min-width: 0;\n flex: 1;\n padding: 8px 10px;\n overflow-x: auto;\n color: var(--settings-text);\n font-size: 12px;\n line-height: 20px;\n white-space: nowrap;\n}\n\n.settings-session-import-recovery__path .settings-command-button {\n min-height: 0;\n flex: none;\n border-width: 0 0 0 1px;\n border-radius: 0;\n}\n\n.settings-session-import-row {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n align-items: center;\n gap: 20px;\n min-width: 0;\n padding: 16px;\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 8px;\n}\n\n.settings-session-import-row__copy {\n display: grid;\n min-width: 0;\n gap: 4px;\n}\n\n.settings-session-import-row__copy strong {\n overflow: hidden;\n color: var(--settings-text);\n font-size: 14px;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.settings-session-import-row__copy span,\n.settings-session-import-row__cwd {\n overflow: hidden;\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.settings-session-import-row__cwd {\n display: block;\n min-width: 0;\n background: transparent;\n}\n\n.settings-session-import-row__action {\n display: flex;\n align-items: flex-end;\n flex-direction: column;\n gap: 8px;\n}\n\n.settings-session-import-running {\n color: var(--settings-muted);\n font-size: 12px;\n}\n\n.settings-preference-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 32px;\n min-height: 88px;\n padding: 18px 0;\n border-top: 1px solid var(--settings-divider);\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-preference-row__copy {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n min-width: 0;\n gap: 5px;\n}\n\n.settings-preference-row__copy strong {\n color: var(--settings-text);\n font-size: 15px;\n font-weight: 600;\n line-height: 22px;\n}\n\n.settings-preference-row__copy span {\n max-width: 680px;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-preference-switch {\n display: inline-flex;\n align-items: center;\n width: 42px;\n height: 24px;\n flex: none;\n padding: 2px;\n border: 0;\n border-radius: 999px;\n background: var(--settings-surface-strong);\n cursor: pointer;\n transition: background 120ms ease;\n}\n\n.settings-preference-switch[aria-checked="true"] {\n justify-content: flex-end;\n background: var(--settings-focus);\n}\n\n.settings-preference-switch:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-preference-switch__thumb {\n width: 20px;\n height: 20px;\n border-radius: 50%;\n background: var(--settings-primary-text);\n box-shadow: 0 1px 3px rgb(0 0 0 / 24%);\n}\n\n.settings-connection-page-header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 18px;\n margin-bottom: 18px;\n}\n\n.settings-connection-page-header .settings-section-label {\n padding-bottom: 0;\n}\n\n.settings-connection-page-header .settings-page-description {\n margin: 8px 0 0;\n}\n\n.settings-connection-page-header .settings-page-description + .settings-page-description {\n margin-top: 8px;\n}\n\n.settings-update-header {\n margin-bottom: 8px;\n}\n\n.settings-connections-content,\n.settings-plugins-content,\n.settings-connection-list,\n.settings-connection-rows {\n min-width: 0;\n}\n\n.settings-connections-content,\n.settings-plugins-content {\n display: grid;\n gap: 12px;\n}\n\n.settings-connection-list {\n overflow: hidden;\n background: var(--settings-surface);\n border: 1px solid var(--settings-border);\n border-radius: 10px;\n}\n\n.settings-segmented {\n display: inline-flex;\n flex-wrap: wrap;\n align-items: center;\n width: fit-content;\n max-width: 100%;\n padding: 2px;\n gap: 3px;\n background: var(--settings-surface-strong);\n border-radius: 10px;\n}\n\n.settings-segmented__item {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-height: 28px;\n padding: 4px 14px;\n color: var(--settings-muted);\n font: inherit;\n font-size: 12px;\n font-weight: 600;\n line-height: 18px;\n white-space: nowrap;\n background: transparent;\n border: 0;\n border-radius: 8px;\n cursor: pointer;\n transition:\n color 0.15s ease,\n background-color 0.15s ease,\n box-shadow 0.15s ease;\n}\n\n.settings-segmented__item:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-segmented__item--selected,\n.settings-segmented__item[aria-selected="true"],\n.settings-segmented__item[aria-pressed="true"] {\n color: var(--settings-text);\n background: var(--settings-elevated);\n box-shadow: var(--settings-segmented-shadow);\n}\n\n.settings-segmented__item:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.settings-segmented__item:disabled:hover {\n color: var(--settings-muted);\n background: transparent;\n}\n\n.settings-segmented__item:focus-visible,\n.settings-connection-row:focus-visible,\n.settings-connection-install-link:focus-visible,\n.settings-connection-view-error:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 1px;\n}\n\n\n.settings-connection-host-tabs {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 6px;\n overflow-x: auto;\n overflow-y: hidden;\n overscroll-behavior-x: contain;\n scrollbar-width: none;\n scroll-behavior: smooth;\n scroll-snap-type: x proximity;\n touch-action: pan-x;\n}\n\n.settings-connection-host-tabs::-webkit-scrollbar {\n display: none;\n}\n\n.settings-connection-host-tab {\n display: inline-flex;\n align-items: center;\n height: 30px;\n min-width: max-content;\n flex: none;\n padding: 0 9px;\n color: var(--settings-muted);\n font: inherit;\n font-size: 12px;\n line-height: 18px;\n white-space: nowrap;\n background: var(--settings-inset);\n border: 1px solid var(--settings-border);\n border-radius: 7px;\n cursor: pointer;\n scroll-snap-align: start;\n}\n\n.settings-connection-host-tab:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-connection-host-tab[aria-selected="true"] {\n color: var(--settings-text);\n font-weight: 600;\n background: var(--settings-active);\n border-color: var(--settings-border);\n}\n\n.settings-connection-table-header,\n.settings-connection-row {\n display: grid;\n /* Component : Status : Actions = 4 : 3 : 3 */\n grid-template-columns: minmax(0, 4fr) minmax(0, 3fr) minmax(0, 3fr);\n align-items: center;\n min-width: 0;\n column-gap: 16px;\n}\n\n.settings-connection-table-header {\n min-height: 30px;\n padding: 0 10px;\n color: var(--settings-muted);\n font-size: 10px;\n font-weight: 600;\n line-height: 16px;\n text-transform: uppercase;\n letter-spacing: 0.06em;\n background: var(--settings-surface);\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-connection-rows > .settings-connection-row,\n.settings-connection-rows > .settings-connection-block {\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-connection-rows > .settings-connection-row:last-child,\n.settings-connection-rows > .settings-connection-block:last-child {\n border-bottom: 0;\n}\n\n.settings-connection-row {\n min-height: 52px;\n padding: 8px 10px;\n cursor: pointer;\n}\n\n.settings-connection-row:hover {\n background: var(--settings-hover);\n}\n\n.settings-connection-row[data-connection-selected="true"] {\n background: var(--settings-surface);\n}\n\n.settings-connection-row__identity,\n.settings-connection-inspector__identity {\n display: inline-flex;\n align-items: center;\n min-width: 0;\n gap: 8px;\n color: var(--settings-text);\n}\n\n.settings-connection-row__identity strong,\n.settings-connection-inspector__identity strong {\n min-width: 0;\n overflow-wrap: anywhere;\n font-size: 12px;\n font-weight: 500;\n line-height: 18px;\n}\n\n.settings-connection-row__mark {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n flex: none;\n color: var(--settings-mark);\n font-size: 10px;\n font-weight: 700;\n background: var(--settings-surface-strong);\n border-radius: 7px;\n}\n\n.settings-connection-row__mark--logo {\n color: var(--settings-text);\n background: transparent;\n}\n\n.settings-connection-row__mark--logo > img,\n.settings-connection-row__mark--logo > svg {\n display: block;\n max-width: 18px;\n max-height: 18px;\n}\n\n.settings-connection-table-header > :last-child {\n text-align: end;\n}\n\n.settings-connection-row__status {\n display: inline-flex;\n align-items: center;\n width: fit-content;\n max-width: 100%;\n gap: 6px;\n color: var(--settings-muted);\n font-size: 11px;\n font-weight: 500;\n line-height: 18px;\n}\n\n.settings-connection-row__status::before {\n width: 6px;\n height: 6px;\n flex: none;\n content: "";\n background: currentColor;\n border-radius: 50%;\n}\n\n.settings-connection-row__status[data-connection-tone="ready"] {\n color: var(--settings-success);\n}\n\n.settings-connection-row__status[data-connection-tone="checking"] {\n color: var(--settings-warning);\n}\n\n.settings-connection-row__status[data-connection-tone="setup"] {\n color: var(--settings-muted);\n}\n\n.settings-connection-row__status[data-connection-tone="setup"]::before {\n background: transparent;\n border: 1.5px solid currentColor;\n}\n\n.settings-connection-row__status[data-connection-tone="failed"] {\n color: var(--settings-danger);\n}\n\n.settings-connection-row__action {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n min-width: 0;\n gap: 4px;\n}\n\n.settings-connection-row__handle {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n width: 16px;\n color: var(--settings-muted);\n cursor: grab;\n opacity: 0.6;\n}\n\n.settings-connection-row__handle:hover {\n opacity: 1;\n}\n\n.settings-connection-row[draggable="true"] {\n cursor: grab;\n}\n\n.settings-connection-row[data-connection-dragging="true"] {\n opacity: 0.4;\n}\n\n.settings-connection-row[data-connection-drop-indicator="before"] {\n box-shadow: inset 0 2px 0 0 var(--settings-focus);\n}\n\n.settings-connection-row[data-connection-drop-indicator="after"] {\n box-shadow: inset 0 -2px 0 0 var(--settings-focus);\n}\n\n.settings-connection-inline-detail {\n display: grid;\n gap: 12px;\n margin-top: 2px;\n padding: 14px 12px 16px;\n border-top: 1px solid var(--settings-divider);\n background: var(--settings-inset);\n}\n\n.settings-connection-group-divider {\n padding: 10px 12px 6px;\n color: var(--settings-muted);\n font-size: 10px;\n font-weight: 600;\n line-height: 16px;\n text-transform: uppercase;\n letter-spacing: 0.06em;\n /* No border-top here: the row immediately above already carries its own\n border-bottom (it is no longer :last-child once this divider follows\n it), so adding one here would double the separator line. */\n}\n\n.settings-connection-group-divider[data-connection-drag-over="true"] {\n color: var(--settings-focus);\n background: rgb(51 156 255 / 8%);\n border-radius: 6px;\n}\n\n.settings-connection-group-more[data-connection-drag-over="true"] {\n background: rgb(51 156 255 / 8%);\n}\n\n.settings-connection-group-hint {\n display: grid;\n gap: 3px;\n margin: 0 12px 12px;\n padding: 14px 16px;\n text-align: center;\n border: 1.5px dashed var(--settings-border);\n border-radius: 10px;\n}\n\n.settings-connection-group-more[data-connection-drag-over="true"] .settings-connection-group-hint {\n border-color: var(--settings-focus);\n}\n\n.settings-connection-group-hint strong {\n color: var(--settings-text);\n font-size: 12.5px;\n font-weight: 500;\n line-height: 18px;\n}\n\n.settings-connection-group-hint span {\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 17px;\n}\n\n.settings-connection-group-reset {\n display: flex;\n width: 100%;\n align-items: center;\n gap: 6px;\n padding: 10px 12px;\n color: var(--settings-muted);\n font: inherit;\n font-size: 12px;\n text-align: left;\n background: transparent;\n border: 0;\n border-top: 1px solid var(--settings-divider);\n cursor: pointer;\n}\n\n.settings-connection-group-reset:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-connection-install-link {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 26px;\n height: 26px;\n padding: 0;\n color: var(--settings-focus);\n font: inherit;\n text-decoration: none;\n background: transparent;\n border: 1px solid transparent;\n border-radius: 7px;\n cursor: pointer;\n}\n\n.settings-connection-install-link:hover,\n.settings-connection-install-link:focus-visible {\n color: var(--settings-focus);\n background: var(--settings-active);\n border-color: var(--settings-border);\n}\n\n.settings-connection-view-error {\n padding: 4px 7px;\n color: var(--settings-danger);\n font: inherit;\n font-size: 11px;\n line-height: 18px;\n background: transparent;\n border: 0;\n border-radius: 6px;\n cursor: pointer;\n}\n\n.settings-connection-view-error:hover {\n color: var(--settings-danger);\n background: var(--settings-danger-bg);\n}\n\n.settings-connection-inspector {\n position: sticky;\n top: 18px;\n}\n\n.settings-connection-inspector__header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n min-width: 0;\n gap: 10px;\n padding: 12px;\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-connection-inspector__body {\n display: grid;\n min-width: 0;\n gap: 12px;\n padding: 12px;\n}\n\n.settings-connection-install-callout {\n display: grid;\n grid-template-columns: 28px minmax(0, 1fr);\n gap: 9px;\n padding: 11px;\n background: var(--settings-surface);\n border: 0;\n border-radius: 8px;\n}\n\n.settings-connection-install-callout__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n color: var(--settings-focus);\n background: var(--settings-active);\n border-radius: 7px;\n}\n\n.settings-connection-install-callout strong,\n.settings-connection-error-summary strong,\n.settings-connection-state-summary strong {\n display: block;\n margin: 0 0 4px;\n color: var(--settings-text);\n font-size: 12px;\n font-weight: 500;\n line-height: 18px;\n}\n\n.settings-connection-install-callout p,\n.settings-connection-error-summary p,\n.settings-connection-state-summary p,\n.settings-connection-issue-note {\n margin: 0;\n color: var(--settings-muted);\n font-size: 11px;\n line-height: 16px;\n}\n\n.settings-connection-install-command {\n display: grid;\n gap: 4px;\n margin-top: 8px;\n}\n\n.settings-connection-install-command span {\n color: var(--settings-muted);\n font-size: 10px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n}\n\n.settings-connection-install-command code {\n display: block;\n min-width: 0;\n overflow-wrap: anywhere;\n color: var(--settings-text);\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n font-size: 11px;\n line-height: 16px;\n white-space: pre-wrap;\n}\n\n.settings-connection-install-actions {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 8px;\n}\n\n.settings-connection-copy-prompt {\n position: relative;\n}\n\n.settings-connection-copy-prompt__tooltip {\n position: absolute;\n z-index: 4;\n bottom: calc(100% + 6px);\n left: 0;\n width: max-content;\n max-width: min(360px, 72vw);\n max-height: 180px;\n overflow: auto;\n padding: 8px 10px;\n color: var(--settings-text);\n font-size: 11px;\n line-height: 16px;\n white-space: pre-wrap;\n text-align: left;\n background: var(--settings-elevated);\n border: 1px solid var(--settings-border);\n border-radius: 8px;\n box-shadow: 0 10px 24px rgb(0 0 0 / 22%);\n opacity: 0;\n visibility: hidden;\n pointer-events: none;\n transition: opacity 120ms ease;\n}\n\n.settings-connection-copy-prompt:hover .settings-connection-copy-prompt__tooltip,\n.settings-connection-copy-prompt:focus-within .settings-connection-copy-prompt__tooltip {\n opacity: 1;\n visibility: visible;\n}\n\n.settings-connection-error-summary {\n padding: 13px 14px;\n color: var(--settings-danger);\n background: var(--settings-danger-bg);\n border: 1px solid var(--settings-danger-border);\n border-radius: 10px;\n}\n\n.settings-connection-error-metadata {\n display: grid;\n gap: 7px;\n padding: 12px;\n background: var(--settings-inset);\n border: 1px solid var(--settings-border);\n border-radius: 9px;\n}\n\n.settings-connection-detail-line {\n display: grid;\n grid-template-columns: 92px minmax(0, 1fr);\n gap: 10px;\n min-width: 0;\n color: var(--settings-muted);\n font-size: 10px;\n line-height: 16px;\n}\n\n.settings-connection-detail-line code {\n min-width: 0;\n overflow-wrap: anywhere;\n color: var(--settings-text);\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n white-space: pre-wrap;\n}\n\n.settings-connection-error-log-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 10px;\n}\n\n.settings-connection-error-log-header strong {\n color: var(--settings-text);\n font-size: 11px;\n font-weight: 600;\n}\n\n.settings-connection-error-log-header .settings-command-button {\n min-height: 30px;\n padding: 5px 9px;\n font-size: 11px;\n}\n\n.settings-connection-stderr {\n max-height: 220px;\n min-width: 0;\n margin: 0;\n padding: 11px;\n overflow: auto;\n color: var(--settings-text);\n font:\n 10px/16px ui-monospace,\n "SFMono-Regular",\n Consolas,\n "Liberation Mono",\n monospace;\n white-space: pre-wrap;\n overflow-wrap: anywhere;\n background: var(--settings-inset);\n border: 1px solid var(--settings-border);\n border-radius: 9px;\n}\n\n.settings-connection-error-actions {\n display: grid;\n grid-template-columns: minmax(0, 1fr);\n gap: 8px;\n}\n\n.settings-connection-error-actions .settings-command-button {\n width: 100%;\n}\n\n.settings-connection-issue-note {\n margin-top: -4px;\n}\n\n.settings-connection-state-summary {\n padding: 14px;\n background: var(--settings-surface);\n border: 1px solid var(--settings-border);\n border-radius: 10px;\n}\n\n.settings-empty {\n display: flex;\n align-items: center;\n min-height: 72px;\n padding: 12px 16px;\n}\n\n.settings-empty > div {\n display: grid;\n min-width: 0;\n gap: 2px;\n}\n\n.settings-empty strong {\n color: var(--settings-text);\n font-size: 13px;\n font-weight: 500;\n line-height: 19px;\n}\n\n.settings-empty span {\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 19px;\n}\n\n.settings-about-page {\n display: flex;\n flex-direction: column;\n gap: 18px;\n box-sizing: border-box;\n min-height: min(620px, calc(100vh - 200px));\n max-width: 720px;\n}\n\n.settings-about-page > .settings-section-label {\n padding-bottom: 10px;\n}\n\n.settings-about-panel {\n display: grid;\n gap: 18px;\n padding: 24px;\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 12px;\n}\n\n.settings-about-product {\n color: var(--settings-text);\n font-size: 24px;\n font-weight: 700;\n line-height: 32px;\n}\n\n.settings-about-tagline {\n color: var(--settings-text);\n font-size: 16px;\n font-weight: 600;\n line-height: 24px;\n}\n\n.settings-about-copy {\n display: grid;\n max-width: 660px;\n gap: 12px;\n}\n\n.settings-about-lead,\n.settings-about-extension,\n.settings-about-closing p,\n.settings-about-copy p {\n margin: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 21px;\n}\n\n.settings-about-lead {\n color: var(--settings-text);\n font-weight: 500;\n}\n\n.settings-about-agents {\n display: grid;\n gap: 10px;\n margin: 2px 0;\n padding: 0;\n list-style: none;\n}\n\n.settings-about-agent {\n display: grid;\n gap: 4px;\n padding-left: 2px;\n}\n\n.settings-about-agent-name {\n color: var(--settings-text);\n font-size: 13px;\n font-weight: 600;\n line-height: 18px;\n}\n\n.settings-about-agent-name::before {\n content: "\xB7 ";\n color: var(--settings-muted);\n font-weight: 600;\n}\n\n.settings-about-agent-description {\n display: block;\n padding-left: 0.85em;\n color: var(--settings-muted);\n font-size: 12px;\n font-weight: 400;\n line-height: 18px;\n}\n\n.settings-about-closing {\n display: grid;\n gap: 8px;\n}\n\n.settings-about-repository {\n gap: 10px;\n}\n\n.settings-about-open-source {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 0.35em;\n margin: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 21px;\n}\n\n.settings-about-repository p {\n margin: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 21px;\n}\n\n.settings-about-star-callout {\n margin: 4px 0 0;\n color: var(--settings-warning);\n font-size: 14px;\n font-weight: 600;\n line-height: 22px;\n}\n\n.settings-about-repository-link {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n color: #7cb8ff;\n font-weight: 600;\n line-height: 1;\n text-decoration: none;\n}\n\n.settings-about-repository-link .codexhost-settings-icon {\n display: block;\n flex: none;\n}\n\n.settings-about-repository-link:hover {\n text-decoration: underline;\n}\n\n.settings-about-brand {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 12px;\n margin-top: auto;\n padding-top: 12px;\n color: inherit;\n opacity: 0.9;\n text-decoration: none;\n transition: opacity 160ms ease;\n}\n\n.settings-about-brand:hover {\n opacity: 1;\n}\n\n.settings-about-brand-video {\n width: 40px;\n height: 40px;\n flex: none;\n overflow: hidden;\n object-fit: cover;\n border-radius: 999px;\n box-shadow: 0 1px 2px rgb(0 0 0 / 18%);\n}\n\n.settings-about-brand-copy {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 2px;\n}\n\n.settings-about-brand-name {\n color: var(--settings-text);\n font-size: 14px;\n font-weight: 800;\n letter-spacing: 0.18em;\n line-height: 18px;\n}\n\n.settings-about-brand-tagline {\n color: var(--settings-muted);\n font-size: 12px;\n font-weight: 500;\n letter-spacing: 0.18em;\n line-height: 16px;\n}\n\n.settings-page-error {\n padding: 16px;\n color: var(--settings-text);\n font-size: 13px;\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 20px;\n}\n\n.settings-update-metadata {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 1fr));\n gap: 24px;\n margin-bottom: 24px;\n padding: 0 0 20px;\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-update-metadata__item {\n display: grid;\n min-width: 0;\n gap: 4px;\n}\n\n.settings-update-metadata__item span {\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n.settings-update-metadata__item strong {\n min-width: 0;\n overflow-wrap: anywhere;\n color: var(--settings-text);\n font-size: 15px;\n font-weight: 500;\n line-height: 22px;\n}\n\n/* The only emphasis on this screen: a latest version newer than the installed one. */\n.settings-update-metadata__value--newer {\n color: var(--settings-focus);\n}\n\n.settings-update-panel {\n display: grid;\n gap: 12px;\n padding: 20px;\n color: var(--settings-text);\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 8px;\n}\n\n/* Soft status copy and the Update action should not sit in a framed card. */\n.settings-update-panel[data-update-state="unavailable"],\n.settings-update-panel[data-update-state="failed"],\n.settings-update-panel[data-update-state="error"],\n.settings-update-panel[data-update-state="available"] {\n padding: 4px 0 0;\n border: 0;\n border-radius: 0;\n}\n\n.settings-update-panel__status-row {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 8px;\n min-width: 0;\n}\n\n.settings-update-panel__status-row .settings-update-actions {\n flex: none;\n}\n\n.settings-update-panel__status-row .settings-update-panel__head {\n flex: 1 1 auto;\n min-width: 0;\n}\n\n.settings-update-panel__head {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 8px;\n}\n\n.settings-update-panel__head .codexhost-settings-icon {\n color: var(--settings-muted);\n}\n\n.settings-update-panel[data-update-state="available"]\n .settings-update-panel__head\n .codexhost-settings-icon,\n.settings-update-panel[data-update-state="downloading"]\n .settings-update-panel__head\n .codexhost-settings-icon,\n.settings-update-panel[data-update-state="installing"]\n .settings-update-panel__head\n .codexhost-settings-icon,\n.settings-update-panel[data-update-state="restarting"]\n .settings-update-panel__head\n .codexhost-settings-icon {\n color: var(--settings-focus);\n}\n\n.settings-update-panel[data-update-state="current"]\n .settings-update-panel__head\n .codexhost-settings-icon {\n color: var(--settings-success);\n}\n\n.settings-update-panel[data-update-state="failed"]\n .settings-update-panel__head\n .codexhost-settings-icon,\n.settings-update-panel[data-update-state="error"]\n .settings-update-panel__head\n .codexhost-settings-icon {\n color: var(--settings-danger);\n}\n\n.settings-update-panel[data-update-state="unavailable"]\n .settings-update-panel__head\n .codexhost-settings-icon {\n color: var(--settings-muted);\n}\n\n.settings-update-panel__title {\n min-width: 0;\n overflow-wrap: anywhere;\n color: var(--settings-text);\n font-size: 14px;\n font-weight: 600;\n line-height: 22px;\n}\n\n.settings-update-summary,\n.settings-update-error {\n margin: 0;\n overflow-wrap: anywhere;\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-update-summary {\n color: var(--settings-muted);\n}\n\n.settings-update-error {\n color: var(--settings-danger);\n}\n\n.settings-update-progress {\n width: 100%;\n height: 8px;\n accent-color: var(--settings-focus);\n}\n\n.settings-update-progress-detail {\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n/* Release notes scroll with the page; a scroller inside a scroller traps the wheel. */\n.settings-update-notes-section {\n min-width: 0;\n margin-top: 24px;\n padding-top: 24px;\n border-top: 1px solid var(--settings-divider);\n}\n\n.settings-update-notes-section:empty {\n display: none;\n}\n\n.settings-update-notes {\n display: grid;\n min-width: 0;\n gap: 12px;\n color: var(--settings-muted);\n font-size: 14px;\n line-height: 22px;\n overflow-wrap: anywhere;\n}\n\n.settings-update-notes > :first-child {\n margin-top: 0;\n}\n\n.settings-update-notes > :last-child {\n margin-bottom: 0;\n}\n\n.settings-update-notes h1,\n.settings-update-notes h2,\n.settings-update-notes h3,\n.settings-update-notes h4,\n.settings-update-notes h5,\n.settings-update-notes h6 {\n margin: 6px 0 0;\n color: var(--settings-text);\n font-weight: 600;\n}\n\n.settings-update-notes h1 {\n font-size: 18px;\n line-height: 26px;\n}\n\n.settings-update-notes h2 {\n font-size: 17px;\n line-height: 24px;\n}\n\n.settings-update-notes h3,\n.settings-update-notes h4,\n.settings-update-notes h5,\n.settings-update-notes h6 {\n font-size: 14px;\n line-height: 22px;\n}\n\n.settings-update-notes p,\n.settings-update-notes ul,\n.settings-update-notes ol,\n.settings-update-notes pre,\n.settings-update-notes blockquote {\n margin: 0;\n}\n\n.settings-update-notes ul,\n.settings-update-notes ol {\n padding-left: 24px;\n}\n\n.settings-update-notes li {\n padding-left: 4px;\n}\n\n.settings-update-notes li::marker {\n color: var(--settings-muted);\n font-size: 0.85em;\n}\n\n.settings-update-notes li + li {\n margin-top: 14px;\n}\n\n.settings-update-notes .release-note-translation {\n display: block;\n margin-top: 3px;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-update-notes blockquote {\n padding: 8px 12px;\n color: var(--settings-muted);\n border-left: 3px solid var(--settings-focus);\n background: var(--settings-surface);\n}\n\n.settings-update-notes hr {\n width: 100%;\n margin: 2px 0;\n border: 0;\n border-top: 1px solid var(--settings-divider);\n}\n\n.settings-update-notes strong {\n color: var(--settings-text);\n font-weight: 600;\n}\n\n.settings-update-notes a {\n color: var(--settings-focus);\n text-decoration: none;\n}\n\n.settings-update-notes a:hover {\n text-decoration: underline;\n}\n\n.settings-update-notes code {\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n font-size: 12px;\n}\n\n.settings-update-notes :not(pre) > code {\n padding: 1px 5px;\n background: var(--settings-surface-strong);\n border-radius: 4px;\n}\n\n.settings-update-notes pre {\n min-width: 0;\n max-width: 100%;\n padding: 10px 12px;\n overflow-x: auto;\n overflow-y: hidden;\n background: var(--settings-inset);\n border-radius: 6px;\n}\n\n.settings-update-notes pre code {\n line-height: 18px;\n white-space: pre-wrap;\n}\n\n/* Manual update sits directly under the status panel, not behind a disclosure:\n automatic updates can fail for machine-local reasons and this is the way out. */\n.settings-update-controls {\n display: grid;\n min-width: 0;\n gap: 10px;\n margin-top: 24px;\n}\n\n.settings-update-manual-title {\n color: var(--settings-text);\n font-size: 15px;\n font-weight: 600;\n line-height: 22px;\n}\n\n.settings-update-manual {\n display: grid;\n min-width: 0;\n gap: 8px;\n}\n\n.settings-update-manual[hidden] {\n display: none;\n}\n\n.settings-update-manual-description {\n margin: 0;\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n.settings-update-manual-description.is-fallback {\n color: var(--settings-danger);\n}\n\n.settings-update-command {\n display: flex;\n align-items: stretch;\n min-width: 0;\n overflow: hidden;\n border: 1px solid var(--settings-border);\n border-radius: 6px;\n}\n\n.settings-update-command code {\n min-width: 0;\n flex: 1;\n padding: 9px 12px;\n overflow-x: auto;\n color: var(--settings-text);\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n font-size: 12px;\n line-height: 20px;\n white-space: nowrap;\n}\n\n.settings-update-command__copy {\n display: inline-flex;\n align-items: center;\n flex: none;\n gap: 6px;\n padding: 0 12px;\n color: var(--settings-muted);\n font-size: 12px;\n background: transparent;\n border: 0;\n border-left: 1px solid var(--settings-border);\n cursor: pointer;\n}\n\n.settings-update-command__copy:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-update-command__copy:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: -2px;\n}\n\n.settings-update-actions {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.settings-command-button,\n.settings-update-link {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex: none;\n width: max-content;\n max-width: 100%;\n min-height: 30px;\n gap: 6px;\n padding: 5px 10px;\n white-space: nowrap;\n color: var(--settings-primary-text);\n font: inherit;\n font-size: 12px;\n text-decoration: none;\n background: var(--settings-primary);\n border: 1px solid var(--settings-primary);\n border-radius: 7px;\n cursor: pointer;\n}\n\n.settings-command-button--secondary,\n.settings-update-link {\n color: var(--settings-muted);\n background: transparent;\n border-color: var(--settings-border);\n}\n\n.settings-command-button--secondary .codexhost-settings-icon,\n.settings-update-link .codexhost-settings-icon {\n color: var(--settings-muted);\n}\n\n.settings-command-button:hover:not(.settings-command-button--secondary) {\n filter: brightness(1.08);\n}\n\n.settings-command-button--danger {\n color: var(--settings-danger);\n}\n\n.settings-command-button--danger:hover:not(:disabled) {\n color: #fecaca;\n background: var(--settings-danger-bg);\n border-color: var(--settings-danger-border);\n}\n\n.settings-command-button--secondary:hover,\n.settings-update-link:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-command-button--secondary:hover .codexhost-settings-icon,\n.settings-update-link:hover .codexhost-settings-icon {\n color: var(--settings-text);\n}\n\n.settings-command-button:disabled,\n.settings-command-button[aria-disabled="true"] {\n opacity: 0.55;\n cursor: not-allowed;\n filter: none;\n}\n\n.settings-command-button:focus-visible,\n.settings-update-link:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n}\n\n.settings-session-import-content {\n display: grid;\n min-width: 0;\n gap: 12px;\n margin-top: 16px;\n}\n\n.settings-session-import-list {\n display: grid;\n min-width: 0;\n overflow: hidden;\n background: var(--settings-surface);\n border: 1px solid var(--settings-border);\n border-radius: 12px;\n}\n\n.settings-session-import-row {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n align-items: center;\n min-width: 0;\n gap: 16px;\n padding: 14px 16px;\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-session-import-row:last-child {\n border-bottom: 0;\n}\n\n.settings-session-import-row__copy {\n display: grid;\n min-width: 0;\n gap: 4px;\n}\n\n.settings-session-import-row__copy strong {\n color: var(--settings-text);\n font-size: 14px;\n font-weight: 600;\n line-height: 20px;\n}\n\n.settings-session-import-row__copy span,\n.settings-session-import-row__cwd {\n min-width: 0;\n overflow-wrap: anywhere;\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n.settings-session-import-row__cwd {\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n}\n\n.settings-session-import-row__action {\n display: flex;\n align-items: center;\n flex: none;\n gap: 8px;\n}\n\n.settings-session-import-running {\n color: #f5c542;\n font-size: 12px;\n font-weight: 500;\n line-height: 18px;\n white-space: nowrap;\n}\n\n.settings-session-import-recovery {\n display: grid;\n min-width: 0;\n gap: 12px;\n padding: 16px;\n background: var(--settings-surface);\n border: 1px solid var(--settings-border);\n border-radius: 12px;\n}\n\n.settings-session-import-recovery__copy {\n display: grid;\n gap: 6px;\n}\n\n.settings-session-import-recovery__copy strong {\n color: var(--settings-text);\n font-size: 15px;\n font-weight: 600;\n line-height: 22px;\n}\n\n.settings-session-import-recovery__copy p {\n margin: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-session-import-recovery__path {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 8px;\n}\n\n.settings-session-import-recovery__path code {\n min-width: 0;\n flex: 1;\n overflow-wrap: anywhere;\n color: var(--settings-text);\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n font-size: 12px;\n line-height: 18px;\n}\n\n.codexhost-settings-icon {\n display: block;\n flex: none;\n stroke: currentColor;\n}\n\n@media (max-width: 720px) {\n .codexhost-settings-dialog {\n width: calc(100vw - 16px);\n height: calc(100vh - 16px);\n border-radius: 10px;\n }\n\n .settings-layout {\n grid-template-columns: minmax(0, 1fr);\n grid-template-rows: auto minmax(0, 1fr);\n }\n\n .settings-sidebar {\n border-right: 0;\n border-bottom: 1px solid var(--settings-border);\n }\n\n .settings-header {\n height: 56px;\n padding-inline: 14px;\n }\n\n .settings-sidebar {\n padding-top: 20px;\n }\n\n .settings-nav {\n flex: none;\n flex-direction: row;\n gap: 4px;\n padding: 7px 8px 8px;\n overflow-x: auto;\n overflow-y: hidden;\n }\n\n .settings-nav-section-label {\n display: none;\n }\n\n .settings-nav-button {\n width: auto;\n min-width: max-content;\n min-height: 34px;\n grid-template-columns: 16px auto;\n border-radius: 10px;\n }\n\n .settings-page__content {\n width: calc(100% - 40px);\n }\n\n .settings-page__content {\n padding-top: 32px;\n padding-bottom: 32px;\n }\n\n .settings-section-label {\n padding-bottom: 20px;\n font-size: 20px;\n line-height: 26px;\n }\n\n .settings-update-metadata {\n grid-template-columns: minmax(0, 1fr);\n gap: 16px;\n }\n\n .settings-status-row {\n grid-template-columns: minmax(0, 1fr) auto;\n gap: 16px;\n }\n\n .settings-account-header,\n .settings-connection-page-header {\n flex-direction: column;\n }\n\n .settings-account-header > .settings-command-button,\n .settings-connection-page-header > .settings-command-button {\n width: 100%;\n }\n\n .settings-session-import-row {\n grid-template-columns: minmax(0, 1fr);\n }\n\n .settings-session-import-row__action {\n justify-content: flex-start;\n flex-wrap: wrap;\n }\n\n .settings-status-row__detail {\n grid-column: 1 / -1;\n margin: -8px 0 0 58px;\n }\n}\n\n@media (forced-colors: active) {\n :host,\n :host([data-theme="light"]),\n :host([data-theme="dark"]) {\n --settings-bg: Canvas;\n --settings-sidebar: Canvas;\n --settings-panel: Canvas;\n --settings-surface: Canvas;\n --settings-surface-hover: Highlight;\n --settings-inset: Canvas;\n --settings-text: CanvasText;\n --settings-muted: GrayText;\n --settings-subtle: GrayText;\n --settings-border: ButtonBorder;\n --settings-divider: ButtonBorder;\n --settings-hover: Highlight;\n --settings-active: Highlight;\n --settings-focus: Highlight;\n --settings-elevated: Canvas;\n --settings-surface-strong: Canvas;\n --settings-mark: CanvasText;\n --settings-primary: ButtonFace;\n --settings-primary-hover: Highlight;\n --settings-primary-text: ButtonText;\n --settings-warning: CanvasText;\n --settings-warning-bg: Canvas;\n --settings-warning-border: ButtonBorder;\n --settings-danger: CanvasText;\n --settings-danger-bg: Canvas;\n --settings-danger-border: ButtonBorder;\n --settings-success: CanvasText;\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n *,\n *::before,\n *::after {\n scroll-behavior: auto !important;\n transition-duration: 0s !important;\n }\n}\n';
27346
+ var shell_default = ':host {\n /* Inherit Codex Desktop color-scheme; light-dark() tracks the host page. */\n --settings-bg: light-dark(#ffffff, #181818);\n --settings-sidebar: light-dark(#f4f4f5, #1c1c1c);\n --settings-panel: transparent;\n --settings-text: light-dark(#171717, #f5f5f5);\n --settings-muted: light-dark(#737373, #a1a1a1);\n --settings-subtle: light-dark(#8a8a8a, #777777);\n --settings-border: light-dark(rgb(15 23 42 / 10%), rgb(255 255 255 / 10%));\n --settings-divider: light-dark(rgb(15 23 42 / 10%), rgb(255 255 255 / 10%));\n --settings-hover: light-dark(rgb(15 23 42 / 5%), rgb(255 255 255 / 6%));\n --settings-active: light-dark(rgb(51 156 255 / 14%), rgb(51 156 255 / 12%));\n --settings-focus: #339cff;\n --settings-elevated: light-dark(#ffffff, #2c2c2e);\n --settings-inset: light-dark(rgb(15 23 42 / 4%), rgb(0 0 0 / 18%));\n --settings-surface: light-dark(rgb(15 23 42 / 3%), rgb(255 255 255 / 2%));\n --settings-surface-strong: light-dark(rgb(15 23 42 / 6%), rgb(255 255 255 / 6%));\n --settings-surface-hover: light-dark(#eeeeee, #303030);\n --settings-mark: light-dark(#52525b, #d4d8de);\n --settings-dialog-shadow: light-dark(\n 0 24px 64px rgb(15 23 42 / 16%),\n 0 24px 64px rgb(0 0 0 / 38%)\n );\n --settings-backdrop: light-dark(rgb(15 23 42 / 28%), rgb(0 0 0 / 52%));\n --settings-segmented-shadow:\n 0 0 0 0.5px light-dark(rgb(15 23 42 / 6%), rgb(0 0 0 / 4%)),\n 0 3px 1px 0 light-dark(rgb(15 23 42 / 4%), rgb(0 0 0 / 4%)),\n 0 3px 8px 0 light-dark(rgb(15 23 42 / 10%), rgb(0 0 0 / 12%));\n --settings-primary: light-dark(#171717, #f4f4f4);\n --settings-primary-hover: light-dark(#2f2f2f, #ffffff);\n --settings-primary-text: light-dark(#ffffff, #171717);\n --settings-warning: light-dark(#8a5500, #f5c96a);\n --settings-warning-bg: light-dark(#fff8e6, rgb(245 201 106 / 8%));\n --settings-warning-border: light-dark(#ead8a8, rgb(245 201 106 / 24%));\n --settings-danger: light-dark(#b42318, #f87171);\n --settings-danger-bg: light-dark(#fff1f0, rgb(239 68 68 / 8%));\n --settings-danger-border: light-dark(#f3c7c3, rgb(239 68 68 / 22%));\n --settings-success: light-dark(#16784a, #4ade80);\n color: var(--settings-text);\n color-scheme: inherit;\n font:\n 13px/1.5 system-ui,\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n sans-serif;\n letter-spacing: 0;\n}\n\n*,\n*::before,\n*::after {\n box-sizing: border-box;\n letter-spacing: 0;\n}\n\nbutton,\ninput,\nselect {\n font: inherit;\n}\n\nbutton {\n color: inherit;\n}\n\n[hidden] {\n display: none !important;\n}\n\n.codexhost-settings-dialog {\n width: min(1120px, calc(100vw - 32px));\n height: min(780px, calc(100vh - 32px));\n max-width: none;\n max-height: none;\n margin: auto;\n padding: 0;\n overflow: hidden;\n color: var(--settings-text);\n background: var(--settings-bg);\n border: 1px solid var(--settings-border);\n border-radius: 12px;\n box-shadow: var(--settings-dialog-shadow);\n}\n\n.codexhost-settings-dialog::backdrop {\n background: var(--settings-backdrop);\n}\n\n.settings-frame,\n.settings-layout {\n width: 100%;\n height: 100%;\n min-width: 0;\n min-height: 0;\n}\n\n.settings-frame {\n display: flex;\n flex-direction: column;\n}\n\n.settings-layout {\n flex: 1;\n display: grid;\n grid-template-columns: 184px minmax(0, 1fr);\n background: var(--settings-bg);\n}\n\n.settings-sidebar {\n display: flex;\n min-width: 0;\n min-height: 0;\n flex-direction: column;\n overflow: hidden;\n background: var(--settings-sidebar);\n border-right: 1px solid var(--settings-border);\n padding-top: 14px;\n}\n\n.settings-header {\n display: flex;\n align-items: center;\n min-width: 0;\n height: 48px;\n flex: none;\n padding: 0 12px;\n border-bottom: 1px solid var(--settings-border);\n}\n\n.settings-header-actions {\n display: flex;\n align-items: center;\n flex: none;\n gap: 12px;\n margin-left: auto;\n}\n\n.settings-brand {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 7px;\n}\n\n.settings-brand__mark {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 26px;\n height: 26px;\n flex: none;\n color: var(--settings-text);\n}\n\n.settings-brand__mark .codexhost-settings-icon {\n width: 24px;\n height: 24px;\n object-fit: contain;\n}\n\n.settings-brand__copy {\n display: flex;\n min-width: 0;\n align-items: baseline;\n gap: 0;\n line-height: 20px;\n}\n\n.settings-brand__name {\n overflow: hidden;\n color: var(--settings-text);\n font-size: 13px;\n font-weight: 600;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.settings-brand__title {\n margin-left: 8px;\n padding-left: 8px;\n color: var(--settings-muted);\n font-size: 13px;\n font-weight: 400;\n border-left: 1px solid var(--settings-border);\n}\n\n.settings-nav {\n display: flex;\n min-width: 0;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 2px;\n padding: 0 7px 10px;\n overflow-y: auto;\n}\n\n.settings-nav-section-label {\n min-height: 28px;\n padding: 7px 9px 3px 4px;\n color: var(--settings-muted);\n font-size: 12px;\n font-weight: 600;\n line-height: 18px;\n}\n\n.settings-nav-section-label:not(:first-child) {\n margin-top: 8px;\n}\n\n.settings-nav-button {\n display: grid;\n grid-template-columns: 16px minmax(0, 1fr);\n align-items: center;\n width: 100%;\n position: relative;\n min-height: 34px;\n flex: none;\n gap: 9px;\n padding: 6px 9px;\n color: var(--settings-text);\n font-size: 14px;\n font-weight: 600;\n line-height: 21px;\n text-align: left;\n background: transparent;\n border: 0;\n border-radius: 8px;\n cursor: pointer;\n}\n\n.settings-nav-button .codexhost-settings-icon {\n width: 16px;\n height: 16px;\n opacity: 0.9;\n}\n\n.settings-nav-button:hover {\n background: var(--settings-hover);\n}\n\n.settings-nav-button[aria-current="page"] {\n background: var(--settings-active);\n color: var(--settings-text);\n font-weight: 500;\n}\n\n.settings-nav-button span {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.settings-icon-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n flex: none;\n padding: 0;\n color: var(--settings-muted);\n background: transparent;\n border: 0;\n border-radius: 8px;\n cursor: pointer;\n}\n\n.settings-icon-button:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-icon-button:focus-visible,\n.settings-nav-button:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 1px;\n}\n\n.settings-page {\n display: block;\n position: relative;\n min-width: 0;\n min-height: 0;\n overflow-y: auto;\n background: var(--settings-bg);\n scrollbar-gutter: stable;\n}\n\n.settings-page__content {\n width: min(930px, calc(100% - 80px));\n margin-inline: auto;\n}\n\n.settings-page__content {\n min-width: 0;\n padding: 28px 0 36px;\n}\n\n.settings-section-label {\n min-height: auto;\n padding: 0 0 28px;\n color: var(--settings-text);\n font-size: 18px;\n font-weight: 600;\n line-height: 26px;\n}\n\n.settings-status-list,\n.settings-empty {\n overflow: hidden;\n background: var(--settings-panel);\n}\n\n.settings-status-row {\n display: grid;\n grid-template-columns: minmax(170px, 1fr) auto minmax(280px, 1.45fr);\n position: relative;\n align-items: center;\n min-height: 72px;\n gap: 20px;\n padding: 12px 0;\n}\n\n.settings-status-row:not(:last-child)::after {\n content: "";\n position: absolute;\n right: 0;\n bottom: 0;\n left: 0;\n height: 1px;\n background: var(--settings-divider);\n}\n\n.settings-status-row__identity {\n display: inline-flex;\n align-items: center;\n min-width: 0;\n color: var(--settings-text);\n gap: 10px;\n font-size: 14px;\n font-weight: 500;\n line-height: 22px;\n}\n\n.settings-status-row__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 36px;\n height: 36px;\n flex: none;\n color: var(--settings-muted);\n background: var(--settings-surface-strong);\n border-radius: 50%;\n}\n\n.settings-status-badge {\n flex: none;\n padding: 3px 8px;\n color: var(--settings-muted);\n font-size: 11px;\n font-weight: 500;\n line-height: 18px;\n background: var(--settings-surface-strong);\n border: 1px solid var(--settings-border);\n border-radius: 6px;\n}\n\n.settings-status-row__detail {\n min-width: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-page-description {\n max-width: 760px;\n margin: -10px 0 20px;\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n.settings-session-import-header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 24px;\n}\n\n.settings-session-import-header .settings-section-label {\n min-width: 0;\n}\n\n.settings-session-import-harness {\n display: flex;\n min-width: 0;\n margin: 0 0 16px;\n}\n\n.settings-session-import-harness__options {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n width: fit-content;\n max-width: 100%;\n gap: 8px;\n}\n\n.settings-session-import-harness__option {\n min-height: 32px;\n flex: none;\n padding: 6px 10px;\n color: var(--settings-muted);\n font: inherit;\n font-size: 12px;\n white-space: nowrap;\n background: transparent;\n border: 1px solid var(--settings-border);\n border-radius: 6px;\n cursor: pointer;\n}\n\n.settings-session-import-harness__option[aria-pressed="true"] {\n color: var(--settings-text);\n background: var(--settings-active);\n border-color: rgb(51 156 255 / 50%);\n}\n\n.settings-session-import-harness__option:disabled {\n opacity: 0.38;\n cursor: not-allowed;\n}\n\n.settings-session-import-harness__option:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-session-import-search,\n.settings-session-import-pagination {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 10px;\n}\n\n.settings-session-import-search {\n align-items: stretch;\n margin: 16px 0 0;\n}\n\n.settings-session-import-pagination {\n margin: 16px 0 0;\n}\n\n.settings-session-import-search input {\n flex: 1;\n min-width: 160px;\n}\n\n.settings-session-import-search input,\n.settings-session-import-pagination select {\n box-sizing: border-box;\n color: var(--settings-text);\n background: var(--settings-bg);\n border: 1px solid var(--settings-border);\n border-radius: 6px;\n}\n\n.settings-session-import-search input,\n.settings-session-import-search .settings-command-button {\n box-sizing: border-box;\n height: 36px;\n min-height: 36px;\n padding: 6px 10px;\n border-radius: 6px;\n}\n\n.settings-session-import-pagination select {\n min-height: 28px;\n padding: 2px 8px;\n}\n\n.settings-session-import-search input:focus-visible,\n.settings-session-import-pagination select:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-session-import-pagination {\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n.settings-session-import-pagination label {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.settings-session-import-pagination > span {\n flex: none;\n min-width: 0;\n}\n\n.settings-session-import-pagination__navigation {\n display: flex;\n gap: 8px;\n margin-left: auto;\n}\n\n.settings-session-import-content,\n.settings-session-import-list {\n display: grid;\n gap: 10px;\n}\n\n.settings-session-import-content {\n margin-top: 16px;\n}\n\n.settings-session-import-status {\n display: flex;\n align-items: center;\n min-height: 0;\n gap: 12px;\n padding: 12px 16px;\n color: var(--settings-muted);\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 8px;\n}\n\n.settings-session-import-status.is-error {\n color: #ef4444;\n}\n\n.settings-session-import-recovery {\n display: grid;\n justify-items: start;\n gap: 14px;\n padding: 16px;\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 8px;\n}\n\n.settings-session-import-recovery:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-session-import-recovery__copy {\n display: grid;\n gap: 4px;\n}\n\n.settings-session-import-recovery__copy strong {\n color: var(--settings-text);\n font-size: 14px;\n}\n\n.settings-session-import-recovery__copy p {\n margin: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-session-import-recovery__path {\n display: flex;\n align-items: stretch;\n width: 100%;\n min-width: 0;\n overflow: hidden;\n border: 1px solid var(--settings-border);\n border-radius: 6px;\n}\n\n.settings-session-import-recovery__path code {\n min-width: 0;\n flex: 1;\n padding: 8px 10px;\n overflow-x: auto;\n color: var(--settings-text);\n font-size: 12px;\n line-height: 20px;\n white-space: nowrap;\n}\n\n.settings-session-import-recovery__path .settings-command-button {\n min-height: 0;\n flex: none;\n border-width: 0 0 0 1px;\n border-radius: 0;\n}\n\n.settings-session-import-row {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n align-items: center;\n gap: 20px;\n min-width: 0;\n padding: 16px;\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 8px;\n}\n\n.settings-session-import-row__copy {\n display: grid;\n min-width: 0;\n gap: 4px;\n}\n\n.settings-session-import-row__copy strong {\n overflow: hidden;\n color: var(--settings-text);\n font-size: 14px;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.settings-session-import-row__copy span,\n.settings-session-import-row__cwd {\n overflow: hidden;\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.settings-session-import-row__cwd {\n display: block;\n min-width: 0;\n background: transparent;\n}\n\n.settings-session-import-row__action {\n display: flex;\n align-items: flex-end;\n flex-direction: column;\n gap: 8px;\n}\n\n.settings-session-import-running {\n color: var(--settings-muted);\n font-size: 12px;\n}\n\n.settings-preference-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 32px;\n min-height: 88px;\n padding: 18px 0;\n border-top: 1px solid var(--settings-divider);\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-preference-row__copy {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n min-width: 0;\n gap: 5px;\n}\n\n.settings-preference-row__copy strong {\n color: var(--settings-text);\n font-size: 15px;\n font-weight: 600;\n line-height: 22px;\n}\n\n.settings-preference-row__copy span {\n max-width: 680px;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-preference-switch {\n display: inline-flex;\n align-items: center;\n width: 42px;\n height: 24px;\n flex: none;\n padding: 2px;\n border: 0;\n border-radius: 999px;\n background: var(--settings-surface-strong);\n cursor: pointer;\n transition: background 120ms ease;\n}\n\n.settings-preference-switch[aria-checked="true"] {\n justify-content: flex-end;\n background: var(--settings-focus);\n}\n\n.settings-preference-switch:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-preference-switch__thumb {\n width: 20px;\n height: 20px;\n border-radius: 50%;\n background: var(--settings-primary-text);\n box-shadow: 0 1px 3px rgb(0 0 0 / 24%);\n}\n\n.settings-preference-checkbox {\n width: 18px;\n height: 18px;\n flex: none;\n margin: 0;\n accent-color: var(--settings-focus);\n cursor: pointer;\n}\n\n.settings-preference-checkbox:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-connection-page-header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 18px;\n margin-bottom: 18px;\n}\n\n.settings-connection-page-header .settings-section-label {\n padding-bottom: 0;\n}\n\n.settings-connection-page-header .settings-page-description {\n margin: 8px 0 0;\n}\n\n.settings-connection-page-header .settings-page-description + .settings-page-description {\n margin-top: 8px;\n}\n\n.settings-update-header {\n margin-bottom: 8px;\n}\n\n.settings-connections-content,\n.settings-plugins-content,\n.settings-connection-list,\n.settings-connection-rows {\n min-width: 0;\n}\n\n.settings-connections-content,\n.settings-plugins-content {\n display: grid;\n gap: 12px;\n}\n\n.settings-connection-list {\n overflow: hidden;\n background: var(--settings-surface);\n border: 1px solid var(--settings-border);\n border-radius: 10px;\n}\n\n.settings-segmented {\n display: inline-flex;\n flex-wrap: wrap;\n align-items: center;\n width: fit-content;\n max-width: 100%;\n padding: 2px;\n gap: 3px;\n background: var(--settings-surface-strong);\n border-radius: 10px;\n}\n\n.settings-segmented__item {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-height: 28px;\n padding: 4px 14px;\n color: var(--settings-muted);\n font: inherit;\n font-size: 12px;\n font-weight: 600;\n line-height: 18px;\n white-space: nowrap;\n background: transparent;\n border: 0;\n border-radius: 8px;\n cursor: pointer;\n transition:\n color 0.15s ease,\n background-color 0.15s ease,\n box-shadow 0.15s ease;\n}\n\n.settings-segmented__item:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-segmented__item--selected,\n.settings-segmented__item[aria-selected="true"],\n.settings-segmented__item[aria-pressed="true"] {\n color: var(--settings-text);\n background: var(--settings-elevated);\n box-shadow: var(--settings-segmented-shadow);\n}\n\n.settings-segmented__item:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.settings-segmented__item:disabled:hover {\n color: var(--settings-muted);\n background: transparent;\n}\n\n.settings-segmented__item:focus-visible,\n.settings-connection-row:focus-visible,\n.settings-connection-install-link:focus-visible,\n.settings-connection-view-error:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 1px;\n}\n\n.settings-connection-host-tabs {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 6px;\n overflow-x: auto;\n overflow-y: hidden;\n overscroll-behavior-x: contain;\n scrollbar-width: none;\n scroll-behavior: smooth;\n scroll-snap-type: x proximity;\n touch-action: pan-x;\n}\n\n.settings-connection-host-tabs::-webkit-scrollbar {\n display: none;\n}\n\n.settings-connection-host-tab {\n display: inline-flex;\n align-items: center;\n height: 30px;\n min-width: max-content;\n flex: none;\n padding: 0 9px;\n color: var(--settings-muted);\n font: inherit;\n font-size: 12px;\n line-height: 18px;\n white-space: nowrap;\n background: var(--settings-inset);\n border: 1px solid var(--settings-border);\n border-radius: 7px;\n cursor: pointer;\n scroll-snap-align: start;\n}\n\n.settings-connection-host-tab:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-connection-host-tab[aria-selected="true"] {\n color: var(--settings-text);\n font-weight: 600;\n background: var(--settings-active);\n border-color: var(--settings-border);\n}\n\n.settings-connection-table-header,\n.settings-connection-row {\n display: grid;\n /* Component : Status : Actions = 4 : 3 : 3 */\n grid-template-columns: minmax(0, 4fr) minmax(0, 3fr) minmax(0, 3fr);\n align-items: center;\n min-width: 0;\n column-gap: 16px;\n}\n\n.settings-connection-table-header {\n min-height: 30px;\n padding: 0 10px;\n color: var(--settings-muted);\n font-size: 10px;\n font-weight: 600;\n line-height: 16px;\n text-transform: uppercase;\n letter-spacing: 0.06em;\n background: var(--settings-surface);\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-connection-rows > .settings-connection-row,\n.settings-connection-rows > .settings-connection-block {\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-connection-rows > .settings-connection-row:last-child,\n.settings-connection-rows > .settings-connection-block:last-child {\n border-bottom: 0;\n}\n\n.settings-connection-row {\n min-height: 52px;\n padding: 8px 10px;\n cursor: pointer;\n}\n\n.settings-connection-row:hover {\n background: var(--settings-hover);\n}\n\n.settings-connection-row[data-connection-selected="true"] {\n background: var(--settings-surface);\n}\n\n.settings-connection-row__identity,\n.settings-connection-inspector__identity {\n display: inline-flex;\n align-items: center;\n min-width: 0;\n gap: 8px;\n color: var(--settings-text);\n}\n\n.settings-connection-row__identity strong,\n.settings-connection-inspector__identity strong {\n min-width: 0;\n overflow-wrap: anywhere;\n font-size: 12px;\n font-weight: 500;\n line-height: 18px;\n}\n\n.settings-connection-row__mark {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n flex: none;\n color: var(--settings-mark);\n font-size: 10px;\n font-weight: 700;\n background: var(--settings-surface-strong);\n border-radius: 7px;\n}\n\n.settings-connection-row__mark--logo {\n color: var(--settings-text);\n background: transparent;\n}\n\n.settings-connection-row__mark--logo > img,\n.settings-connection-row__mark--logo > svg {\n display: block;\n max-width: 18px;\n max-height: 18px;\n}\n\n.settings-connection-table-header > :last-child {\n text-align: end;\n}\n\n.settings-connection-row__status {\n display: inline-flex;\n align-items: center;\n width: fit-content;\n max-width: 100%;\n gap: 6px;\n color: var(--settings-muted);\n font-size: 11px;\n font-weight: 500;\n line-height: 18px;\n}\n\n.settings-connection-row__status::before {\n width: 6px;\n height: 6px;\n flex: none;\n content: "";\n background: currentColor;\n border-radius: 50%;\n}\n\n.settings-connection-row__status[data-connection-tone="ready"] {\n color: var(--settings-success);\n}\n\n.settings-connection-row__status[data-connection-tone="checking"] {\n color: var(--settings-warning);\n}\n\n.settings-connection-row__status[data-connection-tone="setup"] {\n color: var(--settings-muted);\n}\n\n.settings-connection-row__status[data-connection-tone="setup"]::before {\n background: transparent;\n border: 1.5px solid currentColor;\n}\n\n.settings-connection-row__status[data-connection-tone="failed"] {\n color: var(--settings-danger);\n}\n\n.settings-connection-row__action {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n min-width: 0;\n gap: 4px;\n}\n\n.settings-connection-row__handle {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n width: 16px;\n color: var(--settings-muted);\n cursor: grab;\n opacity: 0.6;\n}\n\n.settings-connection-row__handle:hover {\n opacity: 1;\n}\n\n.settings-connection-row[draggable="true"] {\n cursor: grab;\n}\n\n.settings-connection-row[data-connection-dragging="true"] {\n opacity: 0.4;\n}\n\n.settings-connection-row[data-connection-drop-indicator="before"] {\n box-shadow: inset 0 2px 0 0 var(--settings-focus);\n}\n\n.settings-connection-row[data-connection-drop-indicator="after"] {\n box-shadow: inset 0 -2px 0 0 var(--settings-focus);\n}\n\n.settings-connection-inline-detail {\n display: grid;\n gap: 12px;\n margin-top: 2px;\n padding: 14px 12px 16px;\n border-top: 1px solid var(--settings-divider);\n background: var(--settings-inset);\n}\n\n.settings-connection-group-divider {\n padding: 10px 12px 6px;\n color: var(--settings-muted);\n font-size: 10px;\n font-weight: 600;\n line-height: 16px;\n text-transform: uppercase;\n letter-spacing: 0.06em;\n /* No border-top here: the row immediately above already carries its own\n border-bottom (it is no longer :last-child once this divider follows\n it), so adding one here would double the separator line. */\n}\n\n.settings-connection-group-divider[data-connection-drag-over="true"] {\n color: var(--settings-focus);\n background: rgb(51 156 255 / 8%);\n border-radius: 6px;\n}\n\n.settings-connection-group-more[data-connection-drag-over="true"] {\n background: rgb(51 156 255 / 8%);\n}\n\n.settings-connection-group-hint {\n display: grid;\n gap: 3px;\n margin: 0 12px 12px;\n padding: 14px 16px;\n text-align: center;\n border: 1.5px dashed var(--settings-border);\n border-radius: 10px;\n}\n\n.settings-connection-group-more[data-connection-drag-over="true"] .settings-connection-group-hint {\n border-color: var(--settings-focus);\n}\n\n.settings-connection-group-hint strong {\n color: var(--settings-text);\n font-size: 12.5px;\n font-weight: 500;\n line-height: 18px;\n}\n\n.settings-connection-group-hint span {\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 17px;\n}\n\n.settings-connection-group-reset {\n display: flex;\n width: 100%;\n align-items: center;\n gap: 6px;\n padding: 10px 12px;\n color: var(--settings-muted);\n font: inherit;\n font-size: 12px;\n text-align: left;\n background: transparent;\n border: 0;\n border-top: 1px solid var(--settings-divider);\n cursor: pointer;\n}\n\n.settings-connection-group-reset:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-connection-install-link {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 26px;\n height: 26px;\n padding: 0;\n color: var(--settings-focus);\n font: inherit;\n text-decoration: none;\n background: transparent;\n border: 1px solid transparent;\n border-radius: 7px;\n cursor: pointer;\n}\n\n.settings-connection-install-link:hover,\n.settings-connection-install-link:focus-visible {\n color: var(--settings-focus);\n background: var(--settings-active);\n border-color: var(--settings-border);\n}\n\n.settings-connection-view-error {\n padding: 4px 7px;\n color: var(--settings-danger);\n font: inherit;\n font-size: 11px;\n line-height: 18px;\n background: transparent;\n border: 0;\n border-radius: 6px;\n cursor: pointer;\n}\n\n.settings-connection-view-error:hover {\n color: var(--settings-danger);\n background: var(--settings-danger-bg);\n}\n\n.settings-connection-inspector {\n position: sticky;\n top: 18px;\n}\n\n.settings-connection-inspector__header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n min-width: 0;\n gap: 10px;\n padding: 12px;\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-connection-inspector__body {\n display: grid;\n min-width: 0;\n gap: 12px;\n padding: 12px;\n}\n\n.settings-connection-install-callout {\n display: grid;\n grid-template-columns: 28px minmax(0, 1fr);\n gap: 9px;\n padding: 11px;\n background: var(--settings-surface);\n border: 0;\n border-radius: 8px;\n}\n\n.settings-connection-install-callout__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 28px;\n height: 28px;\n color: var(--settings-focus);\n background: var(--settings-active);\n border-radius: 7px;\n}\n\n.settings-connection-install-callout strong,\n.settings-connection-error-summary strong,\n.settings-connection-state-summary strong {\n display: block;\n margin: 0 0 4px;\n color: var(--settings-text);\n font-size: 12px;\n font-weight: 500;\n line-height: 18px;\n}\n\n.settings-connection-install-callout p,\n.settings-connection-error-summary p,\n.settings-connection-state-summary p,\n.settings-connection-issue-note {\n margin: 0;\n color: var(--settings-muted);\n font-size: 11px;\n line-height: 16px;\n}\n\n.settings-connection-install-command {\n display: grid;\n gap: 4px;\n margin-top: 8px;\n}\n\n.settings-connection-install-command span {\n color: var(--settings-muted);\n font-size: 10px;\n font-weight: 600;\n line-height: 14px;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n}\n\n.settings-connection-install-command code {\n display: block;\n min-width: 0;\n overflow-wrap: anywhere;\n color: var(--settings-text);\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n font-size: 11px;\n line-height: 16px;\n white-space: pre-wrap;\n}\n\n.settings-connection-install-actions {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 8px;\n}\n\n.settings-connection-copy-prompt {\n position: relative;\n}\n\n.settings-connection-copy-prompt__tooltip {\n position: absolute;\n z-index: 4;\n bottom: calc(100% + 6px);\n left: 0;\n width: max-content;\n max-width: min(360px, 72vw);\n max-height: 180px;\n overflow: auto;\n padding: 8px 10px;\n color: var(--settings-text);\n font-size: 11px;\n line-height: 16px;\n white-space: pre-wrap;\n text-align: left;\n background: var(--settings-elevated);\n border: 1px solid var(--settings-border);\n border-radius: 8px;\n box-shadow: 0 10px 24px rgb(0 0 0 / 22%);\n opacity: 0;\n visibility: hidden;\n pointer-events: none;\n transition: opacity 120ms ease;\n}\n\n.settings-connection-copy-prompt:hover .settings-connection-copy-prompt__tooltip,\n.settings-connection-copy-prompt:focus-within .settings-connection-copy-prompt__tooltip {\n opacity: 1;\n visibility: visible;\n}\n\n.settings-connection-error-summary {\n padding: 13px 14px;\n color: var(--settings-danger);\n background: var(--settings-danger-bg);\n border: 1px solid var(--settings-danger-border);\n border-radius: 10px;\n}\n\n.settings-connection-error-metadata {\n display: grid;\n gap: 7px;\n padding: 12px;\n background: var(--settings-inset);\n border: 1px solid var(--settings-border);\n border-radius: 9px;\n}\n\n.settings-connection-detail-line {\n display: grid;\n grid-template-columns: 92px minmax(0, 1fr);\n gap: 10px;\n min-width: 0;\n color: var(--settings-muted);\n font-size: 10px;\n line-height: 16px;\n}\n\n.settings-connection-detail-line code {\n min-width: 0;\n overflow-wrap: anywhere;\n color: var(--settings-text);\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n white-space: pre-wrap;\n}\n\n.settings-connection-error-log-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 10px;\n}\n\n.settings-connection-error-log-header strong {\n color: var(--settings-text);\n font-size: 11px;\n font-weight: 600;\n}\n\n.settings-connection-error-log-header .settings-command-button {\n min-height: 30px;\n padding: 5px 9px;\n font-size: 11px;\n}\n\n.settings-connection-stderr {\n max-height: 220px;\n min-width: 0;\n margin: 0;\n padding: 11px;\n overflow: auto;\n color: var(--settings-text);\n font:\n 10px/16px ui-monospace,\n "SFMono-Regular",\n Consolas,\n "Liberation Mono",\n monospace;\n white-space: pre-wrap;\n overflow-wrap: anywhere;\n background: var(--settings-inset);\n border: 1px solid var(--settings-border);\n border-radius: 9px;\n}\n\n.settings-connection-error-actions {\n display: grid;\n grid-template-columns: minmax(0, 1fr);\n gap: 8px;\n}\n\n.settings-connection-error-actions .settings-command-button {\n width: 100%;\n}\n\n.settings-connection-issue-note {\n margin-top: -4px;\n}\n\n.settings-connection-state-summary {\n padding: 14px;\n background: var(--settings-surface);\n border: 1px solid var(--settings-border);\n border-radius: 10px;\n}\n\n.settings-empty {\n display: flex;\n align-items: center;\n min-height: 72px;\n padding: 12px 16px;\n}\n\n.settings-empty > div {\n display: grid;\n min-width: 0;\n gap: 2px;\n}\n\n.settings-empty strong {\n color: var(--settings-text);\n font-size: 13px;\n font-weight: 500;\n line-height: 19px;\n}\n\n.settings-empty span {\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 19px;\n}\n\n.settings-about-page {\n display: flex;\n flex-direction: column;\n gap: 18px;\n box-sizing: border-box;\n min-height: min(620px, calc(100vh - 200px));\n max-width: 720px;\n}\n\n.settings-about-page > .settings-section-label {\n padding-bottom: 10px;\n}\n\n.settings-about-panel {\n display: grid;\n gap: 18px;\n padding: 24px;\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 12px;\n}\n\n.settings-about-product {\n color: var(--settings-text);\n font-size: 24px;\n font-weight: 700;\n line-height: 32px;\n}\n\n.settings-about-tagline {\n color: var(--settings-text);\n font-size: 16px;\n font-weight: 600;\n line-height: 24px;\n}\n\n.settings-about-copy {\n display: grid;\n max-width: 660px;\n gap: 12px;\n}\n\n.settings-about-lead,\n.settings-about-extension,\n.settings-about-closing p,\n.settings-about-copy p {\n margin: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 21px;\n}\n\n.settings-about-lead {\n color: var(--settings-text);\n font-weight: 500;\n}\n\n.settings-about-agents {\n display: grid;\n gap: 10px;\n margin: 2px 0;\n padding: 0;\n list-style: none;\n}\n\n.settings-about-agent {\n display: grid;\n gap: 4px;\n padding-left: 2px;\n}\n\n.settings-about-agent-name {\n color: var(--settings-text);\n font-size: 13px;\n font-weight: 600;\n line-height: 18px;\n}\n\n.settings-about-agent-name::before {\n content: "\xB7 ";\n color: var(--settings-muted);\n font-weight: 600;\n}\n\n.settings-about-agent-description {\n display: block;\n padding-left: 0.85em;\n color: var(--settings-muted);\n font-size: 12px;\n font-weight: 400;\n line-height: 18px;\n}\n\n.settings-about-closing {\n display: grid;\n gap: 8px;\n}\n\n.settings-about-repository {\n gap: 10px;\n}\n\n.settings-about-open-source {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 0.35em;\n margin: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 21px;\n}\n\n.settings-about-repository p {\n margin: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 21px;\n}\n\n.settings-about-star-callout {\n margin: 4px 0 0;\n color: var(--settings-warning);\n font-size: 14px;\n font-weight: 600;\n line-height: 22px;\n}\n\n.settings-about-repository-link {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n color: #7cb8ff;\n font-weight: 600;\n line-height: 1;\n text-decoration: none;\n}\n\n.settings-about-repository-link .codexhost-settings-icon {\n display: block;\n flex: none;\n}\n\n.settings-about-repository-link:hover {\n text-decoration: underline;\n}\n\n.settings-about-brand {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 12px;\n margin-top: auto;\n padding-top: 12px;\n color: inherit;\n opacity: 0.9;\n text-decoration: none;\n transition: opacity 160ms ease;\n}\n\n.settings-about-brand:hover {\n opacity: 1;\n}\n\n.settings-about-brand-video {\n width: 40px;\n height: 40px;\n flex: none;\n overflow: hidden;\n object-fit: cover;\n border-radius: 999px;\n box-shadow: 0 1px 2px rgb(0 0 0 / 18%);\n}\n\n.settings-about-brand-copy {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 2px;\n}\n\n.settings-about-brand-name {\n color: var(--settings-text);\n font-size: 14px;\n font-weight: 800;\n letter-spacing: 0.18em;\n line-height: 18px;\n}\n\n.settings-about-brand-tagline {\n color: var(--settings-muted);\n font-size: 12px;\n font-weight: 500;\n letter-spacing: 0.18em;\n line-height: 16px;\n}\n\n.settings-page-error {\n padding: 16px;\n color: var(--settings-text);\n font-size: 13px;\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 20px;\n}\n\n.settings-update-metadata {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 1fr));\n gap: 24px;\n margin-bottom: 24px;\n padding: 0 0 20px;\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-update-metadata__item {\n display: grid;\n min-width: 0;\n gap: 4px;\n}\n\n.settings-update-metadata__item span {\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n.settings-update-metadata__item strong {\n min-width: 0;\n overflow-wrap: anywhere;\n color: var(--settings-text);\n font-size: 15px;\n font-weight: 500;\n line-height: 22px;\n}\n\n/* The only emphasis on this screen: a latest version newer than the installed one. */\n.settings-update-metadata__value--newer {\n color: var(--settings-focus);\n}\n\n.settings-update-panel {\n display: grid;\n gap: 12px;\n padding: 20px;\n color: var(--settings-text);\n background: var(--settings-panel);\n border: 1px solid var(--settings-border);\n border-radius: 8px;\n}\n\n/* Soft status copy and the Update action should not sit in a framed card. */\n.settings-update-panel[data-update-state="unavailable"],\n.settings-update-panel[data-update-state="failed"],\n.settings-update-panel[data-update-state="error"],\n.settings-update-panel[data-update-state="available"] {\n padding: 4px 0 0;\n border: 0;\n border-radius: 0;\n}\n\n.settings-update-panel__status-row {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 8px;\n min-width: 0;\n}\n\n.settings-update-panel__status-row .settings-update-actions {\n flex: none;\n}\n\n.settings-update-panel__status-row .settings-update-panel__head {\n flex: 1 1 auto;\n min-width: 0;\n}\n\n.settings-update-panel__head {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 8px;\n}\n\n.settings-update-panel__head .codexhost-settings-icon {\n color: var(--settings-muted);\n}\n\n.settings-update-panel[data-update-state="available"]\n .settings-update-panel__head\n .codexhost-settings-icon,\n.settings-update-panel[data-update-state="downloading"]\n .settings-update-panel__head\n .codexhost-settings-icon,\n.settings-update-panel[data-update-state="installing"]\n .settings-update-panel__head\n .codexhost-settings-icon,\n.settings-update-panel[data-update-state="restarting"]\n .settings-update-panel__head\n .codexhost-settings-icon {\n color: var(--settings-focus);\n}\n\n.settings-update-panel[data-update-state="current"]\n .settings-update-panel__head\n .codexhost-settings-icon {\n color: var(--settings-success);\n}\n\n.settings-update-panel[data-update-state="failed"]\n .settings-update-panel__head\n .codexhost-settings-icon,\n.settings-update-panel[data-update-state="error"]\n .settings-update-panel__head\n .codexhost-settings-icon {\n color: var(--settings-danger);\n}\n\n.settings-update-panel[data-update-state="unavailable"]\n .settings-update-panel__head\n .codexhost-settings-icon {\n color: var(--settings-muted);\n}\n\n.settings-update-panel__title {\n min-width: 0;\n overflow-wrap: anywhere;\n color: var(--settings-text);\n font-size: 14px;\n font-weight: 600;\n line-height: 22px;\n}\n\n.settings-update-summary,\n.settings-update-error {\n margin: 0;\n overflow-wrap: anywhere;\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-update-summary {\n color: var(--settings-muted);\n}\n\n.settings-update-error {\n color: var(--settings-danger);\n}\n\n.settings-update-progress {\n width: 100%;\n height: 8px;\n accent-color: var(--settings-focus);\n}\n\n.settings-update-progress-detail {\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n/* Release notes scroll with the page; a scroller inside a scroller traps the wheel. */\n.settings-update-notes-section {\n min-width: 0;\n margin-top: 24px;\n padding-top: 24px;\n border-top: 1px solid var(--settings-divider);\n}\n\n.settings-update-notes-section:empty {\n display: none;\n}\n\n.settings-update-notes {\n display: grid;\n min-width: 0;\n gap: 12px;\n color: var(--settings-muted);\n font-size: 14px;\n line-height: 22px;\n overflow-wrap: anywhere;\n}\n\n.settings-update-notes > :first-child {\n margin-top: 0;\n}\n\n.settings-update-notes > :last-child {\n margin-bottom: 0;\n}\n\n.settings-update-notes h1,\n.settings-update-notes h2,\n.settings-update-notes h3,\n.settings-update-notes h4,\n.settings-update-notes h5,\n.settings-update-notes h6 {\n margin: 6px 0 0;\n color: var(--settings-text);\n font-weight: 600;\n}\n\n.settings-update-notes h1 {\n font-size: 18px;\n line-height: 26px;\n}\n\n.settings-update-notes h2 {\n font-size: 17px;\n line-height: 24px;\n}\n\n.settings-update-notes h3,\n.settings-update-notes h4,\n.settings-update-notes h5,\n.settings-update-notes h6 {\n font-size: 14px;\n line-height: 22px;\n}\n\n.settings-update-notes p,\n.settings-update-notes ul,\n.settings-update-notes ol,\n.settings-update-notes pre,\n.settings-update-notes blockquote {\n margin: 0;\n}\n\n.settings-update-notes ul,\n.settings-update-notes ol {\n padding-left: 24px;\n}\n\n.settings-update-notes li {\n padding-left: 4px;\n}\n\n.settings-update-notes li::marker {\n color: var(--settings-muted);\n font-size: 0.85em;\n}\n\n.settings-update-notes li + li {\n margin-top: 14px;\n}\n\n.settings-update-notes .release-note-translation {\n display: block;\n margin-top: 3px;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-update-notes blockquote {\n padding: 8px 12px;\n color: var(--settings-muted);\n border-left: 3px solid var(--settings-focus);\n background: var(--settings-surface);\n}\n\n.settings-update-notes hr {\n width: 100%;\n margin: 2px 0;\n border: 0;\n border-top: 1px solid var(--settings-divider);\n}\n\n.settings-update-notes strong {\n color: var(--settings-text);\n font-weight: 600;\n}\n\n.settings-update-notes a {\n color: var(--settings-focus);\n text-decoration: none;\n}\n\n.settings-update-notes a:hover {\n text-decoration: underline;\n}\n\n.settings-update-notes code {\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n font-size: 12px;\n}\n\n.settings-update-notes :not(pre) > code {\n padding: 1px 5px;\n background: var(--settings-surface-strong);\n border-radius: 4px;\n}\n\n.settings-update-notes pre {\n min-width: 0;\n max-width: 100%;\n padding: 10px 12px;\n overflow-x: auto;\n overflow-y: hidden;\n background: var(--settings-inset);\n border-radius: 6px;\n}\n\n.settings-update-notes pre code {\n line-height: 18px;\n white-space: pre-wrap;\n}\n\n/* Manual update sits directly under the status panel, not behind a disclosure:\n automatic updates can fail for machine-local reasons and this is the way out. */\n.settings-update-controls {\n display: grid;\n min-width: 0;\n gap: 10px;\n margin-top: 24px;\n}\n\n.settings-update-manual-title {\n color: var(--settings-text);\n font-size: 15px;\n font-weight: 600;\n line-height: 22px;\n}\n\n.settings-update-manual {\n display: grid;\n min-width: 0;\n gap: 8px;\n}\n\n.settings-update-manual[hidden] {\n display: none;\n}\n\n.settings-update-manual-description {\n margin: 0;\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n.settings-update-manual-description.is-fallback {\n color: var(--settings-danger);\n}\n\n.settings-update-command {\n display: flex;\n align-items: stretch;\n min-width: 0;\n overflow: hidden;\n border: 1px solid var(--settings-border);\n border-radius: 6px;\n}\n\n.settings-update-command code {\n min-width: 0;\n flex: 1;\n padding: 9px 12px;\n overflow-x: auto;\n color: var(--settings-text);\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n font-size: 12px;\n line-height: 20px;\n white-space: nowrap;\n}\n\n.settings-update-command__copy {\n display: inline-flex;\n align-items: center;\n flex: none;\n gap: 6px;\n padding: 0 12px;\n color: var(--settings-muted);\n font-size: 12px;\n background: transparent;\n border: 0;\n border-left: 1px solid var(--settings-border);\n cursor: pointer;\n}\n\n.settings-update-command__copy:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-update-command__copy:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: -2px;\n}\n\n.settings-update-actions {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.settings-command-button,\n.settings-update-link {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex: none;\n width: max-content;\n max-width: 100%;\n min-height: 30px;\n gap: 6px;\n padding: 5px 10px;\n white-space: nowrap;\n color: var(--settings-primary-text);\n font: inherit;\n font-size: 12px;\n text-decoration: none;\n background: var(--settings-primary);\n border: 1px solid var(--settings-primary);\n border-radius: 7px;\n cursor: pointer;\n}\n\n.settings-command-button--secondary,\n.settings-update-link {\n color: var(--settings-muted);\n background: transparent;\n border-color: var(--settings-border);\n}\n\n.settings-command-button--secondary .codexhost-settings-icon,\n.settings-update-link .codexhost-settings-icon {\n color: var(--settings-muted);\n}\n\n.settings-command-button:hover:not(.settings-command-button--secondary) {\n filter: brightness(1.08);\n}\n\n.settings-command-button--danger {\n color: var(--settings-danger);\n}\n\n.settings-command-button--danger:hover:not(:disabled) {\n color: #fecaca;\n background: var(--settings-danger-bg);\n border-color: var(--settings-danger-border);\n}\n\n.settings-command-button--secondary:hover,\n.settings-update-link:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n\n.settings-command-button--secondary:hover .codexhost-settings-icon,\n.settings-update-link:hover .codexhost-settings-icon {\n color: var(--settings-text);\n}\n\n.settings-command-button:disabled,\n.settings-command-button[aria-disabled="true"] {\n opacity: 0.55;\n cursor: not-allowed;\n filter: none;\n}\n\n.settings-command-button:focus-visible,\n.settings-update-link:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: 2px;\n}\n\n.settings-visually-hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n}\n\n.settings-session-import-content {\n display: grid;\n min-width: 0;\n gap: 12px;\n margin-top: 16px;\n}\n\n.settings-session-import-list {\n display: grid;\n min-width: 0;\n overflow: hidden;\n background: var(--settings-surface);\n border: 1px solid var(--settings-border);\n border-radius: 12px;\n}\n\n.settings-session-import-row {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n align-items: center;\n min-width: 0;\n gap: 16px;\n padding: 14px 16px;\n border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-session-import-row:last-child {\n border-bottom: 0;\n}\n\n.settings-session-import-row__copy {\n display: grid;\n min-width: 0;\n gap: 4px;\n}\n\n.settings-session-import-row__copy strong {\n color: var(--settings-text);\n font-size: 14px;\n font-weight: 600;\n line-height: 20px;\n}\n\n.settings-session-import-row__copy span,\n.settings-session-import-row__cwd {\n min-width: 0;\n overflow-wrap: anywhere;\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 18px;\n}\n\n.settings-session-import-row__cwd {\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n}\n\n.settings-session-import-row__action {\n display: flex;\n align-items: center;\n flex: none;\n gap: 8px;\n}\n\n.settings-session-import-running {\n color: #f5c542;\n font-size: 12px;\n font-weight: 500;\n line-height: 18px;\n white-space: nowrap;\n}\n\n.settings-session-import-recovery {\n display: grid;\n min-width: 0;\n gap: 12px;\n padding: 16px;\n background: var(--settings-surface);\n border: 1px solid var(--settings-border);\n border-radius: 12px;\n}\n\n.settings-session-import-recovery__copy {\n display: grid;\n gap: 6px;\n}\n\n.settings-session-import-recovery__copy strong {\n color: var(--settings-text);\n font-size: 15px;\n font-weight: 600;\n line-height: 22px;\n}\n\n.settings-session-import-recovery__copy p {\n margin: 0;\n color: var(--settings-muted);\n font-size: 13px;\n line-height: 20px;\n}\n\n.settings-session-import-recovery__path {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 8px;\n}\n\n.settings-session-import-recovery__path code {\n min-width: 0;\n flex: 1;\n overflow-wrap: anywhere;\n color: var(--settings-text);\n font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n font-size: 12px;\n line-height: 18px;\n}\n\n.codexhost-settings-icon {\n display: block;\n flex: none;\n stroke: currentColor;\n}\n\n@media (max-width: 720px) {\n .codexhost-settings-dialog {\n width: calc(100vw - 16px);\n height: calc(100vh - 16px);\n border-radius: 10px;\n }\n\n .settings-layout {\n grid-template-columns: minmax(0, 1fr);\n grid-template-rows: auto minmax(0, 1fr);\n }\n\n .settings-sidebar {\n border-right: 0;\n border-bottom: 1px solid var(--settings-border);\n }\n\n .settings-header {\n height: 56px;\n padding-inline: 14px;\n }\n\n .settings-sidebar {\n padding-top: 20px;\n }\n\n .settings-nav {\n flex: none;\n flex-direction: row;\n gap: 4px;\n padding: 7px 8px 8px;\n overflow-x: auto;\n overflow-y: hidden;\n }\n\n .settings-nav-section-label {\n display: none;\n }\n\n .settings-nav-button {\n width: auto;\n min-width: max-content;\n min-height: 34px;\n grid-template-columns: 16px auto;\n border-radius: 10px;\n }\n\n .settings-page__content {\n width: calc(100% - 40px);\n }\n\n .settings-page__content {\n padding-top: 32px;\n padding-bottom: 32px;\n }\n\n .settings-section-label {\n padding-bottom: 20px;\n font-size: 20px;\n line-height: 26px;\n }\n\n .settings-update-metadata {\n grid-template-columns: minmax(0, 1fr);\n gap: 16px;\n }\n\n .settings-status-row {\n grid-template-columns: minmax(0, 1fr) auto;\n gap: 16px;\n }\n\n .settings-account-header,\n .settings-connection-page-header {\n flex-direction: column;\n }\n\n .settings-account-header > .settings-command-button,\n .settings-connection-page-header > .settings-command-button {\n width: 100%;\n }\n\n .settings-session-import-row {\n grid-template-columns: minmax(0, 1fr);\n }\n\n .settings-session-import-row__action {\n justify-content: flex-start;\n flex-wrap: wrap;\n }\n\n .settings-status-row__detail {\n grid-column: 1 / -1;\n margin: -8px 0 0 58px;\n }\n}\n\n@media (forced-colors: active) {\n :host,\n :host([data-theme="light"]),\n :host([data-theme="dark"]) {\n --settings-bg: Canvas;\n --settings-sidebar: Canvas;\n --settings-panel: Canvas;\n --settings-surface: Canvas;\n --settings-surface-hover: Highlight;\n --settings-inset: Canvas;\n --settings-text: CanvasText;\n --settings-muted: GrayText;\n --settings-subtle: GrayText;\n --settings-border: ButtonBorder;\n --settings-divider: ButtonBorder;\n --settings-hover: Highlight;\n --settings-active: Highlight;\n --settings-focus: Highlight;\n --settings-elevated: Canvas;\n --settings-surface-strong: Canvas;\n --settings-mark: CanvasText;\n --settings-primary: ButtonFace;\n --settings-primary-hover: Highlight;\n --settings-primary-text: ButtonText;\n --settings-warning: CanvasText;\n --settings-warning-bg: Canvas;\n --settings-warning-border: ButtonBorder;\n --settings-danger: CanvasText;\n --settings-danger-bg: Canvas;\n --settings-danger-border: ButtonBorder;\n --settings-success: CanvasText;\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n *,\n *::before,\n *::after {\n scroll-behavior: auto !important;\n transition-duration: 0s !important;\n }\n}\n';
26985
27347
 
26986
27348
  // src/settings/accounts.css
26987
- var accounts_default = '.settings-harness-accounts {\n margin-top: 32px;\n}\n\n.settings-harness-accounts__title {\n margin: 0 0 16px;\n font-size: 14px;\n font-weight: 500;\n}\n\n.settings-harness-account__identity {\n min-width: 0;\n}\n\n.settings-harness-account__identity > .settings-account-email {\n display: block;\n max-width: 24ch;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.settings-harness-account__logo {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 40px;\n height: 40px;\n flex: none;\n}\n\n.settings-harness-account {\n display: grid;\n grid-template-columns: minmax(180px, 1fr) minmax(0, 2fr);\n align-items: center;\n gap: 24px;\n padding: 24px;\n}\n\n.settings-harness-account + .settings-harness-account {\n border-top: 1px solid var(--settings-border);\n}\n\n.settings-harness-account > div {\n min-width: 0;\n overflow-wrap: anywhere;\n}\n\n@media (max-width: 700px) {\n .settings-harness-account {\n grid-template-columns: minmax(0, 1fr);\n padding: 16px;\n }\n}\n\n.settings-account-header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 20px;\n}\n\n.settings-account-header > :first-child {\n min-width: 0;\n flex: 1 1 auto;\n}\n\n.settings-account-header > .settings-command-button {\n flex: none;\n white-space: nowrap;\n}\n\n.settings-account-header .settings-section-label {\n margin: 0;\n padding: 0;\n font-size: 27px;\n line-height: 1.4;\n font-weight: 650;\n letter-spacing: -0.035em;\n}\n.settings-account-header .settings-page-description {\n margin: 8px 0 0;\n font-size: 13px;\n}\n\n.settings-account-status {\n margin: 0;\n color: var(--settings-muted);\n font-size: 12px;\n}\n.settings-account-status:empty {\n display: none;\n}\n\n.settings-account-help-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n margin-top: 20px;\n flex-wrap: wrap;\n}\n.settings-account-task-hint {\n display: flex;\n align-items: flex-start;\n gap: 9px;\n margin: 0;\n color: var(--settings-muted);\n font-size: 12px;\n flex: 1 1 280px;\n}\n.settings-account-task-hint svg {\n flex: none;\n margin-top: 1px;\n}\n.settings-account-help-button {\n display: inline-flex;\n align-items: center;\n gap: 7px;\n padding: 8px 12px;\n color: var(--settings-muted);\n font-size: 12px;\n background: transparent;\n border: 0;\n border-radius: 7px;\n cursor: pointer;\n}\n.settings-account-help-button:hover {\n color: var(--settings-text);\n background: var(--settings-hover);\n}\n.settings-account-device-code-note {\n margin: 12px 0 0;\n font-size: 12px;\n padding: 10px 12px;\n color: var(--settings-warning);\n background: var(--settings-warning-bg);\n border: 1px solid var(--settings-warning-border);\n border-radius: 8px;\n}\n\n.settings-account-toolbar {\n margin-top: 27px;\n padding: 18px 0;\n border-top: 1px solid var(--settings-border);\n display: flex;\n align-items: center;\n gap: 14px;\n flex-wrap: wrap;\n}\n.settings-account-count {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 13px;\n white-space: nowrap;\n}\n.settings-account-count > :last-child {\n color: var(--settings-muted);\n font-variant-numeric: tabular-nums;\n}\n.settings-account-search {\n display: flex;\n align-items: center;\n gap: 8px;\n color: var(--settings-muted);\n margin-right: auto;\n min-width: 0;\n max-width: 100%;\n}\n.settings-account-search svg {\n flex: none;\n}\n.settings-account-toolbar input {\n min-width: 80px;\n width: 150px;\n max-width: 100%;\n padding: 5px 0;\n color: var(--settings-text);\n background: transparent;\n border: 0;\n font-size: 13px;\n}\n.settings-account-toolbar input::placeholder {\n color: var(--settings-muted);\n}\n.settings-account-display-controls {\n display: flex;\n padding: 3px;\n border: 1px solid var(--settings-border);\n border-radius: 7px;\n background: var(--settings-inset);\n}\n.settings-account-display-controls button {\n padding: 4px 10px;\n color: var(--settings-muted);\n background: transparent;\n border: 0;\n border-radius: 4px;\n font-size: 12px;\n cursor: pointer;\n}\n.settings-account-display-controls button:hover {\n color: var(--settings-text);\n}\n.settings-account-display-controls button[aria-pressed="true"] {\n color: var(--settings-text);\n background: var(--settings-active);\n}\n\n.settings-account-list {\n --account-border: light-dark(#e2e2e8, #36363b);\n --account-muted: light-dark(#676773, #a5a5af);\n border: 1px solid var(--account-border);\n border-radius: 11px;\n overflow: hidden;\n container-type: inline-size;\n}\n.settings-account-table {\n width: 100%;\n table-layout: fixed;\n border-collapse: collapse;\n font-size: 12px;\n}\n.settings-account-table th {\n padding: 13px 20px;\n color: var(--account-muted);\n background: light-dark(#f8f8fa, #202024);\n font-size: 11px;\n font-weight: 500;\n text-align: left;\n}\n.settings-account-table th:nth-child(1) {\n width: 32%;\n}\n.settings-account-table th:nth-child(2) {\n width: 38%;\n}\n.settings-account-table th:nth-child(3) {\n width: 12%;\n}\n.settings-account-table th:nth-child(4) {\n width: 18%;\n text-align: right;\n}\n.settings-account-table td {\n padding: 19px 20px;\n vertical-align: middle;\n border-top: 1px solid var(--settings-divider);\n}\n.settings-account-row {\n background: light-dark(#ffffff, #232326);\n}\n.settings-account-row:hover {\n background: light-dark(#f7f7fa, #26262a);\n}\n.settings-account-row__person {\n display: grid;\n grid-template-columns: 34px minmax(0, 1fr);\n align-items: center;\n gap: 11px;\n min-width: 0;\n}\n.settings-account-row__mark {\n display: grid;\n place-items: center;\n width: 34px;\n height: 34px;\n color: light-dark(#67558d, #c3baff);\n background: light-dark(#f0ecf7, #353044);\n border: 1px solid light-dark(#d9d0e6, #4d435f);\n border-radius: 10px;\n}\n.settings-account-row__identity {\n min-width: 0;\n}\n.settings-account-title {\n display: flex;\n align-items: center;\n gap: 6px;\n flex-wrap: wrap;\n}\n.settings-account-email {\n min-width: 0;\n overflow: hidden;\n font-size: 13px;\n font-weight: 550;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.settings-account-metadata {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 7px;\n margin-top: 4px;\n color: var(--settings-muted);\n}\n.settings-account-domain {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.settings-account-plan-separator {\n flex: none;\n}\n.settings-account-plan {\n flex: none;\n padding: 1px 6px;\n color: var(--settings-muted);\n border: 1px solid var(--settings-border);\n border-radius: 5px;\n font-size: 11px;\n white-space: nowrap;\n}\n.settings-account-plan--highlighted {\n color: light-dark(#654f91, #c8bfff);\n background: light-dark(#f2edf9, #a99bff18);\n border-color: light-dark(#d9ccea, #a99bff52);\n font-weight: 600;\n}\n.settings-account-active {\n flex: none;\n padding: 2px 7px;\n color: light-dark(#66548e, #bdb4ff);\n background: light-dark(#f4f0fb, #aca0ff12);\n border: 1px solid light-dark(#dfd5f1, #aca0ff24);\n border-radius: 5px;\n font-size: 11px;\n white-space: nowrap;\n}\n\n.settings-account-usage {\n display: grid;\n gap: 14px;\n max-width: 380px;\n}\n.settings-account-usage__meter {\n display: grid;\n grid-template-columns: 48px minmax(36px, 1fr) 96px;\n align-items: center;\n gap: 3px 10px;\n}\n:host([lang="zh-CN"]) .settings-account-usage__meter {\n grid-template-columns: 48px minmax(36px, 1fr) 72px;\n}\n.settings-account-usage__meter--balance {\n display: flex;\n grid-template-columns: none;\n justify-content: flex-start;\n gap: 6px;\n}\n.settings-account-usage__balance {\n display: inline-flex;\n align-items: baseline;\n gap: 4px;\n font-size: 14px;\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n white-space: nowrap;\n}\n\n.settings-account-usage__title {\n color: light-dark(#5d5d68, #c3c3cd);\n font-size: 12px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.settings-account-usage__percent {\n display: flex;\n align-items: baseline;\n justify-content: flex-end;\n gap: 4px;\n font-size: 14px;\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n white-space: nowrap;\n}\n.settings-account-usage__value-label {\n color: var(--settings-muted);\n font-size: 11px;\n font-weight: 400;\n}\n.settings-account-usage__percent--warn {\n color: var(--settings-warning);\n}\n.settings-account-usage__percent--hot {\n color: var(--settings-danger);\n}\n.settings-account-usage__bar {\n height: 4px;\n overflow: hidden;\n background: light-dark(#e3e1e8, #3c3c43);\n border-radius: 4px;\n}\n.settings-account-usage__bar > span {\n display: block;\n height: 100%;\n background: light-dark(#81769e, #9993b8);\n border-radius: inherit;\n}\n.settings-account-usage__bar--warn > span {\n background: var(--settings-warning);\n}\n.settings-account-usage__bar--hot > span {\n background: var(--settings-danger);\n}\n.settings-account-usage__sub {\n grid-column: 2 / -1;\n color: var(--account-muted);\n font-size: 11px;\n font-variant-numeric: tabular-nums;\n overflow-wrap: anywhere;\n}\n.settings-account-usage__message,\n.settings-account-unknown {\n color: var(--settings-muted);\n}\n.settings-account-usage > button {\n justify-self: start;\n}\n.settings-account-actions {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n gap: 4px;\n flex-wrap: wrap;\n}\n.settings-account-action {\n padding: 8px 10px;\n min-height: 36px;\n font-size: 12px;\n color: var(--settings-text);\n background: transparent;\n border: 1px solid transparent;\n border-radius: 7px;\n white-space: nowrap;\n cursor: pointer;\n}\n.settings-account-action:hover {\n background: var(--settings-hover);\n}\n.settings-account-action:disabled {\n opacity: 0.45;\n cursor: not-allowed;\n}\n.settings-account-actions .settings-account-delete {\n color: var(--settings-muted);\n}\n.settings-account-actions .settings-account-delete:hover,\n.settings-account-actions .settings-account-delete:focus-visible {\n color: var(--settings-danger);\n background: var(--settings-danger-bg);\n}\n.settings-account-mobile-label {\n display: none;\n}\n.settings-account-reset-summary {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n min-height: 32px;\n padding: 3px 0;\n font-size: 12px;\n white-space: nowrap;\n color: var(--settings-text);\n background: transparent;\n border: 0;\n border-radius: 5px;\n cursor: pointer;\n}\n.settings-account-reset-summary:hover {\n background: var(--settings-hover);\n}\n.settings-account-reset-summary[aria-expanded="true"] > svg:last-child {\n transform: rotate(90deg);\n}\n.settings-account-details-row > td {\n background: var(--settings-inset);\n}\n.settings-account-reset-details {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 16px;\n flex-wrap: wrap;\n}\n.settings-account-reset-details strong {\n font-size: 12px;\n}\n.settings-account-reset-expiry {\n margin: 6px 0;\n color: var(--settings-muted);\n font-size: 11px;\n}\n.settings-account-reset-expiry.is-warn {\n color: var(--settings-warning);\n}\n.settings-account-reset-expiry.is-hot {\n color: var(--settings-danger);\n}\n.settings-account-reset-list {\n margin: 8px 0 0;\n padding: 0;\n list-style: none;\n color: var(--settings-muted);\n font-size: 11px;\n}\n.settings-account-reset-list li + li {\n margin-top: 4px;\n}\n.settings-account-empty {\n text-align: center;\n color: var(--settings-muted);\n}\n.settings-account-verification {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-wrap: wrap;\n color: var(--settings-muted);\n}\n.settings-account-verification a {\n color: var(--settings-focus);\n overflow-wrap: anywhere;\n}\n.settings-account-verification code {\n padding: 5px 8px;\n color: var(--settings-text);\n font-size: 15px;\n font-weight: 600;\n letter-spacing: 0.08em;\n background: var(--settings-inset);\n border-radius: 6px;\n}\n.settings-account-list :focus-visible,\n.settings-account-toolbar :focus-visible,\n.settings-account-help-button:focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: -2px;\n}\n\n@container (min-width: 611px) and (max-width: 800px) {\n .settings-account-table th,\n .settings-account-table td {\n padding-left: 12px;\n padding-right: 12px;\n }\n .settings-account-table th:nth-child(1) {\n width: 30%;\n }\n .settings-account-table th:nth-child(2) {\n width: 37%;\n }\n .settings-account-table th:nth-child(4) {\n width: 21%;\n }\n}\n\n@container (max-width: 610px) {\n .settings-account-table,\n .settings-account-table tbody {\n display: block;\n }\n .settings-account-table thead {\n display: none;\n }\n .settings-account-row {\n display: grid;\n grid-template-columns: 1fr 1fr;\n padding: 16px;\n gap: 12px;\n border-bottom: 1px solid var(--settings-divider);\n }\n .settings-account-table .settings-account-row > td {\n padding: 0;\n border: 0;\n }\n .settings-account-row > td:nth-child(1),\n .settings-account-row > td:nth-child(2) {\n grid-column: 1 / -1;\n }\n .settings-account-row > td:nth-child(3) {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n .settings-account-mobile-label {\n display: inline;\n color: var(--settings-muted);\n font-size: 11px;\n }\n .settings-account-usage {\n max-width: none;\n }\n .settings-account-table tr:not(.settings-account-row),\n .settings-account-table tr:not(.settings-account-row) > td {\n display: block;\n }\n}\n\n@media (forced-colors: active) {\n .settings-account-usage__bar {\n border: 1px solid CanvasText;\n }\n .settings-account-usage__bar > span {\n background: Highlight;\n }\n}\n';
27349
+ var accounts_default = '.settings-harness-account__logo {\n display: grid;\n place-items: center;\n width: 34px;\n height: 34px;\n}\n\n.settings-account-header {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 20px;\n}\n\n.settings-account-header > :first-child {\n min-width: 0;\n flex: 1 1 auto;\n}\n\n.settings-account-header > .settings-command-button {\n flex: none;\n white-space: nowrap;\n margin-top: 0;\n min-height: 36px;\n padding: 8px 12px;\n border-radius: 7px;\n}\n\n.settings-account-header .settings-section-label {\n margin: 0;\n padding: 0;\n font-size: 27px;\n line-height: 1.4;\n font-weight: 650;\n letter-spacing: -0.035em;\n}\n.settings-account-header .settings-page-description {\n margin: 8px 0 0;\n font-size: 13px;\n}\n\n.settings-account-status {\n margin: 0;\n color: var(--settings-muted);\n font-size: 12px;\n}\n.settings-account-status:empty {\n display: none;\n}\n\n.settings-account-toolbar {\n margin-top: 27px;\n padding: 18px 0;\n border-top: 1px solid var(--settings-border);\n display: flex;\n align-items: center;\n gap: 14px;\n flex-wrap: wrap;\n}\n.settings-account-count {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 13px;\n white-space: nowrap;\n}\n.settings-account-count > :last-child {\n color: var(--settings-muted);\n font-variant-numeric: tabular-nums;\n}\n.settings-account-search {\n display: flex;\n align-items: center;\n gap: 8px;\n color: var(--settings-muted);\n margin-right: auto;\n min-width: 0;\n max-width: 100%;\n}\n.settings-account-search svg {\n flex: none;\n}\n.settings-account-toolbar input {\n min-width: 80px;\n width: 210px;\n max-width: 100%;\n padding: 5px 0;\n color: var(--settings-text);\n background: transparent;\n border: 0;\n font-size: 13px;\n}\n.settings-account-toolbar input::placeholder {\n color: var(--settings-muted);\n}\n.settings-account-display-controls {\n display: flex;\n padding: 3px;\n border: 1px solid var(--settings-border);\n border-radius: 7px;\n background: var(--settings-inset);\n}\n.settings-account-display-controls button {\n padding: 4px 10px;\n color: var(--settings-muted);\n background: transparent;\n border: 0;\n border-radius: 4px;\n font-size: 12px;\n cursor: pointer;\n}\n.settings-account-display-controls button:hover {\n color: var(--settings-text);\n}\n.settings-account-display-controls button[aria-pressed="true"] {\n color: var(--settings-text);\n background: var(--settings-active);\n}\n\n.settings-account-groups {\n display: grid;\n gap: 22px;\n}\n.settings-account-group__title {\n margin: 0 0 8px;\n color: var(--settings-text);\n font-size: 13px;\n font-weight: 600;\n letter-spacing: -0.01em;\n}\n.settings-account-list {\n --account-border: light-dark(#e2e2e8, #36363b);\n --account-muted: light-dark(#676773, #a5a5af);\n border: 1px solid var(--account-border);\n border-radius: 11px;\n overflow: hidden;\n container-type: inline-size;\n}\n.settings-account-list > .settings-account-empty {\n margin: 0;\n padding: 28px 16px;\n}\n.settings-account-table {\n width: 100%;\n table-layout: fixed;\n border-collapse: collapse;\n font-size: 12px;\n}\n.settings-account-table th {\n padding: 12px 16px;\n color: var(--account-muted);\n background: light-dark(#f8f8fa, #202024);\n font-size: 11px;\n font-weight: 500;\n text-align: left;\n}\n.settings-account-table th:nth-child(1) {\n width: 32%;\n}\n.settings-account-table th:nth-child(2),\n.settings-account-table th:nth-child(3) {\n width: 24%;\n}\n.settings-account-table th:nth-child(4) {\n width: 20%;\n text-align: right;\n}\n.settings-account-table--api th:nth-child(1) {\n width: 48%;\n}\n.settings-account-table--api th:nth-child(2) {\n width: 32%;\n}\n.settings-account-table--api th:nth-child(3) {\n width: 20%;\n text-align: right;\n}\n.settings-account-table td {\n padding: 17px 16px;\n vertical-align: middle;\n border-top: 1px solid var(--settings-divider);\n}\n.settings-account-row {\n background: light-dark(#ffffff, #232326);\n}\n.settings-account-row:hover {\n background: light-dark(#f7f7fa, #26262a);\n}\n.settings-account-row__person {\n display: grid;\n grid-template-columns: 34px minmax(0, 1fr);\n align-items: center;\n gap: 11px;\n min-width: 0;\n}\n.settings-account-row__mark {\n display: grid;\n place-items: center;\n width: 34px;\n height: 34px;\n color: light-dark(#67558d, #c3baff);\n background: light-dark(#f0ecf7, #353044);\n border: 1px solid light-dark(#d9d0e6, #4d435f);\n border-radius: 10px;\n}\n.settings-account-row__identity {\n min-width: 0;\n}\n.settings-account-email {\n display: block;\n min-width: 0;\n overflow: hidden;\n font-size: 12px;\n font-weight: 550;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.settings-account-metadata {\n display: flex;\n align-items: center;\n min-width: 0;\n gap: 5px;\n margin-top: 4px;\n color: var(--settings-muted);\n flex-wrap: wrap;\n font-size: 11px;\n overflow-wrap: anywhere;\n}\n.settings-account-plan {\n flex: none;\n padding: 0 4px;\n color: var(--settings-muted);\n border: 1px solid var(--settings-border);\n border-radius: 5px;\n font-size: 10px;\n max-width: 100%;\n overflow-wrap: anywhere;\n}\n.settings-account-plan--highlighted {\n color: light-dark(#654f91, #c8bfff);\n background: light-dark(#f2edf9, #a99bff18);\n border-color: light-dark(#d9ccea, #a99bff52);\n font-weight: 600;\n}\n.settings-account-active {\n flex: none;\n color: light-dark(#66548e, #c8bfff);\n font-size: 10px;\n white-space: nowrap;\n}\n\n.settings-account-usage {\n display: grid;\n gap: 10px;\n}\n.settings-account-usage__meter {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n grid-template-rows: 20px 4px 17px;\n align-items: center;\n gap: 6px 0;\n min-width: 0;\n font-variant-numeric: tabular-nums;\n}\n:host([lang="zh-CN"]) .settings-account-usage__meter {\n grid-template-columns: 48px minmax(36px, 1fr) 72px;\n}\n.settings-account-usage__meter--balance {\n display: flex;\n grid-template-columns: none;\n justify-content: flex-start;\n gap: 6px;\n}\n.settings-account-usage__balance {\n display: inline-flex;\n align-items: baseline;\n gap: 4px;\n font-size: 14px;\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n white-space: nowrap;\n}\n\n.settings-account-usage__title {\n display: none;\n min-width: 0;\n color: var(--settings-muted);\n font-size: 11px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.settings-account-extra-usage {\n display: grid;\n gap: 12px;\n margin-top: 14px;\n}\n.settings-account-extra-usage .settings-account-usage__meter {\n grid-template-rows: auto 20px 4px 17px;\n}\n.settings-account-extra-usage .settings-account-usage__title {\n display: block;\n grid-column: 1 / -1;\n white-space: normal;\n overflow-wrap: anywhere;\n}\n.settings-account-usage__percent {\n grid-column: 1 / -1;\n min-width: 0;\n display: flex;\n align-items: baseline;\n justify-content: flex-end;\n gap: 7px;\n font-size: 14px;\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n white-space: nowrap;\n}\n.settings-account-usage__countdown {\n min-width: 0;\n color: var(--settings-muted);\n font-size: 10px;\n font-weight: 400;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.settings-account-usage__percent > :last-child {\n flex: none;\n}\n.settings-account-usage__percent--warn {\n color: var(--settings-warning);\n}\n.settings-account-usage__percent--hot {\n color: var(--settings-danger);\n}\n.settings-account-usage__bar {\n grid-column: 1 / -1;\n height: 4px;\n overflow: hidden;\n background: light-dark(#e3e1e8, #3c3c43);\n border-radius: 4px;\n}\n.settings-account-usage__bar > span {\n display: block;\n height: 100%;\n background: light-dark(#81769e, #9993b8);\n border-radius: inherit;\n}\n.settings-account-usage__bar--warn > span {\n background: var(--settings-warning);\n}\n.settings-account-usage__bar--hot > span {\n background: var(--settings-danger);\n}\n.settings-account-usage__sub {\n grid-column: 1 / -1;\n color: var(--account-muted);\n font-size: 10px;\n font-variant-numeric: tabular-nums;\n text-align: right;\n white-space: nowrap;\n}\n.settings-account-usage__message {\n color: var(--settings-muted);\n}\n.settings-account-usage__missing {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n align-content: center;\n gap: 6px;\n min-height: 53px;\n color: var(--settings-muted);\n}\n.settings-account-usage__missing > span:not(.settings-account-usage__title) {\n grid-column: 1 / -1;\n font-size: 14px;\n}\n.settings-account-management {\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n gap: 4px;\n}\n.settings-account-native {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 3px;\n color: var(--settings-muted);\n font-size: 11px;\n}\n.settings-account-native .settings-icon-button {\n width: 25px;\n height: 28px;\n}\n.settings-account-usage > button {\n justify-self: start;\n}\n.settings-account-actions {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n gap: 4px;\n flex-wrap: wrap;\n}\n.settings-account-action {\n padding: 4px 5px;\n min-height: 30px;\n font-size: 12px;\n color: var(--settings-text);\n background: transparent;\n border: 1px solid transparent;\n border-radius: 7px;\n white-space: nowrap;\n cursor: pointer;\n}\n.settings-account-action:hover {\n background: var(--settings-hover);\n}\n.settings-account-action:disabled {\n opacity: 0.45;\n cursor: not-allowed;\n}\n.settings-account-delete {\n color: var(--settings-danger);\n}\n.settings-account-delete:hover,\n.settings-account-delete:focus-visible {\n color: var(--settings-danger);\n background: var(--settings-danger-bg);\n}\n.settings-account-reset-summary {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n min-height: 24px;\n padding: 3px 0;\n font-size: 10px;\n white-space: nowrap;\n color: var(--settings-muted);\n background: transparent;\n border: 0;\n border-radius: 5px;\n cursor: pointer;\n}\n.settings-account-reset-summary:hover {\n background: var(--settings-hover);\n}\n.settings-account-reset-summary[aria-expanded="true"] > svg:last-child {\n transform: rotate(90deg);\n}\n.settings-account-details-row > td {\n background: var(--settings-inset);\n}\n.settings-account-reset-details {\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n gap: 16px;\n flex-wrap: wrap;\n}\n.settings-account-reset-details strong {\n font-size: 12px;\n}\n.settings-account-reset-expiry {\n margin: 6px 0;\n color: var(--settings-muted);\n font-size: 11px;\n}\n.settings-account-reset-expiry.is-warn {\n color: var(--settings-warning);\n}\n.settings-account-reset-expiry.is-hot {\n color: var(--settings-danger);\n}\n.settings-account-reset-list {\n margin: 8px 0 0;\n padding: 0;\n list-style: none;\n color: var(--settings-muted);\n font-size: 11px;\n}\n.settings-account-reset-list li + li {\n margin-top: 4px;\n}\n.settings-account-empty {\n text-align: center;\n color: var(--settings-muted);\n}\n.settings-account-verification {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-wrap: wrap;\n color: var(--settings-muted);\n}\n.settings-account-verification a {\n color: var(--settings-focus);\n overflow-wrap: anywhere;\n}\n.settings-account-verification code {\n padding: 5px 8px;\n color: var(--settings-text);\n font-size: 15px;\n font-weight: 600;\n letter-spacing: 0.08em;\n background: var(--settings-inset);\n border-radius: 6px;\n}\n.settings-account-list :focus-visible,\n.settings-account-toolbar :focus-visible {\n outline: 2px solid var(--settings-focus);\n outline-offset: -2px;\n}\n\n.settings-account-dialog {\n position: fixed;\n width: min(360px, calc(100vw - 40px));\n max-height: calc(100vh - 40px);\n overflow: auto;\n padding: 22px;\n color: var(--settings-text);\n background: var(--settings-elevated);\n border: 1px solid var(--settings-border);\n border-radius: 12px;\n box-shadow: var(--settings-dialog-shadow);\n text-align: left;\n}\n.settings-account-dialog::backdrop {\n background: var(--settings-backdrop);\n}\n.settings-account-dialog h2 {\n margin: 0 28px 12px 0;\n font-size: 15px;\n}\n.settings-account-dialog p {\n color: var(--settings-muted);\n font-size: 12px;\n line-height: 1.6;\n overflow-wrap: anywhere;\n}\n.settings-account-dialog__close {\n position: absolute;\n top: 12px;\n right: 12px;\n}\n.settings-account-dialog__actions {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n flex-wrap: wrap;\n}\n\n@container (max-width: 680px) {\n .settings-account-table,\n .settings-account-table tbody {\n display: block;\n }\n .settings-account-table thead {\n display: none;\n }\n .settings-account-row {\n display: grid;\n grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);\n padding: 18px;\n gap: 18px 22px;\n border-top: 1px solid var(--settings-divider);\n }\n .settings-account-row:first-child {\n border-top: 0;\n }\n .settings-account-table .settings-account-row > td {\n display: block;\n min-width: 0;\n padding: 0;\n border: 0;\n }\n .settings-account-person-cell,\n .settings-account-management-cell,\n .settings-account-usage-cell--message,\n .settings-account-table--api .settings-account-usage-cell {\n grid-column: 1 / -1;\n }\n .settings-account-table .settings-account-management-cell {\n border-top: 1px solid var(--settings-divider);\n padding-top: 8px;\n }\n .settings-account-email {\n font-size: 13px;\n }\n .settings-account-usage__title {\n display: block;\n grid-column: 1;\n }\n .settings-account-usage__percent,\n .settings-account-usage__missing > span:not(.settings-account-usage__title) {\n grid-column: 2;\n text-align: right;\n }\n .settings-account-extra-usage .settings-account-usage__percent {\n grid-column: 1 / -1;\n }\n .settings-account-management {\n flex-direction: row;\n justify-content: space-between;\n }\n .settings-account-actions {\n order: 1;\n margin-left: auto;\n }\n .settings-account-native {\n justify-content: flex-start;\n }\n .settings-account-table tr:not(.settings-account-row, [hidden]),\n .settings-account-table tr:not(.settings-account-row, [hidden]) > td {\n display: block;\n }\n}\n\n@container (max-width: 360px) {\n .settings-account-row {\n grid-template-columns: minmax(0, 1fr);\n gap: 16px;\n padding: 16px;\n }\n}\n\n@media (forced-colors: active) {\n .settings-account-usage__bar {\n border: 1px solid CanvasText;\n }\n .settings-account-usage__bar > span {\n background: Highlight;\n }\n}\n';
26988
27350
 
26989
27351
  // src/settings/shell.ts
26990
27352
  var SETTINGS_SHELL_ATTRIBUTE = "data-codexhost-settings-shell";
@@ -27143,7 +27505,9 @@ ${accounts_default}`;
27143
27505
  RENDERER_SETTINGS_NAV_SECTIONS.flatMap((section) => [...section.pageIds])
27144
27506
  );
27145
27507
  for (const section of RENDERER_SETTINGS_NAV_SECTIONS) {
27146
- const pages = section.pageIds.map((pageId) => resolvedRegistry.getPage(pageId)).filter((definition) => definition !== void 0);
27508
+ const pages = section.pageIds.map((pageId) => resolvedRegistry.getPage(pageId)).filter(
27509
+ (definition) => definition !== void 0
27510
+ );
27147
27511
  const leftovers = section.id === "other" ? resolvedRegistry.pages.filter((definition) => !assignedPageIds.has(definition.id)) : [];
27148
27512
  if (pages.length === 0 && leftovers.length === 0) continue;
27149
27513
  appendNavigationSection(rendererSettingsNavSectionLabel(section.id, messages));
@@ -28031,6 +28395,7 @@ ${accounts_default}`;
28031
28395
  const mountedByComposer = /* @__PURE__ */ new Map();
28032
28396
  const pendingReplacements = /* @__PURE__ */ new Map();
28033
28397
  let disposed = false;
28398
+ const disposeReasoningSoftWrap = installReasoningTranscriptSoftWrap(document);
28034
28399
  let scanScheduled = false;
28035
28400
  let refreshTargetsOnNextScan = false;
28036
28401
  let adapterDispose = null;
@@ -29864,6 +30229,7 @@ ${accounts_default}`;
29864
30229
  applyAdapterAgent = null;
29865
30230
  modelControl = null;
29866
30231
  mutationObserver.disconnect();
30232
+ disposeReasoningSoftWrap();
29867
30233
  sidebarAgentIcons.dispose();
29868
30234
  stopSidebarExternalPinning();
29869
30235
  settingsLifecycle.dispose();