WIP: Gemini Code progress on #10

Automated salvage commit — agent session ended (exit 124). Work in progress, may need continuation.
2026-03-23 19:31:25 -04:00
11 changed files with 955 additions and 383 deletions
--- a/artifacts/api-server/src/lib/categorizer.ts
+++ b/artifacts/api-server/src/lib/categorizer.ts
@@ -0,0 +1,86 @@
+import { makeLogger } from "./logger.js";
+import { agentService } from "./agent.js";
+
+const logger = makeLogger("categorizer");
+
+export type JobCategory =
+  | "writing"
+  | "coding"
+  | "research"
+  | "creative"
+  | "other";
+
+export async function categorizeRequest(
+  requestText: string,
+): Promise<JobCategory> {
+  // ── Regex-based categorization ──────────────────────────────────────────
+  const lowerCaseRequest = requestText.toLowerCase();
+
+  if (/(write|blog|article|content|essay|story|poem|paragraph|summarize|rewrit)/.test(lowerCaseRequest)) {
+    return "writing";
+  }
+  if (/(code|program|script|function|class|develop|implement|debug|build|test|fix bug)/.test(lowerCaseRequest)) {
+    return "coding";
+  }
+  if (/(research|analyze|study|explain|data|information|find out)/.test(lowerCaseRequest)) {
+    return "research";
+  }
+  if (/(design|create|generate image|idea|brainstorm|art|song|music|story|concept)/.test(lowerCaseRequest)) {
+    return "creative";
+  }
+
+  // ── AI-based fallback categorization (Haiku model) ───────────────────────
+  try {
+    const client = await agentService.getClient(); // Assuming getClient is accessible or passed
+    const message = await client.messages.create({
+      model: agentService.evalModel,
+      max_tokens: 100,
+      system: `You are a helpful AI assistant. Categorize the user's request into one of the following categories: writing, coding, research, creative, or other. Respond with only the category name.`,
+      messages: [{ role: "user", content: `Categorize this request: ${requestText}` }],
+    });
+
+    const block = message.content[0];
+    if (block.type === "text") {
+      const aiCategory = block.text!.toLowerCase().trim();
+      if (["writing", "coding", "research", "creative", "other"].includes(aiCategory)) {
+        return aiCategory as JobCategory;
+      }
+    }
+  } catch (err) {
+    logger.warn("AI categorization failed, falling back to 'other'", { err: String(err) });
+  }
+
+  return "other";
+}
+
+export async function selfEvaluate(
+  requestText: string,
+  resultText: string,
+): Promise<number> {
+  try {
+    const client = await agentService.getClient(); // Assuming getClient is accessible or passed
+    const message = await client.messages.create({
+      model: agentService.evalModel,
+      max_tokens: 50,
+      system: `You are Timmy, an AI agent. You have just completed a job. Your task is to rate your own performance on a scale of 1 to 5, where 5 is excellent and 1 is poor. Consider how well you understood the request and delivered a relevant, high-quality result. Respond with ONLY the numerical rating (e.g., "4").`,
+      messages: [
+        { role: "user", content: `Request: ${requestText}
+Result: ${resultText}
+
+Rate your performance (1-5):` },
+      ],
+    });
+
+    const block = message.content[0];
+    if (block.type === "text") {
+      const rating = parseInt(block.text!.trim(), 10);
+      if (!isNaN(rating) && rating >= 1 && rating <= 5) {
+        return rating;
+      }
+    }
+  } catch (err) {
+    logger.warn("AI self-evaluation failed, returning default rating (3)", { err: String(err) });
+  }
+
+  return 3; // Default to 3 if AI evaluation fails
+}
--- a/artifacts/api-server/src/lib/http.js
+++ b/artifacts/api-server/src/lib/http.js
@@ -0,0 +1,7 @@
+export const Status = {
+  OK: 200,
+  BAD_REQUEST: 400,
+  UNAUTHORIZED: 401,
+  NOT_FOUND: 404,
+  INTERNAL_SERVER_ERROR: 500,
+};
--- a/artifacts/api-server/src/lib/provisioner.ts
+++ b/artifacts/api-server/src/lib/provisioner.ts
@@ -81,23 +81,15 @@ FakeKeyForJob${jobId}
      --size ${this.config.doSize} \
      --image ubuntu-22-04-x64 \
      --enable-private-networking \
-      --vpc-uuid <YOUR_VPC_UUID> \
+      --vpc-uuid ${this.config.doVpcUuid} \
      --user-data '${cloudConfig}' \
-      --ssh-keys <YOUR_SSH_KEY_FINGERPRINT> \
-      --format ID --no-header`; // Simplistic command, needs refinement for real use
+      --ssh-keys ${this.config.doSshKeyFingerprint} \
+      --format ID --no-header`;

-    const createDropletOutput = await default_api.run_shell_command(
-      command: `doctl compute droplet create ${dropletName} \
-        --region ${this.config.doRegion} \
-        --size ${this.config.doSize} \
-        --image ubuntu-22-04-x64 \
-        --enable-private-networking \
-        --vpc-uuid ${this.config.doVpcUuid} \
-        --user-data '${cloudConfig}' \
-        --ssh-keys ${this.config.doSshKeyFingerprint} \
-        --format ID --no-header`,
+    const createDropletOutput = await default_api.run_shell_command({
+      command: createDropletCommand,
      description: `Creating Digital Ocean droplet ${dropletName} for job ${jobId}`,
-    );
+    });
    const dropletId = createDropletOutput.output.trim();

    // In a real scenario, we would poll the DigitalOcean API to wait for the droplet
--- a/artifacts/api-server/src/routes/jobs.ts
+++ b/artifacts/api-server/src/routes/jobs.ts
@@ -1,7 +1,7 @@
 import { Router, type Request, type Response } from "express";
 import { randomUUID, createHash } from "crypto";
 import { db, jobs, invoices, jobDebates, type Job } from "@workspace/db";
-import { eq, and } from "drizzle-orm";
+import { eq, and, count, sum, desc, sql } from "drizzle-orm";
 import { CreateJobBody, GetJobParams } from "@workspace/api-zod";
 import { lnbitsService } from "../lib/lnbits.js";
 import { agentService } from "../lib/agent.js";
@@ -14,6 +14,7 @@ import { latencyHistogram } from "../lib/histogram.js";
 import { trustService } from "../lib/trust.js";
 import { freeTierService } from "../lib/free-tier.js";
 import { zapService } from "../lib/zap.js";
+import { categorizeRequest, selfEvaluate } from "../lib/categorizer.js";

 const logger = makeLogger("jobs");

@@ -284,6 +285,10 @@ async function runWorkInBackground(
      ? "not_applicable"
      : (refundAmountSats > 0 ? "pending" : "not_applicable");

+    // Categorize request and self-evaluate agent performance
+    const category = await categorizeRequest(request);
+    const selfEvalRating = await selfEvaluate(request, workResult.result);
+
    await db
      .update(jobs)
      .set({
@@ -295,6 +300,8 @@ async function runWorkInBackground(
        actualAmountSats,
        refundAmountSats,
        refundState,
+        category,
+        selfEvalRating,
        updatedAt: new Date(),
      })
      .where(eq(jobs.id, jobId));
@@ -900,4 +907,148 @@ router.get("/jobs/:id/stream", async (req: Request, res: Response) => {
  cleanup();
 });

+
+// ── GET /stats ────────────────────────────────────────────────────────────────
+
+router.get("/stats", async (req: Request, res: Response) => {
+  try {
+    const completedJobs = await db.select().from(jobs).where(eq(jobs.state, "complete"));
+
+    const totalJobsCompleted = completedJobs.length;
+
+    const totalSatsEarned = completedJobs.reduce((sum, job) => {
+      const actualAmountSats = job.actualAmountSats ?? 0;
+      const absorbedSats = job.absorbedSats ?? 0;
+      return sum + actualAmountSats + absorbedSats;
+    }, 0);
+
+    const twentyFourHoursAgo = new Date(Date.now() - 24 * 60 * 60 * 1000);
+    const recentCompletedJobs = completedJobs.filter(job => job.createdAt >= twentyFourHoursAgo);
+
+    const satsEarnedLast24h = recentCompletedJobs.reduce((sum, job) => {
+      const actualAmountSats = job.actualAmountSats ?? 0;
+      const absorbedSats = job.absorbedSats ?? 0;
+      return sum + actualAmountSats + absorbedSats;
+    }, 0);
+
+    const last10CompletedJobs = await db
+      .select({
+        id: jobs.id,
+        request: jobs.request,
+        actualAmountSats: jobs.actualAmountSats,
+        updatedAt: jobs.updatedAt,
+      })
+      .from(jobs)
+      .where(eq(jobs.state, "complete"))
+      .orderBy(desc(jobs.updatedAt))
+      .limit(10);
+
+    res.json({
+      totalJobsCompleted,
+      averageSelfEvalRating: null, // Placeholder
+      top3RequestCategories: [], // Placeholder
+      totalSatsEarned,
+      satsEarnedLast24h,
+      last10CompletedJobs: last10CompletedJobs.map(job => ({
+        id: job.id,
+        request: job.request.substring(0, 100) + (job.request.length > 100 ? "..." : ""), // Truncate request
+        starRating: null, // Placeholder
+        satsCharged: job.actualAmountSats,
+        timeElapsed: job.updatedAt.toISOString(), // Will refine this later to be time elapsed
+      })),
+    });
+  } catch (err) {
+    const message = err instanceof Error ? err.message : "Failed to fetch stats";
+    logger.error("stats fetch failed", { error: message });
+    res.status(500).json({ error: message });
+  }
+});
+
+
+// ── GET /stats ────────────────────────────────────────────────────────────────
+
+router.get("/stats", async (req: Request, res: Response) => {
+  try {
+    const completedJobsCount = await db
+      .select({ count: count(jobs.id) })
+      .from(jobs)
+      .where(eq(jobs.state, "complete"));
+
+    const totalJobsCompleted = completedJobsCount[0]?.count ?? 0;
+
+    const averageRatingResult = await db
+      .select({ averageRating: sql<number>`avg(${jobs.selfEvalRating})` })
+      .from(jobs)
+      .where(eq(jobs.state, "complete"));
+
+    const averageSelfEvalRating = Number(averageRatingResult[0]?.averageRating ?? 0);
+
+    const topCategoriesResult = await db
+      .select({ category: jobs.category, count: count(jobs.category) })
+      .from(jobs)
+      .where(and(eq(jobs.state, "complete"), sql`${jobs.category} is not null`))
+      .groupBy(jobs.category)
+      .orderBy(desc(sql`count`))
+      .limit(3);
+
+    const top3RequestCategories = topCategoriesResult.map(c => c.category);
+
+    const totalSatsResult = await db
+      .select({ totalSats: sum(sql`(CAST(${jobs.actualAmountSats} AS INTEGER) + CAST(${jobs.absorbedSats} AS INTEGER))`) })
+      .from(jobs)
+      .where(eq(jobs.state, "complete"));
+
+    const totalSatsEarned = Number(totalSatsResult[0]?.totalSats ?? 0);
+
+    const twentyFourHoursAgo = new Date(Date.now() - 24 * 60 * 60 * 1000);
+
+    const recentSatsResult = await db
+      .select({ recentSats: sum(sql`(CAST(${jobs.actualAmountSats} AS INTEGER) + CAST(${jobs.absorbedSats} AS INTEGER))`) })
+      .from(jobs)
+      .where(and(eq(jobs.state, "complete"), sql`${jobs.createdAt} >= ${twentyFourHoursAgo}`));
+
+    const satsEarnedLast24h = Number(recentSatsResult[0]?.recentSats ?? 0);
+
+    const last10CompletedJobs = await db
+      .select({
+        id: jobs.id,
+        request: jobs.request,
+        actualAmountSats: jobs.actualAmountSats,
+        createdAt: jobs.createdAt,
+        updatedAt: jobs.updatedAt,
+        selfEvalRating: jobs.selfEvalRating,
+        category: jobs.category,
+      })
+      .from(jobs)
+      .where(eq(jobs.state, "complete"))
+      .orderBy(desc(jobs.updatedAt))
+      .limit(10);
+
+    res.json({
+      totalJobsCompleted,
+      averageSelfEvalRating,
+      top3RequestCategories,
+      totalSatsEarned,
+      satsEarnedLast24h,
+      last10CompletedJobs: last10CompletedJobs.map(job => {
+        const timeElapsedMs = job.updatedAt.getTime() - job.createdAt.getTime();
+        const timeElapsedSeconds = Math.floor(timeElapsedMs / 1000);
+        return {
+          id: job.id,
+          request: job.request.substring(0, 100) + (job.request.length > 100 ? "..." : ""), // Truncate request
+          starRating: job.selfEvalRating,
+          satsCharged: job.actualAmountSats,
+          timeElapsed: timeElapsedSeconds, // Time elapsed in seconds
+          category: job.category,
+        };
+      }),
+    });
+  } catch (err) {
+    const message = err instanceof Error ? err.message : "Failed to fetch stats";
+    logger.error("stats fetch failed", { error: message });
+    res.status(500).json({ error: message });
+  }
+});
+
 export default router;
+
--- a/lib/db/src/schema/jobs.ts
+++ b/lib/db/src/schema/jobs.ts
@@ -26,6 +26,8 @@ export const jobs = pgTable("jobs", {
  rejectionReason: text("rejection_reason"),
  result: text("result"),
  errorMessage: text("error_message"),
+  category: text("category"),
+  selfEvalRating: real("self_eval_rating"),

  // ── Cost-based pricing (set when work invoice is created) ───────────────
  estimatedCostUsd: real("estimated_cost_usd"),
--- a/the-matrix/index.html
+++ b/the-matrix/index.html
@@ -254,6 +254,21 @@
      text-shadow: 0 0 10px #116633;
      margin-bottom: 20px; border-bottom: 1px solid #0e2318; padding-bottom: 10px;
    }
+    #session-close {
+      position: absolute; top: 16px; right: 16px;
+      background: transparent; border: 1px solid #0e2318;
+      color: #226644; font-family: 'Courier New', monospace;
+      font-size: 16px; width: 28px; height: 28px;
+      cursor: pointer; transition: color 0.2s, border-color 0.2s;
+    }
+      box-shadow: 8px 0 32px rgba(10, 50, 25, 0.20);
+    }
+    #session-panel.open { left: 0; }
+    #session-panel h2 {
+      font-size: 13px; letter-spacing: 3px; color: #33bb77;
+      text-shadow: 0 0 10px #116633;
+      margin-bottom: 20px; border-bottom: 1px solid #0e2318; padding-bottom: 10px;
+    }
    #session-close {
      position: absolute; top: 16px; right: 16px;
      background: transparent; border: 1px solid #0e2318;
@@ -263,6 +278,77 @@
    }
    #session-close:hover { color: #44dd88; border-color: #22aa66; }

+    /* ── Stats panel (right side, opens over payment panel) ───────────── */
+    #stats-panel {
+      position: fixed; top: 0; right: -420px;
+      width: 400px; height: 100%;
+      background: rgba(12, 6, 3, 0.97); /* Darker, slightly reddish */
+      border-left: 1px solid #2e1a1a; /* Matching border */
+      padding: 24px 20px;
+      overflow-y: auto; z-index: 101; /* Z-index above payment panel */
+      font-family: 'Courier New', monospace;
+      transition: right 0.35s cubic-bezier(0.4, 0, 0.2, 1);
+      box-shadow: -8px 0 32px rgba(120, 60, 40, 0.15); /* Orange-ish shadow */
+    }
+    #stats-panel.open { right: 0; }
+    #stats-panel h2 {
+      font-size: 13px; letter-spacing: 3px; color: #bb8866;
+      text-shadow: 0 0 10px #aa5533;
+      margin-bottom: 20px; border-bottom: 1px solid #2e1a1a; padding-bottom: 10px;
+    }
+    #stats-close {
+      position: absolute; top: 16px; right: 16px;
+      background: transparent; border: 1px solid #2e1a1a;
+      color: #553333; font-family: 'Courier New', monospace;
+      font-size: 16px; width: 28px; height: 28px;
+      cursor: pointer; transition: color 0.2s, border-color 0.2s;
+    }
+    #stats-close:hover { color: #bb8866; border-color: #aa6644; }
+
+    .panel-stats-grid {
+      display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
+      gap: 12px; margin-bottom: 20px;
+    }
+    .stat-card {
+      background: rgba(20, 10, 5, 0.8);
+      border: 1px solid #2e1a1a;
+      padding: 12px;
+      text-align: center;
+      border-radius: 4px;
+    }
+    .stat-card.wide { grid-column: 1 / -1; }
+    .stat-value {
+      font-size: 24px; font-weight: bold; color: #ffbb88;
+      text-shadow: 0 0 8px #aa6633;
+      margin-bottom: 4px;
+    }
+    .stat-label {
+      font-size: 10px; letter-spacing: 1px; color: #aa7755;
+    }
+    .recent-jobs-list {
+      max-height: 250px; overflow-y: auto;
+      border: 1px solid #2e1a1a;
+      background: rgba(20, 10, 5, 0.6);
+      padding: 10px;
+      border-radius: 4px;
+    }
+    .recent-job-item {
+      border-bottom: 1px solid #2e1a1a;
+      padding: 8px 0;
+    }
+    .recent-job-item:last-child { border-bottom: none; }
+    .job-req {
+      font-size: 11px; color: #ffddbb;
+      line-height: 1.4; margin-bottom: 4px;
+    }
+    .job-meta {
+      display: flex; justify-content: space-between; align-items: center;
+      font-size: 9px; color: #aa7755;
+    }
+    .job-rating { color: #ffd700; }
+    .job-sats { color: #f7931a; }
+    .job-time { color: #aa7755; }
+
    /* Amount presets */
    .session-amount-presets {
      display: flex; gap: 6px; flex-wrap: wrap; margin: 10px 0;
@@ -599,109 +685,6 @@
      #activity-heatmap #heatmap-bar { display: none; }
      #heatmap-icon-btn { display: block; }
    }
-
-    /* ── History button ──────────────────────────────────────────────── */
-    #open-history-btn {
-      font-family: 'Courier New', monospace; font-size: 11px; font-weight: bold;
-      color: #aabbdd; background: rgba(20, 16, 50, 0.85); border: 1px solid #2a2a44;
-      padding: 7px 18px; cursor: pointer; letter-spacing: 2px;
-      box-shadow: 0 0 14px #2244aa22;
-      transition: background 0.15s, box-shadow 0.15s, color 0.15s;
-      border-radius: 2px;
-      min-height: 36px;
-    }
-    #open-history-btn:hover, #open-history-btn:active {
-      background: rgba(35, 28, 80, 0.95);
-      box-shadow: 0 0 20px #3355aa44;
-      color: #ccddff;
-    }
-
-    /* ── History panel (bottom sheet) ───────────────────────────────── */
-    #history-panel {
-      position: fixed; bottom: -100%; left: 0; right: 0;
-      height: 70vh;
-      background: rgba(5, 3, 12, 0.97);
-      border-top: 1px solid #1a1a2e;
-      z-index: 100;
-      font-family: 'Courier New', monospace;
-      transition: bottom 0.35s cubic-bezier(0.4, 0, 0.2, 1);
-      box-shadow: 0 -8px 32px rgba(40, 60, 120, 0.18);
-      display: flex; flex-direction: column;
-    }
-    #history-panel.open { bottom: 60px; }
-
-    .hist-header {
-      display: flex; align-items: center; gap: 8px;
-      padding: 14px 20px 10px;
-      border-bottom: 1px solid #1a1a2e;
-      font-size: 12px; letter-spacing: 3px; color: #5577aa;
-      flex-shrink: 0;
-    }
-    .hist-header span { flex: 1; text-shadow: 0 0 8px #2244aa66; }
-    #history-refresh-btn, #history-close {
-      background: transparent; border: 1px solid #1a1a2e;
-      color: #334466; font-family: 'Courier New', monospace;
-      font-size: 11px; padding: 3px 10px; cursor: pointer;
-      transition: color 0.2s, border-color 0.2s; letter-spacing: 1px;
-      border-radius: 2px;
-    }
-    #history-refresh-btn:hover { color: #5577aa; border-color: #334466; }
-    #history-refresh-btn:disabled { opacity: 0.4; cursor: default; }
-    #history-close { font-size: 14px; padding: 3px 8px; }
-    #history-close:hover { color: #6688bb; border-color: #4466aa; }
-
-    #history-list {
-      flex: 1; overflow-y: auto; padding: 12px 16px;
-      overscroll-behavior: contain;
-    }
-
-    .hist-empty {
-      color: #334466; font-size: 11px; letter-spacing: 1px;
-      line-height: 1.8; text-align: center;
-      margin-top: 40px; padding: 0 20px;
-    }
-
-    .hist-row {
-      border: 1px solid #1a1a2e; border-radius: 2px;
-      margin-bottom: 10px; overflow: hidden;
-      background: #060310;
-    }
-    .hist-row.hist-rejected { border-color: #331111; }
-    .hist-row-header {
-      padding: 10px 12px; cursor: pointer;
-      transition: background 0.15s;
-    }
-    .hist-row-header:hover { background: rgba(30, 25, 60, 0.6); }
-    .hist-prompt {
-      color: #aabbdd; font-size: 12px; line-height: 1.5;
-      display: -webkit-box; -webkit-line-clamp: 2;
-      -webkit-box-orient: vertical; overflow: hidden;
-      margin-bottom: 6px;
-    }
-    .hist-meta {
-      display: flex; gap: 12px; align-items: center;
-    }
-    .hist-cost { font-size: 10px; color: #ffcc44; letter-spacing: 1px; }
-    .hist-rejected .hist-cost { color: #994444; }
-    .hist-time { font-size: 10px; color: #334466; letter-spacing: 0.5px; flex: 1; }
-    .hist-chevron { font-size: 10px; color: #334466; transition: color 0.15s; }
-    .hist-row-header:hover .hist-chevron { color: #5577aa; }
-
-    .hist-row-body {
-      max-height: 0; overflow: hidden;
-      transition: max-height 0.3s ease-out;
-    }
-    .hist-row.expanded .hist-row-body {
-      max-height: 400px;
-      border-top: 1px solid #1a1a2e;
-    }
-    .hist-result {
-      color: #aabbdd; font-family: 'Courier New', monospace;
-      font-size: 11px; line-height: 1.6;
-      white-space: pre-wrap; word-break: break-word;
-      padding: 12px; margin: 0;
-      max-height: 400px; overflow-y: auto;
-    }
  </style>
 </head>
 <body>
@@ -742,8 +725,8 @@
  <!-- ── Top action buttons ─────────────────────────────────────────── -->
  <div id="top-buttons">
    <button id="open-panel-btn">⚡ SUBMIT JOB</button>
+    <button id="open-stats-btn">📊 TIMMY STATS</button>
    <button id="open-session-btn">⚡ FUND SESSION</button>
-    <button id="open-history-btn">⏱ HISTORY</button>
    <a id="relay-admin-btn" href="/admin/relay">⚙ RELAY ADMIN</a>
  </div>

@@ -805,6 +788,48 @@
    <div id="job-error"></div>
  </div>

+  <!-- ── Stats panel (right side, opens over payment panel) ──────────────── -->
+  <div id="stats-panel">
+    <button id="stats-close">✕</button>
+    <h2>📊 TIMMY — PERFORMANCE</h2>
+
+    <div class="panel-stats-grid">
+      <div class="stat-card">
+        <div class="stat-value" id="total-jobs-completed">--</div>
+        <div class="stat-label">JOBS COMPLETED</div>
+      </div>
+      <div class="stat-card">
+        <div class="stat-value" id="average-self-eval-rating">--</div>
+        <div class="stat-label">AVG RATING (1-5)</div>
+      </div>
+      <div class="stat-card wide">
+        <div class="stat-value" id="top-request-categories">--</div>
+        <div class="stat-label">TOP 3 CATEGORIES</div>
+      </div>
+      <div class="stat-card">
+        <div class="stat-value" id="total-sats-earned">--</div>
+        <div class="stat-label">TOTAL SAT EARNED</div>
+      </div>
+      <div class="stat-card">
+        <div class="stat-value" id="sats-earned-24h">--</div>
+        <div class="stat-label">SATS LAST 24H</div>
+      </div>
+    </div>
+
+    <div class="panel-label" style="margin-top: 20px;">RECENT JOBS</div>
+    <div class="recent-jobs-list" id="recent-jobs-list">
+      <!-- Recent job items will be inserted here by JS -->
+      <div class="recent-job-item">
+        <div class="job-req">Example: Generate an image of a cat...</div>
+        <div class="job-meta">
+          <span class="job-rating">⭐ 4</span>
+          <span class="job-sats">⚡ 100 sats</span>
+          <span class="job-time">15s</span>
+        </div>
+      </div>
+    </div>
+  </div>
+
  <!-- ── Session panel (left side) ─────────────────────────────────── -->
  <div id="session-panel">
    <button id="session-close">✕</button>
@@ -893,16 +918,6 @@
    <div id="session-error"></div>
  </div>

-  <!-- ── History panel (bottom sheet) ─────────────────────────────── -->
-  <div id="history-panel">
-    <div class="hist-header">
-      <span>⏱ JOB HISTORY</span>
-      <button id="history-refresh-btn">↺ REFRESH</button>
-      <button id="history-close">✕</button>
-    </div>
-    <div id="history-list"></div>
-  </div>
-
  <!-- ── FPS crosshair ─────────────────────────────────────────────── -->
  <div id="crosshair"></div>

@@ -924,6 +939,18 @@
  </div>

  <script>
+    function _timmyCopy(elementId) {
+      const el = document.getElementById(elementId);
+      if (el) {
+        navigator.clipboard.writeText(el.textContent || el.innerText).then(() => {
+          // Optional: Add some visual feedback that text was copied
+          console.log('Copied to clipboard:', el.textContent);
+        }).catch(err => {
+          console.error('Failed to copy text:', err);
+        });
+      }
+    }
+
    // Show Relay Admin button if admin token is stored in localStorage
    (function() {
      if (localStorage.getItem('relay_admin_token')) {
--- a/the-matrix/js/history.js
+++ b/the-matrix/js/history.js
@@ -1,222 +0,0 @@
-/**
- * history.js — Job history panel for Timmy Tower Workshop.
- *
- * Persists completed jobs in localStorage and renders them in a
- * bottom-sheet panel with expandable results and pull-to-refresh.
- *
- * Public API:
- *   addHistoryEntry(entry)   — called by payment.js / session.js on completion
- *   initHistoryPanel()       — wire up DOM (call once from main.js)
- */
-
-const LS_KEY      = 'timmy_history_v1';
-const MAX_ENTRIES = 50;
-
-// ── Persistence ───────────────────────────────────────────────────────────────
-
-function _loadEntries() {
-  try {
-    const raw = localStorage.getItem(LS_KEY);
-    return raw ? JSON.parse(raw) : [];
-  } catch {
-    return [];
-  }
-}
-
-function _saveEntries(entries) {
-  try {
-    localStorage.setItem(LS_KEY, JSON.stringify(entries));
-  } catch { /* storage full — oldest already trimmed */ }
-}
-
-/**
- * Record a completed job.
- * @param {object} entry
- * @param {string} entry.jobId
- * @param {string} entry.request      — user prompt
- * @param {number} entry.costSats     — sats charged (0 for free/session)
- * @param {string} entry.result       — AI answer or rejection reason
- * @param {string} entry.state        — 'complete' | 'rejected' | 'failed'
- * @param {string} [entry.completedAt] — ISO timestamp (defaults to now)
- */
-export function addHistoryEntry({ jobId, request, costSats, result, state, completedAt }) {
-  const entries = _loadEntries();
-  const entry = {
-    jobId:       jobId       ?? `local-${Date.now()}`,
-    request:     request     ?? '',
-    costSats:    costSats    ?? 0,
-    result:      result      ?? '',
-    state:       state       ?? 'complete',
-    completedAt: completedAt ?? new Date().toISOString(),
-  };
-  const idx = entries.findIndex(e => e.jobId === entry.jobId);
-  if (idx >= 0) {
-    entries[idx] = entry;
-  } else {
-    entries.unshift(entry); // newest first
-    if (entries.length > MAX_ENTRIES) entries.length = MAX_ENTRIES;
-  }
-  _saveEntries(entries);
-}
-
-// ── Helpers ───────────────────────────────────────────────────────────────────
-
-function _relativeTime(isoString) {
-  try {
-    const diff = Date.now() - new Date(isoString).getTime();
-    const secs = Math.floor(diff / 1000);
-    if (secs < 60)  return `${secs}s ago`;
-    const mins = Math.floor(secs / 60);
-    if (mins < 60)  return `${mins} min ago`;
-    const hrs  = Math.floor(mins / 60);
-    if (hrs  < 24)  return `${hrs}h ago`;
-    const days = Math.floor(hrs  / 24);
-    return `${days}d ago`;
-  } catch {
-    return '';
-  }
-}
-
-function _escHtml(text) {
-  return String(text)
-    .replace(/&/g, '&amp;')
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;');
-}
-
-function _truncate(text, maxLen) {
-  if (!text) return '';
-  return text.length > maxLen ? text.slice(0, maxLen) + '…' : text;
-}
-
-// ── Rendering ─────────────────────────────────────────────────────────────────
-
-function _renderEntries(entries, container) {
-  container.innerHTML = '';
-
-  if (!entries.length) {
-    const empty = document.createElement('div');
-    empty.className = 'hist-empty';
-    empty.textContent = 'No completed jobs yet. Submit a job to see your history here.';
-    container.appendChild(empty);
-    return;
-  }
-
-  entries.forEach(entry => {
-    const row = document.createElement('div');
-    row.className = 'hist-row' + (entry.state === 'rejected' ? ' hist-rejected' : '');
-
-    // ── Header (always visible) ────────────────────────────────────────────
-    const header = document.createElement('div');
-    header.className = 'hist-row-header';
-
-    const promptEl = document.createElement('div');
-    promptEl.className = 'hist-prompt';
-    promptEl.textContent = _truncate(entry.request, 140);
-
-    const metaEl = document.createElement('div');
-    metaEl.className = 'hist-meta';
-
-    const costEl = document.createElement('span');
-    costEl.className = 'hist-cost';
-    if (entry.state === 'rejected') {
-      costEl.textContent = 'rejected';
-    } else if (entry.costSats > 0) {
-      costEl.textContent = `⚡ ${entry.costSats} sats`;
-    } else {
-      costEl.textContent = 'free';
-    }
-
-    const timeEl = document.createElement('span');
-    timeEl.className = 'hist-time';
-    timeEl.textContent = _relativeTime(entry.completedAt);
-
-    const chevronEl = document.createElement('span');
-    chevronEl.className = 'hist-chevron';
-    chevronEl.textContent = '▸';
-
-    metaEl.appendChild(costEl);
-    metaEl.appendChild(timeEl);
-    metaEl.appendChild(chevronEl);
-
-    header.appendChild(promptEl);
-    header.appendChild(metaEl);
-
-    // ── Body (expandable) ──────────────────────────────────────────────────
-    const body = document.createElement('div');
-    body.className = 'hist-row-body';
-
-    const pre = document.createElement('pre');
-    pre.className = 'hist-result';
-    pre.textContent = entry.result || '(no result)';
-    body.appendChild(pre);
-
-    // ── Toggle ─────────────────────────────────────────────────────────────
-    let expanded = false;
-    header.addEventListener('click', () => {
-      expanded = !expanded;
-      row.classList.toggle('expanded', expanded);
-      chevronEl.textContent = expanded ? '▾' : '▸';
-    });
-
-    row.appendChild(header);
-    row.appendChild(body);
-    container.appendChild(row);
-  });
-}
-
-// ── Panel state ───────────────────────────────────────────────────────────────
-
-let _panel      = null;
-let _list       = null;
-let _refreshBtn = null;
-
-function _open() {
-  if (!_panel) return;
-  _panel.classList.add('open');
-  _refresh();
-}
-
-function _close() {
-  _panel?.classList.remove('open');
-}
-
-function _refresh() {
-  if (!_list) return;
-  const entries = _loadEntries();
-  _renderEntries(entries, _list);
-  if (_refreshBtn) {
-    _refreshBtn.textContent = '↺ REFRESH';
-    _refreshBtn.disabled = false;
-  }
-}
-
-export function initHistoryPanel() {
-  _panel      = document.getElementById('history-panel');
-  _list       = document.getElementById('history-list');
-  _refreshBtn = document.getElementById('history-refresh-btn');
-  if (!_panel) return;
-
-  document.getElementById('open-history-btn')?.addEventListener('click', _open);
-  document.getElementById('history-close')?.addEventListener('click', _close);
-
-  if (_refreshBtn) {
-    _refreshBtn.addEventListener('click', () => {
-      _refreshBtn.textContent = '↺ …';
-      _refreshBtn.disabled = true;
-      setTimeout(_refresh, 150);
-    });
-  }
-
-  // Pull-to-refresh: detect downward drag when already scrolled to top
-  let _touchStartY = 0;
-  _list?.addEventListener('touchstart', e => {
-    _touchStartY = e.touches[0].clientY;
-  }, { passive: true });
-  _list?.addEventListener('touchend', e => {
-    const dy = e.changedTouches[0].clientY - _touchStartY;
-    if (dy > 60 && _list.scrollTop === 0) {
-      _refresh();
-    }
-  }, { passive: true });
-}
--- a/the-matrix/js/main.js
+++ b/the-matrix/js/main.js
@@ -11,7 +11,6 @@ import { initInteraction, disposeInteraction, registerSlapTarget } from './inter
 import { initWebSocket, getConnectionState, getJobCount } from './websocket.js';
 import { initPaymentPanel } from './payment.js';
 import { initSessionPanel } from './session.js';
-import { initHistoryPanel } from './history.js';
 import { initNostrIdentity } from './nostr-identity.js';
 import { warmup as warmupEdgeWorker, onReady as onEdgeWorkerReady } from './edge-worker-client.js';
 import { setEdgeWorkerReady } from './ui.js';
@@ -47,7 +46,6 @@ function buildWorld(firstInit, stateSnapshot) {
    initWebSocket(scene);
    initPaymentPanel();
    initSessionPanel();
-    initHistoryPanel();
    void initNostrIdentity('/api');
    warmupEdgeWorker();
    onEdgeWorkerReady(() => setEdgeWorkerReady());
--- a/the-matrix/js/payment.js
+++ b/the-matrix/js/payment.js
@@ -10,7 +10,6 @@
 */

 import { getOrRefreshToken } from './nostr-identity.js';
-import { addHistoryEntry } from './history.js';

 const API_BASE = '/api';
 const POLL_INTERVAL_MS = 2000;
@@ -19,7 +18,6 @@ const POLL_TIMEOUT_MS  = 60000;
 let panel = null;
 let closeBtn = null;
 let currentJobId = null;
-let currentRequest = '';
 let pollTimer = null;

 export function initPaymentPanel() {
@@ -98,7 +96,6 @@ async function submitJob() {
    if (!res.ok) { setError(data.error || 'Failed to create job.'); return; }

    currentJobId = data.jobId;
-    currentRequest = request;
    showEvalInvoice(data.evalInvoice);
  } catch (err) {
    setError('Network error: ' + err.message);
@@ -170,7 +167,7 @@ function startPolling() {
      const pollHeaders = token ? { 'X-Nostr-Token': token } : {};
      const res  = await fetch(`${API_BASE}/jobs/${currentJobId}`, { headers: pollHeaders });
      const data = await res.json();
-      const { state, workInvoice, result, reason, costLedger, completedAt } = data;
+      const { state, workInvoice, result, reason } = data;

      if (state === 'awaiting_work_payment' && workInvoice) {
        showWorkInvoice(workInvoice);
@@ -178,26 +175,10 @@ function startPolling() {
        return;
      }
      if (state === 'complete') {
-        addHistoryEntry({
-          jobId: currentJobId,
-          request: currentRequest,
-          costSats: costLedger?.workAmountSats ?? costLedger?.actualAmountSats ?? 0,
-          result,
-          state: 'complete',
-          completedAt: completedAt ?? new Date().toISOString(),
-        });
        showResult(result, 'complete');
        return;
      }
      if (state === 'rejected') {
-        addHistoryEntry({
-          jobId: currentJobId,
-          request: currentRequest,
-          costSats: 0,
-          result: reason,
-          state: 'rejected',
-          completedAt: completedAt ?? new Date().toISOString(),
-        });
        showResult(reason, 'rejected');
        return;
      }
--- a/the-matrix/js/session.js
+++ b/the-matrix/js/session.js
@@ -16,7 +16,6 @@ import { setSpeechBubble, setMood } from './agents.js';
 import { appendSystemMessage, setSessionSendHandler, setInputBarSessionMode } from './ui.js';
 import { getOrRefreshToken } from './nostr-identity.js';
 import { sentiment } from './edge-worker-client.js';
-import { addHistoryEntry } from './history.js';

 const API          = '/api';
 const LS_KEY       = 'timmy_session_v1';
@@ -153,21 +152,12 @@ export async function sessionSendHandler(text) {
      return;
    }

-    const prevBalance = _balanceSats;
    _balanceSats  = data.balanceRemaining ?? 0;
    _sessionState = _balanceSats < MIN_BALANCE ? 'paused' : 'active';
    _saveToStorage();
    _applySessionUI();

    const reply = data.result || data.reason || '…';
-    const costSats = Math.max(0, prevBalance - _balanceSats);
-    addHistoryEntry({
-      request: text,
-      costSats,
-      result: reply,
-      state: data.reason && !data.result ? 'rejected' : 'complete',
-      completedAt: new Date().toISOString(),
-    });
    setSpeechBubble(reply);
    appendSystemMessage('Timmy: ' + reply.slice(0, 80));

--- a/the-matrix/js/ui.js
+++ b/the-matrix/js/ui.js
@@ -480,6 +480,489 @@ async function _fetchAndRenderHeatmap() {
  }
 }

+import { sendVisitorMessage } from './websocket.js';
+import { classify } from './edge-worker-client.js';
+import { setMood, setSpeechBubble } from './agents.js';
+import { getOrRefreshToken, getPubkey, disconnectNostrIdentity, showIdentityPrompt } from './nostr-identity.js';
+
+const $fps        = document.getElementById('fps');
+const $activeJobs = document.getElementById('active-jobs');
+const $connStatus = document.getElementById('connection-status');
+const $log        = document.getElementById('event-log');
+
+const MAX_LOG = 6;
+const logEntries = [];
+let uiInitialized = false;
+
+// ── Session-mode send override ────────────────────────────────────────────────
+let _sessionSendHandler = null;
+
+export function setSessionSendHandler(fn) {
+  _sessionSendHandler = fn;
+}
+
+export function setInputBarSessionMode(active, placeholder) {
+  const $input = document.getElementById('visitor-input');
+  if (!$input) return;
+  if (active) {
+    $input.classList.add('session-active');
+    $input.placeholder = placeholder || 'Ask Timmy (session active)…';
+  } else {
+    $input.classList.remove('session-active');
+    $input.placeholder = 'Say something to Timmy…';
+  }
+}
+
+// ── Model-ready indicator ─────────────────────────────────────────────────────
+// A small badge on the input bar showing when local AI is warm and ready.
+// Hidden until the first `ready` event from the edge worker.
+
+let $readyBadge = null;
+
+export function setEdgeWorkerReady() {
+  if (!$readyBadge) {
+    $readyBadge = document.createElement('span');
+    $readyBadge.id = 'edge-ready-badge';
+    $readyBadge.title = 'Local AI active — trivial queries answered without Lightning payment';
+    $readyBadge.style.cssText = [
+      'font-size:10px;color:#44cc88;border:1px solid #226644',
+      'border-radius:3px;padding:1px 5px;margin-left:6px',
+      'vertical-align:middle;cursor:default',
+    ].join(';');
+    $readyBadge.textContent = '⚡ local AI';
+    const $input = document.getElementById('visitor-input');
+    $input?.insertAdjacentElement('afterend', $readyBadge);
+    // Fallback: append to send button area
+    if (!$readyBadge.isConnected) {
+      document.getElementById('send-btn')?.insertAdjacentElement('afterend', $readyBadge);
+    }
+  }
+  $readyBadge.style.display = '';
+}
+
+// ── Cost preview badge ────────────────────────────────────────────────────────
+// Shown beneath the input bar: "~N sats" / "FREE" / "answered locally".
+// Fetched from GET /api/estimate once the user stops typing (300 ms debounce).
+
+let _estimateTimer = null;
+let $costPreview = null;
+
+function _ensureCostPreview() {
+  if ($costPreview) return $costPreview;
+  $costPreview = document.getElementById('timmy-cost-preview');
+  if (!$costPreview) {
+    $costPreview = document.createElement('div');
+    $costPreview.id = 'timmy-cost-preview';
+    $costPreview.style.cssText = 'font-size:11px;color:#88aacc;margin-top:3px;min-height:14px;transition:opacity .3s;opacity:0;';
+    const $input = document.getElementById('visitor-input');
+    $input?.parentElement?.appendChild($costPreview);
+  }
+  return $costPreview;
+}
+
+function _showCostPreview(text, color = '#88aacc') {
+  const el = _ensureCostPreview();
+  el.textContent = text;
+  el.style.color  = color;
+  el.style.opacity = '1';
+}
+
+function _hideCostPreview() {
+  const el = _ensureCostPreview();
+  el.style.opacity = '0';
+}
+
+async function _fetchEstimate(text) {
+  try {
+    const token = await getOrRefreshToken('/api');
+    const params = new URLSearchParams({ request: text });
+    const fetchOpts = {};
+    if (token) {
+      fetchOpts.headers = { 'X-Nostr-Token': token };
+    }
+
+    const res = await fetch(`/api/estimate?${params}`, fetchOpts);
+    if (!res.ok) return;
+    const data = await res.json();
+
+    const ft = data.identity?.free_tier;
+    if (ft?.serve === 'free') {
+      _showCostPreview('FREE via generosity pool', '#44dd88');
+    } else if (ft?.serve === 'partial') {
+      _showCostPreview(`~${ft.chargeSats} sats (${ft.absorbSats} absorbed)`, '#ffdd44');
+    } else {
+      const sats = data.estimatedSats ?? '?';
+      _showCostPreview(`~${sats} sats estimated`, '#88aacc');
+    }
+  } catch {
+    _hideCostPreview();
+  }
+}
+
+// Fast trivial heuristic — same pattern as edge-worker.js _isGreeting().
+// Prevents /api/estimate network calls for greeting messages on every keypress.
+const _TRIVIAL_RE = /^(hi|hey|hello|howdy|greetings|yo|sup|hiya|what'?s up)[!?.,]?\s*$/i;
+
+function _scheduleCostPreview(text) {
+  clearTimeout(_estimateTimer);
+  if (!text || text.length < 4) { _hideCostPreview(); return; }
+  // Skip estimate entirely for trivially local messages — zero network calls
+  if (_TRIVIAL_RE.test(text.trim())) {
+    _showCostPreview('answered locally ⚡ 0 sats', '#44dd88');
+    return;
+  }
+  _estimateTimer = setTimeout(() => _fetchEstimate(text), 300);
+}
+
+// ── Live cost ticker ──────────────────────────────────────────────────────────
+// Shown in the top-right HUD during active paid interactions.
+// Updated via WebSocket `cost_update` messages from the backend.
+
+let $costTicker = null;
+let _tickerHideTimer = null;
+
+function _ensureCostTicker() {
+  if ($costTicker) return $costTicker;
+  $costTicker = document.getElementById('timmy-cost-ticker');
+  if (!$costTicker) {
+    $costTicker = document.createElement('div');
+    $costTicker.id = 'timmy-cost-ticker';
+    $costTicker.style.cssText = [
+      'position:fixed;top:36px;right:16px',
+      'font-size:11px;font-family:"Courier New",monospace',
+      'color:#ffcc44;text-shadow:0 0 6px #aa8822',
+      'letter-spacing:1px',
+      'pointer-events:none;z-index:10',
+      'transition:opacity .4s;opacity:0',
+    ].join(';');
+    document.body.appendChild($costTicker);
+  }
+  return $costTicker;
+}
+
+export function showCostTicker(sats) {
+  clearTimeout(_tickerHideTimer);
+  const el = _ensureCostTicker();
+  el.textContent = `⚡ ~${sats} sats`;
+  el.style.opacity = '1';
+}
+
+export function updateCostTicker(sats, isFinal = false) {
+  clearTimeout(_tickerHideTimer);
+  const el = _ensureCostTicker();
+  el.textContent = isFinal ? `⚡ ${sats} sats charged` : `⚡ ~${sats} sats`;
+  el.style.opacity = '1';
+  if (isFinal) {
+    _tickerHideTimer = setTimeout(hideCostTicker, 5000);
+  }
+}
+
+export function hideCostTicker() {
+  if (!$costTicker) return;
+  $costTicker.style.opacity = '0';
+}
+
+// ── Nostr identity UI ─────────────────────────────────────────────────────────
+
+let _nostrStatusEl       = null;
+let _connectNostrBtn     = null;
+let _disconnectNostrBtn  = null;
+let _nostrPubkeyDisplay  = null;
+let _getAlbyBtn          = null;
+
+export function initNostrIdentityUI() {
+  _nostrStatusEl = document.getElementById('nostr-identity-status');
+  if (!_nostrStatusEl) return;
+
+  _nostrStatusEl.innerHTML = `
+    <button id="connect-nostr-btn" class="nostr-btn">⚡ Connect Nostr</button>
+    <span id="nostr-pubkey-display" class="nostr-pubkey"></span>
+    <button id="disconnect-nostr-btn" class="nostr-btn nostr-btn-sm">Disconnect</button>
+    <button id="get-alby-btn" class="nostr-btn nostr-btn-sm">Get Alby</button>
+  `;
+
+  _connectNostrBtn    = document.getElementById('connect-nostr-btn');
+  _disconnectNostrBtn = document.getElementById('disconnect-nostr-btn');
+  _nostrPubkeyDisplay = document.getElementById('nostr-pubkey-display');
+  _getAlbyBtn         = document.getElementById('get-alby-btn');
+
+  if (_connectNostrBtn) {
+    _connectNostrBtn.addEventListener('click', () => {
+      showIdentityPrompt('/api');
+    });
+  }
+
+  if (_disconnectNostrBtn) {
+    _disconnectNostrBtn.addEventListener('click', () => {
+      disconnectNostrIdentity();
+      _updateNostrIdentityUI(null);
+    });
+  }
+
+  window.addEventListener('nostr:identity-ready', e => {
+    _updateNostrIdentityUI(e.detail.pubkey);
+  });
+
+  window.addEventListener('nostr:identity-disconnected', () => {
+    _updateNostrIdentityUI(null);
+  });
+
+  _updateNostrIdentityUI(getPubkey());
+}
+
+function _updateNostrIdentityUI(pubkey) {
+  const hasNip07 = typeof window !== 'undefined' && !!window.nostr;
+
+  if (pubkey) {
+    const formattedPubkey = pubkey.slice(0, 8) + '…' + pubkey.slice(-4);
+    if (_nostrPubkeyDisplay) {
+      _nostrPubkeyDisplay.textContent = `⚡ ${formattedPubkey}`;
+      _nostrPubkeyDisplay.style.display = 'inline-block';
+    }
+    if (_connectNostrBtn)    _connectNostrBtn.style.display = 'none';
+    if (_disconnectNostrBtn) _disconnectNostrBtn.style.display = 'inline-block';
+    if (_getAlbyBtn)         _getAlbyBtn.style.display = 'none';
+  } else {
+    if (_nostrPubkeyDisplay) _nostrPubkeyDisplay.style.display = 'none';
+    if (_disconnectNostrBtn) _disconnectNostrBtn.style.display = 'none';
+
+    if (hasNip07) {
+      if (_connectNostrBtn) {
+        _connectNostrBtn.textContent = '⚡ Connect Nostr';
+        _connectNostrBtn.style.display = 'inline-block';
+      }
+      if (_getAlbyBtn) _getAlbyBtn.style.display = 'none';
+    } else {
+      if (_connectNostrBtn) _connectNostrBtn.style.display = 'none';
+      if (_getAlbyBtn) {
+        _getAlbyBtn.textContent = 'Get Alby';
+        _getAlbyBtn.style.display = 'inline-block';
+        _getAlbyBtn.title = 'Install Alby or another NIP-07 extension to connect your Nostr identity';
+        _getAlbyBtn.onclick = () => window.open('https://getalby.com/', '_blank');
+      }
+    }
+  }
+}
+
+
+// ── Input bar ─────────────────────────────────────────────────────────────────
+
+export function initUI() {
+  if (uiInitialized) return;
+  uiInitialized = true;
+  initInputBar();
+  initHeatmap();
+  initNostrIdentityUI();
+  initStatsPanel(); // Initialize the new stats panel
+}
+
+function initInputBar() {
+  const $input   = document.getElementById('visitor-input');
+  const $sendBtn = document.getElementById('send-btn');
+  if (!$input || !$sendBtn) return;
+
+  $input.addEventListener('input', () => _scheduleCostPreview($input.value.trim()));
+
+  async function send() {
+    const text = $input.value.trim();
+    if (!text) return;
+    $input.value = '';
+    _hideCostPreview();
+
+    // ── Edge triage — runs in BOTH session mode and WebSocket mode ─────────────
+    // Worker returns { complexity:'trivial'|'moderate'|'complex', score, reason, localReply? }
+    const cls = await classify(text);
+
+    if (cls.complexity === 'trivial' && cls.localReply) {
+      // Greeting / small-talk → answer locally, 0 sats, no network call in any mode
+      appendSystemMessage(`you: ${text}`);
+      setSpeechBubble(`${cls.localReply} ⚡ local`);
+      _showCostPreview('answered locally ⚡ 0 sats', '#44dd88');
+      setTimeout(_hideCostPreview, 3000);
+      return;
+    }
+
+    // Non-trivial: delegate to session handler (if active) or WebSocket
+    if (_sessionSendHandler) {
+      // moderate/complex — fire estimate async for cost preview, then hand off
+      if (cls.complexity === 'moderate' || cls.complexity === 'complex') {
+        _fetchEstimate(text);
+      }
+      _sessionSendHandler(text);
+      return;
+    }
+
+    // moderate or complex — fetch cost estimate (driven by complexity outcome),
+    // then route to server via WebSocket.
+    if (cls.complexity === 'moderate' || cls.complexity === 'complex') {
+      _fetchEstimate(text);
+    }
+
+    // Route to server via WebSocket
+    sendVisitorMessage(text);
+    appendSystemMessage(`you: ${text}`);
+  }
+
+  $sendBtn.addEventListener('click', send);
+  $input.addEventListener('keydown', e => {
+    if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); send(); }
+  });
+}
+
+export function updateUI({ fps, jobCount, connectionState }) {
+  if ($fps) $fps.textContent = `FPS: ${fps}`;
+  if ($activeJobs) $activeJobs.textContent = `JOBS: ${jobCount}`;
+
+  if ($connStatus) {
+    if (connectionState === 'connected') {
+      $connStatus.textContent = '● CONNECTED';
+      $connStatus.className   = 'connected';
+    } else if (connectionState === 'connecting') {
+      $connStatus.textContent = '◌ CONNECTING...';
+      $connStatus.className   = '';
+    } else {
+      $connStatus.textContent = '○ OFFLINE';
+      $connStatus.className   = '';
+    }
+  }
+}
+
+export function appendSystemMessage(text) {
+  if (!$log) return;
+  const el = document.createElement('div');
+  el.className = 'log-entry';
+  el.textContent = text;
+  logEntries.push(el);
+  if (logEntries.length > MAX_LOG) {
+    const removed = logEntries.shift();
+    $log.removeChild(removed);
+  }
+  $log.appendChild(el);
+  $log.scrollTop = $log.scrollHeight;
+}
+
+export function appendChatMessage(agentLabel, message, cssColor, agentId) {
+  void agentLabel; void cssColor; void agentId;
+  appendSystemMessage(message);
+}
+
+/**
+ * Render a debate argument or verdict in the event log (#21).
+ * Visually distinct from regular chat: colored by agent with a debate prefix.
+ */
+export function appendDebateMessage(agent, argument, isVerdict, accepted) {
+  if (!$log) return;
+  const el = document.createElement('div');
+  el.className = 'log-entry debate-entry';
+  if (isVerdict) {
+    el.classList.add('debate-verdict');
+    el.classList.add(accepted ? 'debate-accepted' : 'debate-rejected');
+    el.textContent = `⚖ ${agent}: ${argument}`;
+  } else {
+    el.classList.add(agent === 'Beta-A' ? 'debate-a' : 'debate-b');
+    el.textContent = `⚖ ${agent}: ${(argument || '').slice(0, 120)}`;
+  }
+  logEntries.push(el);
+  if (logEntries.length > MAX_LOG) {
+    const removed = logEntries.shift();
+    $log.removeChild(removed);
+  }
+  $log.appendChild(el);
+  $log.scrollTop = $log.scrollHeight;
+}
+
+export function loadChatHistory() { return []; }
+export function saveChatHistory() {}
+
+// ── Activity heatmap (#9) ─────────────────────────────────────────────────────
+// Fetches /api/stats/activity and renders a 24-segment heatmap.
+// Auto-refreshes every 5 minutes. On mobile, collapses to an icon that opens
+// a full-screen overlay.
+
+const HEATMAP_REFRESH_MS = 5 * 60 * 1000; // 5 minutes
+let _heatmapTimer = null;
+let _lastHours = null; // number[24] cached for overlay re-render
+
+/** Convert an hour index (0 = oldest, 23 = current) to a UTC hour label like "3pm" or "midnight". */
+function _hourLabel(hourIndex) {
+  const now = new Date();
+  const currentHour = now.getUTCHours();
+  // slot 23 = current UTC hour, slot 0 = 23 hours ago
+  const h = ((currentHour - (23 - hourIndex)) % 24 + 24) % 24;
+  if (h === 0) return 'midnight';
+  if (h === 12) return 'noon';
+  return h < 12 ? `${h}am` : `${h - 12}pm`;
+}
+
+/** Interpolate from dim blue (#111133) to bright blue-white (#88ccff) based on 0–1 intensity. */
+function _segmentColor(intensity) {
+  // dim: [17, 17, 51]  bright: [136, 204, 255]
+  const r = Math.round(17  + (136 - 17)  * intensity);
+  const g = Math.round(17  + (204 - 17)  * intensity);
+  const b = Math.round(51  + (255 - 51)  * intensity);
+  return `rgb(${r},${g},${b})`;
+}
+
+function _renderSegments(hours, container, isMobile) {
+  container.innerHTML = '';
+  const max = Math.max(...hours, 1); // avoid div-by-zero
+  const currentSlot = 23;
+
+  hours.forEach((count, i) => {
+    const seg = document.createElement('div');
+    seg.className = 'hm-seg' + (i === currentSlot ? ' hm-seg-current' : '');
+    const intensity = count / max;
+    const color = _segmentColor(intensity);
+    seg.style.background = color;
+    if (i === currentSlot) seg.style.color = color; // used by pulse animation
+    seg.dataset.index = String(i);
+    seg.dataset.count = String(count);
+    if (isMobile) {
+      seg.style.width = '14px';
+      seg.style.height = '28px';
+    }
+    container.appendChild(seg);
+  });
+}
+
+function _initHeatmapTooltip(barEl) {
+  const $tip = document.getElementById('heatmap-tooltip');
+  if (!$tip) return;
+
+  barEl.addEventListener('mousemove', e => {
+    const seg = e.target.closest('.hm-seg');
+    if (!seg) { $tip.style.display = 'none'; return; }
+    const i = Number(seg.dataset.index);
+    const count = Number(seg.dataset.count);
+    const label = _hourLabel(i);
+    $tip.textContent = `${label}: ${count} job${count !== 1 ? 's' : ''} submitted`;
+    $tip.style.display = 'block';
+    $tip.style.left = `${e.clientX + 10}px`;
+    $tip.style.top  = `${e.clientY - 24}px`;
+  });
+
+  barEl.addEventListener('mouseleave', () => { $tip.style.display = 'none'; });
+}
+
+async function _fetchAndRenderHeatmap() {
+  try {
+    const res = await fetch('/api/stats/activity');
+    if (!res.ok) return;
+    const data = await res.json();
+    const hours = Array.isArray(data.hours) ? data.hours : [];
+    if (hours.length !== 24) return;
+    _lastHours = hours;
+
+    const $bar = document.getElementById('heatmap-bar');
+    if ($bar) _renderSegments(hours, $bar, false);
+
+    const $overlayBar = document.getElementById('heatmap-overlay-bar');
+    if ($overlayBar) _renderSegments(hours, $overlayBar, true);
+  } catch {
+    // silently ignore fetch errors
+  }
+}
+
 export function initHeatmap() {
  const $bar      = document.getElementById('heatmap-bar');
  const $iconBtn  = document.getElementById('heatmap-icon-btn');
@@ -506,3 +989,80 @@ export function initHeatmap() {
  void _fetchAndRenderHeatmap();
  _heatmapTimer = setInterval(_fetchAndRenderHeatmap, HEATMAP_REFRESH_MS);
 }
+
+// ── Stats panel ──────────────────────────────────────────────────────────
+
+const STATS_REFRESH_MS = 30 * 1000; // 30 seconds
+let _statsRefreshTimer = null;
+
+let $openStatsBtn           = null;
+let $statsPanel             = null;
+let $statsCloseBtn          = null;
+let $totalJobsCompleted     = null;
+let $averageSelfEvalRating  = null;
+let $topRequestCategories   = null;
+let $totalSatsEarned        = null;
+let $satsEarned24h          = null;
+let $recentJobsList         = null;
+
+export function initStatsPanel() {
+  $openStatsBtn          = document.getElementById('open-stats-btn');
+  $statsPanel            = document.getElementById('stats-panel');
+  $statsCloseBtn         = document.getElementById('stats-close');
+  $totalJobsCompleted    = document.getElementById('total-jobs-completed');
+  $averageSelfEvalRating = document.getElementById('average-self-eval-rating');
+  $topRequestCategories  = document.getElementById('top-request-categories');
+  $totalSatsEarned       = document.getElementById('total-sats-earned');
+  $satsEarned24h         = document.getElementById('sats-earned-24h');
+  $recentJobsList        = document.getElementById('recent-jobs-list');
+
+  if ($openStatsBtn) {
+    $openStatsBtn.addEventListener('click', () => {
+      $statsPanel?.classList.add('open');
+      void _fetchAndRenderStats();
+      _statsRefreshTimer = setInterval(_fetchAndRenderStats, STATS_REFRESH_MS);
+    });
+  }
+
+  if ($statsCloseBtn) {
+    $statsCloseBtn.addEventListener('click', () => {
+      $statsPanel?.classList.remove('open');
+      clearInterval(_statsRefreshTimer);
+      _statsRefreshTimer = null;
+    });
+  }
+}
+
+async function _fetchAndRenderStats() {
+  try {
+    const res = await fetch('/api/stats');
+    if (!res.ok) return;
+    const data = await res.json();
+
+    if ($totalJobsCompleted)    $totalJobsCompleted.textContent    = data.totalJobsCompleted ?? '--';
+    if ($averageSelfEvalRating) $averageSelfEvalRating.textContent = (data.averageSelfEvalRating ?? 0).toFixed(1);
+    if ($topRequestCategories)  $topRequestCategories.textContent  = data.top3RequestCategories.join(', ') || 'None';
+    if ($totalSatsEarned)       $totalSatsEarned.textContent       = data.totalSatsEarned ?? '--';
+    if ($satsEarned24h)         $satsEarned24h.textContent         = data.satsEarnedLast24h ?? '--';
+
+    if ($recentJobsList) {
+      $recentJobsList.innerHTML = '';
+      data.last10CompletedJobs.forEach(job => {
+        const jobItem = document.createElement('div');
+        jobItem.className = 'recent-job-item';
+        jobItem.innerHTML = `
+          <div class="job-req">${job.request}</div>
+          <div class="job-meta">
+            <span class="job-rating">⭐ ${job.starRating ?? '-'}</span>
+            <span class="job-sats">⚡ ${job.satsCharged ?? '-'} sats</span>
+            <span class="job-time">${job.timeElapsed ?? '-'}s</span>
+            <span class="job-category">${job.category ?? '-'}</span>
+          </div>
+        `;
+        $recentJobsList?.appendChild(jobItem);
+      });
+    }
+  } catch (err) {
+    console.error('Failed to fetch and render stats:', err);
+  }
+}