feat: add token usage metrics and click-to-zoom charts

This commit:
- Bakes total/prompt/completion tokens directly into results.csv
- Reverts dynamic JSON scraping backend logic for speed
- Adds modal overlay functionality to zoom Chart.js graphs on click

1 files changed, 45 insertions, 0 deletions

diff --git a/api/static/css/components.css b/api/static/css/components.css
index de237c9..e576b3a 100644
--- a/api/static/css/components.css
+++ b/api/static/css/components.css
@@ -217,6 +217,51 @@
     text-decoration: underline;
 }
 
+/* Modal */
+.modal-overlay {
+    position: fixed;
+    top: 0; left: 0; right: 0; bottom: 0;
+    background-color: rgba(0, 0, 0, 0.85);
+    backdrop-filter: blur(4px);
+    z-index: 1000;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: var(--space-xl);
+}
+
+.modal-content {
+    background-color: var(--color-bg-1);
+    border: var(--border-width) solid var(--color-bg-3);
+    border-radius: var(--border-radius);
+    width: 90vw;
+    max-width: 1200px;
+    position: relative;
+    padding: var(--space-lg);
+    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
+}
+
+.btn-close {
+    position: absolute;
+    top: 10px;
+    right: 15px;
+    background: none;
+    border: none;
+    color: var(--color-text-muted);
+    font-size: 1.5rem;
+    cursor: pointer;
+    transition: var(--transition-fast);
+}
+
+.btn-close:hover {
+    color: var(--color-danger);
+}
+
+/* Make chart containers clickable */
+.chart-container canvas {
+    cursor: pointer;
+}
+
 @keyframes blink {
     0% { opacity: 1; }
     50% { opacity: 0.6; }