@jsonstudio/rcc 0.89.1189 → 0.89.1348

package/dist/docs/daemon-admin-ui.html

@@ -85,6 +85,194 @@
         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;
@@ -184,6 +372,14 @@
         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;
@@ -230,12 +426,53 @@
         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;
       }
@@ -243,14 +480,14 @@
       .table-wrap {
         width: 100%;
         max-width: 100%;
-        overflow: auto;
+        overflow: visible;
         border-radius: 12px;
         border: 1px solid var(--border);
       }
 
       .table-wrap .table {
         border: 0;
-        min-width: 860px;
+        min-width: 0;
       }
 
       .table td.actions-cell {
@@ -278,6 +515,39 @@
         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);
@@ -327,9 +597,8 @@
           <div class="title">
             <h1>RouteCodex Daemon Admin</h1>
             <p>
-              Writes to <span class="mono">~/.routecodex/config.json</span>. If
-              <span class="mono">httpserver.apikey</span> is configured, remote access is allowed
-              with the key; otherwise this page is localhost-only.
+              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">
@@ -340,7 +609,45 @@
         </header>
 
         <div class="row" style="margin-bottom: 10px;">
-          <label for="apiKeyInput">Server API Key (optional)</label>
+          <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"
@@ -393,11 +700,11 @@
             <div class="card" style="box-shadow: none;">
               <p class="section-title" id="providerEditorTitle">Provider editor</p>
               <p class="section-sub">
-                Edit provider JSON (secrets are not allowed inline). Save writes to disk and creates a backup.
+                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;">
-                If you use <span class="mono">httpserver.apikey</span>, set it above so API calls don’t return 401. Without apikey configured, this page is localhost-only.
+                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;">
@@ -473,11 +780,14 @@
                 </div>
               </div>
 
-              <textarea
-                id="providerJsonEditor"
-                spellcheck="false"
-                placeholder="{\n  \"enabled\": true,\n  \"type\": \"responses\",\n  \"baseURL\": \"https://...\",\n  \"auth\": { \"type\": \"apikey\", \"apiKey\": \"authfile-...\" }\n}"
-              ></textarea>
+              <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>
@@ -593,21 +903,55 @@
               <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;">
-                <button id="refreshQuotaBtn" class="primary">Refresh</button>
-                <button id="resetQuotaBtn" class="danger">Reset quota module</button>
+	              </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>providerKey</th>
-                      <th>auth</th>
+                      <th>provider</th>
+                      <th>key</th>
+                      <th>model</th>
                       <th>inPool</th>
                       <th>reason</th>
-                      <th>cooldownUntil</th>
-                      <th>blacklistUntil</th>
+                      <th>until</th>
                       <th>errCount</th>
                       <th></th>
                     </tr>
@@ -615,66 +959,148 @@
                   <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">Notes</p>
-              <div class="notice">
+	              <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 quota module</span>, then <span class="mono">Restart runtime</span>.
-                </div>
-              </div>
-            </div>
+	                </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">
-            <div class="card" style="box-shadow:none;">
-              <p class="section-title">Routing editor</p>
-              <p class="section-sub">Edits <span class="mono">virtualrouter.routing</span> in user config.</p>
-              <div class="row" style="margin-bottom: 10px;">
-                <button id="loadRoutingBtn" class="primary">Load</button>
-                <button id="saveRoutingBtn" class="primary">Save</button>
-              </div>
-              <textarea id="routingEditor" spellcheck="false" placeholder="{\n  \"default\": [...]\n}"></textarea>
-              <div id="routingOpLog" class="log" style="margin-top: 10px; display:none;"></div>
-            </div>
-
-            <div class="card" style="box-shadow:none;">
-              <p class="section-title">Runtime providers</p>
-              <p class="section-sub">
-                What the running process currently has loaded (restart required after edits).
-              </p>
-              <div class="row" style="margin-bottom: 10px;">
-                <button id="refreshRuntimesBtn" class="primary">Refresh</button>
-              </div>
-              <div class="table-wrap">
-                <table class="table">
-                  <thead>
-                    <tr>
-                      <th>providerKey</th>
-                      <th>runtimeKey</th>
-                      <th>family</th>
-                      <th>protocol</th>
-                      <th>series</th>
-                    </tr>
-                  </thead>
-                  <tbody id="runtimesTbody"></tbody>
-                </table>
-              </div>
-            </div>
+	        <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);
@@ -703,10 +1129,8 @@
 
       async function apiFetch(path, opts = {}) {
         const headers = new Headers(opts.headers || {});
-        const apiKey = getApiKey();
-        if (apiKey) headers.set("x-api-key", apiKey);
         if (!headers.has("content-type") && opts.body) headers.set("content-type", "application/json");
-        const res = await fetch(path, { ...opts, headers });
+        const res = await fetch(path, { ...opts, headers, credentials: "same-origin" });
         const text = await res.text();
         let json = null;
         try {
@@ -720,6 +1144,7 @@
             `HTTP ${res.status} ${res.statusText}`;
           const err = new Error(msg);
           err.status = res.status;
+          err.path = path;
           err.payload = json;
           throw err;
         }
@@ -739,7 +1164,7 @@
         ];
         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 setting apikey.
+        // Light auto-refresh on tab switch to avoid showing stale "Unauthorized" after login.
         void maybeRefreshTab(name);
       }
 
@@ -768,8 +1193,14 @@
           if (key === "providers") await refreshProviders();
           else if (key === "tokens") await refreshTokens();
           else if (key === "credentials") await refreshCredentials();
-          else if (key === "quota") await refreshQuota();
-          else if (key === "routing") await refreshRuntimes();
+	          else if (key === "quota") {
+	            await refreshQuota();
+	            await refreshQuotaSnapshot();
+	          }
+          else if (key === "routing") {
+            await refreshRuntimes();
+            await refreshRoutingSources();
+          }
         } catch {
           // ignore refresh failures on tab switch
         }
@@ -799,6 +1230,476 @@
         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 {
@@ -887,8 +1788,12 @@
             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.appendChild(createCell("td", p.id || "", "mono indent"));
+              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 }));
@@ -924,19 +1829,23 @@
             }
           }
         } 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;
-          $("providerJsonEditor").value = JSON.stringify(data.provider || {}, null, 2);
+          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}`);
         }
       }
 
@@ -945,18 +1854,24 @@
         const id = ($("providerIdInput").value || "").trim();
         if (!id) {
           setLog("providerOpLog", "provider id is required");
+          toast("provider id is required");
           return;
         }
         try {
-          const provider = JSON.parse($("providerJsonEditor").value || "{}");
+          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}`);
         }
       }
 
@@ -964,15 +1879,19 @@
         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}`);
         }
       }
 
@@ -998,7 +1917,9 @@
           $("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;
         }
       }
@@ -1025,7 +1946,8 @@
           const secretRef = ($("apikeySecretRefOut").textContent || "").replace(/^secretRef:\\s*/i, "").trim();
           base.auth = { type: "apikey", apiKey: secretRef || "authfile-REPLACE_ME" };
         }
-        $("providerJsonEditor").value = JSON.stringify(base, null, 2);
+        providerEditorSetValue(base);
+        providerEditorSetDirty(true);
       }
 
       function updateAuthModeUi() {
@@ -1078,74 +2000,678 @@
         }
       }
 
-      async function authorizeOauth() {
-        setLog("credentialOpLog", "");
-        const provider = $("oauthProviderSelect").value;
-        const alias = ($("oauthAuthAliasInput").value || "default").trim() || "default";
-        const openBrowser = $("oauthOpenBrowser").checked;
-        const forceReauthorize = $("oauthForceReauth").checked;
+	      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 {
-          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}`);
+          return new Date(ms).toLocaleString();
+        } catch {
+          return String(ms);
         }
       }
 
-      async function loadRouting() {
-        setLog("routingOpLog", "");
-        try {
-          const out = await apiFetch("/config/routing");
-          $("routingEditor").value = JSON.stringify(out.routing || {}, null, 2);
-          setLog("routingOpLog", `Loaded. Path: ${out.path || "—"}`);
-        } catch (e) {
-          setLog("routingOpLog", `Load failed: ${e.message}`);
-        }
+      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`;
       }
 
-      async function saveRouting() {
-        setLog("routingOpLog", "");
-        try {
-          const routing = JSON.parse($("routingEditor").value || "{}");
-          const out = await apiFetch("/config/routing", {
-            method: "PUT",
-            body: JSON.stringify({ routing })
-          });
-          setLog("routingOpLog", `Saved. Path: ${out.path || "—"}\nRestart required to apply.`);
-        } catch (e) {
-          setLog("routingOpLog", `Save failed: ${e.message}`);
+      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;
       }
 
-      async function refreshRuntimes() {
-        const body = $("runtimesTbody");
-        body.replaceChildren();
-        try {
-          const items = await apiFetch("/providers/runtimes");
-          for (const r of items || []) {
-            const tr = document.createElement("tr");
-            tr.appendChild(createCell("td", r.providerKey || "", "mono truncate", { title: true }));
-            tr.appendChild(createCell("td", r.runtimeKey || "", "mono truncate", { title: true }));
-            tr.appendChild(createCell("td", r.family || "", ""));
-            tr.appendChild(createCell("td", r.protocol || "", ""));
-            tr.appendChild(createCell("td", r.series || "", ""));
-            body.appendChild(tr);
+      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);
           }
-        } catch (e) {
-          body.appendChild(createErrorRow(5, e && e.message ? e.message : e));
         }
+        return resolved;
       }
 
-      function formatEpochMs(ms) {
-        if (typeof ms !== "number" || !Number.isFinite(ms) || ms <= 0) return "—";
+      async function refreshRoutingTargets() {
         try {
-          return new Date(ms).toLocaleString();
+          const routingOut = await apiFetch("/config/routing");
+          UI.routingTargets = extractRoutingTargets(routingOut && routingOut.routing ? routingOut.routing : {});
+          UI.routingTargetsUpdatedAt = Date.now();
         } catch {
-          return String(ms);
+          UI.routingTargets = null;
+          UI.routingTargetsUpdatedAt = Date.now();
         }
       }
 
@@ -1154,43 +2680,257 @@
         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");
-          const list = Array.isArray(out.providers) ? out.providers : [];
-          for (const q of list) {
+          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", q.providerKey || "", "mono truncate", { title: true }));
-            tr.appendChild(createCell("td", q.authType || "", ""));
-            tr.appendChild(createCell("td", String(Boolean(q.inPool)), ""));
-            tr.appendChild(createCell("td", q.reason || "", ""));
-            tr.appendChild(createCell("td", formatEpochMs(q.cooldownUntil), "mono"));
-            tr.appendChild(createCell("td", formatEpochMs(q.blacklistUntil), "mono"));
-            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", textOf(q.providerKey));
-            const reset = document.createElement("button");
-            reset.textContent = "Reset";
-            reset.setAttribute("data-action", "quota-reset");
-            reset.setAttribute("data-key", textOf(q.providerKey));
-            const disable = document.createElement("button");
-            disable.textContent = "Disable…";
-            disable.className = "danger";
-            disable.setAttribute("data-action", "quota-disable");
-            disable.setAttribute("data-key", textOf(q.providerKey));
-            box.appendChild(recover);
-            box.appendChild(reset);
-            box.appendChild(disable);
-            actionsTd.appendChild(box);
-            tr.appendChild(actionsTd);
+            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) {
-          body.appendChild(createErrorRow(8, e && e.message ? e.message : 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)}`);
         }
       }
 
@@ -1311,36 +3051,43 @@
 
       async function quotaAction(kind, providerKey) {
         setLog("quotaOpLog", "");
-        if (!providerKey) return;
+        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 minutesRaw = prompt("Disable duration (minutes)", "60");
-            if (!minutesRaw) return;
-            const minutes = Number.parseFloat(minutesRaw);
+            const minutes = Number.parseFloat(textOf($("quotaDurationSelect").value || "60"));
             if (!Number.isFinite(minutes) || minutes <= 0) {
               throw new Error("Invalid minutes");
             }
-            const modeRaw = prompt("Mode: cooldown or blacklist", "cooldown");
-            const mode = (modeRaw || "cooldown").trim().toLowerCase() === "blacklist" ? "blacklist" : "cooldown";
+            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)}`);
         }
       }
 
@@ -1351,8 +3098,11 @@
           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}`);
         }
       }
 
@@ -1361,6 +3111,119 @@
         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);
@@ -1387,14 +3250,15 @@
           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 refreshRuntimes();
-        } catch (e) {
-          setLog("providerOpLog", `Restart failed: ${e.message}`);
-        }
+	          await refreshStatus();
+	          await refreshProviders();
+	          await refreshCredentials();
+	          await refreshQuota();
+	          await refreshQuotaSnapshot();
+	          await refreshRuntimes();
+	        } catch (e) {
+	          setLog("providerOpLog", `Restart failed: ${e.message}`);
+	        }
       });
 
       $("refreshProvidersBtn").addEventListener("click", refreshProviders);
@@ -1402,20 +3266,36 @@
       $("newProviderBtn").addEventListener("click", () => {
         $("providerEditorTitle").textContent = "Provider editor (new)";
         $("providerIdInput").value = "";
-        $("providerJsonEditor").value = JSON.stringify(presetFor($("providerPreset").value), null, 2);
+        setSelectedProviderId("");
+        providerEditorSetValue(presetFor($("providerPreset").value));
         setLog("providerOpLog", "");
       });
       $("providersTbody").addEventListener("click", async (ev) => {
         const btn = ev.target.closest("button");
-        if (!btn) return;
-        const id = btn.getAttribute("data-id");
-        const action = btn.getAttribute("data-action");
-        if (action === "test" && id) {
-          await testProviderFromPool(id);
+        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;
         }
-        if (action === "edit") await loadProvider(id);
-        if (action === "delete") await deleteProvider(id);
+
+        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();
@@ -1427,7 +3307,16 @@
         const id = ($("providerIdInput").value || "").trim();
         await deleteProvider(id);
       });
-      $("createApiKeyCredentialBtn").addEventListener("click", createApiKeyCredential);
+      $("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();
@@ -1437,11 +3326,24 @@
       $("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 el = ev.target;
-        if (!el || el.tagName !== "BUTTON") return;
+        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);
@@ -1450,10 +3352,27 @@
 
       $("loadRoutingBtn").addEventListener("click", loadRouting);
       $("saveRoutingBtn").addEventListener("click", saveRouting);
-      $("refreshRuntimesBtn").addEventListener("click", refreshRuntimes);
+      $("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)";
@@ -1464,6 +3383,10 @@
         await refreshCredentials();
         await refreshQuota();
         await refreshRuntimes();
+        if (auth && auth.authenticated) {
+          await refreshRoutingSources();
+          await loadRouting();
+        }
         await loadSettings();
       })();
     </script>