apiblaze 0.21.21 → 0.21.22

package/dist/index.js

@@ -34,7 +34,7 @@ var __toESM = (mod, isNodeMode, target2) => (target2 = mod != null ? __create(__
 var version;
 var init_package = __esm({
   "package.json"() {
-    version = "0.21.21";
+    version = "0.21.22";
   }
 });
 
@@ -5734,8 +5734,6 @@ async function printDevOutcome(o, port) {
   const where = { tenant: o.tenant, anon: o.anon };
   const rest = restUrl(o.name, o.version, o.env, where);
   const agents = o.anon ? mcpUrl(o.name, o.version, o.env, where) : `https://${mcpHost(o.name, o.tenant)}/${o.version}/${o.env}`;
-  const first = BRAND === "mcpblaze" ? agents : rest;
-  const third = BRAND === "mcpblaze" ? `REST API: ${import_chalk19.default.bold(rest)}` : `agents: ${import_chalk19.default.bold(agents)}`;
   const s = o.secure;
   const applied = s?.applied ?? [];
   const locked = (o.families ?? []).filter((f) => applied.includes(f.key));
@@ -5753,24 +5751,19 @@ async function printDevOutcome(o, port) {
     spinner.stop();
     admin2 = await addAdmin(o.adminEmail, o.tenant, o.teamId);
   }
+  const lockedPhrase = applied.length && s?.enforced ? `${describeFamilies(applied)} locked to their creator` : applied.length && s?.pending ? `${describeFamilies(applied)} rules being applied` : s && !s.enforced && s.errors?.length ? import_chalk19.default.yellow(`rules not applied (${s.errors.join("; ")})`) : "no rules yet (needs a spec)";
+  const adminBit = o.adminEmail ? admin2 ? `${o.adminEmail} is admin${admin2.active ? "" : " (on first sign-in)"}` : import_chalk19.default.yellow(`could not add ${o.adminEmail} as admin`) : "";
+  const restLine = `    ${import_chalk19.default.dim("API ")}  ${import_chalk19.default.bold(rest)}   ${import_chalk19.default.dim(doorsPhrase(o.auth))}`;
+  const mcpLine = `    ${import_chalk19.default.dim("MCP ")}  ${import_chalk19.default.bold(agents)}   ${import_chalk19.default.dim("paste into Claude, ChatGPT or Cursor")}`;
   console.log();
-  console.log(`  ${import_chalk19.default.green("\u2713")} ${import_chalk19.default.bold(first)}  \u2192 localhost:${port}   ${import_chalk19.default.dim(`(${doorsPhrase(o.auth)})`)}`);
-  const adminBit = o.adminEmail ? admin2 ? ` \xB7 ${import_chalk19.default.bold(o.adminEmail)} is admin${admin2.active ? "" : " (active on first sign-in)"}` : ` \xB7 ${import_chalk19.default.yellow(`could not add ${o.adminEmail} as admin`)}` : "";
-  if (applied.length && s?.enforced) {
-    console.log(`  ${import_chalk19.default.green("\u2713")} ${describeFamilies(applied)} locked to their creator${s.skipped?.length ? ` (${s.skipped.length} skipped)` : ""}${adminBit}`);
-  } else if (applied.length && s?.pending) {
-    console.log(`  ${import_chalk19.default.green("\u2713")} ${describeFamilies(applied)}: rules are being applied \u2014 check with ${import_chalk19.default.cyan(`${B.cli} rule ${o.name}`)} in a minute${adminBit}`);
-  } else if (s && !s.enforced && s.errors?.length) {
-    console.log(`  ${import_chalk19.default.yellow("\u26A0")} ${import_chalk19.default.yellow(`not locked \u2014 ${s.errors.join("; ")}`)}${adminBit}`);
-  } else {
-    console.log(`  ${import_chalk19.default.dim("\u2013")} ${import_chalk19.default.dim(`nothing locked \u2014 every caller who gets in can reach every route (npx ${B.cli} rule ${o.name} once you have a spec)`)}${adminBit}`);
-  }
-  console.log(`  ${import_chalk19.default.green("\u2713")} ${third}`);
-  if (!o.adminEmail) console.log(`  ${import_chalk19.default.dim("\u2013")} ${import_chalk19.default.dim(`no admin yet \u2014 npx ${B.cli} admins add you@example.com --tenant ${o.tenant ?? "<tenant>"}`)}`);
+  console.log(`  ${import_chalk19.default.green("\u2713")} ${import_chalk19.default.bold(`localhost:${port} is live on the internet`)}`);
+  console.log(BRAND === "mcpblaze" ? mcpLine : restLine);
+  console.log(BRAND === "mcpblaze" ? restLine : mcpLine);
   if (o.auth.doors.includes("api_key") && o.apiKey) {
-    console.log();
-    console.log(`  ${import_chalk19.default.dim("API key (backend key, for your frontend-server, shown once):")} ${import_chalk19.default.bold.green(o.apiKey)}   ${import_chalk19.default.dim("\u2192 send it as X-API-Key and say who is calling with X-End-User-Id")}`);
+    console.log(`    ${import_chalk19.default.dim("Key ")}  ${import_chalk19.default.bold.green(o.apiKey)}   ${import_chalk19.default.dim("shown once \xB7 your server sends it as X-API-Key, naming the user in X-End-User-Id")}`);
   }
+  console.log(`    ${import_chalk19.default.dim("Included")}  ${["API keys", "sign-in", lockedPhrase, "rate limits", adminBit].filter(Boolean).join(import_chalk19.default.dim(" \xB7 "))}`);
+  if (isVerbose() && !o.adminEmail) console.log(import_chalk19.default.dim(`    No admin yet: npx ${B.cli}@latest admins add you@example.com --tenant ${o.tenant ?? "<tenant>"}`));
   const okLines = agentPrompts(locked, o.openapi, null).filter((l) => l.ok);
   const tryHint = okLines[1]?.say ?? okLines[0]?.say;
   await connectAgentStep({
@@ -6320,6 +6313,7 @@ var init_create = __esm({
     init_apichat();
     import_yaml4 = require("yaml");
     import_chalk19 = __toESM(require("chalk"));
+    init_trace();
     import_ora6 = __toESM(require("ora"));
     init_auth();
     init_api();
@@ -6371,340 +6365,211 @@ var init_files = __esm({
   "src/demo-app/files.ts"() {
     "use strict";
     DEMO_FILES = {
-      "README.md": "# ResiResi: the APIblaze demo\n\nA tiny table-booking app for pizzerias, used by `npx apiblaze@latest demo` to show what APIblaze does.\n\n```\nnpx apiblaze@latest demo\n```\n\nThat one command writes this folder to `./apiblaze-demo`, puts APIblaze in front of the backend,\nstarts everything and opens the page. No login, no prompts, no dependencies.\n\n## What the page shows\n\n1. **Without APIblaze.** The app uses one shared password, so Ben can cancel Ana's booking.\n2. **With APIblaze.** Same app, unchanged. Ben tries again and is blocked: only the person who made\n   a booking can change it.\n3. **An AI assistant.** It uses the same app, under the same rules, and cannot cancel Ana's booking either.\n\n## The files\n\n| File | What it is |\n| --- | --- |\n| `backend.js` | The pizzeria's API. No login, no keys, no permission checks. |\n| `openapi.yaml` | The list of endpoints. APIblaze reads it to work out who may change what. |\n| `app.js` | The website's server. It calls the API with one key and says who is acting. |\n| `public/index.html` | The page. |\n| `start.js` | Starts the backend (port 3001) and the website (port 3000). |\n\nStop the demo with `npx apiblaze@latest demo stop`.\n",
-      "openapi.yaml": "openapi: 3.0.3\ninfo:\n  title: ResiResi API\n  version: 1.0.0\n  description: Table bookings for a pizzeria. This file is all APIblaze reads to decide who may do what.\npaths:\n  /reservations:\n    get:\n      operationId: listReservations\n      summary: List my bookings\n      responses:\n        '200':\n          description: The caller's bookings\n          content:\n            application/json:\n              schema:\n                type: array\n                items: { $ref: '#/components/schemas/Reservation' }\n    post:\n      operationId: createReservation\n      summary: Book a table\n      requestBody:\n        required: true\n        content:\n          application/json:\n            schema: { $ref: '#/components/schemas/NewReservation' }\n      responses:\n        '201':\n          description: Booked\n          content:\n            application/json:\n              schema: { $ref: '#/components/schemas/Reservation' }\n  /reservations/{id}:\n    parameters:\n      - { name: id, in: path, required: true, schema: { type: string } }\n    get:\n      operationId: getReservation\n      summary: Get one booking\n      responses:\n        '200':\n          description: The booking\n          content:\n            application/json:\n              schema: { $ref: '#/components/schemas/Reservation' }\n    delete:\n      operationId: cancelReservation\n      summary: Cancel a booking\n      responses:\n        '204': { description: Cancelled }\ncomponents:\n  schemas:\n    NewReservation:\n      type: object\n      required: [name, table, time]\n      properties:\n        name: { type: string, example: Ana }\n        table: { type: integer, example: 4 }\n        time: { type: string, example: '19:30' }\n    Reservation:\n      allOf:\n        - $ref: '#/components/schemas/NewReservation'\n        - type: object\n          properties:\n            id: { type: string, example: r1 }\n",
-      "backend.js": `// The pizzeria's backend: book, list and cancel tables.
-//
-// Look at what is NOT here: no login, no API keys, no "is this your booking?"
-// check, no AI code. APIblaze sits in front of this file and does all of that.
-// The only things this backend knows about people are two headers APIblaze adds
-// to every call it lets through: x-abz-tenant-id, "which pizzeria", and
-// x-abz-user-id, "who is asking".
-//
-// Two doors, so the demo can show the difference:
-//   /before/...  the way most apps ship: one shared password, anyone holding it can do anything.
-//   /...         behind APIblaze: every call names its person, and APIblaze decides.
-//
-// Zero dependencies. Run it alone with \`node backend.js\` (port 3001).
-
-const http = require('http');
-
-const PASSWORD = 'pizza123'; // the "before" app's shared secret
-const stores = { before: new Map(), after: new Map() };
-let next = 1;
-
-function send(res, status, body) {
-  res.writeHead(status, { 'content-type': 'application/json' });
-  res.end(body === undefined ? '' : JSON.stringify(body));
-}
-
-function handle(req, res, body) {
-  const url = new URL(req.url, 'http://x');
-  let path = url.pathname;
-  let door = 'after';
-  if (path.startsWith('/before/')) { door = 'before'; path = path.slice('/before'.length); }
-
-  if (path === '/openapi.yaml') {
-    res.writeHead(200, { 'content-type': 'text/yaml' });
-    return res.end(require('fs').readFileSync(require('path').join(__dirname, 'openapi.yaml')));
-  }
-
-  const who = req.headers['x-abz-user-id'] || '';
-  const tenant = req.headers['x-abz-tenant-id'] || '';
-  if (door === 'before' && req.headers['x-demo-password'] !== PASSWORD) return send(res, 401, { error: 'wrong password' });
-  if (door === 'after' && !who) return send(res, 401, { error: 'only APIblaze may call this door' });
-
-  const db = stores[door];
-  const m = /^\\/reservations(?:\\/([^/]+))?$/.exec(path);
-  if (!m) return send(res, 404, { error: 'not found' });
-  const id = m[1];
-
-  if (!id && req.method === 'POST') {
-    let input = {};
-    try { input = JSON.parse(body || '{}'); } catch { return send(res, 400, { error: 'body must be JSON' }); }
-    const row = { id: \`r\${next++}\`, name: String(input.name || 'Guest'), table: Number(input.table) || 1, time: String(input.time || '19:30'), owner: who || null, tenant: tenant || null };
-    db.set(row.id, row);
-    return send(res, 201, row);
-  }
-  if (!id && req.method === 'GET') {
-    // Lists are the backend's job: show each person their own bookings, in their
-    // own pizzeria. ("ana" at Nino Pizza and "ana" at Gino Pizza are two people.)
-    const rows = [...db.values()].filter((r) => door === 'before' || (r.owner === who && r.tenant === tenant));
-    return send(res, 200, rows);
-  }
-  const row = db.get(id);
-  if (!row) return send(res, 404, { error: 'no such booking' });
-  if (req.method === 'GET') return send(res, 200, row);
-  if (req.method === 'DELETE') { db.delete(id); return send(res, 204); }
-  return send(res, 405, { error: 'method not allowed' });
-}
-
-function startBackend(port = Number(process.env.BACKEND_PORT) || 3001) {
-  const server = http.createServer((req, res) => {
-    let body = '';
-    req.on('data', (c) => { body += c; });
-    req.on('end', () => {
-      try { handle(req, res, body); } catch (e) { send(res, 500, { error: String(e && e.message || e) }); }
-    });
-  });
-  return new Promise((resolve, reject) => {
-    server.once('error', reject);
-    server.listen(port, '127.0.0.1', () => resolve(server));
-  });
-}
-
-module.exports = { startBackend, PASSWORD };
-if (require.main === module) startBackend().then(() => console.log('backend on http://localhost:3001'));
-`,
-      "app.js": "// The pizzeria's website server. It serves the page and makes the calls for it.\n//\n//   \"Before\" calls go straight to the backend with the shared password.\n//   \"After\"  calls go through APIblaze with ONE server key, and say who is\n//            acting with X-End-User-Id. The browser never sees the key.\n//\n// That is the whole integration: a URL, a key, and a header naming the person.\n\nconst http = require('http');\nconst fs = require('fs');\nconst path = require('path');\nconst { PASSWORD } = require('./backend');\n\nfunction env(name, fallback = '') { return process.env[name] || fallback; }\n\nfunction json(res, status, body) {\n  res.writeHead(status, { 'content-type': 'application/json' });\n  res.end(JSON.stringify(body));\n}\n\nconst mask = (k) => (k ? `${k.slice(0, 7)}\u2022\u2022\u2022\u2022${k.slice(-4)}` : '');\n\nasync function call(door, as, op, id, extra) {\n  const backend = `http://127.0.0.1:${env('BACKEND_PORT', '3001')}`;\n  const base = door === 'before' ? `${backend}/before` : env('APIBLAZE_URL').replace(/\\/$/, '');\n  const headers = { 'content-type': 'application/json' };\n  if (door === 'before') headers['x-demo-password'] = PASSWORD;\n  else {\n    // Each pizzeria has its own key. \"after\" = Nino Pizza's key, \"gino\" = Gino Pizza's key.\n    headers['x-api-key'] = door === 'gino' ? env('APIBLAZE_GINO_KEY') : env('APIBLAZE_SERVER_KEY');\n    headers['x-end-user-id'] = as;\n  }\n  const who = { ana: 'Ana', ben: 'Ben' }[as] || as;\n  const req = op === 'book'\n    ? { method: 'POST', url: `${base}/reservations`, body: JSON.stringify({ name: who, table: (extra && extra.table) || 4, time: (extra && extra.time) || '19:30' }) }\n    : op === 'cancel'\n      ? { method: 'DELETE', url: `${base}/reservations/${encodeURIComponent(id || '')}` }\n      : op === 'open'\n        ? { method: 'GET', url: `${base}/reservations/${encodeURIComponent(id || '')}` }\n        : { method: 'GET', url: `${base}/reservations` };\n  const r = await fetch(req.url, { method: req.method, headers, body: req.body });\n  const text = await r.text();\n  let body = null;\n  try { body = text ? JSON.parse(text) : null; } catch { body = text; }\n  return { status: r.status, body };\n}\n\nasync function relayChat(req, res, raw) {\n  let input;\n  try { input = JSON.parse(raw || '{}'); } catch { return json(res, 400, { error: 'bad json' }); }\n  const mcp = env('APIBLAZE_MCP_URL').replace(/\\/$/, '');\n  if (!mcp) return json(res, 503, { error: 'The assistant is not set up. Run: npx apiblaze@latest demo' });\n  const upstream = await fetch(`${mcp}/runtime-chat`, {\n    method: 'POST',\n    headers: { 'content-type': 'application/json', 'x-api-key': env('APIBLAZE_SERVER_KEY'), 'x-end-user-id': String(input.as || 'ben') },\n    body: JSON.stringify({ id: String(input.id || Date.now()), trigger: 'submit-message', messages: input.messages || [] }),\n  });\n  res.writeHead(upstream.status, { 'content-type': upstream.headers.get('content-type') || 'application/json', 'cache-control': 'no-cache' });\n  if (!upstream.body) return res.end();\n  const reader = upstream.body.getReader();\n  for (;;) {\n    const { done, value } = await reader.read();\n    if (done) break;\n    res.write(Buffer.from(value));\n  }\n  res.end();\n}\n\nfunction startApp(port = Number(env('APP_PORT', '3000'))) {\n  const page = path.join(__dirname, 'public', 'index.html');\n  const server = http.createServer((req, res) => {\n    let raw = '';\n    req.on('data', (c) => { raw += c; });\n    req.on('end', async () => {\n      try {\n        const url = new URL(req.url, 'http://x');\n        if (req.method === 'GET' && (url.pathname === '/' || url.pathname === '/index.html')) {\n          res.writeHead(200, { 'content-type': 'text/html; charset=utf-8' });\n          return res.end(fs.readFileSync(page));\n        }\n        if (url.pathname === '/api/config') {\n          return json(res, 200, {\n            name: env('APIBLAZE_NAME'), apiUrl: env('APIBLAZE_URL'), mcpUrl: env('APIBLAZE_MCP_URL'),\n            key: mask(env('APIBLAZE_SERVER_KEY')),\n            ginoKey: mask(env('APIBLAZE_GINO_KEY')),\n          });\n        }\n        if (req.method === 'POST' && url.pathname === '/api/act') {\n          const b = JSON.parse(raw || '{}');\n          const door = ['before', 'gino'].includes(b.door) ? b.door : 'after';\n          return json(res, 200, await call(door, String(b.as || 'ana'), String(b.op || 'list'), b.id, b));\n        }\n        if (req.method === 'POST' && url.pathname === '/api/chat') return relayChat(req, res, raw);\n        json(res, 404, { error: 'not found' });\n      } catch (e) {\n        json(res, 502, { error: `Could not reach the API: ${String(e && e.message || e)}` });\n      }\n    });\n  });\n  return new Promise((resolve, reject) => {\n    server.once('error', reject);\n    server.listen(port, '127.0.0.1', () => resolve(server));\n  });\n}\n\nmodule.exports = { startApp };\n",
+      "README.md": "# Nino's Pizza: the APIblaze demo\n\nA tiny table-booking app for pizzerias, used by `npx apiblaze@latest demo` to show what APIblaze does.\n\n```\nnpx apiblaze@latest demo\n```\n\nThat one command writes this folder to `./apiblaze-demo`, puts APIblaze in front of the backend,\nstarts everything and opens the page. No login, no prompts, no dependencies.\n\n## What the page shows\n\n1. **Your API is live on the internet.** The backend runs on your laptop; APIblaze gives it a public\n   URL and an MCP address for AI assistants. A live ticker shows each request reaching your laptop.\n2. **An AI assistant uses it.** Ask it to book a table and watch the request arrive.\n3. **Included, no code:** only the owner can change a booking, each customer (Nino Pizza,\n   Gino Pizza) is separate, rate limits, sign-in, and drop-in widgets for API keys and roles.\n\n## The files\n\n| File | What it is |\n| --- | --- |\n| `backend.js` | The pizzeria's API. No login, no keys, no permission checks. |\n| `openapi.yaml` | Its endpoints. APIblaze builds the AI tools and the ownership rules from it. |\n| `app.js` | The website's server. Calls the API with one key and says who is acting. |\n| `public/index.html` | The page. |\n| `start.js` | Starts the backend (port 3001) and the website (port 3000). |\n\n`npx apiblaze@latest demo` also adds `lib/apiblaze-server.js` and `public/apiblaze-widgets.js`, the same\nhelpers you get from `npm i apiblaze`. Stop the demo with `npx apiblaze@latest demo stop`.\n",
+      "openapi.yaml": "openapi: 3.0.3\ninfo:\n  title: Nino's Pizza API\n  version: 1.0.0\n  description: Table bookings at Nino's Pizza. APIblaze reads this file to build the MCP tools for AI assistants and to work out who may change what.\npaths:\n  /reservations:\n    get:\n      operationId: listReservations\n      summary: List my bookings\n      responses:\n        '200':\n          description: The caller's bookings\n          content:\n            application/json:\n              schema:\n                type: array\n                items: { $ref: '#/components/schemas/Reservation' }\n    post:\n      operationId: createReservation\n      summary: Book a table\n      requestBody:\n        required: true\n        content:\n          application/json:\n            schema: { $ref: '#/components/schemas/NewReservation' }\n      responses:\n        '201':\n          description: Booked\n          content:\n            application/json:\n              schema: { $ref: '#/components/schemas/Reservation' }\n  /reservations/{id}:\n    parameters:\n      - { name: id, in: path, required: true, schema: { type: string } }\n    get:\n      operationId: getReservation\n      summary: Get one booking\n      responses:\n        '200':\n          description: The booking\n          content:\n            application/json:\n              schema: { $ref: '#/components/schemas/Reservation' }\n    delete:\n      operationId: cancelReservation\n      summary: Cancel a booking\n      responses:\n        '204': { description: Cancelled }\ncomponents:\n  schemas:\n    NewReservation:\n      type: object\n      required: [name, table, time]\n      properties:\n        name: { type: string, example: Ana }\n        table: { type: integer, example: 4 }\n        time: { type: string, example: '19:30', description: 'Time of the booking, 24h HH:MM' }\n        guests: { type: integer, example: 2, description: 'How many people' }\n    Reservation:\n      allOf:\n        - $ref: '#/components/schemas/NewReservation'\n        - type: object\n          properties:\n            id: { type: string, example: r1 }\n",
+      "backend.js": "// Nino's Pizza backend: book, list and cancel tables. It runs on YOUR laptop.\n//\n// `npx apiblaze@latest dev` (which the demo runs for you) puts it on the internet\n// at a public URL and gives AI assistants an MCP address for it. Everything else\n// (API keys, sign-in, who may change what, rate limits) happens in APIblaze, in\n// front of this file. Look at what is NOT here: no login, no keys, no permission\n// checks, no AI code.\n//\n// What APIblaze tells this backend about each call, in two headers:\n//   x-abz-tenant-id  which customer (pizzeria) is calling\n//   x-abz-user-id    which person\n//\n// Zero dependencies. Run it alone with `node backend.js` (port 3001).\n\nconst http = require('http');\nconst fs = require('fs');\nconst path = require('path');\n\nconst bookings = new Map();\nlet next = 1;\n// The last requests this laptop answered \u2014 the demo page shows them live.\nconst recent = [];\nfunction remember(entry) {\n  recent.unshift({ at: Date.now(), ...entry });\n  recent.length = Math.min(recent.length, 50);\n}\n\nfunction send(res, status, body) {\n  res.writeHead(status, { 'content-type': 'application/json' });\n  res.end(body === undefined ? '' : JSON.stringify(body));\n}\n\nfunction handle(req, res, body) {\n  const url = new URL(req.url, 'http://x');\n  if (url.pathname === '/openapi.yaml') {\n    res.writeHead(200, { 'content-type': 'text/yaml' });\n    return res.end(fs.readFileSync(path.join(__dirname, 'openapi.yaml')));\n  }\n  const who = req.headers['x-abz-user-id'] || '';\n  const tenant = req.headers['x-abz-tenant-id'] || '';\n  const reply = (status, data) => { remember({ method: req.method, path: url.pathname, who, tenant, status }); send(res, status, data); };\n  if (!who) return reply(401, { error: 'calls come through APIblaze, which says who is calling' });\n\n  const m = /^\\/reservations(?:\\/([^/]+))?$/.exec(url.pathname);\n  if (!m) return reply(404, { error: 'not found' });\n  const id = m[1];\n\n  if (!id && req.method === 'POST') {\n    let input = {};\n    try { input = JSON.parse(body || '{}'); } catch { return reply(400, { error: 'body must be JSON' }); }\n    const row = {\n      id: `r${next++}`, name: String(input.name || who), table: Number(input.table) || 1,\n      time: String(input.time || '19:30'), guests: Number(input.guests) || 2, owner: who, tenant,\n    };\n    bookings.set(row.id, row);\n    return reply(201, row);\n  }\n  if (!id && req.method === 'GET') {\n    // Lists are the backend's job: each person sees their own bookings, at their own pizzeria.\n    return reply(200, [...bookings.values()].filter((r) => r.owner === who && r.tenant === tenant));\n  }\n  const row = bookings.get(id);\n  if (!row) return reply(404, { error: 'no such booking' });\n  if (req.method === 'GET') return reply(200, row);\n  if (req.method === 'DELETE') { bookings.delete(id); return reply(204); }\n  return reply(405, { error: 'method not allowed' });\n}\n\nfunction startBackend(port = Number(process.env.BACKEND_PORT) || 3001) {\n  const server = http.createServer((req, res) => {\n    let body = '';\n    req.on('data', (c) => { body += c; });\n    req.on('end', () => {\n      try { handle(req, res, body); } catch (e) { send(res, 500, { error: String((e && e.message) || e) }); }\n    });\n  });\n  return new Promise((resolve, reject) => {\n    server.once('error', reject);\n    server.listen(port, '127.0.0.1', () => resolve(server));\n  });\n}\n\nmodule.exports = { startBackend, recent };\nif (require.main === module) startBackend().then(() => console.log('backend on http://localhost:3001'));\n",
+      "app.js": "// Nino's Pizza website server: serves the page and makes its calls.\n//\n// Every call goes through APIblaze with ONE server key (kept here, never in the\n// browser) and says who is acting with X-End-User-Id. The chat and the two\n// widgets use apiblaze's own server helpers (lib/apiblaze-server.js, copied in by\n// `npx apiblaze@latest demo` \u2014 the same code as `import \u2026 from 'apiblaze/server'`).\n\nconst http = require('http');\nconst fs = require('fs');\nconst path = require('path');\nconst { recent } = require('./backend');\n\nconst env = (name, fallback = '') => process.env[name] || fallback;\nconst json = (res, status, body) => { res.writeHead(status, { 'content-type': 'application/json' }); res.end(JSON.stringify(body)); };\nconst mask = (k) => (k ? `${k.slice(0, 7)}\u2022\u2022\u2022\u2022${k.slice(-4)}` : '');\n\nlet lib = null;\ntry { lib = require('./lib/apiblaze-server.js'); } catch { /* run without the widgets */ }\n\n// The person using the page. A real app takes this from its own login.\nconst ME = { userId: 'ana', email: 'ana@ninopizza.example', label: 'Ana' };\n\nasync function call(op, { as = 'ana', id, key = 'nino', body } = {}) {\n  const base = env('APIBLAZE_URL').replace(/\\/$/, '');\n  const headers = {\n    'content-type': 'application/json',\n    'x-api-key': key === 'gino' ? env('APIBLAZE_GINO_KEY') : env('APIBLAZE_SERVER_KEY'),\n    'x-end-user-id': as,\n  };\n  const req = op === 'book' ? { method: 'POST', url: `${base}/reservations`, body: JSON.stringify(body || { name: 'Ana', table: 4, time: '19:30', guests: 2 }) }\n    : op === 'cancel' ? { method: 'DELETE', url: `${base}/reservations/${encodeURIComponent(id || '')}` }\n      : op === 'open' ? { method: 'GET', url: `${base}/reservations/${encodeURIComponent(id || '')}` }\n        : { method: 'GET', url: `${base}/reservations` };\n  const r = await fetch(req.url, { method: req.method, headers, body: req.body });\n  const text = await r.text();\n  let data = null;\n  try { data = text ? JSON.parse(text) : null; } catch { data = text; }\n  return { status: r.status, body: data };\n}\n\n// Node http  <->  the web-standard handlers apiblaze/server exports.\nasync function viaHandler(handler, req, res, raw) {\n  const request = new Request(`http://localhost${req.url}`, {\n    method: req.method,\n    headers: { 'content-type': req.headers['content-type'] || 'application/json' },\n    body: ['GET', 'HEAD'].includes(req.method) ? undefined : raw,\n  });\n  const out = await handler(request);\n  const headers = {};\n  out.headers.forEach((v, k) => { headers[k] = v; });\n  res.writeHead(out.status, headers);\n  if (!out.body) return res.end();\n  const reader = out.body.getReader();\n  for (;;) { const { done, value } = await reader.read(); if (done) break; res.write(Buffer.from(value)); }\n  res.end();\n}\n\nfunction widgets() {\n  if (!lib) return {};\n  const project = env('APIBLAZE_NAME');\n  const tenant = env('APIBLAZE_TENANT');\n  const out = {};\n  out.chat = lib.createApiblazeChat({\n    project: `${project}-${tenant}`, apiKey: env('APIBLAZE_SERVER_KEY'),\n    host: 'tryabz.run', environment: 'dev', getUser: () => ({ userId: ME.userId }),\n  });\n  if (env('APIBLAZE_CP_KEY') && env('APIBLAZE_WIDGETS') === '1') {\n    const user = () => ({ tenant, userId: ME.userId, email: ME.email, label: ME.label });\n    out.keys = lib.createApiblazeKeys({ cpKey: env('APIBLAZE_CP_KEY'), getUser: user, environment: 'dev' });\n    out.groups = lib.createApiblazeGroups({ cpKey: env('APIBLAZE_CP_KEY'), getUser: user });\n  }\n  return out;\n}\n\nfunction startApp(port = Number(env('APP_PORT', '3000'))) {\n  const w = widgets();\n  const pub = path.join(__dirname, 'public');\n  const server = http.createServer((req, res) => {\n    let raw = '';\n    req.on('data', (c) => { raw += c; });\n    req.on('end', async () => {\n      try {\n        const url = new URL(req.url, 'http://x');\n        const p = url.pathname;\n        if (req.method === 'GET' && (p === '/' || p === '/index.html')) {\n          res.writeHead(200, { 'content-type': 'text/html; charset=utf-8' });\n          return res.end(fs.readFileSync(path.join(pub, 'index.html')));\n        }\n        if (req.method === 'GET' && p === '/apiblaze-widgets.js' && fs.existsSync(path.join(pub, 'apiblaze-widgets.js'))) {\n          res.writeHead(200, { 'content-type': 'text/javascript; charset=utf-8' });\n          return res.end(fs.readFileSync(path.join(pub, 'apiblaze-widgets.js')));\n        }\n        if (p === '/api/config') {\n          return json(res, 200, {\n            name: env('APIBLAZE_NAME'), apiUrl: env('APIBLAZE_URL'), mcpUrl: env('APIBLAZE_MCP_URL'),\n            portalUrl: env('APIBLAZE_PORTAL_URL'), key: mask(env('APIBLAZE_SERVER_KEY')), ginoKey: mask(env('APIBLAZE_GINO_KEY')),\n            backendPort: env('BACKEND_PORT', '3001'), rps: Number(env('APIBLAZE_DEMO_RPS')) || null, rateCard: env('APIBLAZE_RATE_CARD') === '1', widgets: { chat: !!w.chat, keys: !!w.keys, groups: !!w.groups },\n          });\n        }\n        if (p === '/api/ticker') return json(res, 200, recent.slice(0, 12));\n        if (p === '/api/apiblaze/chat' && w.chat) return viaHandler(w.chat.handler, req, res, raw);\n        if (p === '/api/apiblaze/keys' && w.keys) return viaHandler(w.keys.handler, req, res, raw);\n        if (p === '/api/apiblaze/groups' && w.groups) return viaHandler(w.groups.handler, req, res, raw);\n        if (req.method === 'POST' && p === '/api/act') {\n          const b = JSON.parse(raw || '{}');\n          return json(res, 200, await call(String(b.op || 'list'), { as: String(b.as || 'ana'), id: b.id, key: b.key, body: b.body }));\n        }\n        if (req.method === 'POST' && p === '/api/hammer') {\n          // 30 calls at once, as one customer: the demo's rate limit lets only some through.\n          const codes = await Promise.all(Array.from({ length: 30 }, () => call('list').then((r) => r.status).catch(() => 0)));\n          const served = codes.filter((c) => c === 200).length;\n          const limited = codes.filter((c) => c === 429).length;\n          return json(res, 200, { sent: codes.length, served, limited, other: codes.length - served - limited });\n        }\n        json(res, 404, { error: 'not found' });\n      } catch (e) {\n        json(res, 502, { error: `Could not reach the API: ${String((e && e.message) || e)}` });\n      }\n    });\n  });\n  return new Promise((resolve, reject) => {\n    server.once('error', reject);\n    server.listen(port, '127.0.0.1', () => resolve(server));\n  });\n}\n\nmodule.exports = { startApp };\n",
       "start.js": "// Starts the pizzeria: the backend (port 3001) and the website (port 3000).\n// `npx apiblaze@latest demo` runs this for you and connects APIblaze to the backend.\n// To run it yourself: `node start.js`, then in another terminal\n//   npx apiblaze@latest dev --port 3001 --project <the name in .env.local> --auto\n\nconst fs = require('fs');\nconst path = require('path');\n\nfunction loadEnv(file = path.join(__dirname, '.env.local')) {\n  if (!fs.existsSync(file)) return;\n  for (const line of fs.readFileSync(file, 'utf8').split('\\n')) {\n    const m = /^\\s*([A-Z0-9_]+)\\s*=\\s*(.*)\\s*$/.exec(line);\n    if (m && !process.env[m[1]]) process.env[m[1]] = m[2].replace(/^\"(.*)\"$/, '$1');\n  }\n}\n\nasync function start() {\n  loadEnv();\n  const { startBackend } = require('./backend');\n  const { startApp } = require('./app');\n  const backendPort = Number(process.env.BACKEND_PORT) || 3001;\n  const appPort = Number(process.env.APP_PORT) || 3000;\n  await startBackend(backendPort);\n  await startApp(appPort);\n  return { backendPort, appPort };\n}\n\nmodule.exports = { start, loadEnv };\nif (require.main === module) {\n  start().then(({ appPort }) => console.log(`Pizzeria running: http://localhost:${appPort}`))\n    .catch((e) => { console.error(`Could not start: ${e.message}`); process.exit(1); });\n}\n",
       "public/index.html": `<!doctype html>
 <html lang="en">
 <head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
-<title>ResiResi demo</title>
+<title>Nino's Pizza demo</title>
 <style>
   :root {
-    --bg: #faf7f2; --card: #ffffff; --ink: #1d1b19; --muted: #6b6560; --line: #e8e2d9;
-    --bad: #c2410c; --bad-bg: #fff1e8; --good: #15803d; --good-bg: #ecfdf3;
-    --accent: #e4572e; --accent-ink: #fff; --soft: #f3eee6; --mono: ui-monospace, SFMono-Regular, Menlo, monospace;
+    --bg: #faf7f2; --card: #fff; --ink: #1d1b19; --muted: #6b6560; --line: #e8e2d9; --soft: #f3eee6;
+    --accent: #e4572e; --accent-ink: #fff; --good: #15803d; --good-bg: #ecfdf3; --bad: #c2410c; --bad-bg: #fff1e8;
+    --live: #16a34a; --mono: ui-monospace, SFMono-Regular, Menlo, monospace;
   }
   @media (prefers-color-scheme: dark) {
-    :root {
-      --bg: #161412; --card: #1f1c1a; --ink: #f3efe9; --muted: #a39b92; --line: #34302c;
-      --bad: #fb923c; --bad-bg: #2b1a10; --good: #4ade80; --good-bg: #10241a; --soft: #26221f;
-    }
+    :root { --bg: #161412; --card: #1f1c1a; --ink: #f3efe9; --muted: #a39b92; --line: #34302c; --soft: #26221f;
+      --good: #4ade80; --good-bg: #10241a; --bad: #fb923c; --bad-bg: #2b1a10; }
   }
   * { box-sizing: border-box; }
   body { margin: 0; background: var(--bg); color: var(--ink); font: 16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
-  main { max-width: 1040px; margin: 0 auto; padding: 32px 16px 64px; }
-  header { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; }
-  h1 { font-size: 28px; margin: 0; letter-spacing: -0.02em; }
-  .badge { font-size: 13px; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; background: var(--card); }
-  .lede { font-size: 18px; color: var(--muted); margin: 8px 0 24px; max-width: 46em; }
-  .play { background: var(--accent); color: var(--accent-ink); border: 0; border-radius: 12px; padding: 14px 22px; font-size: 17px; font-weight: 600; cursor: pointer; }
-  .play:disabled { opacity: .6; cursor: default; }
-  .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 24px; }
-  @media (max-width: 760px) { .grid { grid-template-columns: 1fr; } }
+  main { max-width: 1080px; margin: 0 auto; padding: 28px 16px 64px; }
+  h1 { font-size: 30px; margin: 0; letter-spacing: -0.02em; }
+  .lede { font-size: 18px; color: var(--muted); margin: 6px 0 20px; }
   .card { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 20px; }
-  .step { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
-  h2 { font-size: 20px; margin: 4px 0 4px; }
-  .sub { color: var(--muted); margin: 0 0 16px; font-size: 15px; }
-  .row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
-  button.act { background: var(--soft); color: var(--ink); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; font-size: 15px; cursor: pointer; }
-  button.act:hover { border-color: var(--muted); }
-  .log { display: grid; gap: 8px; min-height: 96px; }
-  .out { border-radius: 10px; padding: 10px 12px; font-size: 15px; background: var(--soft); }
-  .out.bad { background: var(--bad-bg); color: var(--bad); font-weight: 600; }
+  .hero { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 16px; }
+  @media (max-width: 820px) { .hero, .grid { grid-template-columns: 1fr !important; } }
+  .addr { display: grid; gap: 14px; }
+  .addr .label { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
+  .addr .row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
+  code, .mono { font-family: var(--mono); font-size: 13px; }
+  .url { background: var(--soft); padding: 8px 10px; border-radius: 10px; word-break: break-all; flex: 1; min-width: 0; }
+  button { background: var(--soft); color: var(--ink); border: 1px solid var(--line); border-radius: 10px; padding: 9px 13px; font-size: 14px; cursor: pointer; }
+  button:hover { border-color: var(--muted); }
+  button.primary { background: var(--accent); color: var(--accent-ink); border-color: transparent; font-weight: 600; }
+  .hint { color: var(--muted); font-size: 14px; margin: 2px 0 0; }
+  .dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--live); margin-right: 6px; box-shadow: 0 0 0 0 rgba(22,163,74,.6); animation: pulse 1.6s infinite; }
+  @keyframes pulse { 70% { box-shadow: 0 0 0 8px rgba(22,163,74,0); } 100% { box-shadow: 0 0 0 0 rgba(22,163,74,0); } }
+  .ticker { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 12px; }
+  .ticker ol { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; max-height: 230px; overflow: auto; }
+  .ticker li { font-family: var(--mono); font-size: 12.5px; background: var(--soft); border-radius: 8px; padding: 6px 9px; display: flex; gap: 8px; }
+  .ticker li.new { animation: flash 1.2s ease-out; }
+  @keyframes flash { from { background: var(--good-bg); } }
+  .ticker .st { margin-left: auto; color: var(--muted); }
+  .empty { color: var(--muted); font-size: 14px; }
+  h2 { font-size: 20px; margin: 0 0 4px; }
+  h3 { font-size: 17px; margin: 0 0 4px; }
+  .section { margin: 28px 0 10px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
+  .grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
+  .grid .card { padding: 16px; }
+  .sub { color: var(--muted); font-size: 14px; margin: 0 0 12px; }
+  .out { border-radius: 10px; padding: 8px 10px; font-size: 14px; margin-top: 10px; background: var(--soft); }
   .out.good { background: var(--good-bg); color: var(--good); font-weight: 600; }
-  .out small { display: block; font-weight: 400; color: var(--muted); font-family: var(--mono); font-size: 12px; margin-top: 2px; }
-  .chat { margin-top: 16px; }
-  .msgs { display: grid; gap: 8px; margin: 12px 0; min-height: 60px; }
-  .msg { border-radius: 12px; padding: 10px 12px; max-width: 85%; white-space: pre-wrap; }
-  .msg.user { background: var(--accent); color: var(--accent-ink); justify-self: end; }
-  .msg.bot { background: var(--soft); }
-  .msg.tool { font-family: var(--mono); font-size: 12px; color: var(--muted); background: transparent; padding: 0 12px; }
-  form.ask { display: flex; gap: 8px; }
-  form.ask input { flex: 1; min-width: 0; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font-size: 15px; background: var(--card); color: var(--ink); }
-  .added { margin-top: 16px; }
-  .added ul { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 8px; }
-  .added li::before { content: "\u2713  "; color: var(--good); font-weight: 700; }
-  code { font-family: var(--mono); font-size: 13px; background: var(--soft); padding: 1px 6px; border-radius: 6px; word-break: break-all; }
-  .next { margin-top: 16px; font-size: 17px; }
+  .out.bad { background: var(--bad-bg); color: var(--bad); font-weight: 600; }
+  .out small { display: block; font-weight: 400; color: var(--muted); font-family: var(--mono); font-size: 12px; }
+  .wide { grid-column: span 3; }
+  @media (max-width: 820px) { .wide { grid-column: auto; } }
+  .footer { margin-top: 26px; font-size: 17px; }
+  #chat { min-height: 420px; }
 </style>
 </head>
 <body>
 <main>
-  <header>
-    <h1>\u{1F355} ResiResi \xB7 table bookings for pizzerias</h1>
-    <span class="badge" id="badge">connecting\u2026</span>
-  </header>
-  <p class="lede">Ana books a table at Nino Pizza. The same little booking app, twice. On the left, it ships the way most apps do. On the right, APIblaze stands in front of it. Nobody changed the app's code.</p>
-  <button class="play" id="play">\u25B6 Play the story</button>
+  <h1>\u{1F355} Nino's Pizza</h1>
+  <p class="lede">This booking app is running on your laptop. One command put it on the internet, with a door for AI assistants. You wrote no code for it.</p>
 
-  <div class="grid">
-    <section class="card">
-      <div class="step">1 \xB7 Without APIblaze</div>
-      <h2>One shared password</h2>
-      <p class="sub">The app holds a password. Anyone who gets it can do anything.</p>
-      <div class="row">
-        <button class="act" data-door="before" data-as="ana" data-op="book">Ana books table 4</button>
-        <button class="act" data-door="before" data-as="ben" data-op="cancel">Ben cancels Ana's booking</button>
+  <section class="hero">
+    <div class="card">
+      <div class="addr">
+        <div>
+          <div class="label"><span class="dot"></span>Your API, live on the internet</div>
+          <div class="row"><span class="url mono" id="api">\u2026</span><button data-copy="api">Copy</button></div>
+          <p class="hint">Anyone you give a key to can call it from anywhere. It's answered by <span class="mono" id="local">localhost</span> on this machine.</p>
+        </div>
+        <div>
+          <div class="label">\u{1F916} Its MCP address, for AI assistants</div>
+          <div class="row"><span class="url mono" id="mcp">\u2026</span><button data-copy="mcp">Copy</button></div>
+          <p class="hint">Paste it into Claude, ChatGPT or Cursor and they can use your app, under the same rules.</p>
+        </div>
       </div>
-      <div class="log" id="log-before"></div>
-    </section>
-
-    <section class="card">
-      <div class="step">2 \xB7 With APIblaze</div>
-      <h2>Every call says who is asking</h2>
-      <p class="sub">APIblaze checks each request. Only the person who made a booking can change it.</p>
-      <div class="row">
-        <button class="act" data-door="after" data-as="ana" data-op="book">Ana books table 4</button>
-        <button class="act" data-door="after" data-as="ben" data-op="cancel">Ben cancels Ana's booking</button>
+      <div class="ticker">
+        <div class="label" style="font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)">Requests reaching your laptop, live</div>
+        <ol id="ticker"><li class="empty" id="ticker-empty">Nothing yet. Ask the assistant to book a table \u2192</li></ol>
       </div>
-      <div class="log" id="log-after"></div>
-    </section>
-  </div>
-
-  <section class="card chat" id="tenants" hidden>
-    <div class="step">3 \xB7 Two pizzerias, one app</div>
-    <h2>Each pizzeria gets its own key</h2>
-    <p class="sub">Nino Pizza and Gino Pizza both use this app. Nino's key <code id="nino-key">\u2026</code> \xB7 Gino's key <code id="gino-key">\u2026</code></p>
-    <div class="row">
-      <button class="act" id="gino-peek">Gino Pizza's key asks for Nino's booking</button>
     </div>
-    <div class="log" id="log-gino"></div>
+    <div class="card" style="padding:0;overflow:hidden"><div id="chat"></div></div>
   </section>
 
-  <section class="card chat">
-    <div class="step" id="ai-step">3 \xB7 An AI assistant, same rules</div>
-    <h2>Ben asks an AI to do it instead</h2>
-    <p class="sub">AI assistants can use this app too, and they get exactly the same answer as Ben.</p>
-    <div class="row">
-      <button class="act" id="ask-ben">Ben asks: "Cancel Ana's booking"</button>
-      <button class="act" id="ask-ana">Ana asks: "What are my bookings?"</button>
+  <div class="section">Included with every APIblaze API, still no code</div>
+  <section class="grid">
+    <div class="card">
+      <h3>\u{1F6E1} Only the owner can change it</h3>
+      <p class="sub">Ana books a table. Ben tries to cancel it.</p>
+      <button id="rule">Ben cancels Ana's booking</button>
+      <div id="rule-out"></div>
+    </div>
+    <div class="card" id="tenants" hidden>
+      <h3>\u{1F3E2} Each customer is separate</h3>
+      <p class="sub">Nino Pizza and Gino Pizza use the same app, each with its own key.</p>
+      <button id="gino">Gino's key asks for Nino's booking</button>
+      <div id="gino-out"></div>
+    </div>
+    <div class="card" id="rate-card" hidden>
+      <h3>\u23F1 Rate limits</h3>
+      <p class="sub">Each customer gets <span id="rps">a few</span> calls a second. Send 30 at once and see what happens.</p>
+      <button id="hammer">Send 30 calls at once</button>
+      <div id="hammer-out"></div>
+    </div>
+    <div class="card">
+      <h3>\u{1F510} Sign-in</h3>
+      <p class="sub">People and AI agents can sign in with GitHub instead of a key. Your API has a developer portal for that.</p>
+      <a id="portal" href="#" target="_blank" rel="noopener"><button>Open the developer portal</button></a>
+    </div>
+    <div class="card wide" id="keys-card" hidden>
+      <h3>\u{1F511} API keys, self-serve</h3>
+      <p class="sub">Drop this widget into your site and each customer makes their own keys.</p>
+      <div id="keys"></div>
+    </div>
+    <div class="card wide" id="groups-card" hidden>
+      <h3>\u{1F465} Users and roles</h3>
+      <p class="sub">Put people in groups. Rules can say "only staff may cancel".</p>
+      <div id="groups"></div>
     </div>
-    <div class="msgs" id="msgs"></div>
-    <form class="ask" id="ask">
-      <input id="q" placeholder="Ask the assistant something, as Ben" autocomplete="off">
-      <button class="act" type="submit">Send</button>
-    </form>
   </section>
 
-  <section class="card added">
-    <div class="step">What APIblaze added, with zero code in this app</div>
-    <ul>
-      <li>A key for this app: <code id="key">\u2026</code> (kept on the server, never in the browser)</li>
-      <li>"Only the person who made a booking can change it", worked out from <code>openapi.yaml</code></li>
-      <li>A door for AI assistants: <code id="mcp">\u2026</code></li>
-    </ul>
-    <p class="next">Want this in front of your own app? Ask Claude: <b>"Put APIblaze in front of my app."</b></p>
-  </section>
+  <p class="footer">This is exactly what <code>npx apiblaze@latest dev</code> does for your own app. Ask Claude: <b>"Put my app on APIblaze."</b></p>
 </main>
+<script src="/apiblaze-widgets.js"></script>
 <script>
 const $ = (s) => document.querySelector(s);
-const ids = { before: null, after: null };
-const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
-
-function show(door, cls, text, detail) {
-  const el = document.createElement('div');
-  el.className = 'out ' + (cls || '');
-  el.textContent = text;
-  if (detail) { const s = document.createElement('small'); s.textContent = detail; el.appendChild(s); }
-  $('#log-' + door).appendChild(el);
+const post = (url, body) => fetch(url, { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify(body || {}) }).then((r) => r.json()).catch((e) => ({ status: 0, error: String(e) }));
+function out(el, cls, text, detail) {
+  const d = document.createElement('div'); d.className = 'out ' + (cls || ''); d.textContent = text;
+  if (detail) { const s = document.createElement('small'); s.textContent = detail; d.appendChild(s); }
+  $(el).replaceChildren(d);
 }
+document.querySelectorAll('[data-copy]').forEach((b) => b.onclick = () => { navigator.clipboard?.writeText($('#' + b.dataset.copy).textContent); b.textContent = 'Copied'; setTimeout(() => b.textContent = 'Copy', 1200); });
 
-async function act(door, as, op) {
-  if (op === 'cancel' && !ids[door]) await act(door, 'ana', 'book');
-  const r = await fetch('/api/act', { method: 'POST', headers: { 'content-type': 'application/json' },
-    body: JSON.stringify({ door, as, op, id: ids[door] }) }).then((x) => x.json()).catch((e) => ({ status: 0, body: { error: String(e) } }));
-  const code = 'HTTP ' + r.status;
-  if (op === 'book') {
-    if (r.status === 201) { ids[door] = r.body.id; show(door, '', \`Ana booked table \${r.body.table} at \${r.body.time}.\`, \`\${code} \xB7 booking \${r.body.id}\`); }
-    else show(door, 'bad', explain(r), code);
-    return;
-  }
-  if (r.status === 204) {
-    show(door, door === 'before' ? 'bad' : '', door === 'before' ? "Cancelled. Ben just deleted Ana's table." : 'Cancelled.', code);
-    ids[door] = null;
-  } else if (r.status === 403 || r.status === 404) {
-    show(door, 'good', "\u{1F6E1} Blocked. Only Ana can cancel Ana's booking.", code + ' \xB7 decided by APIblaze, not the app');
-  } else show(door, 'bad', explain(r), code);
-}
+let bookingId = null;
+async function book() { const r = await post('/api/act', { op: 'book', as: 'ana' }); if (r.status === 201) bookingId = r.body.id; return r; }
 
+$('#rule').onclick = async () => {
+  if (!bookingId) await book();
+  const r = await post('/api/act', { op: 'cancel', as: 'ben', id: bookingId });
+  if (r.status === 403) out('#rule-out', 'good', "\u{1F6E1} Blocked. Only Ana can cancel Ana's booking.", 'HTTP 403 \xB7 decided by APIblaze, not your code');
+  else if (r.status === 204) { out('#rule-out', 'bad', 'Cancelled. That should not happen.', 'HTTP 204'); bookingId = null; }
+  else out('#rule-out', 'bad', explain(r), 'HTTP ' + r.status);
+};
+$('#gino').onclick = async () => {
+  if (!bookingId) await book();
+  const r = await post('/api/act', { op: 'open', as: 'ana', id: bookingId, key: 'gino' });
+  if (r.status === 403 || r.status === 404) out('#gino-out', 'good', "\u{1F6E1} Blocked. Gino Pizza only sees Gino Pizza's bookings.", 'HTTP ' + r.status);
+  else out('#gino-out', 'bad', r.status === 200 ? "Gino Pizza can read Nino's booking." : explain(r), 'HTTP ' + r.status);
+};
+$('#hammer').onclick = async () => {
+  out('#hammer-out', '', 'Sending\u2026');
+  const r = await post('/api/hammer');
+  out('#hammer-out', 'good', \`\${r.served} served, \${r.limited} told to slow down.\`, \`\${r.sent} calls \xB7 HTTP 200 \xD7 \${r.served}, 429 \xD7 \${r.limited}\`);
+};
 function explain(r) {
-  const b = r.body || {};
   if (r.status === 402) return 'The free demo calls ran out. Run again: npx apiblaze@latest demo';
-  if (r.status === 429) return 'Too many clicks at once. Wait a second and try again.';
-  if (r.status >= 500 || r.status === 0) return 'The connection to APIblaze dropped. Run again: npx apiblaze@latest demo';
-  return (b.detail || b.title || b.error || 'Something went wrong') + '';
+  if (r.status === 429) return 'Too many calls at once. Wait a second.';
+  if (!r.status || r.status >= 500) return 'The connection to APIblaze dropped. Run again: npx apiblaze@latest demo';
+  return (r.body && (r.body.detail || r.body.error)) || 'Something went wrong';
 }
 
-$('.grid').addEventListener('click', (e) => {
-  const b = e.target.closest('button.act'); if (!b) return;
-  act(b.dataset.door, b.dataset.as, b.dataset.op);
-});
-
-// \u2500\u2500 the assistant \u2500\u2500
-const thread = { ana: [], ben: [] };
-function bubble(cls, text) { const d = document.createElement('div'); d.className = 'msg ' + cls; d.textContent = text; $('#msgs').appendChild(d); return d; }
-async function ask(as, text) {
-  bubble('user', (as === 'ana' ? 'Ana: ' : 'Ben: ') + text);
-  const msg = { id: String(Math.random()), role: 'user', parts: [{ type: 'text', text }] };
-  thread[as].push(msg);
-  let bot = null, said = '';
+// Live ticker: what the backend on this laptop just answered.
+const seen = new Set();
+async function tick() {
   try {
-    const res = await fetch('/api/chat', { method: 'POST', headers: { 'content-type': 'application/json' },
-      body: JSON.stringify({ as, id: 'demo-' + as, messages: thread[as] }) });
-    const ct = res.headers.get('content-type') || '';
-    if (!res.ok || !ct.includes('event-stream')) {
-      const d = await res.json().catch(() => ({}));
-      bubble('bot', res.status === 402 ? 'The free assistant turns ran out for this demo.' : (d.error || d.detail || 'The assistant is not available right now.'));
-      return;
-    }
-    const reader = res.body.getReader(); const dec = new TextDecoder(); let buf = '';
-    for (;;) {
-      const { done, value } = await reader.read(); if (done) break;
-      buf += dec.decode(value, { stream: true });
-      let at;
-      while ((at = buf.indexOf('\\n\\n')) !== -1) {
-        const raw = buf.slice(0, at); buf = buf.slice(at + 2);
-        const data = raw.split('\\n').filter((l) => l.startsWith('data:')).map((l) => l.slice(5).trim()).join('\\n');
-        if (!data || data === '[DONE]') continue;
-        let ev; try { ev = JSON.parse(data); } catch { continue; }
-        if (ev.type === 'tool-input-start') bubble('tool', '\u2192 using the app: ' + (ev.toolName || 'tool'));
-        if (ev.type === 'tool-output-error') bubble('tool', '\u2190 refused: ' + String(ev.errorText || '').slice(0, 120));
-        if (ev.type === 'text-delta') { if (!bot) bot = bubble('bot', ''); said += ev.delta || ''; bot.textContent = said; }
-        if (ev.type === 'error') bubble('bot', ev.errorText || 'Something went wrong.');
+    const rows = await fetch('/api/ticker').then((r) => r.json());
+    if (rows.length) $('#ticker-empty')?.remove();
+    for (const r of rows.slice().reverse()) {
+      const k = r.at + r.method + r.path + r.who;
+      if (seen.has(k)) continue; seen.add(k);
+      const li = document.createElement('li'); li.className = 'new';
+      const t = new Date(r.at).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit' });
+      const who = r.who ? \`\${r.who}\${r.tenant ? ' @ ' + r.tenant.replace(/[0-9a-f]{4}$/, '') : ''}\` : '';
+      // Text only: these values come from requests made on the internet.
+      for (const [tag, text, cls] of [['span', t], ['b', r.method], ['span', r.path], ['span', who], ['span', String(r.status), 'st']]) {
+        const el = document.createElement(tag); el.textContent = text; if (cls) el.className = cls; li.appendChild(el);
       }
+      $('#ticker').prepend(li);
     }
-    if (said) thread[as].push({ id: String(Math.random()), role: 'assistant', parts: [{ type: 'text', text: said }] });
-  } catch (e) { bubble('bot', 'The assistant is not reachable right now.'); }
+  } catch { /* the page keeps working */ }
 }
-$('#ask-ben').onclick = async () => {
-  if (!ids.after) await act('after', 'ana', 'book');
-  ask('ben', \`Cancel booking \${ids.after}. It's Ana's table, I want it.\`);
-};
-$('#ask-ana').onclick = () => ask('ana', 'What are my bookings?');
-
-// \u2500\u2500 two pizzerias \u2500\u2500
-let hasTenants = false;
-async function ginoPeek() {
-  if (!ids.after) await act('after', 'ana', 'book');
-  // Same person name, different pizzeria: only the key differs.
-  const r = await fetch('/api/act', { method: 'POST', headers: { 'content-type': 'application/json' },
-    body: JSON.stringify({ door: 'gino', as: 'ana', op: 'open', id: ids.after }) }).then((x) => x.json()).catch(() => ({ status: 0 }));
-  const code = 'HTTP ' + r.status;
-  if (r.status === 200) show('gino', 'bad', "Gino Pizza can read Nino's booking.", code);
-  else if (r.status === 403 || r.status === 404) show('gino', 'good', "\u{1F6E1} Blocked. Gino Pizza's key only sees Gino Pizza's bookings.", code + ' \xB7 decided by APIblaze, not the app');
-  else show('gino', 'bad', explain(r), code);
-}
-$('#gino-peek').onclick = ginoPeek;
-$('#ask').onsubmit = (e) => { e.preventDefault(); const q = $('#q').value.trim(); if (q) { $('#q').value = ''; ask('ben', q); } };
-
-$('#play').onclick = async () => {
-  $('#play').disabled = true;
-  await act('before', 'ana', 'book'); await sleep(700);
-  await act('before', 'ben', 'cancel'); await sleep(1200);
-  await act('after', 'ana', 'book'); await sleep(700);
-  await act('after', 'ben', 'cancel'); await sleep(900);
-  if (hasTenants) { await ginoPeek(); await sleep(900); }
-  $('#ask-ben').click();
-  $('#play').disabled = false;
-};
+setInterval(tick, 1000);
 
 fetch('/api/config').then((r) => r.json()).then((c) => {
-  $('#badge').textContent = c.name ? 'Protected by APIblaze \xB7 ' + c.name : 'APIblaze not connected';
-  $('#key').textContent = c.key || 'not set';
-  $('#mcp').textContent = c.mcpUrl || 'not set';
-  if (c.ginoKey) {
-    hasTenants = true;
-    $('#tenants').hidden = false;
-    $('#nino-key').textContent = c.key;
-    $('#gino-key').textContent = c.ginoKey;
-    $('#ai-step').textContent = '4 \xB7 An AI assistant, same rules';
-  }
+  $('#api').textContent = c.apiUrl || 'not connected';
+  $('#mcp').textContent = c.mcpUrl || 'not connected';
+  $('#local').textContent = 'localhost:' + c.backendPort;
+  if (c.portalUrl) $('#portal').href = c.portalUrl; else $('#portal').hidden = true;
+  if (c.ginoKey) $('#tenants').hidden = false;
+  if (c.rps) $('#rps').textContent = c.rps;
+  if (c.rateCard) $('#rate-card').hidden = false;
+  const W = window.ApiblazeWidgets;
+  const theme = { accent: '#e4572e' };
+  if (W && c.widgets.chat) W.chat('#chat', { endpoint: '/api/apiblaze/chat', mode: 'inline', title: "Nino's Pizza assistant", avatar: '\u{1F355}', height: 520, theme,
+    welcome: "Hi Ana! I can book, list and cancel tables at Nino's Pizza. I'm using the app on your laptop, through APIblaze.",
+    suggestions: ['Book table 4 for 2 people at 7:30pm', 'What are my bookings?', "Cancel booking r1"] });
+  if (W && c.widgets.keys) { $('#keys-card').hidden = false; W.keys('#keys', { endpoint: '/api/apiblaze/keys', theme }); }
+  if (W && c.widgets.groups) { $('#groups-card').hidden = false; W.groups('#groups', { endpoint: '/api/apiblaze/groups', theme }); }
 });
 </script>
 </body>
@@ -6717,6 +6582,8 @@ fetch('/api/config').then((r) => r.json()).then((c) => {
 // src/commands/demo.ts
 var demo_exports = {};
 __export(demo_exports, {
+  DEMO_ADMIN_EMAIL: () => DEMO_ADMIN_EMAIL,
+  DEMO_RPS: () => DEMO_RPS,
   demoName: () => demoName,
   runDemo: () => runDemo,
   runDemoStop: () => runDemoStop,
@@ -6782,6 +6649,11 @@ function writeApp(dir) {
   }
   import_fs5.default.writeFileSync(import_path4.default.join(dir, "package.json"), JSON.stringify({ name: "nino-pizza-demo", private: true, scripts: { start: "node start.js" } }, null, 2) + "\n");
   import_fs5.default.writeFileSync(import_path4.default.join(dir, ".gitignore"), ".env.local\n.demo/\n");
+  for (const [from, to] of [[import_path4.default.join(__dirname, "server", "index.js"), import_path4.default.join(dir, "lib", "apiblaze-server.js")], [import_path4.default.join(__dirname, "browser", "widgets.js"), import_path4.default.join(dir, "public", "apiblaze-widgets.js")]]) {
+    if (!import_fs5.default.existsSync(from)) continue;
+    import_fs5.default.mkdirSync(import_path4.default.dirname(to), { recursive: true });
+    import_fs5.default.copyFileSync(from, to);
+  }
 }
 function saveState(dir, s) {
   const d = import_path4.default.join(dir, STATE_DIR);
@@ -6892,14 +6764,30 @@ async function startDemo(opts) {
   const missing = [!cpKey && "workspace key", !teamId && "team", !serverKey && "API key", !tenant2 && "tenant"].filter(Boolean);
   if (missing.length) throw new DemoError(`${B.product} did not return everything the demo needs (${missing.join(", ")}).`, `Run again: ${LATEST} demo`);
   const apiUrl = restUrl(project, version2, "dev", { anon: true });
-  const chatBase = `https://${project}-${tenant2}.mcp.tryabz.run/${version2}/dev`;
+  await cpFetch(cpKey, `/projects/${encodeURIComponent(project)}/${encodeURIComponent(version2)}/limits`, {
+    method: "PUT",
+    body: JSON.stringify({ consumerRps: DEMO_RPS, endUserRps: DEMO_RPS })
+  }).catch(() => {
+  });
+  await cpFetch(cpKey, `/teams/${encodeURIComponent(teamId)}/tenants/${encodeURIComponent(tenant2)}/admin-emails`, {
+    method: "POST",
+    body: JSON.stringify({ email: DEMO_ADMIN_EMAIL })
+  }).catch(() => {
+  });
   const gino = (r.tenants ?? []).find((t) => t.api_key);
+  const agents = mcpUrl(project, version2, "dev", { tenant: tenant2, anon: true });
   writeEnv(dir, {
     APIBLAZE_NAME: project,
+    APIBLAZE_TENANT: tenant2,
     APIBLAZE_URL: apiUrl,
     APIBLAZE_SERVER_KEY: serverKey,
     ...gino?.api_key ? { APIBLAZE_GINO_KEY: gino.api_key } : {},
-    APIBLAZE_MCP_URL: chatBase,
+    APIBLAZE_MCP_URL: agents,
+    APIBLAZE_PORTAL_URL: `https://${tenant2}.portal.apiblaze.com/${version2}`,
+    // The keys + users widgets mint through the workspace's control key (server-side only).
+    APIBLAZE_CP_KEY: cpKey,
+    APIBLAZE_WIDGETS: process.env.APIBLAZE_DEMO_WIDGETS === "0" ? 0 : 1,
+    APIBLAZE_DEMO_RPS: DEMO_RPS,
     APP_PORT: appPort,
     BACKEND_PORT: backendPort
   });
@@ -6914,23 +6802,20 @@ async function startDemo(opts) {
   const url = `http://localhost:${appPort}`;
   if (opts.open !== false) openBrowser3(url);
   const secs = Math.round((Date.now() - t0) / 1e3);
-  const agents = mcpUrl(project, version2, "dev", { tenant: tenant2, anon: true });
   console.log();
-  console.log(`${import_chalk25.default.green("\u2713")} The demo is live: ${import_chalk25.default.bold(url)}   ${import_chalk25.default.dim(`(${secs} s)`)}`);
+  console.log(`${import_chalk25.default.green("\u2713")} Nino's Pizza, running on this laptop, is live on the internet: ${import_chalk25.default.bold(url)}   ${import_chalk25.default.dim(`(${secs} s)`)}`);
   console.log();
-  console.log("  What it shows. Tell the user this, in plain words:");
-  console.log("  1. Without APIblaze, a booking app uses one shared password, so Ben can cancel Ana's table.");
-  console.log(`  2. With ${B.product} in front of the same app, unchanged, Ben tries again. Blocked.`);
-  if (gino) console.log("  3. Two pizzerias share the app, each with its own key. Gino Pizza's key cannot see Nino Pizza's bookings.");
-  console.log(`  ${gino ? 4 : 3}. An AI assistant uses the same app under the same rules. It cannot cancel Ana's table either.`);
-  console.log('  The page has a "Play the story" button that runs it all.');
+  console.log("  Tell the user this, in plain words:");
+  console.log(`  1. "This booking app runs on your laptop. ${B.product} just gave it a public address, plus an MCP address so AI assistants can use it."`);
+  console.log('  2. "On the page, ask the assistant to book a table, and watch the request arrive on your laptop."');
+  console.log('  3. "API keys, sign-in and who-can-change-what are already on, with no code. Try the cards below."');
   console.log();
-  console.log(`  The app's code is in ./${DIR_NAME}. backend.js has no login or permissions code.`);
-  console.log(`  Its key is saved in ./${DIR_NAME}/.env.local, never shown here.`);
-  console.log(import_chalk25.default.dim(`  For AI assistants: ${agents}`));
-  console.log(import_chalk25.default.dim(`  Stop it: ${LATEST} demo stop   \xB7   Run it again any time: ${LATEST} demo`));
+  console.log(`  Public API   ${apiUrl}`);
+  console.log(`  MCP          ${agents}`);
+  console.log(`  Same as      ${LATEST} dev --port ${backendPort} --openapi ./openapi.yaml   ${import_chalk25.default.dim("(the command for your own app)")}`);
+  console.log(import_chalk25.default.dim(`  Code in ./${DIR_NAME} \xB7 key saved in .env.local, never shown \xB7 stop: ${LATEST} demo stop`));
   console.log();
-  console.log(`  Ask the user one question: "Want to put this in front of your own app?"`);
+  console.log(`  Ask the user one question: "Want to put your own app on the internet like this?"`);
 }
 async function runDemoStop() {
   const n = await stopDemos();
@@ -6999,7 +6884,7 @@ async function serveDemo(dir) {
   await new Promise(() => {
   });
 }
-var import_fs5, import_path4, import_net, import_child_process4, import_crypto, import_module, import_chalk25, DIR_NAME, STATE_DIR, LATEST, DemoError, ADJ, NOUN, pick2, registryFile, alive;
+var import_fs5, import_path4, import_net, import_child_process4, import_crypto, import_module, import_chalk25, DIR_NAME, STATE_DIR, LATEST, DEMO_RPS, DEMO_ADMIN_EMAIL, DemoError, ADJ, NOUN, pick2, registryFile, alive;
 var init_demo = __esm({
   "src/commands/demo.ts"() {
     "use strict";
@@ -7013,12 +6898,15 @@ var init_demo = __esm({
     init_api();
     init_tunnel_client();
     init_auth();
+    init_anon_cred();
     init_brand();
     init_create();
     init_files();
     DIR_NAME = `${B.cli}-demo`;
     STATE_DIR = ".demo";
     LATEST = `npx ${B.cli}@latest`;
+    DEMO_RPS = 2;
+    DEMO_ADMIN_EMAIL = "ana@ninopizza.example";
     DemoError = class extends Error {
       constructor(message, fix) {
         super(message);
@@ -7354,6 +7242,13 @@ async function journey(label3, work, home, checks) {
   } else {
     add("tenants-record", false, "no Gino Pizza key: the server did not return extra_tenants");
   }
+  const page = `http://127.0.0.1:${env.APP_PORT}`;
+  const made = await http(`${page}/api/apiblaze/keys`, { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ action: "create" }) });
+  const widgetKey = made.body?.key;
+  const used = widgetKey ? await http(`${api}/reservations`, { headers: { "x-api-key": widgetKey } }) : { status: 0 };
+  add("keys-widget", made.status === 201 && used.status === 200, `create ${made.status} \xB7 the new key calls the API ${used.status}`);
+  const snap = await http(`${page}/api/apiblaze/groups`, { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ action: "snapshot" }) });
+  add("users-widget", snap.status === 200 && snap.body?.access === "ok", `snapshot ${snap.status} \xB7 access ${snap.body?.access ?? "-"}`);
   const chat = await http(`${env.APIBLAZE_MCP_URL}/runtime-chat`, {
     method: "POST",
     headers: as("ana"),
@@ -7368,11 +7263,16 @@ async function journey(label3, work, home, checks) {
     }
   }).filter(Boolean).filter((e) => e.type === "text-delta").map((e) => e.delta ?? "").join("");
   const streamErr = /"type":"error"/.test(chat.text);
-  add(
-    "ai-turn",
-    chat.status === 200 && chat.type.includes("event-stream") && said.length > 0 && !streamErr,
-    `HTTP ${chat.status}${streamErr ? " \xB7 stream error" : ""} \xB7 ${said.length} chars${chat.status !== 200 ? ` \xB7 ${chat.text.slice(0, 120)}` : ""}`
-  );
+  const ipCapped = /data-apiblaze-upsell/.test(chat.text) && /Free chats used up/.test(chat.text);
+  if (ipCapped) {
+    checks.push({ id: `${label3}:ai-turn`, ok: true, skipped: true, detail: "SKIPPED \u2014 this machine's IP is at today's free-chat cap (resets daily); a newcomer's first chat is unaffected" });
+  } else {
+    add(
+      "ai-turn",
+      chat.status === 200 && chat.type.includes("event-stream") && said.length > 0 && !streamErr,
+      `HTTP ${chat.status}${streamErr ? " \xB7 stream error" : ""} \xB7 ${said.length} chars${chat.status !== 200 ? ` \xB7 ${chat.text.slice(0, 120)}` : ""}`
+    );
+  }
   return env;
 }
 async function runOpAnon(o = {}) {
@@ -7401,9 +7301,13 @@ async function runOpAnon(o = {}) {
     checks.push({ id: "stop", ok: stop.code === 0 && portsFree, detail: `exit ${stop.code}${portsFree ? "" : " \xB7 ports still answering"}` });
     import_fs8.default.rmSync(root, { recursive: true, force: true });
   }
-  for (const c of checks) log4(`  ${c.ok ? import_chalk70.default.green("\u2713") : import_chalk70.default.red("\u2717")} ${c.id.padEnd(24)} ${import_chalk70.default.dim(c.detail)}`);
+  for (const c of checks) log4(`  ${c.skipped ? import_chalk70.default.yellow("\u2013") : c.ok ? import_chalk70.default.green("\u2713") : import_chalk70.default.red("\u2717")} ${c.id.padEnd(24)} ${import_chalk70.default.dim(c.detail)}`);
   const failed = checks.filter((c) => !c.ok).length;
-  log4(failed ? import_chalk70.default.red(`${checks.length - failed}/${checks.length} passed (${Math.round((Date.now() - t0) / 1e3)} s)`) : import_chalk70.default.green(`${checks.length}/${checks.length} passed (${Math.round((Date.now() - t0) / 1e3)} s)`));
+  const skipped = checks.filter((c) => c.skipped).length;
+  const passed = checks.length - failed - skipped;
+  const secs = Math.round((Date.now() - t0) / 1e3);
+  const tail = `${skipped ? `, ${skipped} skipped` : ""} (${secs} s)`;
+  log4(failed ? import_chalk70.default.red(`${passed}/${checks.length - skipped} passed, ${failed} failed${tail}`) : import_chalk70.default.green(`${passed}/${checks.length - skipped} passed${tail}`));
   if (o.json) process.stdout.write(JSON.stringify({ ok: !failed, checks }, null, 2) + "\n");
   if (failed) process.exitCode = 1;
   return { ok: !failed, checks };
@@ -7975,10 +7879,9 @@ description: Use when the user asks what ${P} (or ${B.cli}) does or can do for t
 
 Run nothing. Say this, in these words or very close to them, then stop:
 
-"${P} puts a smart front door on your app's backend. In one command, every customer gets
-their own key, people can only touch their own data, and AI assistants like me can use your
-app safely, under the same rules. You don't write any login or permissions code. Want me to
-show you in about 30 seconds?"
+"${P} puts the app on your laptop on the internet in one command. It gets a public address,
+plus an address AI assistants like me can use to work with it. API keys, sign-in and
+who-can-change-what come built in, with no code. Want me to show you in about 30 seconds?"
 
 Do not use the words proxy, MCP, tenant, OpenAPI or header unless the user does first.
 
@@ -7988,13 +7891,12 @@ Do not use the words proxy, MCP, tenant, OpenAPI or header unless the user does
 2. Run exactly this, in the foreground. It needs no login and asks nothing. It sets
    everything up, opens the browser and exits by itself once the page is live:
    \`${run2} demo\`
-3. When it prints \u2713, tell the three-beat story it printed, in plain words, with the link:
-   - "Here's a booking app where anyone with the password can do anything: Ben cancels Ana's table."
-   - "Same app with ${P} in front, no code changed: Ben tries again. Blocked."
-   - If it printed the pizzerias line: "Two pizzerias share the app, each with its own key. Gino's can't see Nino's bookings."
-   - "And here's an AI assistant using the same app, with the same rules."
-   Point them at the "Play the story" button. Then ask one question:
-   **"Want to put this in front of your own app?"**
+3. When it prints \u2713, tell the story it printed, in plain words, with the link:
+   - "This booking app runs on your laptop. ${P} just gave it a public address, and one for AI assistants."
+   - "On the page, ask the assistant to book a table and watch the request arrive on your laptop."
+   - "Keys, sign-in and who-can-change-what are already on, with no code. Try the cards."
+   Then ask one question: **"Want to put your own app on the internet like this?"**
+   If they say yes: their app runs locally \u2192 \`${run2} dev\`; it is deployed \u2192 \`${run2} create\`.
 4. If it prints \u2717, say its one sentence and run the one command it gives, once.
 
 Rules for the demo: keep each update to one line. Do not narrate steps, read the demo's
@@ -17377,7 +17279,7 @@ program.command("login").description(`Authenticate with ${B.product}`).option("-
     process.exit(1);
   }
 });
-program.command("create").description(`Create a new ${B.thing} \u2014 both doors open by default (an API key for your backend and widget, GitHub sign-in for people and agents) and resources locked to their creator (no login needed: logged out it creates an anonymous ${B.thingShort} you can claim)`).option("--name <name>", B.cli === "mcpblaze" ? "MCP server name (becomes <name>-<tenant>.mcpblaze.com)" : "Proxy name (becomes <name>.abz.run)").option("--target <url|file>", "What to proxy \u2014 pass ANY of: a target server base URL (https://httpbin.org), a local OpenAPI file (./openapi.yaml), or a remote OpenAPI URL (https://acme.com/openapi.yaml). Spec inputs are detected automatically; routes, API version and environments then come from the spec").addOption(new import_commander.Option("--openapi <file|url>", "Deprecated alias \u2014 --target now detects spec files/URLs itself").hideHelp()).addOption(new import_commander.Option("--openapispec <file|url>", "Deprecated alias for --openapi").hideHelp()).option("--team <id|name>", "Team to create under (defaults to your active team)").option("--auth <type>", "Open ONE door only: api_key | oauth (sign in with GitHub, APIblaze-hosted) | none. Omitted = both doors.").option("--apikey", "API-key door only (no sign-in): the bootstrap keys are minted and printed; callers send X-API-Key, agents connect with a key.").option("--oauth [config]", `Sign-in door only (no API key). Bare = APIblaze-hosted GitHub sign-in. '{"iss","aud","jwks"}' = trust YOUR hosted login's JWTs. '{"provider","clientId","clientSecret"?}' = APIblaze-hosted login page with YOUR OAuth app (github \xB7 google \xB7 microsoft \xB7 facebook \xB7 auth0 \xB7 oidc); the secret is optional except for github and facebook. '{"provider":"oidc","issuer":"https://acme.okta.com/oauth2/default","clientId":"\u2026"}' = any OpenID Connect IdP by issuer (Okta \xB7 Entra \xB7 Keycloak \xB7 Cognito \xB7 \u2026).`).option("--identified", "Require every call to identify its end user (X-End-User-Id from a backend key, or a login token \u2014 a client key alone cannot); unattributed calls are rejected").option("--iam", `Turn IAM on for the ${B.thingShort}'s tenant so users & groups apply to identified calls`).option("--apiversion <version>", `API version to create (e.g. 2.0.0). Creating a new version of a ${B.thingShort} you own adds a version to the existing project.`).option("--tenant <slug>", `Tenant to attach the ${B.thingShort} to (created if new). Omitted \u2192 your team's most-recently-used tenant.`).option("--product <slug>", "Product tag to group this project under in the portal (team-scoped; anonymous create). Defaults to your team's existing/placeholder tag.").option("--display-name <name>", "Human-friendly display name").option("--subdomain <slug>", "Explicit subdomain (defaults to --name)").option("--config <file>", "JSON file with the full request body (anonymous create): requests_auth, login providers + client/server token types, scopes, callback URLs, etc. See apiblaze_anonymous.yaml. Flags override its fields.").option("-y, --yes", "Skip the confirmation prompt").option("--auto", `Zero prompts, start to finish: generates the ${B.thingShort} name when --name is omitted (from the target host, salted), takes every confirmation as yes, auto-picks the tenant. Implies --yes.`).option("--new-session", "Start a fresh anonymous session (do not group with prior anonymous creates)").option("--json", "Output machine-readable JSON (non-interactive)").action(async (opts) => {
+program.command("create").description(`Put an app that is already DEPLOYED behind ${B.product}: a public URL and an MCP address for AI agents in front of your URL or OpenAPI spec. Included: API keys, sign-in, ownership rules, rate limits. No login needed. (App on this machine? Use \`dev\`.)`).option("--name <name>", B.cli === "mcpblaze" ? "MCP server name (becomes <name>-<tenant>.mcpblaze.com)" : "Proxy name (becomes <name>.abz.run)").option("--target <url|file>", "What to proxy \u2014 pass ANY of: a target server base URL (https://httpbin.org), a local OpenAPI file (./openapi.yaml), or a remote OpenAPI URL (https://acme.com/openapi.yaml). Spec inputs are detected automatically; routes, API version and environments then come from the spec").addOption(new import_commander.Option("--openapi <file|url>", "Deprecated alias \u2014 --target now detects spec files/URLs itself").hideHelp()).addOption(new import_commander.Option("--openapispec <file|url>", "Deprecated alias for --openapi").hideHelp()).option("--team <id|name>", "Team to create under (defaults to your active team)").option("--auth <type>", "Open ONE door only: api_key | oauth (sign in with GitHub, APIblaze-hosted) | none. Omitted = both doors.").option("--apikey", "API-key door only (no sign-in): the bootstrap keys are minted and printed; callers send X-API-Key, agents connect with a key.").option("--oauth [config]", `Sign-in door only (no API key). Bare = APIblaze-hosted GitHub sign-in. '{"iss","aud","jwks"}' = trust YOUR hosted login's JWTs. '{"provider","clientId","clientSecret"?}' = APIblaze-hosted login page with YOUR OAuth app (github \xB7 google \xB7 microsoft \xB7 facebook \xB7 auth0 \xB7 oidc); the secret is optional except for github and facebook. '{"provider":"oidc","issuer":"https://acme.okta.com/oauth2/default","clientId":"\u2026"}' = any OpenID Connect IdP by issuer (Okta \xB7 Entra \xB7 Keycloak \xB7 Cognito \xB7 \u2026).`).option("--identified", "Require every call to identify its end user (X-End-User-Id from a backend key, or a login token \u2014 a client key alone cannot); unattributed calls are rejected").option("--iam", `Turn IAM on for the ${B.thingShort}'s tenant so users & groups apply to identified calls`).option("--apiversion <version>", `API version to create (e.g. 2.0.0). Creating a new version of a ${B.thingShort} you own adds a version to the existing project.`).option("--tenant <slug>", `Tenant to attach the ${B.thingShort} to (created if new). Omitted \u2192 your team's most-recently-used tenant.`).option("--product <slug>", "Product tag to group this project under in the portal (team-scoped; anonymous create). Defaults to your team's existing/placeholder tag.").option("--display-name <name>", "Human-friendly display name").option("--subdomain <slug>", "Explicit subdomain (defaults to --name)").option("--config <file>", "JSON file with the full request body (anonymous create): requests_auth, login providers + client/server token types, scopes, callback URLs, etc. See apiblaze_anonymous.yaml. Flags override its fields.").option("-y, --yes", "Skip the confirmation prompt").option("--auto", `Zero prompts, start to finish: generates the ${B.thingShort} name when --name is omitted (from the target host, salted), takes every confirmation as yes, auto-picks the tenant. Implies --yes.`).option("--new-session", "Start a fresh anonymous session (do not group with prior anonymous creates)").option("--json", "Output machine-readable JSON (non-interactive)").action(async (opts) => {
   try {
     await runCreate({ ...opts, openapi: opts.openapi ?? opts.openapispec });
   } catch (err) {
@@ -17429,7 +17331,7 @@ withSetupOptions(sidecar.command("setup").description(`Wire a Next.js app to rou
 sidecar.command("approve").description(`Route an origin through ${B.product} (creates its proxy)`).argument("<origin>", "Origin, e.g. api.stripe.com").option("--team <id|name>", "Team (defaults to active team)").option("--json", "Machine-readable output").action(action((origin, opts, cmd) => runOriginsApprove(origin, { ...cmd.parent?.opts(), ...opts })));
 sidecar.command("deny").description("Dismiss a candidate origin so it stops being suggested").argument("<origin>", "Origin, e.g. sentry.io").option("--team <id|name>", "Team (defaults to active team)").action(action((origin, opts, cmd) => runOriginsDeny(origin, { ...cmd.parent?.opts(), ...opts })));
 sidecar.command("remove").description("Un-route an approved origin (deletes its proxy; the app goes direct again)").argument("<origin>", "Origin, e.g. api.stripe.com").option("--team <id|name>", "Team (defaults to active team)").action(action((origin, opts, cmd) => runOriginsRemove(origin, { ...cmd.parent?.opts(), ...opts })));
-program.command("dev").description(`Put the code running on this machine behind ${B.product}: everything \`create\` does \u2014 both doors, resources locked to their creator, an admin, an agent connected \u2014 with localhost as the target, through a tunnel (no login needed)`).argument("[port]", "Local port to tunnel (positional; overrides --port)").option("-p, --port <number>", "Local port your server listens on", "3000").option("--openapi <file|url>", "Your OpenAPI spec (a local file or a URL). Omitted \u2192 looks for /openapi.json, /openapi.yaml, /docs/openapi.json on that port. Rules need one.").option("--name <name>", B.cli === "mcpblaze" ? "MCP server name (becomes <name>-<tenant>.mcpblaze.com); omitted \u2192 one short question with a generated default" : "Proxy name (becomes <name>.abz.run); omitted \u2192 one short question with a generated default").option("--team <id|name>", "Team to create under (defaults to your active team)").option("--tenant <slug>", `Tenant to attach the ${B.thingShort} to (created if new)`).option("--auth <type>", "Open ONE door only: api_key | oauth (sign in with GitHub) | none. Omitted = both doors.").option("--apikey", "API-key door only (no sign-in). With --oauth <config>: BOTH doors, sign-in through your own app or issuer").option("--oauth [config]", "Sign-in door only (no API key). Same shapes as `create --oauth`.").option("--auto", "Every answer = the default: generated name, both doors, every resource locked, no admin, no agent. No prompts, no TTY needed.").option("--project <nameOrId>", "Re-attach this existing localhost project (skips the picker \u2014 for scripts)").option("-y, --yes", "Skip the confirmation when one project already points at this machine").option("-o, --capture-file <path>", "Stream full request/response traffic to a file (JSON lines)").option("--new-session", "Logged-out only: start a fresh anonymous workspace instead of reusing this machine's (each run = a throwaway proxy)").action(async (port, opts) => {
+program.command("dev").description(`Put the app running on THIS machine on the internet: a public URL and an MCP address for AI agents, tunnelled to localhost. Included: API keys, sign-in, ownership rules, rate limits. No login needed. (Deployed app? Use \`create\`.)`).argument("[port]", "Local port to tunnel (positional; overrides --port)").option("-p, --port <number>", "Local port your server listens on", "3000").option("--openapi <file|url>", "Your OpenAPI spec (a local file or a URL). Omitted \u2192 looks for /openapi.json, /openapi.yaml, /docs/openapi.json on that port. Rules need one.").option("--name <name>", B.cli === "mcpblaze" ? "MCP server name (becomes <name>-<tenant>.mcpblaze.com); omitted \u2192 one short question with a generated default" : "Proxy name (becomes <name>.abz.run); omitted \u2192 one short question with a generated default").option("--team <id|name>", "Team to create under (defaults to your active team)").option("--tenant <slug>", `Tenant to attach the ${B.thingShort} to (created if new)`).option("--auth <type>", "Open ONE door only: api_key | oauth (sign in with GitHub) | none. Omitted = both doors.").option("--apikey", "API-key door only (no sign-in). With --oauth <config>: BOTH doors, sign-in through your own app or issuer").option("--oauth [config]", "Sign-in door only (no API key). Same shapes as `create --oauth`.").option("--auto", "Every answer = the default: generated name, both doors, every resource locked, no admin, no agent. No prompts, no TTY needed.").option("--project <nameOrId>", "Re-attach this existing localhost project (skips the picker \u2014 for scripts)").option("-y, --yes", "Skip the confirmation when one project already points at this machine").option("-o, --capture-file <path>", "Stream full request/response traffic to a file (JSON lines)").option("--new-session", "Logged-out only: start a fresh anonymous workspace instead of reusing this machine's (each run = a throwaway proxy)").action(async (port, opts) => {
   try {
     const resolved = parseInt(port ?? opts.port, 10);
     if (Number.isNaN(resolved)) {