npm - @jsonstudio/rcc - Versions diffs - 0.89.1205 → 0.89.1348 - Mend

@jsonstudio/rcc 0.89.1205 → 0.89.1348

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.

Files changed (332) hide show

package/docs/daemon-admin-ui.html ADDED Viewed

@@ -0,0 +1,3394 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <title>RouteCodex Daemon Admin</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <style>
+      :root {
+        --bg: #070a14;
+        --panel: rgba(255, 255, 255, 0.05);
+        --panel-2: rgba(255, 255, 255, 0.03);
+        --border: rgba(255, 255, 255, 0.08);
+        --text: rgba(255, 255, 255, 0.92);
+        --muted: rgba(255, 255, 255, 0.62);
+        --accent: #4ea1ff;
+        --ok: #4cd964;
+        --warn: #ffb547;
+        --err: #ff5f5f;
+        --radius: 12px;
+      }
+      * {
+        box-sizing: border-box;
+      }
+      body {
+        margin: 0;
+        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
+          sans-serif;
+        background: radial-gradient(circle at 25% 0, #131a36 0, var(--bg) 50%, #03040a 100%);
+        color: var(--text);
+      }
+      .container {
+        max-width: 1680px;
+        margin: 22px auto 40px;
+        padding: 0 16px;
+      }
+      .card {
+        border: 1px solid var(--border);
+        background: linear-gradient(180deg, var(--panel), var(--panel-2));
+        border-radius: var(--radius);
+        padding: 14px;
+        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
+      }
+      header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 14px;
+        flex-wrap: wrap;
+        margin-bottom: 14px;
+      }
+      .title h1 {
+        margin: 0;
+        font-size: 16px;
+        font-weight: 650;
+      }
+      .title p {
+        margin: 3px 0 0;
+        font-size: 12px;
+        color: var(--muted);
+      }
+      .statusline {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        flex-wrap: wrap;
+      }
+      .pill {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        border: 1px solid var(--border);
+        background: rgba(255, 255, 255, 0.03);
+        border-radius: 999px;
+        padding: 4px 10px;
+        font-size: 12px;
+        color: var(--muted);
+      }
+      .toast {
+        position: fixed;
+        right: 14px;
+        bottom: 14px;
+        max-width: 520px;
+        padding: 10px 12px;
+        border-radius: 10px;
+        border: 1px solid var(--border);
+        background: rgba(20, 20, 20, 0.92);
+        color: var(--fg);
+        box-shadow: 0 12px 34px rgba(0,0,0,0.45);
+        z-index: 99999;
+        font-size: 13px;
+        line-height: 1.35;
+        display: none;
+        white-space: pre-wrap;
+        word-break: break-word;
+      }
+      .toast.show { display: block; }
+      .toast.ok { border-color: rgba(38, 200, 120, 0.45); }
+      .toast.err { border-color: rgba(255, 90, 90, 0.55); }
+      .kv {
+        border: 1px solid rgba(255, 255, 255, 0.10);
+        border-radius: 12px;
+        padding: 8px 10px;
+        background: rgba(0, 0, 0, 0.18);
+        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+        font-size: 12px;
+        line-height: 1.45;
+        color: rgba(255, 255, 255, 0.86);
+        overflow: visible;
+        max-height: none;
+      }
+      .kv details {
+        border-left: 1px solid rgba(255, 255, 255, 0.10);
+        margin-left: 10px;
+        padding-left: 10px;
+      }
+      .kv summary {
+        cursor: pointer;
+        list-style: none;
+        user-select: none;
+        display: flex;
+        gap: 10px;
+        align-items: baseline;
+        padding: 2px 0;
+      }
+      .kv summary::-webkit-details-marker { display: none; }
+      .kv .kv-key {
+        color: rgba(255, 255, 255, 0.92);
+        min-width: 180px;
+        max-width: 520px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+      .kv .kv-meta {
+        color: rgba(255, 255, 255, 0.55);
+        flex: 1;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+      .kv .kv-leaf {
+        display: flex;
+        gap: 10px;
+        padding: 2px 0;
+      }
+      .kv .kv-val {
+        color: rgba(255, 255, 255, 0.78);
+        flex: 1;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+      .kv-tools {
+        display: flex;
+        gap: 8px;
+        flex-wrap: wrap;
+        margin: 0 0 8px;
+      }
+      .kv-editor .kv-leaf,
+      .kv-editor summary {
+        align-items: center;
+      }
+      .kv-editor .kv-type {
+        color: rgba(255, 255, 255, 0.55);
+        min-width: 92px;
+        max-width: 140px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+      .kv-editor .kv-actions {
+        display: inline-flex;
+        gap: 6px;
+        margin-left: auto;
+        flex: 0 0 auto;
+      }
+      .kv-editor .kv-actions button {
+        padding: 4px 8px;
+        border-radius: 8px;
+        font-size: 12px;
+      }
+      .kv-editor input[type="text"],
+      .kv-editor input[type="number"],
+      .kv-editor select {
+        padding: 4px 6px;
+        border-radius: 8px;
+        font-size: 12px;
+      }
+      .kv-editor .kv-path {
+        color: rgba(255, 255, 255, 0.42);
+        margin-left: 6px;
+      }
+      #routingKvEditor.kv-editor .kv-val {
+        white-space: normal;
+        overflow: visible;
+        text-overflow: unset;
+      }
+      #routingKvEditor.kv-editor .kv-actions .kv-path {
+        display: none;
+      }
+      body.show-routing-paths #routingKvEditor.kv-editor .kv-actions .kv-path {
+        display: inline-flex;
+      }
+      #routingKvEditor.kv-editor .kv-actions button.danger {
+        display: none;
+      }
+      #routingKvEditor.kv-editor .kv-leaf:hover .kv-actions button.danger,
+      #routingKvEditor.kv-editor summary:hover .kv-actions button.danger {
+        display: inline-flex;
+      }
+      #routingKvEditor .routing-target-actions {
+        margin-top: 6px;
+        display: flex;
+        flex-direction: column;
+        gap: 6px;
+      }
+      #routingKvEditor .routing-target-row {
+        display: flex;
+        gap: 8px;
+        flex-wrap: wrap;
+        align-items: center;
+      }
+      #routingKvEditor .routing-target-key {
+        padding: 2px 6px;
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        border-radius: 999px;
+        background: rgba(255, 255, 255, 0.04);
+        max-width: 520px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+      #routingKvEditor .routing-target-meta {
+        color: rgba(255, 255, 255, 0.55);
+      }
+      #routingKvEditor .routing-target-row button {
+        padding: 4px 8px;
+        border-radius: 8px;
+        font-size: 12px;
+      }
+      .dot {
+        width: 8px;
+        height: 8px;
+        border-radius: 999px;
+        background: var(--warn);
+      }
+      .dot.ok {
+        background: var(--ok);
+      }
+      .dot.err {
+        background: var(--err);
+      }
+      .row {
+        display: flex;
+        gap: 10px;
+        flex-wrap: wrap;
+        align-items: center;
+      }
+      label {
+        font-size: 12px;
+        color: var(--muted);
+      }
+      input[type="text"],
+      input[type="password"],
+      select,
+      textarea {
+        border: 1px solid var(--border);
+        background: rgba(0, 0, 0, 0.25);
+        color: var(--text);
+        border-radius: 10px;
+        padding: 8px 10px;
+        font-size: 12px;
+        outline: none;
+      }
+      textarea {
+        width: 100%;
+        min-height: 220px;
+        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+          "Courier New", monospace;
+        line-height: 1.45;
+      }
+      button {
+        border: 1px solid var(--border);
+        background: rgba(255, 255, 255, 0.04);
+        color: var(--text);
+        border-radius: 10px;
+        padding: 8px 10px;
+        font-size: 12px;
+        cursor: pointer;
+      }
+      button.primary {
+        border-color: rgba(78, 161, 255, 0.55);
+        background: rgba(78, 161, 255, 0.14);
+      }
+      button.danger {
+        border-color: rgba(255, 95, 95, 0.55);
+        background: rgba(255, 95, 95, 0.14);
+      }
+      .tabs {
+        display: flex;
+        gap: 6px;
+        margin: 14px 0 10px;
+        flex-wrap: wrap;
+      }
+      .tab {
+        padding: 8px 12px;
+        border-radius: 999px;
+        border: 1px solid var(--border);
+        background: rgba(255, 255, 255, 0.02);
+        color: var(--muted);
+      }
+      .tab.active {
+        color: var(--text);
+        border-color: rgba(78, 161, 255, 0.55);
+        background: rgba(78, 161, 255, 0.12);
+      }
+      .grid {
+        display: grid;
+        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+        gap: 12px;
+      }
+      .grid.grid-wide-left {
+        grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
+      }
+      .grid.grid-wide-right {
+        grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
+      }
+      .grid.grid-one {
+        grid-template-columns: minmax(0, 1fr);
+      }
+      /* Ensure grid children can shrink without overflowing into the next column */
+      .grid > .card {
+        min-width: 0;
+      }
+      @media (max-width: 980px) {
+        .grid {
+          grid-template-columns: minmax(0, 1fr);
+        }
+      }
+      .section-title {
+        font-size: 13px;
+        font-weight: 650;
+        margin: 0 0 6px;
+      }
+      .section-sub {
+        margin: 0 0 10px;
+        font-size: 12px;
+        color: var(--muted);
+      }
+      .table {
+        width: 100%;
+        border-collapse: collapse;
+        table-layout: fixed;
+      }
+      .table th,
+      .table td {
+        padding: 8px 10px;
+        font-size: 12px;
+        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+        vertical-align: top;
+        overflow-wrap: anywhere;
+        word-break: break-word;
+      }
+      .table th {
+        text-align: left;
+        color: var(--muted);
+        font-weight: 600;
+        background: rgba(255, 255, 255, 0.03);
+      }
+      .table.table-runtime th:nth-child(1),
+      .table.table-runtime td:nth-child(1) {
+        width: 22%;
+      }
+      .table.table-runtime th:nth-child(2),
+      .table.table-runtime td:nth-child(2) {
+        width: 19%;
+      }
+      .table.table-runtime th:nth-child(3),
+      .table.table-runtime td:nth-child(3) {
+        width: 9%;
+      }
+      .table.table-runtime th:nth-child(4),
+      .table.table-runtime td:nth-child(4) {
+        width: 12%;
+      }
+      .table.table-runtime th:nth-child(5),
+      .table.table-runtime td:nth-child(5) {
+        width: 12%;
+      }
+      .table.table-runtime th:nth-child(6),
+      .table.table-runtime td:nth-child(6) {
+        width: 7%;
+      }
+      .table.table-runtime th:nth-child(7),
+      .table.table-runtime td:nth-child(7) {
+        width: 11%;
+      }
+      .table.table-runtime th:nth-child(8),
+      .table.table-runtime td:nth-child(8) {
+        width: 8%;
+      }
+      .table tr.group-row td {
+        background: rgba(255, 255, 255, 0.02);
+        color: rgba(255, 255, 255, 0.86);
+        font-weight: 650;
+      }
+      .table tr.provider-row:hover td {
+        background: rgba(78, 161, 255, 0.06);
+      }
+      .table tr.provider-row.selected td {
+        background: rgba(78, 161, 255, 0.12);
+      }
+      .indent {
+        padding-left: 22px !important;
+      }
+      .table-wrap {
+        width: 100%;
+        max-width: 100%;
+        overflow: visible;
+        border-radius: 12px;
+        border: 1px solid var(--border);
+      }
+      .table-wrap .table {
+        border: 0;
+        min-width: 0;
+      }
+      .table td.actions-cell {
+        width: 220px;
+        overflow: visible;
+      }
+      .actions {
+        display: flex;
+        gap: 8px;
+        flex-wrap: wrap;
+        justify-content: flex-end;
+      }
+      .truncate {
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      .mono {
+        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+          "Courier New", monospace;
+        color: var(--muted);
+        word-break: break-all;
+      }
+      .pill {
+        display: inline-block;
+        padding: 2px 8px;
+        border-radius: 999px;
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        background: rgba(255, 255, 255, 0.04);
+        font-size: 11px;
+        line-height: 1.4;
+        white-space: nowrap;
+      }
+      .pill.ok {
+        border-color: rgba(52, 211, 153, 0.35);
+        background: rgba(52, 211, 153, 0.10);
+        color: rgba(210, 255, 236, 0.92);
+      }
+      .pill.warn {
+        border-color: rgba(255, 181, 71, 0.35);
+        background: rgba(255, 181, 71, 0.10);
+        color: rgba(255, 236, 210, 0.92);
+      }
+      .pill.bad {
+        border-color: rgba(239, 68, 68, 0.35);
+        background: rgba(239, 68, 68, 0.10);
+        color: rgba(255, 220, 220, 0.92);
+      }
+      .muted {
+        color: var(--muted);
+      }
+      .notice {
+        border: 1px solid rgba(255, 181, 71, 0.35);
+        background: rgba(255, 181, 71, 0.08);
+        border-radius: 12px;
+        padding: 10px 12px;
+        font-size: 12px;
+        color: rgba(255, 255, 255, 0.82);
+      }
+      .log {
+        white-space: pre-wrap;
+        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+          "Courier New", monospace;
+        font-size: 12px;
+        line-height: 1.45;
+        color: rgba(255, 255, 255, 0.84);
+        background: rgba(0, 0, 0, 0.25);
+        border: 1px solid rgba(255, 255, 255, 0.08);
+        border-radius: 12px;
+        padding: 10px 12px;
+      }
+      @media (max-width: 640px) {
+        header {
+          flex-direction: column;
+          align-items: flex-start;
+        }
+        .statusline {
+          width: 100%;
+          justify-content: flex-start;
+        }
+        .row {
+          align-items: stretch;
+        }
+        .row > input,
+        .row > select,
+        .row > button {
+          max-width: 100%;
+        }
+      }
+    </style>
+  </head>
+  <body>
+    <div class="container">
+      <div class="card">
+        <header>
+          <div class="title">
+            <h1>RouteCodex Daemon Admin</h1>
+            <p>
+              Writes to <span class="mono">~/.routecodex/config.json</span>. This UI requires an admin password:
+              first visit will ask you to set one (stored at <span class="mono">~/.routecodex/login</span>), then you login with it.
+            </p>
+          </div>
+          <div class="statusline">
+            <div class="pill"><span id="statusDot" class="dot"></span><span id="statusText">connecting…</span></div>
+            <div class="pill"><span class="mono" id="serverId">serverId: —</span></div>
+            <button id="restartRuntimeBtn" class="primary">Restart runtime</button>
+          </div>
+        </header>
+        <div class="row" style="margin-bottom: 10px;">
+          <label for="adminPasswordInput">Admin password</label>
+          <input
+            id="adminPasswordInput"
+            type="password"
+            placeholder="set (first time) / login"
+            style="flex: 1; min-width: 260px;"
+          />
+          <button id="setupPasswordBtn" class="primary">Set</button>
+          <button id="loginPasswordBtn" class="primary">Login</button>
+          <button id="logoutPasswordBtn">Logout</button>
+          <span class="mono" id="adminAuthHint"></span>
+        </div>
+        <details id="changePasswordDetails" style="margin: 0 0 10px; display:none;">
+          <summary class="muted" style="font-size:12px; cursor:pointer; user-select:none;">Change admin password</summary>
+          <div class="row" style="margin-top: 10px;">
+            <label for="oldAdminPasswordInput">old</label>
+            <input
+              id="oldAdminPasswordInput"
+              type="password"
+              placeholder="old password"
+              style="flex: 1; min-width: 240px;"
+            />
+            <label for="newAdminPasswordInput">new</label>
+            <input
+              id="newAdminPasswordInput"
+              type="password"
+              placeholder="new password (8+ chars)"
+              style="flex: 1; min-width: 240px;"
+            />
+            <button id="changePasswordBtn" class="primary">Change</button>
+          </div>
+          <div class="muted" style="font-size:12px; margin-top: 6px;">
+            Localhost-only. Requires current authenticated session.
+          </div>
+        </details>
+        <div class="row" style="margin-bottom: 10px;">
+          <label for="apiKeyInput">Server API key (optional, for /v1/* tests)</label>
+          <input
+            id="apiKeyInput"
+            type="password"
+            placeholder="x-api-key / Authorization: Bearer …"
+            style="flex: 1; min-width: 260px;"
+          />
+          <button id="saveApiKeyBtn" class="primary">Save</button>
+          <button id="clearApiKeyBtn">Clear</button>
+          <span class="mono" id="apiKeyHint"></span>
+        </div>
+        <div class="tabs">
+          <button class="tab active" data-tab="providers">Provider Pool</button>
+          <button class="tab" data-tab="tokens">Token Stats</button>
+          <button class="tab" data-tab="credentials">Auth Provider Pool</button>
+          <button class="tab" data-tab="quota">Quota Pool</button>
+          <button class="tab" data-tab="routing">Runtime Routing Pool</button>
+        </div>
+        <section id="panelProviders" data-panel="providers">
+          <div class="grid grid-wide-left">
+            <div class="card" style="box-shadow: none;">
+              <p class="section-title">Providers in <span class="mono">virtualrouter.providers</span></p>
+              <p class="section-sub">
+                API keys are stored as authfiles and referenced with <span class="mono">authfile-…</span>. The UI never reads or returns secrets.
+              </p>
+              <div class="row" style="margin-bottom: 10px;">
+                <button id="refreshProvidersBtn" class="primary">Refresh</button>
+                <button id="newProviderBtn">New provider…</button>
+              </div>
+              <div class="table-wrap">
+                <table class="table">
+                  <thead>
+                    <tr>
+                      <th>id</th>
+                      <th>type</th>
+                      <th>enabled</th>
+                      <th>baseURL</th>
+                      <th>models</th>
+                      <th>compat</th>
+                      <th>auth</th>
+                      <th></th>
+                    </tr>
+                  </thead>
+                  <tbody id="providersTbody"></tbody>
+                </table>
+              </div>
+            </div>
+            <div class="card" style="box-shadow: none;">
+              <p class="section-title" id="providerEditorTitle">Provider editor</p>
+              <p class="section-sub">
+                Edit providers as key/value entries to avoid JSON syntax errors. Save writes to disk and creates a backup.
+              </p>
+              <div class="notice" style="margin-bottom: 10px;">
+                Admin API calls use the password login above (cookie session). The optional server API key is only needed for testing proxy endpoints like <span class="mono">/v1/responses</span>.
+              </div>
+              <div class="row" style="margin-bottom: 10px;">
+                <label for="providerIdInput">provider id</label>
+                <input id="providerIdInput" type="text" placeholder="e.g. tab, glm, qwen" style="width: 240px;" />
+                <label for="providerPreset">preset</label>
+                <select id="providerPreset">
+                  <option value="responses">responses (OpenAI /v1/responses)</option>
+                  <option value="openai">openai (OpenAI /v1/chat/completions)</option>
+                  <option value="openai-standard">openai-standard</option>
+                  <option value="iflow">iflow (cookieFile)</option>
+                  <option value="custom" selected>custom (start empty)</option>
+                </select>
+              </div>
+              <div class="row" style="margin-bottom: 10px;">
+                <label for="authMode">auth</label>
+                <select id="authMode">
+                  <option value="apikey">apikey (store as authfile)</option>
+                  <option value="oauth">oauth (alias-only + authorize in Auth tab)</option>
+                  <option value="cookie">cookieFile</option>
+                  <option value="none">none</option>
+                </select>
+              </div>
+              <div id="authApikeyBox" class="card" style="box-shadow:none; padding: 10px; margin-bottom: 10px;">
+                <p class="section-title" style="margin-bottom: 8px;">API key</p>
+                <div class="row" style="margin-bottom: 8px;">
+                  <label for="apikeyAliasInput">alias</label>
+                  <input id="apikeyAliasInput" type="text" placeholder="default" style="width: 220px;" />
+                  <label for="apikeyValueInput">apiKey</label>
+                  <input
+                    id="apikeyValueInput"
+                    type="password"
+                    placeholder="will be written to ~/.routecodex/auth/*.key"
+                    style="flex: 1; min-width: 260px;"
+                  />
+                </div>
+                <div class="row">
+                  <span class="mono" id="apikeySecretRefOut"></span>
+                  <button id="createApiKeyCredentialBtn">Create authfile</button>
+                </div>
+              </div>
+              <div id="authOauthBox" class="card" style="box-shadow:none; padding: 10px; margin-bottom: 10px; display:none;">
+                <p class="section-title" style="margin-bottom: 8px;">OAuth</p>
+                <p class="section-sub" style="margin-bottom: 8px;">
+                  Use Auth tab to authorize. Here we only reference <span class="mono">tokenFile</span> as an alias.
+                </p>
+                <div class="row">
+                  <label for="oauthTypeInput">auth.type</label>
+                  <input
+                    id="oauthTypeInput"
+                    type="text"
+                    placeholder="qwen-oauth / iflow-oauth / gemini-cli-oauth / antigravity-oauth"
+                    style="flex: 1; min-width: 260px;"
+                  />
+                  <label for="oauthAliasInput">tokenFile alias</label>
+                  <input id="oauthAliasInput" type="text" placeholder="default" style="width: 240px;" />
+                </div>
+              </div>
+              <div id="authCookieBox" class="card" style="box-shadow:none; padding: 10px; margin-bottom: 10px; display:none;">
+                <p class="section-title" style="margin-bottom: 8px;">Cookie file</p>
+                <div class="row">
+                  <label for="cookieFileInput">cookieFile</label>
+                  <input
+                    id="cookieFileInput"
+                    type="text"
+                    placeholder="~/.routecodex/auth/iflow-work.cookie"
+                    style="flex: 1; min-width: 280px;"
+                  />
+                </div>
+              </div>
+              <p class="section-title" style="margin-top: 10px;">Provider config</p>
+              <p class="section-sub">Tree editor. Use “Apply preset” to populate common templates.</p>
+              <div class="kv-tools">
+                <button id="providerEditorExpandBtn">Expand all</button>
+                <button id="providerEditorCollapseBtn">Collapse all</button>
+                <span class="mono" id="providerEditorDirtyHint"></span>
+              </div>
+              <div id="providerKvEditor" class="kv kv-editor"></div>
+              <div class="row" style="margin-top: 10px;">
+                <button id="loadProviderBtn">Load</button>
+                <button id="applyPresetBtn">Apply preset</button>
+                <button id="saveProviderBtn" class="primary">Save</button>
+                <button id="deleteProviderBtn" class="danger">Delete</button>
+              </div>
+              <div id="providerOpLog" class="log" style="margin-top: 10px; display:none;"></div>
+            </div>
+          </div>
+        </section>
+        <section id="panelTokens" data-panel="tokens" style="display:none;">
+          <div class="grid">
+            <div class="card" style="box-shadow:none;">
+              <p class="section-title">Token usage (session + historical)</p>
+              <p class="section-sub">
+                Session stats reset on server restart. Historical totals are aggregated from
+                <span class="mono">~/.routecodex/logs/provider-stats.jsonl</span> (best-effort).
+              </p>
+              <div class="row" style="margin-bottom: 10px;">
+                <button id="refreshTokensBtn" class="primary">Refresh</button>
+              </div>
+              <div class="notice mono" id="tokenTotalsBox" style="white-space: pre-wrap;"></div>
+              <div class="table-wrap" style="margin-top: 10px;">
+                <table class="table">
+                  <thead>
+                    <tr>
+                      <th>providerKey</th>
+                      <th>model</th>
+                      <th>session req/err</th>
+                      <th>session tokens in/out/total</th>
+                      <th>historical req/err</th>
+                      <th>historical tokens in/out/total</th>
+                    </tr>
+                  </thead>
+                  <tbody id="tokensTbody"></tbody>
+                </table>
+              </div>
+            </div>
+          </div>
+        </section>
+        <section id="panelCredentials" data-panel="credentials" style="display:none;">
+          <div class="grid">
+            <div class="card" style="box-shadow:none;">
+              <p class="section-title">Credentials</p>
+              <p class="section-sub">
+                Token files + API key authfiles in <span class="mono">~/.routecodex/auth</span>.
+              </p>
+              <div class="row" style="margin-bottom: 10px;">
+                <button id="refreshCredentialsBtn" class="primary">Refresh</button>
+              </div>
+              <div class="table-wrap">
+                <table class="table">
+                  <thead>
+                    <tr>
+                      <th>kind</th>
+                      <th>provider</th>
+                      <th>alias</th>
+                      <th>status</th>
+                      <th>expires</th>
+                      <th>secretRef</th>
+                    </tr>
+                  </thead>
+                  <tbody id="credentialsTbody"></tbody>
+                </table>
+              </div>
+            </div>
+            <div class="card" style="box-shadow:none;">
+              <p class="section-title">OAuth / Browser settings</p>
+              <p class="section-sub">
+                Set <span class="mono">ROUTECODEX_OAUTH_BROWSER</span> via config so “Authorize” can auto-open with Camoufox.
+              </p>
+              <div class="row" style="margin-bottom: 10px;">
+                <label for="oauthBrowserSelect">oauthBrowser</label>
+                <select id="oauthBrowserSelect">
+                  <option value="default">default</option>
+                  <option value="camoufox">camoufox</option>
+                </select>
+                <button id="saveOauthBrowserBtn" class="primary">Save</button>
+              </div>
+              <p class="section-title" style="margin-top: 10px;">Authorize OAuth</p>
+              <div class="row" style="margin-bottom: 10px;">
+                <label for="oauthProviderSelect">provider</label>
+                <select id="oauthProviderSelect">
+                  <option value="qwen">qwen</option>
+                  <option value="iflow">iflow</option>
+                  <option value="gemini-cli">gemini-cli</option>
+                  <option value="antigravity">antigravity</option>
+                </select>
+                <label for="oauthAuthAliasInput">alias</label>
+                <input id="oauthAuthAliasInput" type="text" placeholder="default" style="width: 240px;" />
+              </div>
+              <div class="row" style="margin-bottom: 10px;">
+                <label><input id="oauthOpenBrowser" type="checkbox" checked /> open browser</label>
+                <label><input id="oauthForceReauth" type="checkbox" /> force reauthorize</label>
+                <button id="oauthAuthorizeBtn" class="primary">Authorize</button>
+              </div>
+              <div id="credentialOpLog" class="log" style="display:none;"></div>
+            </div>
+          </div>
+        </section>
+        <section id="panelQuota" data-panel="quota" style="display:none;">
+          <div class="grid">
+            <div class="card" style="box-shadow:none;">
+              <p class="section-title">Quota (daemon)</p>
+              <p class="section-sub">
+                VirtualRouter consumes this via <span class="mono">quotaView</span>. When
+                <span class="mono">inPool=false</span>, the provider is treated as removed from the route pool.
+	              </p>
+	              <div class="row" style="margin-bottom: 10px;">
+	                <label for="quotaFilterInput">filter</label>
+	                <input id="quotaFilterInput" type="text" placeholder="providerKey contains…" style="width: 320px;" />
+	                <label><input id="quotaHideOkToggle" type="checkbox" /> hide ok</label>
+	                <label><input id="quotaOnlyRoutedTargetsToggle" type="checkbox" checked /> only routed targets</label>
+	                <span class="muted" style="font-size:12px;">Tip: click a row to fill the offline box.</span>
+	              </div>
+	              <div class="row" style="margin-bottom: 10px;">
+	                <label for="quotaKeyInput">providerKey</label>
+	                <input id="quotaKeyInput" type="text" placeholder="tab.key1.gpt-5.2-codex" style="width: 420px;" />
+	                <label for="quotaModeSelect">offline mode</label>
+	                <select id="quotaModeSelect" style="width: 140px;">
+	                  <option value="cooldown">cooldown</option>
+	                  <option value="blacklist">blacklist</option>
+	                </select>
+	                <label for="quotaDurationSelect">offline time</label>
+	                <select id="quotaDurationSelect" style="width: 160px;">
+	                  <option value="5">5m</option>
+	                  <option value="15">15m</option>
+	                  <option value="30">30m</option>
+	                  <option value="60" selected>1h</option>
+	                  <option value="180">3h</option>
+	                  <option value="360">6h</option>
+	                  <option value="720">12h</option>
+	                  <option value="1440">24h</option>
+	                </select>
+	                <button id="quotaApplyDisableBtn" class="danger">Offline</button>
+	                <button id="quotaApplyRecoverBtn">Recover</button>
+	                <button id="quotaApplyResetBtn">Reset</button>
+	              </div>
+                <div class="muted" style="font-size:12px; margin: -6px 0 10px;">
+                  Offline removes the provider from the route pool for the selected minutes. Recover brings it back online immediately.
+                </div>
+	              <div class="row" style="margin-bottom: 10px;">
+	                <button id="refreshQuotaBtn" class="primary">Refresh provider pool</button>
+	                <button id="refreshQuotaSnapshotBtn" class="primary">Refresh antigravity snapshot</button>
+	                <button id="resetQuotaBtn" class="danger">Reset provider-quota module</button>
+              </div>
+              <div class="table-wrap">
+                <table class="table">
+                  <thead>
+                    <tr>
+                      <th>provider</th>
+                      <th>key</th>
+                      <th>model</th>
+                      <th>inPool</th>
+                      <th>reason</th>
+                      <th>until</th>
+                      <th>errCount</th>
+                      <th></th>
+                    </tr>
+                  </thead>
+                  <tbody id="quotaTbody"></tbody>
+                </table>
+              </div>
+	              <div id="quotaOpLog" class="log" style="margin-top: 10px; display:none;"></div>
+	            </div>
+	            <div class="card" style="box-shadow:none;">
+	              <p class="section-title">Antigravity quota snapshot</p>
+	              <p class="section-sub">
+	                Snapshot fetched by <span class="mono">QuotaManagerModule</span> (antigravity quota API). Used to gate antigravity providers entering the route pool.
+	              </p>
+	              <div class="row" style="margin-bottom: 10px;">
+	                <label><input id="quotaSnapshotOnlyRoutedToggle" type="checkbox" checked /> only routed models</label>
+	                <span class="muted" style="font-size:12px;">(filters by current provider pool keys)</span>
+	              </div>
+	              <div class="table-wrap">
+	                <table class="table">
+	                  <thead>
+	                    <tr>
+	                      <th>alias</th>
+	                      <th>model</th>
+	                      <th>remaining</th>
+	                      <th>resetAt</th>
+	                      <th>fetchedAt</th>
+	                    </tr>
+	                  </thead>
+	                  <tbody id="quotaSnapshotTbody"></tbody>
+	                </table>
+	              </div>
+	              <div id="quotaSnapshotLog" class="log" style="margin-top: 10px; display:none;"></div>
+	            </div>
+	            <div class="card" style="box-shadow:none;">
+	              <p class="section-title">Notes</p>
+	              <div class="notice">
+                <div style="margin-bottom: 6px;">
+                  Use this view to confirm 429/backoff/blacklist decisions and whether a provider is currently eligible.
+	                </div>
+	                <div>
+	                  If a provider looks stuck, try <span class="mono">Reset provider-quota module</span>, then <span class="mono">Restart runtime</span>.
+	                </div>
+	              </div>
+	            </div>
+          </div>
+        </section>
+	        <section id="panelRouting" data-panel="routing" style="display:none;">
+	          <div class="grid grid-one">
+	            <div class="card" style="box-shadow:none;">
+	              <p class="section-title">Routing editor</p>
+	              <p class="section-sub">
+	                Edits routing in a selected config file (auto-detects <span class="mono">virtualrouter.routing</span> or <span class="mono">routing</span>).
+	              </p>
+	              <div class="row" style="margin-bottom: 10px;">
+	                <label for="routingSourceSelect">source</label>
+	                <select id="routingSourceSelect" style="width: 420px;"></select>
+	                <button id="refreshRoutingSourcesBtn">Refresh sources</button>
+	              </div>
+	              <div class="row" style="margin-bottom: 10px;">
+	                <label for="routingQuotaModeSelect">mode</label>
+	                <select id="routingQuotaModeSelect" style="width: 160px;">
+	                  <option value="cooldown" selected>cooldown</option>
+	                  <option value="blacklist">blacklist</option>
+	                </select>
+	                <label for="routingQuotaDurationSelect">offline time</label>
+	                <select id="routingQuotaDurationSelect" style="width: 160px;">
+	                  <option value="5">5m</option>
+	                  <option value="15">15m</option>
+	                  <option value="30">30m</option>
+	                  <option value="60" selected>1h</option>
+	                  <option value="180">3h</option>
+	                  <option value="360">6h</option>
+	                  <option value="720">12h</option>
+	                  <option value="1440">24h</option>
+	                </select>
+	              </div>
+	              <div class="row" style="margin-bottom: 10px;">
+	                <button id="loadRoutingBtn" class="primary">Load</button>
+	                <button id="saveRoutingBtn" class="primary">Save</button>
+                  <button id="refreshRoutingPoolBtn">Refresh pool status</button>
+	                <button id="routingRegExpandBtn">Expand all</button>
+	                <button id="routingRegCollapseBtn">Collapse all</button>
+                  <label style="margin-left:auto;"><input id="routingShowPathsToggle" type="checkbox" /> show debug paths</label>
+	              </div>
+	              <div id="routingOpLog" class="log" style="margin-top: 10px; display:none;"></div>
+	              <div class="muted" style="font-size:12px; margin: -4px 0 10px;">
+	                Tip: edit routing here (CRUD). For tool targets, use the inline <span class="mono">Offline/Recover</span> controls to manage runtime provider keys.
+	              </div>
+	              <div id="routingKvEditor" class="kv kv-editor"></div>
+	            </div>
+          </div>
+        </section>
+      </div>
+    </div>
+    <div id="toast" class="toast" role="status" aria-live="polite"></div>
+    <script>
+      const $ = (id) => document.getElementById(id);
+		      const UI = {
+		        selectedProviderId: "",
+		        lastUnauthorizedToastAt: 0,
+		        adminAuth: null,
+		        quotaProviders: [],
+		        quotaProvidersUpdatedAt: 0,
+		        quotaProviderMap: null,
+		        routingTargets: null,
+		        routingTargetsUpdatedAt: 0,
+		        routingSources: [],
+		        routingSourcesUpdatedAt: 0,
+		        routingLocation: "virtualrouter.routing"
+		      };
+      let toastTimer = null;
+      function toast(msg, kind = "err") {
+        const el = $("toast");
+        if (!el) return;
+        el.classList.remove("ok", "err", "show");
+        el.classList.add(kind === "ok" ? "ok" : "err");
+        el.textContent = String(msg || "");
+        el.classList.add("show");
+        if (toastTimer) clearTimeout(toastTimer);
+        toastTimer = setTimeout(() => {
+          try { el.classList.remove("show"); } catch {}
+        }, 4200);
+      }
+      function onClick(id, handler) {
+        const el = $(id);
+        if (!el) {
+          console.warn(`[daemon-admin-ui] missing #${id}`);
+          return false;
+        }
+        el.addEventListener("click", handler);
+        return true;
+      }
+      function notifyUnauthorizedOnce(context) {
+        const now = Date.now();
+        if (now - UI.lastUnauthorizedToastAt < 1800) return;
+        UI.lastUnauthorizedToastAt = now;
+        const label = context ? ` (${context})` : "";
+        toast(`Unauthorized${label}. Login required.`);
+        try { void refreshAdminAuthStatus(); } catch {}
+      }
+      function setLog(id, value) {
+        const el = $(id);
+        if (!el) return;
+        el.style.display = value ? "block" : "none";
+        const raw = value || "";
+        const max = 12000;
+        const out = raw.length > max ? raw.slice(0, max) + "\n…(truncated)" : raw;
+        el.textContent = out;
+      }
+      function getApiKey() {
+        try {
+          return sessionStorage.getItem("routecodex:apikey") || "";
+        } catch {
+          return "";
+        }
+      }
+      function setApiKey(value) {
+        try {
+          if (!value) sessionStorage.removeItem("routecodex:apikey");
+          else sessionStorage.setItem("routecodex:apikey", value);
+        } catch {}
+      }
+      async function apiFetch(path, opts = {}) {
+        const headers = new Headers(opts.headers || {});
+        if (!headers.has("content-type") && opts.body) headers.set("content-type", "application/json");
+        const res = await fetch(path, { ...opts, headers, credentials: "same-origin" });
+        const text = await res.text();
+        let json = null;
+        try {
+          json = text ? JSON.parse(text) : null;
+        } catch {
+          json = null;
+        }
+        if (!res.ok) {
+          const msg =
+            (json && json.error && (json.error.message || json.error.code)) ||
+            `HTTP ${res.status} ${res.statusText}`;
+          const err = new Error(msg);
+          err.status = res.status;
+          err.path = path;
+          err.payload = json;
+          throw err;
+        }
+        return json;
+      }
+      function selectTab(name) {
+        document.querySelectorAll(".tab").forEach((btn) => {
+          btn.classList.toggle("active", btn.getAttribute("data-tab") === name);
+        });
+        const panels = [
+          { name: "providers", el: $("panelProviders") },
+          { name: "tokens", el: $("panelTokens") },
+          { name: "credentials", el: $("panelCredentials") },
+          { name: "quota", el: $("panelQuota") },
+          { name: "routing", el: $("panelRouting") }
+        ];
+        for (const p of panels) p.el.style.display = p.name === name ? "block" : "none";
+        // Light auto-refresh on tab switch to avoid showing stale "Unauthorized" after login.
+        void maybeRefreshTab(name);
+      }
+      function getActiveTab() {
+        const active = document.querySelector(".tab.active");
+        const name = active ? active.getAttribute("data-tab") : null;
+        return name || "providers";
+      }
+      const tabLastRefreshedAt = {
+        providers: 0,
+        tokens: 0,
+        credentials: 0,
+        quota: 0,
+        routing: 0
+      };
+      async function maybeRefreshTab(name) {
+        const key = name in tabLastRefreshedAt ? name : "providers";
+        const now = Date.now();
+        if (now - tabLastRefreshedAt[key] < 1500) {
+          return;
+        }
+        tabLastRefreshedAt[key] = now;
+        try {
+          if (key === "providers") await refreshProviders();
+          else if (key === "tokens") await refreshTokens();
+          else if (key === "credentials") await refreshCredentials();
+	          else if (key === "quota") {
+	            await refreshQuota();
+	            await refreshQuotaSnapshot();
+	          }
+          else if (key === "routing") {
+            await refreshRuntimes();
+            await refreshRoutingSources();
+          }
+        } catch {
+          // ignore refresh failures on tab switch
+        }
+      }
+      function textOf(value) {
+        if (value === null || value === undefined) return "";
+        return String(value);
+      }
+      function createCell(tag, text, className, opts = {}) {
+        const el = document.createElement(tag);
+        if (className) el.className = className;
+        const s = textOf(text);
+        el.textContent = s;
+        if (opts.title && s) el.title = s;
+        return el;
+      }
+      function createErrorRow(colSpan, message) {
+        const tr = document.createElement("tr");
+        const td = document.createElement("td");
+        td.colSpan = colSpan;
+        td.className = "mono";
+        td.textContent = `Failed to load: ${textOf(message)}`;
+        tr.appendChild(td);
+        return tr;
+      }
+      function setSelectedProviderId(id) {
+        UI.selectedProviderId = textOf(id || "");
+        const tbody = $("providersTbody");
+        if (!tbody) return;
+        tbody.querySelectorAll("tr.provider-row").forEach((tr) => {
+          const pid = tr.getAttribute("data-provider-id") || "";
+          tr.classList.toggle("selected", pid && pid === UI.selectedProviderId);
+        });
+      }
+      function kvTypeMeta(value) {
+        if (value === null) return "null";
+        if (value === undefined) return "undefined";
+        if (Array.isArray(value)) return `array(${value.length})`;
+        const t = typeof value;
+        if (t === "string") return `string(${value.length})`;
+        if (t === "number") return "number";
+        if (t === "boolean") return "boolean";
+        if (t === "bigint") return "bigint";
+        if (t === "function") return "function";
+        if (t === "symbol") return "symbol";
+        if (t === "object") {
+          try {
+            const keys = Object.keys(value);
+            return `object(${keys.length})`;
+          } catch {
+            return "object";
+          }
+        }
+        return t;
+      }
+      const providerEditorState = {
+        value: {},
+        dirty: false
+      };
+      function providerEditorClone(value) {
+        try {
+          return value == null ? value : JSON.parse(JSON.stringify(value));
+        } catch {
+          return value;
+        }
+      }
+      function providerEditorSetDirty(dirty) {
+        providerEditorState.dirty = Boolean(dirty);
+        const hint = $("providerEditorDirtyHint");
+        if (hint) hint.textContent = providerEditorState.dirty ? "unsaved changes" : "";
+      }
+      function providerEditorSetValue(value) {
+        providerEditorState.value = providerEditorClone(value) || {};
+        providerEditorSetDirty(false);
+        providerEditorRender();
+      }
+      function providerEditorGetValue() {
+        return providerEditorClone(providerEditorState.value) || {};
+      }
+      function providerEditorPathToString(path) {
+        if (!path || !path.length) return "";
+        return path.map((p) => String(p)).join(".");
+      }
+      function providerEditorGetByPath(root, path) {
+        let cur = root;
+        for (const part of path || []) {
+          if (cur == null) return undefined;
+          cur = cur[part];
+        }
+        return cur;
+      }
+      function providerEditorSetByPath(root, path, nextValue) {
+        if (!root || typeof root !== "object") return;
+        if (!path || !path.length) return;
+        const last = path[path.length - 1];
+        let cur = root;
+        for (let i = 0; i < path.length - 1; i += 1) {
+          const part = path[i];
+          const existing = cur[part];
+          if (existing == null || typeof existing !== "object") cur[part] = {};
+          cur = cur[part];
+        }
+        cur[last] = nextValue;
+      }
+      function providerEditorDeleteByPath(root, path) {
+        if (!root || typeof root !== "object") return;
+        if (!path || !path.length) return;
+        const last = path[path.length - 1];
+        let cur = root;
+        for (let i = 0; i < path.length - 1; i += 1) {
+          const part = path[i];
+          if (cur == null) return;
+          cur = cur[part];
+        }
+        if (Array.isArray(cur)) {
+          const idx = Number(last);
+          if (Number.isFinite(idx) && idx >= 0 && idx < cur.length) cur.splice(idx, 1);
+          return;
+        }
+        try { delete cur[last]; } catch {}
+      }
+      function providerEditorKind(value) {
+        if (value === null) return "null";
+        if (Array.isArray(value)) return "array";
+        const t = typeof value;
+        if (t === "string") return "string";
+        if (t === "number") return "number";
+        if (t === "boolean") return "boolean";
+        if (t === "object") return "object";
+        return "string";
+      }
+      function providerEditorCoerce(kind, raw) {
+        if (kind === "null") return null;
+        if (kind === "boolean") return raw === true || raw === "true";
+        if (kind === "number") {
+          const n = typeof raw === "number" ? raw : Number.parseFloat(String(raw));
+          return Number.isFinite(n) ? n : 0;
+        }
+        if (kind === "array") return [];
+        if (kind === "object") return {};
+        return String(raw ?? "");
+      }
+      function providerEditorRender() {
+        const container = $("providerKvEditor");
+        if (!container) return;
+        try {
+          container.replaceChildren();
+        } catch {
+          try { container.innerHTML = ""; } catch {}
+        }
+        try {
+          container.appendChild(providerEditorRenderNode("provider", providerEditorState.value || {}, [], 0, true));
+        } catch (e) {
+          const msg = e && e.message ? e.message : String(e);
+          try { container.textContent = `Render failed: ${msg}`; } catch {}
+        }
+      }
+      function providerEditorRenderNode(label, value, path, depth, isRoot = false) {
+        const isObj = value !== null && typeof value === "object";
+        const isArr = Array.isArray(value);
+        const kind = providerEditorKind(value);
+        if (!isObj) {
+          const row = document.createElement("div");
+          row.className = "kv-leaf";
+          const keyEl = document.createElement("div");
+          keyEl.className = "kv-key";
+          keyEl.textContent = label;
+          const typeSel = document.createElement("select");
+          typeSel.className = "kv-type";
+          typeSel.innerHTML = [
+            "<option value=\"string\">string</option>",
+            "<option value=\"number\">number</option>",
+            "<option value=\"boolean\">boolean</option>",
+            "<option value=\"null\">null</option>",
+            "<option value=\"object\">object</option>",
+            "<option value=\"array\">array</option>"
+          ].join("");
+          typeSel.value = kind;
+          typeSel.addEventListener("click", (e) => e.stopPropagation());
+          typeSel.addEventListener("change", () => {
+            const root = providerEditorState.value || {};
+            providerEditorSetByPath(root, path, providerEditorCoerce(typeSel.value, ""));
+            providerEditorSetDirty(true);
+            providerEditorRender();
+          });
+          const valWrap = document.createElement("div");
+          valWrap.className = "kv-val";
+          if (kind === "boolean") {
+            const sel = document.createElement("select");
+            sel.innerHTML = `<option value="true">true</option><option value="false">false</option>`;
+            sel.value = value ? "true" : "false";
+            sel.addEventListener("click", (e) => e.stopPropagation());
+            sel.addEventListener("change", () => {
+              const root = providerEditorState.value || {};
+              providerEditorSetByPath(root, path, sel.value === "true");
+              providerEditorSetDirty(true);
+              providerEditorRender();
+            });
+            valWrap.appendChild(sel);
+          } else if (kind === "number") {
+            const inp = document.createElement("input");
+            inp.type = "number";
+            inp.value = String(value);
+            inp.addEventListener("click", (e) => e.stopPropagation());
+            inp.addEventListener("change", () => {
+              const root = providerEditorState.value || {};
+              const n = Number.parseFloat(inp.value);
+              providerEditorSetByPath(root, path, Number.isFinite(n) ? n : 0);
+              providerEditorSetDirty(true);
+              providerEditorRender();
+            });
+            valWrap.appendChild(inp);
+          } else if (kind === "null") {
+            const span = document.createElement("span");
+            span.className = "mono";
+            span.textContent = "null";
+            valWrap.appendChild(span);
+          } else {
+            const inp = document.createElement("input");
+            inp.type = "text";
+            inp.value = value == null ? "" : String(value);
+            inp.addEventListener("click", (e) => e.stopPropagation());
+            inp.addEventListener("change", () => {
+              const root = providerEditorState.value || {};
+              providerEditorSetByPath(root, path, String(inp.value));
+              providerEditorSetDirty(true);
+              providerEditorRender();
+            });
+            valWrap.appendChild(inp);
+          }
+          const actions = document.createElement("div");
+          actions.className = "kv-actions";
+          if (!isRoot) {
+            const del = document.createElement("button");
+            del.textContent = "Del";
+            del.className = "danger";
+            del.addEventListener("click", (e) => {
+              e.preventDefault();
+              e.stopPropagation();
+              const root = providerEditorState.value || {};
+              providerEditorDeleteByPath(root, path);
+              providerEditorSetDirty(true);
+              providerEditorRender();
+            });
+            actions.appendChild(del);
+          }
+          const pathEl = document.createElement("span");
+          pathEl.className = "kv-path mono";
+          pathEl.textContent = providerEditorPathToString(path);
+          actions.appendChild(pathEl);
+          row.appendChild(keyEl);
+          row.appendChild(typeSel);
+          row.appendChild(valWrap);
+          row.appendChild(actions);
+          return row;
+        }
+        const details = document.createElement("details");
+        details.open = isRoot || depth < 1;
+        const summary = document.createElement("summary");
+        const keyEl = document.createElement("div");
+        keyEl.className = "kv-key";
+        keyEl.textContent = label;
+        const metaEl = document.createElement("div");
+        metaEl.className = "kv-meta";
+        metaEl.textContent = kvTypeMeta(value);
+        const actions = document.createElement("div");
+        actions.className = "kv-actions";
+        if (isArr) {
+          const add = document.createElement("button");
+          add.textContent = "+Item";
+          add.addEventListener("click", (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+            const t = (prompt("Item type: string/number/boolean/null/object/array", "string") || "string").trim().toLowerCase();
+            const k = ["string","number","boolean","null","object","array"].includes(t) ? t : "string";
+            let init = "";
+            if (k === "boolean") init = prompt("Value: true/false", "false") || "false";
+            else if (k === "number") init = prompt("Value (number)", "0") || "0";
+            else if (k === "string") init = prompt("Value (string)", "") || "";
+            const v = providerEditorCoerce(k, k === "boolean" ? init === "true" : init);
+            const root = providerEditorState.value || {};
+            const arr = providerEditorGetByPath(root, path);
+            if (Array.isArray(arr)) {
+              arr.push(v);
+              providerEditorSetDirty(true);
+              providerEditorRender();
+            }
+          });
+          actions.appendChild(add);
+        } else {
+          const add = document.createElement("button");
+          add.textContent = "+Key";
+          add.addEventListener("click", (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+            const name = (prompt("Key name", "") || "").trim();
+            if (!name) return;
+            const t = (prompt("Value type: string/number/boolean/null/object/array", "string") || "string").trim().toLowerCase();
+            const k = ["string","number","boolean","null","object","array"].includes(t) ? t : "string";
+            let init = "";
+            if (k === "boolean") init = prompt("Value: true/false", "false") || "false";
+            else if (k === "number") init = prompt("Value (number)", "0") || "0";
+            else if (k === "string") init = prompt("Value (string)", "") || "";
+            const v = providerEditorCoerce(k, k === "boolean" ? init === "true" : init);
+            const root = providerEditorState.value || {};
+            const obj = providerEditorGetByPath(root, path);
+            if (obj && typeof obj === "object" && !Array.isArray(obj)) {
+              obj[name] = v;
+              providerEditorSetDirty(true);
+              providerEditorRender();
+            }
+          });
+          actions.appendChild(add);
+        }
+        if (!isRoot) {
+          const del = document.createElement("button");
+          del.textContent = "Del";
+          del.className = "danger";
+          del.addEventListener("click", (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+            const root = providerEditorState.value || {};
+            providerEditorDeleteByPath(root, path);
+            providerEditorSetDirty(true);
+            providerEditorRender();
+          });
+          actions.appendChild(del);
+        }
+        const pathEl = document.createElement("span");
+        pathEl.className = "kv-path mono";
+        pathEl.textContent = providerEditorPathToString(path);
+        actions.appendChild(pathEl);
+        summary.appendChild(keyEl);
+        summary.appendChild(metaEl);
+        summary.appendChild(actions);
+        details.appendChild(summary);
+        if (isArr) {
+          for (let i = 0; i < value.length; i += 1) {
+            details.appendChild(providerEditorRenderNode(String(i), value[i], path.concat([i]), depth + 1));
+          }
+          return details;
+        }
+        let keys = [];
+        try {
+          keys = Object.keys(value);
+          keys.sort((a, b) => a.localeCompare(b));
+        } catch {
+          keys = [];
+        }
+        for (const childKey of keys) {
+          details.appendChild(providerEditorRenderNode(childKey, value[childKey], path.concat([childKey]), depth + 1));
+        }
+        return details;
+      }
+      function providerEditorSetAuthApiKey(secretRef) {
+        const ref = textOf(secretRef).trim();
+        if (!ref) return;
+        const root = providerEditorState.value || {};
+        if (!root.auth || typeof root.auth !== "object" || Array.isArray(root.auth)) root.auth = {};
+        root.auth.type = "apikey";
+        root.auth.apiKey = ref;
+        providerEditorSetDirty(true);
+        providerEditorRender();
+      }
+      function kvPreview(value) {
+        if (value === null || value === undefined) return String(value);
+        const t = typeof value;
+        if (t === "string") {
+          const max = 140;
+          const s = value.length > max ? value.slice(0, max) + "…" : value;
+          return JSON.stringify(s);
+        }
+        if (t === "number" || t === "boolean" || t === "bigint") return String(value);
+        if (Array.isArray(value)) return "";
+        if (t === "object") return "";
+        return String(value);
+      }
+      function renderRegistry(container, value, opts = {}) {
+        if (!container) return;
+        container.replaceChildren();
+        const rootLabel = (opts.rootLabel || "root").trim() || "root";
+        try {
+          container.appendChild(renderRegistryNode(rootLabel, value, 0, true));
+        } catch (e) {
+          const box = document.createElement("div");
+          box.className = "mono";
+          box.textContent = `Render failed: ${e && e.message ? e.message : String(e)}`;
+          container.appendChild(box);
+        }
+      }
+      function renderRegistryNode(key, value, depth, isRoot = false) {
+        const isObj = value !== null && typeof value === "object";
+        const isArr = Array.isArray(value);
+        if (!isObj) {
+          const row = document.createElement("div");
+          row.className = "kv-leaf";
+          const k = document.createElement("div");
+          k.className = "kv-key";
+          k.textContent = key;
+          const v = document.createElement("div");
+          v.className = "kv-val";
+          v.textContent = kvPreview(value);
+          row.appendChild(k);
+          row.appendChild(v);
+          return row;
+        }
+        const details = document.createElement("details");
+        details.open = isRoot || depth < 1;
+        const summary = document.createElement("summary");
+        const k = document.createElement("div");
+        k.className = "kv-key";
+        k.textContent = key;
+        const m = document.createElement("div");
+        m.className = "kv-meta";
+        const meta = kvTypeMeta(value);
+        const preview = kvPreview(value);
+        m.textContent = preview ? `${meta}  ${preview}` : meta;
+        summary.appendChild(k);
+        summary.appendChild(m);
+        details.appendChild(summary);
+        if (isArr) {
+          for (let i = 0; i < value.length; i += 1) {
+            details.appendChild(renderRegistryNode(String(i), value[i], depth + 1));
+          }
+          return details;
+        }
+        let keys = [];
+        try {
+          keys = Object.keys(value);
+          keys.sort((a, b) => a.localeCompare(b));
+        } catch {
+          keys = [];
+        }
+        for (const childKey of keys) {
+          let childValue;
+          try {
+            childValue = value[childKey];
+          } catch (e) {
+            childValue = `[[unreadable: ${e && e.message ? e.message : String(e)}]]`;
+          }
+          details.appendChild(renderRegistryNode(childKey, childValue, depth + 1));
+        }
+        return details;
+      }
+      function setAllDetailsOpen(container, open, keepRootOpen = true) {
+        if (!container) return;
+        const nodes = Array.from(container.querySelectorAll("details"));
+        nodes.forEach((d, idx) => {
+          d.open = open || (keepRootOpen && idx === 0);
+        });
+      }
+      function presetFor(type) {
+        if (type === "responses") {
+          return {
+            enabled: true,
+            type: "responses",
+            baseURL: "https://api.openai.com/v1",
+            auth: { type: "apikey", apiKey: "authfile-REPLACE_ME" },
+            responses: { process: "chat", streaming: "always" },
+            config: { responses: { process: "chat", streaming: "always" } },
+            models: {}
+          };
+        }
+        if (type === "openai") {
+          return {
+            enabled: true,
+            type: "openai",
+            baseURL: "https://api.openai.com/v1",
+            auth: { type: "apikey", apiKey: "authfile-REPLACE_ME" },
+            models: {}
+          };
+        }
+        if (type === "openai-standard") {
+          return {
+            enabled: true,
+            type: "openai-standard",
+            baseURL: "https://api.openai.com/v1",
+            auth: { type: "apikey", apiKey: "authfile-REPLACE_ME" },
+            models: {}
+          };
+        }
+        if (type === "iflow") {
+          return {
+            enabled: true,
+            type: "iflow",
+            baseURL: "https://apis.iflow.cn/v1",
+            compatibilityProfile: "chat:iflow",
+            auth: { type: "iflow-cookie", cookieFile: "~/.routecodex/auth/iflow-work.cookie" },
+            models: {}
+          };
+        }
+        return {
+          enabled: true,
+          type: "responses",
+          baseURL: "",
+          auth: { type: "apikey", apiKey: "authfile-REPLACE_ME" },
+          models: {}
+        };
+      }
+      async function refreshStatus() {
+        try {
+          const data = await apiFetch("/daemon/status");
+          $("serverId").textContent = `serverId: ${data.serverId || "—"}`;
+          $("statusText").textContent = "connected";
+          $("statusDot").classList.add("ok");
+          $("statusDot").classList.remove("err");
+        } catch (e) {
+          $("statusText").textContent = e && e.status === 401 ? "401 (set API key above)" : "disconnected";
+          $("statusDot").classList.remove("ok");
+          $("statusDot").classList.add("err");
+        }
+      }
+      async function refreshProviders() {
+        const body = $("providersTbody");
+        body.replaceChildren();
+        try {
+          const data = await apiFetch("/config/providers");
+          const list = Array.isArray(data.providers) ? data.providers : [];
+          const grouped = new Map();
+          for (const p of list) {
+            const t = textOf(p.type || "unknown") || "unknown";
+            if (!grouped.has(t)) grouped.set(t, []);
+            grouped.get(t).push(p);
+          }
+          const types = Array.from(grouped.keys()).sort((a, b) => a.localeCompare(b));
+          for (const type of types) {
+            const groupRow = document.createElement("tr");
+            groupRow.className = "group-row";
+            const groupCell = document.createElement("td");
+            groupCell.colSpan = 8;
+            groupCell.textContent = `${type} (${grouped.get(type).length})`;
+            groupRow.appendChild(groupCell);
+            body.appendChild(groupRow);
+            const items = grouped.get(type);
+            items.sort((a, b) => textOf(a.id).localeCompare(textOf(b.id)));
+            for (const p of items) {
+              const pid = textOf(p.id);
+              const tr = document.createElement("tr");
+              tr.className = "provider-row";
+              tr.setAttribute("data-provider-id", pid);
+              if (pid && pid === UI.selectedProviderId) tr.classList.add("selected");
+              tr.appendChild(createCell("td", pid || "", "mono indent"));
+              tr.appendChild(createCell("td", p.type || "", ""));
+              tr.appendChild(createCell("td", String(Boolean(p.enabled)), ""));
+              tr.appendChild(createCell("td", p.baseURL || "", "mono truncate", { title: true }));
+              const preview = Array.isArray(p.modelsPreview) ? p.modelsPreview.map((x) => textOf(x)).filter(Boolean) : [];
+              const modelSummary = preview.length ? `${p.modelCount || 0}: ${preview.join(", ")}${(p.modelCount || 0) > preview.length ? ", …" : ""}` : String(p.modelCount || 0);
+              tr.appendChild(createCell("td", modelSummary, "mono truncate", { title: true }));
+              tr.appendChild(createCell("td", p.compatibilityProfile || "", "mono truncate", { title: true }));
+              tr.appendChild(createCell("td", p.authType || "", ""));
+              const actionsTd = document.createElement("td");
+              actionsTd.className = "actions-cell";
+              const box = document.createElement("div");
+              box.className = "actions";
+              const edit = document.createElement("button");
+              edit.textContent = "Edit";
+              edit.setAttribute("data-action", "edit");
+              edit.setAttribute("data-id", textOf(p.id));
+              const test = document.createElement("button");
+              test.textContent = "Test";
+              test.setAttribute("data-action", "test");
+              test.setAttribute("data-id", textOf(p.id));
+              test.disabled = !(p && p.enabled !== false && Number(p.modelCount || 0) > 0);
+              const del = document.createElement("button");
+              del.textContent = "Delete";
+              del.className = "danger";
+              del.setAttribute("data-action", "delete");
+              del.setAttribute("data-id", textOf(p.id));
+              box.appendChild(edit);
+              box.appendChild(test);
+              box.appendChild(del);
+              actionsTd.appendChild(box);
+              tr.appendChild(actionsTd);
+              body.appendChild(tr);
+            }
+          }
+        } catch (e) {
+          if (e && e.status === 401) notifyUnauthorizedOnce("providers");
+          body.appendChild(createErrorRow(8, e && e.message ? e.message : e));
+        }
+      }
+      async function loadProvider(id) {
+        setLog("providerOpLog", "");
+        setSelectedProviderId(id);
+        try {
+          const data = await apiFetch(`/config/providers/${encodeURIComponent(id)}`);
+          $("providerIdInput").value = id;
+          providerEditorSetValue(data.provider || {});
+          $("providerEditorTitle").textContent = `Provider editor: ${id}`;
+        } catch (e) {
+          if (e && e.status === 401) notifyUnauthorizedOnce("provider load");
+          setLog("providerOpLog", `Load failed: ${e.message}`);
+          toast(`Load failed: ${e.message}`);
+        }
+      }
+      async function saveProvider() {
+        setLog("providerOpLog", "");
+        const id = ($("providerIdInput").value || "").trim();
+        if (!id) {
+          setLog("providerOpLog", "provider id is required");
+          toast("provider id is required");
+          return;
+        }
+        try {
+          const provider = providerEditorGetValue() || {};
+          if (provider && typeof provider === "object") provider.id = id;
+          const result = await apiFetch(`/config/providers/${encodeURIComponent(id)}`, {
+            method: "PUT",
+            body: JSON.stringify({ provider })
+          });
+          setLog("providerOpLog", `Saved. Path: ${result.path || "—"}\nRestart required to apply.`);
+          toast("Provider saved.", "ok");
+          providerEditorSetDirty(false);
+          await refreshProviders();
+        } catch (e) {
+          if (e && e.status === 401) notifyUnauthorizedOnce("provider save");
+          setLog("providerOpLog", `Save failed: ${e.message}`);
+          toast(`Save failed: ${e.message}`);
+        }
+      }
+      async function deleteProvider(id) {
+        setLog("providerOpLog", "");
+        if (!id) {
+          setLog("providerOpLog", "provider id is required");
+          toast("provider id is required");
+          return;
+        }
+        if (!confirm(`Delete provider "${id}" from user config?`)) return;
+        try {
+          const result = await apiFetch(`/config/providers/${encodeURIComponent(id)}`, { method: "DELETE" });
+          setLog("providerOpLog", `Deleted. Path: ${result.path || "—"}\nRestart required to apply.`);
+          toast("Provider deleted.", "ok");
+          await refreshProviders();
+        } catch (e) {
+          if (e && e.status === 401) notifyUnauthorizedOnce("provider delete");
+          setLog("providerOpLog", `Delete failed: ${e.message}`);
+          toast(`Delete failed: ${e.message}`);
+        }
+      }
+      async function createApiKeyCredential() {
+        setLog("providerOpLog", "");
+        $("apikeySecretRefOut").textContent = "";
+        const provider = ($("providerIdInput").value || "").trim();
+        const alias = ($("apikeyAliasInput").value || "default").trim() || "default";
+        const apiKey = ($("apikeyValueInput").value || "").trim();
+        if (!provider) {
+          setLog("providerOpLog", "provider id is required before creating an authfile");
+          return null;
+        }
+        if (!apiKey) {
+          setLog("providerOpLog", "apiKey is required");
+          return null;
+        }
+        try {
+          const out = await apiFetch("/daemon/credentials/apikey", {
+            method: "POST",
+            body: JSON.stringify({ provider, alias, apiKey })
+          });
+          $("apikeySecretRefOut").textContent = `secretRef: ${out.secretRef}`;
+          return out.secretRef;
+        } catch (e) {
+          if (e && e.status === 401) notifyUnauthorizedOnce("authfile create");
+          setLog("providerOpLog", `Create authfile failed: ${e.message}`);
+          toast(`Create authfile failed: ${e.message}`);
+          return null;
+        }
+      }
+      function applyPresetToEditor() {
+        const preset = $("providerPreset").value;
+        const base = presetFor(preset);
+        const authMode = $("authMode").value;
+        if (authMode === "none") {
+          delete base.auth;
+        }
+        if (authMode === "cookie") {
+          base.auth = {
+            type: "iflow-cookie",
+            cookieFile: ($("cookieFileInput").value || "").trim() || "~/.routecodex/auth/iflow.cookie"
+          };
+        }
+        if (authMode === "oauth") {
+          const t = ($("oauthTypeInput").value || "").trim() || "qwen-oauth";
+          const alias = ($("oauthAliasInput").value || "default").trim() || "default";
+          base.auth = { type: t, tokenFile: alias };
+        }
+        if (authMode === "apikey") {
+          const secretRef = ($("apikeySecretRefOut").textContent || "").replace(/^secretRef:\\s*/i, "").trim();
+          base.auth = { type: "apikey", apiKey: secretRef || "authfile-REPLACE_ME" };
+        }
+        providerEditorSetValue(base);
+        providerEditorSetDirty(true);
+      }
+      function updateAuthModeUi() {
+        const mode = $("authMode").value;
+        $("authApikeyBox").style.display = mode === "apikey" ? "block" : "none";
+        $("authOauthBox").style.display = mode === "oauth" ? "block" : "none";
+        $("authCookieBox").style.display = mode === "cookie" ? "block" : "none";
+      }
+      async function refreshCredentials() {
+        const body = $("credentialsTbody");
+        body.replaceChildren();
+        try {
+          const items = await apiFetch("/daemon/credentials");
+          for (const c of items || []) {
+            const tr = document.createElement("tr");
+            const exp = c.expiresInSec == null ? "—" : `${c.expiresInSec}s`;
+            tr.appendChild(createCell("td", c.kind || "", ""));
+            tr.appendChild(createCell("td", c.provider || "", "mono"));
+            tr.appendChild(createCell("td", c.alias || "", "mono"));
+            tr.appendChild(createCell("td", c.status || "", ""));
+            tr.appendChild(createCell("td", exp, "mono"));
+            tr.appendChild(createCell("td", c.secretRef || "—", "mono"));
+            body.appendChild(tr);
+          }
+        } catch (e) {
+          body.appendChild(createErrorRow(6, e && e.message ? e.message : e));
+        }
+      }
+      async function loadSettings() {
+        try {
+          const data = await apiFetch("/config/settings");
+          const v = (data.oauthBrowser || "default").toLowerCase();
+          $("oauthBrowserSelect").value = v === "camoufox" ? "camoufox" : "default";
+        } catch {}
+      }
+      async function saveSettings() {
+        setLog("credentialOpLog", "");
+        const oauthBrowser = $("oauthBrowserSelect").value;
+        try {
+          const out = await apiFetch("/config/settings", {
+            method: "PUT",
+            body: JSON.stringify({ oauthBrowser })
+          });
+          setLog("credentialOpLog", `Saved oauthBrowser=${out.oauthBrowser}.`);
+        } catch (e) {
+          setLog("credentialOpLog", `Save failed: ${e.message}`);
+        }
+      }
+	      async function authorizeOauth() {
+	        setLog("credentialOpLog", "");
+	        const provider = $("oauthProviderSelect").value;
+	        const alias = ($("oauthAuthAliasInput").value || "default").trim() || "default";
+	        const openBrowser = $("oauthOpenBrowser").checked;
+	        const forceReauthorize = $("oauthForceReauth").checked;
+	        try {
+	          const out = await apiFetch("/daemon/oauth/authorize", {
+	            method: "POST",
+	            body: JSON.stringify({ provider, alias, openBrowser, forceReauthorize })
+	          });
+	          setLog("credentialOpLog", `OK. tokenFile: ${out.tokenFile || "—"}`);
+	          await refreshCredentials();
+	        } catch (e) {
+	          setLog("credentialOpLog", `Authorize failed: ${e.message}`);
+	        }
+	      }
+	      const routingEditorState = {
+	        value: {},
+	        dirty: false
+	      };
+	      function routingEditorClone(value) {
+	        try {
+	          return value == null ? value : JSON.parse(JSON.stringify(value));
+	        } catch {
+	          return value;
+	        }
+	      }
+	      function routingEditorSetDirty(dirty) {
+	        routingEditorState.dirty = Boolean(dirty);
+	      }
+	      function routingEditorSetValue(value) {
+	        routingEditorState.value = routingEditorClone(value) || {};
+	        routingEditorSetDirty(false);
+	        routingEditorRender();
+	      }
+	      function routingEditorGetValue() {
+	        return routingEditorClone(routingEditorState.value) || {};
+	      }
+	      function routingEditorPathToString(path) {
+	        if (!path || !path.length) return "";
+	        return path.map((p) => String(p)).join(".");
+	      }
+	      function routingEditorGetByPath(root, path) {
+	        let cur = root;
+	        for (const part of path || []) {
+	          if (cur == null) return undefined;
+	          cur = cur[part];
+	        }
+	        return cur;
+	      }
+	      function routingEditorSetByPath(root, path, nextValue) {
+	        if (!root || typeof root !== "object") return;
+	        if (!path || !path.length) return;
+	        const last = path[path.length - 1];
+	        let cur = root;
+	        for (let i = 0; i < path.length - 1; i += 1) {
+	          const part = path[i];
+	          const existing = cur[part];
+	          if (existing == null || typeof existing !== "object") cur[part] = {};
+	          cur = cur[part];
+	        }
+	        cur[last] = nextValue;
+	      }
+	      function routingEditorDeleteByPath(root, path) {
+	        if (!root || typeof root !== "object") return;
+	        if (!path || !path.length) return;
+	        const last = path[path.length - 1];
+	        let cur = root;
+	        for (let i = 0; i < path.length - 1; i += 1) {
+	          const part = path[i];
+	          if (cur == null) return;
+	          cur = cur[part];
+	        }
+	        if (Array.isArray(cur)) {
+	          const idx = Number(last);
+	          if (Number.isFinite(idx) && idx >= 0 && idx < cur.length) cur.splice(idx, 1);
+	          return;
+	        }
+	        try { delete cur[last]; } catch {}
+	      }
+	      function routingEditorKind(value) {
+	        if (value === null) return "null";
+	        if (Array.isArray(value)) return "array";
+	        const t = typeof value;
+	        if (t === "string") return "string";
+	        if (t === "number") return "number";
+	        if (t === "boolean") return "boolean";
+	        if (t === "object") return "object";
+	        return "string";
+	      }
+	      function routingEditorCoerce(kind, raw) {
+	        if (kind === "null") return null;
+	        if (kind === "boolean") return raw === true || raw === "true";
+	        if (kind === "number") {
+	          const n = typeof raw === "number" ? raw : Number.parseFloat(String(raw));
+	          return Number.isFinite(n) ? n : 0;
+	        }
+	        if (kind === "array") return [];
+	        if (kind === "object") return {};
+	        return String(raw ?? "");
+	      }
+	      function looksLikeRoutingTargetString(path, value) {
+	        const s = textOf(value).trim();
+	        if (!s) return false;
+	        if (s.length > 320) return false;
+	        if (s.includes(" ")) return false;
+	        if (!s.includes(".")) return false;
+	        const root = routingEditorState.value || {};
+	        const parentPath = path.slice(0, -1);
+	        const parent = routingEditorGetByPath(root, parentPath);
+	        const parentKey = path.length >= 2 ? path[path.length - 2] : null;
+	        if (parentKey === "targets") return true;
+	        if (Array.isArray(parent) && path.length === 2 && typeof path[0] === "string") return true;
+	        return false;
+	      }
+	      function resolveTargetToProviderKeys(target) {
+	        const raw = textOf(target).trim();
+	        if (!raw) return [];
+	        const list = Array.isArray(UI.quotaProviders) ? UI.quotaProviders : [];
+	        const keys = list.map((p) => textOf(p && p.providerKey ? p.providerKey : "")).filter(Boolean);
+	        const known = new Set(keys);
+	        if (known.has(raw)) return [raw];
+	        const dot = raw.indexOf(".");
+	        if (dot <= 0) return [];
+	        const providerId = raw.slice(0, dot);
+	        const modelId = raw.slice(dot + 1);
+	        if (!providerId || !modelId) return [];
+	        const prefix = `${providerId}.`;
+	        const suffix = `.${modelId}`;
+	        const out = [];
+	        for (const k of keys) {
+	          if (k.startsWith(prefix) && k.endsWith(suffix)) out.push(k);
+	        }
+	        out.sort((a, b) => a.localeCompare(b));
+	        return out;
+	      }
+	      function getQuotaStateByProviderKey(providerKey) {
+	        const map = UI.quotaProviderMap instanceof Map ? UI.quotaProviderMap : null;
+	        if (map && map.has(providerKey)) return map.get(providerKey);
+	        const list = Array.isArray(UI.quotaProviders) ? UI.quotaProviders : [];
+	        return list.find((p) => textOf(p && p.providerKey ? p.providerKey : "") === providerKey) || null;
+	      }
+	      async function routingQuotaAction(kind, providerKey) {
+	        if (!providerKey) return;
+	        if (!UI.adminAuth || !UI.adminAuth.authenticated) {
+	          notifyUnauthorizedOnce("routing quota action");
+	          return;
+	        }
+	        try {
+	          if (kind === "recover") {
+	            await apiFetch(`/quota/providers/${encodeURIComponent(providerKey)}/recover`, { method: "POST" });
+	          } else if (kind === "disable") {
+	            const minutes = Number.parseFloat(textOf($("routingQuotaDurationSelect").value || "60"));
+	            if (!Number.isFinite(minutes) || minutes <= 0) throw new Error("Invalid minutes");
+	            const modeRaw = (textOf($("routingQuotaModeSelect").value) || "cooldown").trim().toLowerCase();
+	            const mode = modeRaw === "blacklist" ? "blacklist" : "cooldown";
+	            await apiFetch(`/quota/providers/${encodeURIComponent(providerKey)}/disable`, {
+	              method: "POST",
+	              body: JSON.stringify({ mode, durationMinutes: minutes })
+	            });
+	          } else {
+	            return;
+	          }
+	          await refreshRuntimes();
+	          routingEditorRender();
+	        } catch (e) {
+	          if (e && e.status === 401) notifyUnauthorizedOnce("routing quota action");
+	          toast(`Action failed: ${e && e.message ? e.message : String(e)}`);
+	        }
+	      }
+	      function routingEditorRenderTargetActions(target) {
+	        const providerKeys = resolveTargetToProviderKeys(target);
+	        if (!providerKeys.length) return null;
+	        const box = document.createElement("div");
+	        box.className = "routing-target-actions";
+	        for (const providerKey of providerKeys) {
+	          const row = document.createElement("div");
+	          row.className = "routing-target-row";
+	          const key = document.createElement("span");
+	          key.className = "routing-target-key mono";
+	          key.textContent = providerKey;
+	          const state = getQuotaStateByProviderKey(providerKey);
+	          const inPool = state ? Boolean(state.inPool) : null;
+	          const untilMs = state ? Math.max(Number(state.blacklistUntil || 0), Number(state.cooldownUntil || 0)) : 0;
+	          const meta = document.createElement("span");
+	          meta.className = "routing-target-meta";
+	          meta.textContent =
+	            inPool === null
+	              ? "unknown"
+	              : inPool
+	                ? "online"
+	                : untilMs
+	                  ? `offline ${formatEpochWithDelta(untilMs)}`
+	                  : "offline";
+	          const offBtn = document.createElement("button");
+	          offBtn.textContent = "Offline";
+	          offBtn.className = "danger";
+	          offBtn.addEventListener("click", (e) => {
+	            e.preventDefault();
+	            e.stopPropagation();
+	            void routingQuotaAction("disable", providerKey);
+	          });
+	          const recBtn = document.createElement("button");
+	          recBtn.textContent = "Recover";
+	          recBtn.addEventListener("click", (e) => {
+	            e.preventDefault();
+	            e.stopPropagation();
+	            void routingQuotaAction("recover", providerKey);
+	          });
+	          row.appendChild(key);
+	          row.appendChild(meta);
+	          row.appendChild(offBtn);
+	          row.appendChild(recBtn);
+	          box.appendChild(row);
+	        }
+	        return box;
+	      }
+	      function routingEditorRender() {
+	        const container = $("routingKvEditor");
+	        if (!container) return;
+	        try {
+	          container.replaceChildren();
+	        } catch {
+	          try { container.innerHTML = ""; } catch {}
+	        }
+	        try {
+	          container.appendChild(routingEditorRenderNode("routing", routingEditorState.value || {}, [], 0, true));
+	        } catch (e) {
+	          const msg = e && e.message ? e.message : String(e);
+	          try { container.textContent = `Render failed: ${msg}`; } catch {}
+	        }
+	      }
+	      function routingEditorRenderNode(label, value, path, depth, isRoot = false) {
+	        const isObj = value !== null && typeof value === "object";
+	        const isArr = Array.isArray(value);
+	        const kind = routingEditorKind(value);
+	        if (!isObj) {
+	          const row = document.createElement("div");
+	          row.className = "kv-leaf";
+	          const keyEl = document.createElement("div");
+	          keyEl.className = "kv-key";
+	          keyEl.textContent = label;
+	          const typeSel = document.createElement("select");
+	          typeSel.className = "kv-type";
+	          typeSel.innerHTML = [
+	            "<option value=\"string\">string</option>",
+	            "<option value=\"number\">number</option>",
+	            "<option value=\"boolean\">boolean</option>",
+	            "<option value=\"null\">null</option>",
+	            "<option value=\"object\">object</option>",
+	            "<option value=\"array\">array</option>"
+	          ].join("");
+	          typeSel.value = kind;
+	          typeSel.addEventListener("click", (e) => e.stopPropagation());
+	          typeSel.addEventListener("change", () => {
+	            const root = routingEditorState.value || {};
+	            routingEditorSetByPath(root, path, routingEditorCoerce(typeSel.value, ""));
+	            routingEditorSetDirty(true);
+	            routingEditorRender();
+	          });
+	          const valWrap = document.createElement("div");
+	          valWrap.className = "kv-val";
+	          if (kind === "boolean") {
+	            const sel = document.createElement("select");
+	            sel.innerHTML = `<option value="true">true</option><option value="false">false</option>`;
+	            sel.value = value ? "true" : "false";
+	            sel.addEventListener("click", (e) => e.stopPropagation());
+	            sel.addEventListener("change", () => {
+	              const root = routingEditorState.value || {};
+	              routingEditorSetByPath(root, path, sel.value === "true");
+	              routingEditorSetDirty(true);
+	              routingEditorRender();
+	            });
+	            valWrap.appendChild(sel);
+	          } else if (kind === "number") {
+	            const inp = document.createElement("input");
+	            inp.type = "number";
+	            inp.value = String(value);
+	            inp.addEventListener("click", (e) => e.stopPropagation());
+	            inp.addEventListener("change", () => {
+	              const root = routingEditorState.value || {};
+	              const n = Number.parseFloat(inp.value);
+	              routingEditorSetByPath(root, path, Number.isFinite(n) ? n : 0);
+	              routingEditorSetDirty(true);
+	              routingEditorRender();
+	            });
+	            valWrap.appendChild(inp);
+	          } else if (kind === "null") {
+	            const span = document.createElement("span");
+	            span.className = "mono";
+	            span.textContent = "null";
+	            valWrap.appendChild(span);
+	          } else {
+	            const inp = document.createElement("input");
+	            inp.type = "text";
+	            inp.value = value == null ? "" : String(value);
+	            inp.addEventListener("click", (e) => e.stopPropagation());
+	            inp.addEventListener("change", () => {
+	              const root = routingEditorState.value || {};
+	              routingEditorSetByPath(root, path, String(inp.value));
+	              routingEditorSetDirty(true);
+	              routingEditorRender();
+	            });
+	            valWrap.appendChild(inp);
+	            if (looksLikeRoutingTargetString(path, value)) {
+	              const widget = routingEditorRenderTargetActions(inp.value);
+	              if (widget) valWrap.appendChild(widget);
+	            }
+	          }
+	          const actions = document.createElement("div");
+	          actions.className = "kv-actions";
+	          if (!isRoot) {
+	            const del = document.createElement("button");
+	            del.textContent = "Del";
+	            del.className = "danger";
+	            del.addEventListener("click", (e) => {
+	              e.preventDefault();
+	              e.stopPropagation();
+	              const root = routingEditorState.value || {};
+	              routingEditorDeleteByPath(root, path);
+	              routingEditorSetDirty(true);
+	              routingEditorRender();
+	            });
+	            actions.appendChild(del);
+	          }
+	          const pathEl = document.createElement("span");
+	          pathEl.className = "kv-path mono";
+	          pathEl.textContent = routingEditorPathToString(path);
+	          actions.appendChild(pathEl);
+	          row.appendChild(keyEl);
+	          row.appendChild(typeSel);
+	          row.appendChild(valWrap);
+	          row.appendChild(actions);
+	          return row;
+	        }
+	        const details = document.createElement("details");
+	        details.open = isRoot || depth < 1;
+	        const summary = document.createElement("summary");
+	        const keyEl = document.createElement("div");
+	        keyEl.className = "kv-key";
+	        keyEl.textContent = label;
+	        const metaEl = document.createElement("div");
+	        metaEl.className = "kv-meta";
+	        metaEl.textContent = kvTypeMeta(value);
+	        const actions = document.createElement("div");
+	        actions.className = "kv-actions";
+	        if (isArr) {
+	          const add = document.createElement("button");
+	          add.textContent = "+Item";
+	          add.addEventListener("click", (e) => {
+	            e.preventDefault();
+	            e.stopPropagation();
+	            const t = (prompt("Item type: string/number/boolean/null/object/array", "string") || "string").trim().toLowerCase();
+	            const k = ["string","number","boolean","null","object","array"].includes(t) ? t : "string";
+	            let init = "";
+	            if (k === "boolean") init = prompt("Value: true/false", "false") || "false";
+	            else if (k === "number") init = prompt("Value (number)", "0") || "0";
+	            else if (k === "string") init = prompt("Value (string)", "") || "";
+	            const v = routingEditorCoerce(k, k === "boolean" ? init === "true" : init);
+	            const root = routingEditorState.value || {};
+	            const arr = routingEditorGetByPath(root, path);
+	            if (Array.isArray(arr)) {
+	              arr.push(v);
+	              routingEditorSetDirty(true);
+	              routingEditorRender();
+	            }
+	          });
+	          actions.appendChild(add);
+	        } else {
+	          const add = document.createElement("button");
+	          add.textContent = "+Key";
+	          add.addEventListener("click", (e) => {
+	            e.preventDefault();
+	            e.stopPropagation();
+	            const name = (prompt("Key name", "") || "").trim();
+	            if (!name) return;
+	            const t = (prompt("Value type: string/number/boolean/null/object/array", "string") || "string").trim().toLowerCase();
+	            const k = ["string","number","boolean","null","object","array"].includes(t) ? t : "string";
+	            let init = "";
+	            if (k === "boolean") init = prompt("Value: true/false", "false") || "false";
+	            else if (k === "number") init = prompt("Value (number)", "0") || "0";
+	            else if (k === "string") init = prompt("Value (string)", "") || "";
+	            const v = routingEditorCoerce(k, k === "boolean" ? init === "true" : init);
+	            const root = routingEditorState.value || {};
+	            const obj = routingEditorGetByPath(root, path);
+	            if (obj && typeof obj === "object" && !Array.isArray(obj)) {
+	              obj[name] = v;
+	              routingEditorSetDirty(true);
+	              routingEditorRender();
+	            }
+	          });
+	          actions.appendChild(add);
+	        }
+	        if (!isRoot) {
+	          const del = document.createElement("button");
+	          del.textContent = "Del";
+	          del.className = "danger";
+	          del.addEventListener("click", (e) => {
+	            e.preventDefault();
+	            e.stopPropagation();
+	            const root = routingEditorState.value || {};
+	            routingEditorDeleteByPath(root, path);
+	            routingEditorSetDirty(true);
+	            routingEditorRender();
+	          });
+	          actions.appendChild(del);
+	        }
+	        const pathEl = document.createElement("span");
+	        pathEl.className = "kv-path mono";
+	        pathEl.textContent = routingEditorPathToString(path);
+	        actions.appendChild(pathEl);
+	        summary.appendChild(keyEl);
+	        summary.appendChild(metaEl);
+	        summary.appendChild(actions);
+	        details.appendChild(summary);
+	        if (isArr) {
+	          for (let i = 0; i < value.length; i += 1) {
+	            details.appendChild(routingEditorRenderNode(String(i), value[i], path.concat([i]), depth + 1));
+	          }
+	          return details;
+	        }
+	        let keys = [];
+	        try {
+	          keys = Object.keys(value);
+	          keys.sort((a, b) => a.localeCompare(b));
+	        } catch {
+	          keys = [];
+	        }
+	        for (const childKey of keys) {
+	          details.appendChild(routingEditorRenderNode(childKey, value[childKey], path.concat([childKey]), depth + 1));
+	        }
+	        return details;
+	      }
+	      async function loadRouting() {
+	        setLog("routingOpLog", "");
+	        const auth = UI.adminAuth ? UI.adminAuth : await refreshAdminAuthStatus();
+	        if (!auth || !auth.authenticated) {
+	          notifyUnauthorizedOnce("routing");
+	          return;
+	        }
+	        try {
+	          const selectedPath = textOf($("routingSourceSelect").value || "").trim();
+	          const query = selectedPath ? `?path=${encodeURIComponent(selectedPath)}` : "";
+	          const out = await apiFetch(`/config/routing${query}`);
+	          UI.routingLocation = out.location || "virtualrouter.routing";
+	          routingEditorSetValue(out.routing || {});
+	          setLog("routingOpLog", `Loaded. Path: ${out.path || "—"}\nLocation: ${UI.routingLocation}`);
+	          toast("Routing loaded.", "ok");
+	        } catch (e) {
+	          if (e && e.status === 401) notifyUnauthorizedOnce("routing");
+	          setLog("routingOpLog", `Load failed: ${e.message}`);
+	          toast(`Load failed: ${e.message}`);
+	        }
+	      }
+	      async function saveRouting() {
+	        setLog("routingOpLog", "");
+	        const auth = UI.adminAuth ? UI.adminAuth : await refreshAdminAuthStatus();
+	        if (!auth || !auth.authenticated) {
+	          notifyUnauthorizedOnce("routing save");
+	          return;
+	        }
+	        try {
+	          const selectedPath = textOf($("routingSourceSelect").value || "").trim();
+	          const query = selectedPath ? `?path=${encodeURIComponent(selectedPath)}` : "";
+	          const routing = routingEditorGetValue() || {};
+	          const out = await apiFetch(`/config/routing${query}`, {
+	            method: "PUT",
+	            body: JSON.stringify({ routing, location: UI.routingLocation, path: selectedPath || undefined })
+	          });
+	          UI.routingLocation = out.location || UI.routingLocation;
+	          setLog("routingOpLog", `Saved. Path: ${out.path || "—"}\nLocation: ${UI.routingLocation}\nRestart required to apply.`);
+	          toast("Routing saved.", "ok");
+	          routingEditorSetDirty(false);
+	        } catch (e) {
+	          if (e && e.status === 401) notifyUnauthorizedOnce("routing save");
+	          setLog("routingOpLog", `Save failed: ${e.message}`);
+	          toast(`Save failed: ${e.message}`);
+	        }
+	      }
+	      async function refreshRoutingSources() {
+	        const select = $("routingSourceSelect");
+	        if (!select) return;
+	        const prev = textOf(select.value || "");
+	        try {
+	          const out = await apiFetch("/config/routing/sources");
+	          const sources = Array.isArray(out && out.sources) ? out.sources : [];
+	          UI.routingSources = sources;
+	          UI.routingSourcesUpdatedAt = Date.now();
+	          select.replaceChildren();
+	          for (const s of sources) {
+	            const opt = document.createElement("option");
+	            opt.value = textOf(s.path || "");
+	            const version = s.version ? ` v=${s.version}` : "";
+	            const loc = s.location ? ` (${s.location})` : "";
+	            const kind = s.kind ? `[${s.kind}] ` : "";
+	            opt.textContent = `${kind}${textOf(s.label || s.path || "")}${version}${loc}`;
+	            select.appendChild(opt);
+	          }
+	          const active = textOf(out && out.activePath ? out.activePath : "");
+	          const hasPrev = sources.some((s) => textOf(s.path) === prev);
+	          const hasActive = sources.some((s) => textOf(s.path) === active);
+	          if (hasPrev) select.value = prev;
+	          else if (hasActive) select.value = active;
+	          toast("Routing sources refreshed.", "ok");
+	        } catch (e) {
+	          if (e && e.status === 401) notifyUnauthorizedOnce("routing sources");
+	          toast(`Routing sources failed: ${e && e.message ? e.message : String(e)}`);
+	        }
+	      }
+	      async function refreshRuntimes() {
+	        try {
+	          const quota = await apiFetch("/quota/providers");
+	          const quotaProviders = quota && Array.isArray(quota.providers) ? quota.providers : [];
+	          UI.quotaProviders = quotaProviders;
+	          UI.quotaProvidersUpdatedAt = Date.now();
+	          UI.quotaProviderMap = new Map(quotaProviders.map((q) => [textOf(q.providerKey), q]));
+	        } catch (e) {
+	          if (e && e.status === 401) notifyUnauthorizedOnce("pool status");
+	          throw e;
+	        }
+	      }
+      function formatEpochMs(ms) {
+        if (typeof ms !== "number" || !Number.isFinite(ms) || ms <= 0) return "—";
+        try {
+          return new Date(ms).toLocaleString();
+        } catch {
+          return String(ms);
+        }
+      }
+      function formatDurationMs(ms) {
+        if (typeof ms !== "number" || !Number.isFinite(ms)) return "—";
+        const abs = Math.abs(ms);
+        const sign = ms < 0 ? "-" : "";
+        const s = Math.round(abs / 1000);
+        if (s < 60) return `${sign}${s}s`;
+        const m = Math.round(s / 60);
+        if (m < 60) return `${sign}${m}m`;
+        const h = Math.round(m / 60);
+        if (h < 48) return `${sign}${h}h`;
+        const d = Math.round(h / 24);
+        return `${sign}${d}d`;
+      }
+      function formatEpochWithDelta(ms) {
+        if (typeof ms !== "number" || !Number.isFinite(ms) || ms <= 0) return "—";
+        const delta = ms - Date.now();
+        const tail = delta >= 0 ? `in ${formatDurationMs(delta)}` : `${formatDurationMs(delta)} ago`;
+        return `${formatEpochMs(ms)} (${tail})`;
+      }
+	      function pill(text, kind) {
+	        const span = document.createElement("span");
+	        span.className = `pill ${kind || ""}`.trim();
+	        span.textContent = textOf(text);
+	        return span;
+	      }
+      function extractRoutingTargets(routing) {
+        const out = new Set();
+        if (!routing || typeof routing !== "object") return out;
+        for (const routeName of Object.keys(routing)) {
+          const pools = routing[routeName];
+          if (!Array.isArray(pools)) continue;
+          for (const pool of pools) {
+            if (!pool || typeof pool !== "object") continue;
+            const targets = pool.targets;
+            if (!Array.isArray(targets)) continue;
+            for (const t of targets) {
+              if (typeof t === "string" && t.trim()) out.add(t.trim());
+            }
+          }
+        }
+        return out;
+      }
+      function resolveRoutedProviderKeys(routingTargets, providers) {
+        const targets = routingTargets instanceof Set ? Array.from(routingTargets) : [];
+        const list = Array.isArray(providers) ? providers : [];
+        const keys = [];
+        for (const p of list) {
+          const k = textOf(p && p.providerKey ? p.providerKey : "");
+          if (k) keys.push(k);
+        }
+        const known = new Set(keys);
+        const resolved = new Set();
+        if (!targets.length || !known.size) return resolved;
+        for (const t of targets) {
+          const target = textOf(t);
+          if (!target) continue;
+          if (known.has(target)) {
+            resolved.add(target);
+            continue;
+          }
+          const dot = target.indexOf(".");
+          if (dot <= 0) continue;
+          const providerId = target.slice(0, dot);
+          const modelId = target.slice(dot + 1);
+          if (!providerId || !modelId) continue;
+          const prefix = `${providerId}.`;
+          const suffix = `.${modelId}`;
+          for (const k of known) {
+            if (k.startsWith(prefix) && k.endsWith(suffix)) resolved.add(k);
+          }
+        }
+        return resolved;
+      }
+      async function refreshRoutingTargets() {
+        try {
+          const routingOut = await apiFetch("/config/routing");
+          UI.routingTargets = extractRoutingTargets(routingOut && routingOut.routing ? routingOut.routing : {});
+          UI.routingTargetsUpdatedAt = Date.now();
+        } catch {
+          UI.routingTargets = null;
+          UI.routingTargetsUpdatedAt = Date.now();
+        }
+      }
+      async function refreshQuota() {
+        const body = $("quotaTbody");
+        body.replaceChildren();
+        setLog("quotaOpLog", "");
+        try {
+          // Load routing targets so we can filter out providers not referenced by routing pools.
+          await refreshRoutingTargets();
+          // Force refresh quota first so UI doesn't show stale pool state.
+          try {
+            await apiFetch("/daemon/modules/quota/refresh", { method: "POST" });
+          } catch (e) {
+            // Backwards compatibility: older servers may only support reset.
+            if (e && e.status === 404) {
+              try {
+                await apiFetch("/daemon/modules/quota/reset", { method: "POST" });
+              } catch (e2) {
+                throw e2;
+              }
+            } else {
+              throw e;
+            }
+          }
+          const out = await apiFetch("/quota/providers");
+          UI.quotaProviders = Array.isArray(out.providers) ? out.providers : [];
+          UI.quotaProvidersUpdatedAt = Date.now();
+          renderQuotaProviders();
+        } catch (e) {
+          if (e && e.status === 401) notifyUnauthorizedOnce("quota");
+          else toast(e && e.message ? e.message : String(e || "quota refresh failed"));
+          body.appendChild(createErrorRow(8, e && e.message ? e.message : e));
+        }
+      }
+      function renderQuotaProviders() {
+        const body = $("quotaTbody");
+        body.replaceChildren();
+        const filter = textOf($("quotaFilterInput").value || "").trim().toLowerCase();
+        const hideOk = Boolean($("quotaHideOkToggle").checked);
+        const onlyRoutedTargets = Boolean($("quotaOnlyRoutedTargetsToggle").checked);
+        const routedProviderKeys = onlyRoutedTargets ? resolveRoutedProviderKeys(UI.routingTargets, UI.quotaProviders) : null;
+        const list = Array.isArray(UI.quotaProviders) ? UI.quotaProviders : [];
+        const next = list
+          .filter((q) => {
+            const key = textOf(q && q.providerKey ? q.providerKey : "").toLowerCase();
+            if (filter && !key.includes(filter)) return false;
+            if (hideOk && q && q.inPool === true) return false;
+            if (routedProviderKeys && !routedProviderKeys.has(textOf(q && q.providerKey ? q.providerKey : ""))) return false;
+            return true;
+          })
+          .slice();
+        next.sort((a, b) => {
+          const aIn = a && a.inPool === true ? 1 : 0;
+          const bIn = b && b.inPool === true ? 1 : 0;
+          if (aIn !== bIn) return aIn - bIn; // inPool=false first
+          const aUntil = Math.max(Number(a?.blacklistUntil || 0), Number(a?.cooldownUntil || 0));
+          const bUntil = Math.max(Number(b?.blacklistUntil || 0), Number(b?.cooldownUntil || 0));
+          if (aUntil !== bUntil) return bUntil - aUntil;
+          return textOf(a?.providerKey).localeCompare(textOf(b?.providerKey));
+        });
+        if (!next.length) {
+          body.appendChild(createErrorRow(8, "No providers matched filter."));
+          return;
+        }
+        function splitProviderKey(providerKey) {
+          const raw = textOf(providerKey || "");
+          const parts = raw.split(".");
+          if (parts.length >= 3) {
+            return { providerId: parts[0], authAlias: parts[1], model: parts.slice(2).join(".") };
+          }
+          if (parts.length === 2) {
+            return { providerId: parts[0], authAlias: "", model: parts[1] };
+          }
+          return { providerId: raw, authAlias: "", model: "" };
+        }
+        const byProvider = new Map();
+        for (const q of next) {
+          const pk = textOf(q && q.providerKey ? q.providerKey : "");
+          const { providerId, authAlias, model } = splitProviderKey(pk);
+          if (!byProvider.has(providerId)) byProvider.set(providerId, new Map());
+          const byAlias = byProvider.get(providerId);
+          if (!byAlias.has(authAlias)) byAlias.set(authAlias, []);
+          byAlias.get(authAlias).push({ q, pk, providerId, authAlias, model });
+        }
+        const providerIds = Array.from(byProvider.keys()).sort((a, b) => a.localeCompare(b));
+        const groupCols = 8;
+        const appendGroupRow = (label, indent = false) => {
+          const tr = document.createElement("tr");
+          tr.className = "group-row";
+          const td = document.createElement("td");
+          td.colSpan = groupCols;
+          td.textContent = label;
+          if (indent) td.className = "indent";
+          tr.appendChild(td);
+          body.appendChild(tr);
+        };
+        for (const providerId of providerIds) {
+          const byAlias = byProvider.get(providerId);
+          let modelsCount = 0;
+          for (const v of byAlias.values()) modelsCount += v.length;
+          appendGroupRow(`${providerId} (${modelsCount})`);
+          const aliases = Array.from(byAlias.keys()).sort((a, b) => a.localeCompare(b));
+          for (const alias of aliases) {
+            const items = byAlias.get(alias);
+            appendGroupRow(`${alias || "(no-key)"} (${items.length})`, true);
+            for (const item of items) {
+              const q = item.q;
+              const tr = document.createElement("tr");
+              tr.className = "provider-row";
+              tr.setAttribute("data-provider-key", item.pk);
+              tr.appendChild(createCell("td", "", "mono"));
+              tr.appendChild(createCell("td", "", "mono"));
+              tr.appendChild(createCell("td", item.model || item.pk, "mono indent", { title: true }));
+              const inPool = Boolean(q.inPool);
+              const inTd = document.createElement("td");
+              inTd.appendChild(pill(inPool ? "true" : "false", inPool ? "ok" : "bad"));
+              tr.appendChild(inTd);
+              const reason = textOf(q.reason || "");
+              const reasonKind =
+                reason === "ok" ? "ok" :
+                reason === "cooldown" ? "warn" :
+                reason === "blacklist" || reason === "fatal" || reason === "quotaDepleted" ? "bad" : "warn";
+              const reasonTd = document.createElement("td");
+              reasonTd.appendChild(pill(reason || "—", reasonKind));
+              tr.appendChild(reasonTd);
+              const cooldown = formatEpochWithDelta(q.cooldownUntil);
+              const blacklist = formatEpochWithDelta(q.blacklistUntil);
+              const until = `cooldown=${cooldown || "—"} blacklist=${blacklist || "—"}`;
+              tr.appendChild(createCell("td", until, "mono", { title: true }));
+              tr.appendChild(createCell("td", q.consecutiveErrorCount ?? 0, "mono"));
+              const actionsTd = document.createElement("td");
+              actionsTd.className = "actions-cell";
+              const box = document.createElement("div");
+              box.className = "actions";
+              const recover = document.createElement("button");
+              recover.textContent = "Recover";
+              recover.setAttribute("data-action", "quota-recover");
+              recover.setAttribute("data-key", item.pk);
+              const reset = document.createElement("button");
+              reset.textContent = "Reset";
+              reset.setAttribute("data-action", "quota-reset");
+              reset.setAttribute("data-key", item.pk);
+              const disable = document.createElement("button");
+              disable.textContent = "Offline…";
+              disable.className = "danger";
+              disable.setAttribute("data-action", "quota-disable");
+              disable.setAttribute("data-key", item.pk);
+              box.appendChild(recover);
+              box.appendChild(reset);
+              box.appendChild(disable);
+              actionsTd.appendChild(box);
+              tr.appendChild(actionsTd);
+              body.appendChild(tr);
+            }
+          }
+        }
+      }
+      function formatRemainingFraction(v) {
+        if (typeof v !== "number" || !Number.isFinite(v)) return "—";
+        const pct = Math.max(0, Math.min(1, v)) * 100;
+        return `${pct.toFixed(1)}%`;
+      }
+      async function refreshQuotaSnapshot() {
+        const body = $("quotaSnapshotTbody");
+        body.replaceChildren();
+        setLog("quotaSnapshotLog", "");
+        try {
+          // Ensure routing + provider pool snapshots exist so we can filter routed models.
+          await refreshRoutingTargets();
+          if (!Array.isArray(UI.quotaProviders) || UI.quotaProviders.length === 0) {
+            try {
+              const outProviders = await apiFetch("/quota/providers");
+              UI.quotaProviders = Array.isArray(outProviders.providers) ? outProviders.providers : [];
+              UI.quotaProvidersUpdatedAt = Date.now();
+            } catch {
+              // ignore: snapshot view can still render unfiltered
+            }
+          }
+          const out = await apiFetch("/quota/summary");
+          let list = Array.isArray(out.records) ? out.records : [];
+          const onlyRouted = Boolean($("quotaSnapshotOnlyRoutedToggle").checked);
+          if (onlyRouted) {
+            const routedProviderKeys = resolveRoutedProviderKeys(UI.routingTargets, UI.quotaProviders);
+            const allowedSnapshotKeys = new Set();
+            for (const providerKey of routedProviderKeys) {
+              if (!providerKey.toLowerCase().startsWith("antigravity.")) continue;
+              const parts = providerKey.split(".");
+              if (parts.length < 3) continue;
+              const alias = parts[1];
+              const modelId = parts.slice(2).join(".");
+              if (!alias || !modelId) continue;
+              allowedSnapshotKeys.add(`antigravity://${alias}/${modelId}`);
+            }
+            list = list.filter((r) => allowedSnapshotKeys.has(textOf(r && r.key ? r.key : "")));
+          }
+          list.sort((a, b) => String(a.key || "").localeCompare(String(b.key || "")));
+          for (const r of list) {
+            const raw = textOf(r && r.key ? r.key : "");
+            const prefix = "antigravity://";
+            const rest = raw.startsWith(prefix) ? raw.slice(prefix.length) : raw;
+            const parts = rest.split("/");
+            const alias = parts.length >= 2 ? parts[0] : "";
+            const model = parts.length >= 2 ? parts.slice(1).join("/") : rest;
+            const tr = document.createElement("tr");
+            tr.appendChild(createCell("td", alias || "—", "mono", { title: true }));
+            tr.appendChild(createCell("td", model || "—", "mono", { title: true }));
+            tr.appendChild(createCell("td", formatRemainingFraction(r.remainingFraction), "mono"));
+            tr.appendChild(createCell("td", formatEpochWithDelta(r.resetAt), "mono", { title: true }));
+            tr.appendChild(createCell("td", formatEpochMs(r.fetchedAt), "mono", { title: true }));
+            body.appendChild(tr);
+          }
+          if (!list.length) {
+            body.appendChild(createErrorRow(5, "No quota records to show (check filter or click Refresh antigravity snapshot)."));
+          }
+        } catch (e) {
+          if (e && e.status === 401) notifyUnauthorizedOnce("quota snapshot");
+          body.appendChild(createErrorRow(5, e && e.message ? e.message : e));
+        }
+      }
+      async function refreshQuotaSnapshotNow() {
+        setLog("quotaSnapshotLog", "");
+        try {
+          const out = await apiFetch("/quota/refresh", { method: "POST" });
+          const result = out && out.result ? out.result : null;
+          setLog(
+            "quotaSnapshotLog",
+            `OK. refreshedAt=${result && result.refreshedAt ? formatEpochMs(result.refreshedAt) : "—"} tokenCount=${result && typeof result.tokenCount === "number" ? result.tokenCount : "—"} records=${result && typeof result.recordCount === "number" ? result.recordCount : "—"}`
+          );
+          await refreshQuotaSnapshot();
+          toast("Quota snapshot refreshed.", "ok");
+        } catch (e) {
+          if (e && e.status === 401) notifyUnauthorizedOnce("quota refresh");
+          setLog("quotaSnapshotLog", `Refresh failed: ${e && e.message ? e.message : e}`);
+          toast(`Refresh failed: ${e && e.message ? e.message : String(e)}`);
+        }
+      }
+      function formatInt(n) {
+        const v = typeof n === "number" && Number.isFinite(n) ? n : 0;
+        try { return v.toLocaleString(); } catch { return String(v); }
+      }
+      function formatTokensRow(label, totals) {
+        const inTok = formatInt(totals.totalPromptTokens);
+        const outTok = formatInt(totals.totalCompletionTokens);
+        const totTok = formatInt(totals.totalOutputTokens);
+        const req = formatInt(totals.requestCount);
+        const err = formatInt(totals.errorCount);
+        return `${label}: requests=${req} (err=${err}) tokens in/out/total=${inTok}/${outTok}/${totTok}`;
+      }
+      async function refreshTokens() {
+        const body = $("tokensTbody");
+        body.replaceChildren();
+        $("tokenTotalsBox").textContent = "";
+        try {
+          const out = await apiFetch("/daemon/stats");
+          const session = out && out.session ? out.session : null;
+          const historical = out && out.historical ? out.historical : null;
+          const totals = out && out.totals ? out.totals : null;
+          const sessionTotals = totals && totals.session ? totals.session : { requestCount: 0, errorCount: 0, totalPromptTokens: 0, totalCompletionTokens: 0, totalOutputTokens: 0 };
+          const historicalTotals = totals && totals.historical ? totals.historical : { requestCount: 0, errorCount: 0, totalPromptTokens: 0, totalCompletionTokens: 0, totalOutputTokens: 0 };
+          const lines = [];
+          lines.push(formatTokensRow("ALL (session)", sessionTotals));
+          lines.push(formatTokensRow("ALL (historical)", historicalTotals));
+          $("tokenTotalsBox").textContent = lines.join("\n");
+          const sessionRows = session && Array.isArray(session.totals) ? session.totals : [];
+          const histRows = historical && Array.isArray(historical.totals) ? historical.totals : [];
+          const byKey = new Map();
+          const keyOf = (r) => `${textOf(r.providerKey)}|${textOf(r.model || "")}`;
+          for (const r of sessionRows) {
+            if (!r || !r.providerKey) continue;
+            byKey.set(keyOf(r), { providerKey: textOf(r.providerKey), model: textOf(r.model || ""), session: r, historical: null });
+          }
+          for (const r of histRows) {
+            if (!r || !r.providerKey) continue;
+            const k = keyOf(r);
+            const existing = byKey.get(k) || { providerKey: textOf(r.providerKey), model: textOf(r.model || ""), session: null, historical: null };
+            existing.historical = r;
+            byKey.set(k, existing);
+          }
+          const rows = Array.from(byKey.values()).sort((a, b) => {
+            const ak = `${a.providerKey}.${a.model}`;
+            const bk = `${b.providerKey}.${b.model}`;
+            return ak.localeCompare(bk);
+          });
+          for (const row of rows) {
+            const tr = document.createElement("tr");
+            tr.appendChild(createCell("td", row.providerKey, "mono truncate", { title: true }));
+            tr.appendChild(createCell("td", row.model || "—", "mono truncate", { title: true }));
+            const s = row.session;
+            const sReqErr = s ? `${formatInt(s.requestCount)} / ${formatInt(s.errorCount)}` : "—";
+            const sTok = s ? `${formatInt(s.totalPromptTokens)}/${formatInt(s.totalCompletionTokens)}/${formatInt(s.totalOutputTokens)}` : "—";
+            tr.appendChild(createCell("td", sReqErr, "mono"));
+            tr.appendChild(createCell("td", sTok, "mono"));
+            const h = row.historical;
+            const hReqErr = h ? `${formatInt(h.requestCount)} / ${formatInt(h.errorCount)}` : "—";
+            const hTok = h ? `${formatInt(h.totalPromptTokens)}/${formatInt(h.totalCompletionTokens)}/${formatInt(h.totalOutputTokens)}` : "—";
+            tr.appendChild(createCell("td", hReqErr, "mono"));
+            tr.appendChild(createCell("td", hTok, "mono"));
+            body.appendChild(tr);
+          }
+        } catch (e) {
+          body.appendChild(createErrorRow(6, e && e.message ? e.message : e));
+        }
+      }
+      async function testProviderFromPool(providerId) {
+        setLog("providerOpLog", "");
+        try {
+          const detail = await apiFetch(`/config/providers/${encodeURIComponent(providerId)}`);
+          const provider = detail && detail.provider ? detail.provider : null;
+          const models = provider && provider.models && typeof provider.models === "object" ? Object.keys(provider.models) : [];
+          if (!models.length) {
+            throw new Error("No models configured for this provider");
+          }
+          const modelId = models[0];
+          const directModel = `${providerId}.${modelId}`;
+          const payload = { model: directModel, input: [{ role: "user", content: "ping" }], stream: false };
+          const headers = new Headers({ "content-type": "application/json" });
+          const apiKey = getApiKey();
+          if (apiKey) headers.set("x-api-key", apiKey);
+          const started = Date.now();
+          const resp = await fetch("/v1/responses", { method: "POST", headers, body: JSON.stringify(payload) });
+          const text = await resp.text();
+          const ms = Date.now() - started;
+          if (!resp.ok) {
+            throw new Error(`HTTP ${resp.status} (${ms}ms): ${text}`);
+          }
+          let json = null;
+          try { json = text ? JSON.parse(text) : null; } catch { json = null; }
+          const summary =
+            json && typeof json.output_text === "string"
+              ? json.output_text.slice(0, 200)
+              : json && Array.isArray(json.output)
+                ? "(output items=" + json.output.length + ")"
+                : "(ok)";
+          setLog("providerOpLog", `Test OK (${ms}ms) model=${directModel}\n${summary}`);
+        } catch (e) {
+          setLog("providerOpLog", `Test failed: ${e && e.message ? e.message : e}`);
+        }
+      }
+      async function quotaAction(kind, providerKey) {
+        setLog("quotaOpLog", "");
+        if (!providerKey) {
+          setLog("quotaOpLog", "providerKey required");
+          toast("providerKey required");
+          return;
+        }
+        try {
+          if (kind === "recover") {
+            await apiFetch(`/quota/providers/${encodeURIComponent(providerKey)}/recover`, { method: "POST" });
+            await refreshQuota();
+            toast("Recovered.", "ok");
+            return;
+          }
+          if (kind === "reset") {
+            await apiFetch(`/quota/providers/${encodeURIComponent(providerKey)}/reset`, { method: "POST" });
+            await refreshQuota();
+            toast("Reset.", "ok");
+            return;
+          }
+          if (kind === "disable") {
+            const minutes = Number.parseFloat(textOf($("quotaDurationSelect").value || "60"));
+            if (!Number.isFinite(minutes) || minutes <= 0) {
+              throw new Error("Invalid minutes");
+            }
+            const modeRaw = (textOf($("quotaModeSelect").value) || "cooldown").trim().toLowerCase();
+            const mode = modeRaw === "blacklist" ? "blacklist" : "cooldown";
+            await apiFetch(`/quota/providers/${encodeURIComponent(providerKey)}/disable`, {
+              method: "POST",
+              body: JSON.stringify({ mode, durationMinutes: minutes })
+            });
+            await refreshQuota();
+            toast("Applied.", "ok");
+            return;
+          }
+        } catch (e) {
+          if (e && e.status === 401) notifyUnauthorizedOnce("quota action");
+          setLog("quotaOpLog", `Action failed: ${e && e.message ? e.message : e}`);
+          toast(`Action failed: ${e && e.message ? e.message : String(e)}`);
+        }
+      }
+      async function resetQuotaModule() {
+        setLog("quotaOpLog", "");
+        if (!confirm("Reset provider-quota module now? This clears cooldown/blacklist state.")) return;
+        try {
+          const out = await apiFetch("/daemon/modules/provider-quota/reset", { method: "POST" });
+          setLog("quotaOpLog", `OK. resetAt=${out.resetAt || "—"}`);
+          await refreshQuota();
+          toast("Quota module reset.", "ok");
+        } catch (e) {
+          if (e && e.status === 401) notifyUnauthorizedOnce("quota reset");
+          setLog("quotaOpLog", `Reset failed: ${e.message}`);
+          toast(`Reset failed: ${e.message}`);
+        }
+      }
+      // Bind events
+      document.querySelectorAll(".tab").forEach((btn) => {
+        btn.addEventListener("click", () => selectTab(btn.getAttribute("data-tab")));
+      });
+      async function refreshAdminAuthStatus() {
+        try {
+          const status = await apiFetch("/daemon/auth/status", { method: "GET" });
+          if (status && status.ok) {
+            const hasPassword = Boolean(status.hasPassword);
+            const authed = Boolean(status.authenticated);
+            UI.adminAuth = { hasPassword, authenticated: authed };
+            $("adminAuthHint").textContent = authed ? "authenticated" : hasPassword ? "login required" : "setup required (localhost only)";
+            $("setupPasswordBtn").style.display = hasPassword ? "none" : "inline-block";
+            $("loginPasswordBtn").style.display = hasPassword ? "inline-block" : "none";
+            $("changePasswordDetails").style.display = hasPassword && authed ? "block" : "none";
+            return { hasPassword, authenticated: authed };
+          }
+        } catch (e) {
+          const msg = e && e.message ? e.message : String(e);
+          $("adminAuthHint").textContent = msg;
+          toast(`Admin auth status failed: ${msg}`);
+        }
+        UI.adminAuth = { hasPassword: false, authenticated: false };
+        $("changePasswordDetails").style.display = "none";
+        return { hasPassword: false, authenticated: false };
+      }
+      $("adminPasswordInput").addEventListener("keydown", async (ev) => {
+        if (ev.key !== "Enter") return;
+        ev.preventDefault();
+        const status = UI.adminAuth ? UI.adminAuth : await refreshAdminAuthStatus();
+        if (status.hasPassword) $("loginPasswordBtn").click();
+        else $("setupPasswordBtn").click();
+      });
+      $("setupPasswordBtn").addEventListener("click", async () => {
+        const pw = ($("adminPasswordInput").value || "");
+        try {
+          $("adminAuthHint").textContent = "setting password…";
+          await apiFetch("/daemon/auth/setup", { method: "POST", body: JSON.stringify({ password: pw }) });
+          $("adminPasswordInput").value = "";
+          $("oldAdminPasswordInput").value = "";
+          $("newAdminPasswordInput").value = "";
+          toast("Password set. You're now logged in.", "ok");
+          await refreshAdminAuthStatus();
+          await refreshStatus();
+          await refreshProviders();
+          await refreshCredentials();
+          await refreshQuota();
+          await refreshQuotaSnapshot();
+          await refreshRuntimes();
+          await refreshRoutingSources();
+          await loadRouting();
+        } catch (e) {
+          const msg = e && e.message ? e.message : String(e);
+          $("adminAuthHint").textContent = msg;
+          toast(`Set password failed: ${msg}`);
+        }
+      });
+      $("loginPasswordBtn").addEventListener("click", async () => {
+        const pw = ($("adminPasswordInput").value || "");
+        try {
+          $("adminAuthHint").textContent = "logging in…";
+          await apiFetch("/daemon/auth/login", { method: "POST", body: JSON.stringify({ password: pw }) });
+          $("adminPasswordInput").value = "";
+          $("oldAdminPasswordInput").value = "";
+          $("newAdminPasswordInput").value = "";
+          toast("Logged in.", "ok");
+          await refreshAdminAuthStatus();
+          await refreshStatus();
+          await refreshProviders();
+          await refreshCredentials();
+          await refreshQuota();
+          await refreshRuntimes();
+          await refreshRoutingSources();
+          await loadRouting();
+        } catch (e) {
+          const msg = e && e.message ? e.message : String(e);
+          $("adminAuthHint").textContent = msg;
+          toast(`Login failed: ${msg}`);
+        }
+      });
+      $("logoutPasswordBtn").addEventListener("click", async () => {
+        try {
+          $("adminAuthHint").textContent = "logging out…";
+          await apiFetch("/daemon/auth/logout", { method: "POST" });
+          toast("Logged out.", "ok");
+          await refreshAdminAuthStatus();
+        } catch (e) {
+          const msg = e && e.message ? e.message : String(e);
+          $("adminAuthHint").textContent = msg;
+          toast(`Logout failed: ${msg}`);
+        }
+      });
+      $("changePasswordBtn").addEventListener("click", async () => {
+        const oldPassword = ($("oldAdminPasswordInput").value || "");
+        const newPassword = ($("newAdminPasswordInput").value || "");
+        try {
+          $("adminAuthHint").textContent = "changing password…";
+          await apiFetch("/daemon/auth/change", {
+            method: "POST",
+            body: JSON.stringify({ oldPassword, newPassword })
+          });
+          $("oldAdminPasswordInput").value = "";
+          $("newAdminPasswordInput").value = "";
+          toast("Password changed.", "ok");
+          await refreshAdminAuthStatus();
+        } catch (e) {
+          const msg = e && e.message ? e.message : String(e);
+          $("adminAuthHint").textContent = msg;
+          toast(`Change password failed: ${msg}`);
+        }
+      });
+      $("saveApiKeyBtn").addEventListener("click", () => {
+        const value = ($("apiKeyInput").value || "").trim();
+        setApiKey(value);
+        $("apiKeyHint").textContent = value ? "saved (session only)" : "";
+        Promise.resolve()
+          .then(refreshStatus)
+          .then(() => selectTab(getActiveTab()))
+          .catch(() => {});
+      });
+      $("clearApiKeyBtn").addEventListener("click", () => {
+        setApiKey("");
+        $("apiKeyInput").value = "";
+        $("apiKeyHint").textContent = "";
+        Promise.resolve()
+          .then(refreshStatus)
+          .then(() => selectTab(getActiveTab()))
+          .catch(() => {});
+      });
+      $("restartRuntimeBtn").addEventListener("click", async () => {
+        setLog("providerOpLog", "");
+        if (!confirm("Reload config from disk and rebuild runtime now?")) return;
+        try {
+          const out = await apiFetch("/daemon/restart", { method: "POST" });
+          const warnings = Array.isArray(out.warnings) && out.warnings.length ? `\nWarnings:\n- ${out.warnings.join("\n- ")}` : "";
+          setLog("providerOpLog", `Restarted.\nconfigPath: ${out.configPath || "—"}\nreloadedAt: ${out.reloadedAt || "—"}${warnings}`);
+	          await refreshStatus();
+	          await refreshProviders();
+	          await refreshCredentials();
+	          await refreshQuota();
+	          await refreshQuotaSnapshot();
+	          await refreshRuntimes();
+	        } catch (e) {
+	          setLog("providerOpLog", `Restart failed: ${e.message}`);
+	        }
+      });
+      $("refreshProvidersBtn").addEventListener("click", refreshProviders);
+      $("refreshTokensBtn").addEventListener("click", refreshTokens);
+      $("newProviderBtn").addEventListener("click", () => {
+        $("providerEditorTitle").textContent = "Provider editor (new)";
+        $("providerIdInput").value = "";
+        setSelectedProviderId("");
+        providerEditorSetValue(presetFor($("providerPreset").value));
+        setLog("providerOpLog", "");
+      });
+      $("providersTbody").addEventListener("click", async (ev) => {
+        const btn = ev.target.closest("button");
+        if (btn) {
+          const id = btn.getAttribute("data-id");
+          const action = btn.getAttribute("data-action");
+          if (action === "test" && id) {
+            setSelectedProviderId(id);
+            await testProviderFromPool(id);
+            return;
+          }
+          if (action === "edit" && id) {
+            await loadProvider(id);
+            return;
+          }
+          if (action === "delete" && id) {
+            await deleteProvider(id);
+            return;
+          }
+          return;
+        }
+        const row = ev.target.closest("tr.provider-row");
+        if (!row) return;
+        const id = row.getAttribute("data-provider-id");
+        if (!id) return;
+        await loadProvider(id);
+      });
+      $("loadProviderBtn").addEventListener("click", async () => {
+        const id = ($("providerIdInput").value || "").trim();
+        if (id) await loadProvider(id);
+      });
+      $("applyPresetBtn").addEventListener("click", applyPresetToEditor);
+      $("saveProviderBtn").addEventListener("click", saveProvider);
+      $("deleteProviderBtn").addEventListener("click", async () => {
+        const id = ($("providerIdInput").value || "").trim();
+        await deleteProvider(id);
+      });
+      $("createApiKeyCredentialBtn").addEventListener("click", async () => {
+        const secretRef = await createApiKeyCredential();
+        if (secretRef) {
+          providerEditorSetAuthApiKey(secretRef);
+          toast("Authfile created and applied to provider editor.", "ok");
+        }
+      });
+      $("providerEditorExpandBtn").addEventListener("click", () => setAllDetailsOpen($("providerKvEditor"), true, true));
+      $("providerEditorCollapseBtn").addEventListener("click", () => setAllDetailsOpen($("providerKvEditor"), false, true));
+      $("authMode").addEventListener("change", updateAuthModeUi);
+      updateAuthModeUi();
+      $("refreshCredentialsBtn").addEventListener("click", refreshCredentials);
+      $("saveOauthBrowserBtn").addEventListener("click", saveSettings);
+      $("oauthAuthorizeBtn").addEventListener("click", authorizeOauth);
+      $("refreshQuotaBtn").addEventListener("click", refreshQuota);
+      $("refreshQuotaSnapshotBtn").addEventListener("click", refreshQuotaSnapshotNow);
+      $("quotaFilterInput").addEventListener("input", renderQuotaProviders);
+      $("quotaHideOkToggle").addEventListener("change", renderQuotaProviders);
+      $("quotaOnlyRoutedTargetsToggle").addEventListener("change", renderQuotaProviders);
+      $("quotaApplyDisableBtn").addEventListener("click", () => void quotaAction("disable", $("quotaKeyInput").value));
+      $("quotaApplyRecoverBtn").addEventListener("click", () => void quotaAction("recover", $("quotaKeyInput").value));
+      $("quotaApplyResetBtn").addEventListener("click", () => void quotaAction("reset", $("quotaKeyInput").value));
+      $("quotaTbody").addEventListener("click", (ev) => {
+        const tr = ev.target.closest("tr");
+        if (tr && tr.getAttribute) {
+          const pk = tr.getAttribute("data-provider-key");
+          if (pk) $("quotaKeyInput").value = pk;
+        }
+        const el = ev.target.closest("button");
+        if (!el) return;
+        const action = el.getAttribute("data-action");
+        const key = el.getAttribute("data-key");
+        if (key) $("quotaKeyInput").value = key;
+        if (action === "quota-recover") void quotaAction("recover", key);
+        else if (action === "quota-reset") void quotaAction("reset", key);
+        else if (action === "quota-disable") void quotaAction("disable", key);
+      });
+      $("resetQuotaBtn").addEventListener("click", resetQuotaModule);
+      $("loadRoutingBtn").addEventListener("click", loadRouting);
+      $("saveRoutingBtn").addEventListener("click", saveRouting);
+      $("refreshRoutingSourcesBtn").addEventListener("click", refreshRoutingSources);
+      $("routingSourceSelect").addEventListener("change", loadRouting);
+      $("routingRegExpandBtn").addEventListener("click", () => setAllDetailsOpen($("routingKvEditor"), true));
+      $("routingRegCollapseBtn").addEventListener("click", () => setAllDetailsOpen($("routingKvEditor"), false));
+      $("refreshRoutingPoolBtn").addEventListener("click", async () => {
+        try {
+          await refreshRuntimes();
+          toast("Pool status refreshed.", "ok");
+        } catch (e) {
+          toast(`Refresh failed: ${e && e.message ? e.message : String(e)}`);
+        }
+      });
+      $("routingShowPathsToggle").addEventListener("change", () => {
+        try {
+          document.body.classList.toggle("show-routing-paths", Boolean($("routingShowPathsToggle").checked));
+        } catch {}
+      });
+      // Init
+      (async () => {
+        const auth = await refreshAdminAuthStatus();
+        const savedKey = getApiKey();
+        if (savedKey) {
+          $("apiKeyHint").textContent = "saved (session only)";
+          $("apiKeyInput").value = savedKey;
+        }
+        await refreshStatus();
+        await refreshProviders();
+        await refreshCredentials();
+        await refreshQuota();
+        await refreshRuntimes();
+        if (auth && auth.authenticated) {
+          await refreshRoutingSources();
+          await loadRouting();
+        }
+        await loadSettings();
+      })();
+    </script>
+  </body>
+</html>