show token usage on per-agent web ui after each turn

hive-ag3nt/assets/agent.css

@@ -180,6 +180,12 @@ pre.diff {
   font-size: 0.78em;
   letter-spacing: 0.04em;
 }
+.token-usage {
+  color: var(--muted);
+  font-size: 0.8em;
+  letter-spacing: 0.04em;
+  cursor: default;
+}
 .btn-dashlink {
   color: var(--cyan);
   border: 1px solid var(--cyan);

hive-ag3nt/assets/app.js

@@ -412,6 +412,21 @@
     el_.hidden = false;
     el_.textContent = 'model · ' + model;
   }
+  function renderTokenUsage(u) {
+    const el_ = $('token-usage');
+    if (!el_) return;
+    if (!u) { el_.hidden = true; return; }
+    const ctx = u.input_tokens + u.cache_read_input_tokens + u.cache_creation_input_tokens;
+    const fmt = (n) => n >= 1000 ? (n / 1000).toFixed(1) + 'k' : String(n);
+    el_.hidden = false;
+    el_.title = [
+      'input: ' + u.input_tokens,
+      'output: ' + u.output_tokens,
+      'cache_read: ' + u.cache_read_input_tokens,
+      'cache_write: ' + u.cache_creation_input_tokens,
+    ].join(' · ');
+    el_.textContent = '· ctx ' + fmt(ctx) + ' in · ' + fmt(u.output_tokens) + ' out';
+  }
   function renderLastTurn(ms) {
     const el_ = $('last-turn');
     if (!el_) return;
@@ -485,6 +500,7 @@
         setStateAbs(s.turn_state, s.turn_state_since);
       }
       renderModelChip(s.model);
+      renderTokenUsage(s.token_usage);
       // Skip the re-render if nothing structurally changed. The most
       // common case is `online` polling itself — without this guard, the
       // operator's <input value> gets clobbered every cycle.

hive-ag3nt/assets/index.html

@@ -17,6 +17,7 @@
     <span id="state-badge" class="state-badge state-loading">… booting</span>
     <span id="model-chip" class="model-chip" hidden></span>
     <span id="last-turn" class="last-turn" hidden></span>
+    <span id="token-usage" class="token-usage" hidden></span>
     <button type="button" id="cancel-btn" class="btn-cancel-turn" hidden>■ cancel turn</button>
     <button type="button" id="new-session-btn" class="btn-new-session"
             title="next turn runs without --continue, starting a fresh claude session">↻ new session</button>