diff --git a/static/billing-dashboard.html b/static/billing-dashboard.html
index 0c1592a..b5ff794 100644
--- a/static/billing-dashboard.html
+++ b/static/billing-dashboard.html
@@ -411,6 +411,19 @@ footer{padding:10px 20px 16px;font-size:11px;color:var(--faint);text-align:cente
       </div>
     </div>
 
+      <!-- CG3e: Tokenbruk per agent -->
+    <div class="card" style="margin-top:12px">
+      <div class="card-hdr">
+        <span class="card-title">⚡ Tokenbruk per agent</span>
+        <span class="card-sub">Siste 30 dager</span>
+      </div>
+      <div id="token-usage-body">
+        <div class="empty-state">
+          <span class="material-symbols-outlined">bolt</span>
+          Laster tokendata...
+        </div>
+      </div>
+    </div>
   </main>
 </div>
 
@@ -822,6 +835,36 @@ if ('serviceWorker' in navigator) {
     });
   });
 }
+// CG3e: hent tokenbruk
+(function(){
+  fetch('/billing/tokens/summary')
+    .then(r=>r.ok?r.json():Promise.reject(r.status))
+    .then(data=>{
+      const body=document.getElementById('token-usage-body');
+      if(!data.rows||!data.rows.length){
+        body.innerHTML='<div class="empty-state"><span class="material-symbols-outlined">bolt</span>Ingen tokendata ennå</div>';
+        return;
+      }
+      body.innerHTML=`<table style="width:100%;border-collapse:collapse;font-size:13px">
+        <thead><tr style="color:var(--muted);font-size:11px;text-align:left">
+          <th style="padding:6px 0">Agent</th>
+          <th>Modell</th>
+          <th style="text-align:right">Tokens</th>
+          <th style="text-align:right">Kost (USD)</th>
+        </tr></thead>
+        <tbody>${data.rows.map(r=>`<tr style="border-top:1px solid var(--border)">
+          <td style="padding:7px 0">${r.agent_name}</td>
+          <td style="color:var(--muted)">${r.model_name}</td>
+          <td style="text-align:right;font-family:var(--mono)">${r.total_tokens.toLocaleString()}</td>
+          <td style="text-align:right;font-family:var(--mono)">$${r.total_cost_usd.toFixed(4)}</td>
+        </tr>`).join('')}</tbody>
+      </table>`;
+    })
+    .catch(()=>{
+      document.getElementById('token-usage-body').innerHTML=
+        '<div class="empty-state"><span class="material-symbols-outlined">bolt</span>Ingen tokendata ennå</div>';
+    });
+})();
 </script>
 
 </body>