@mugwork/mug 0.1.0

package/dist/src/commands/dev.js

@@ -0,0 +1,2818 @@
+import { checkCliVersion } from "../version-check.js";
+import { existsSync, readFileSync, writeFileSync, readdirSync, watch, mkdirSync, unlinkSync } from "node:fs";
+import { join, dirname, resolve } from "node:path";
+import Database from "better-sqlite3";
+import { createServer } from "node:http";
+import { spawn, exec } from "node:child_process";
+import { createRequire } from "node:module";
+import { fileURLToPath } from "node:url";
+import { statSync } from "node:fs";
+import { WebSocketServer } from "ws";
+import { readSecrets } from "./secret.js";
+import { validateFormConfigErrors } from "./form.js";
+import { ensureDevEmail, getAccountToken } from "./login.js";
+import { repairScaffolding, ensureSettings, migrateMugJsonSources } from "./sync.js";
+import { parseWorkflowSteps, countSteps } from "../workflow-parser.js";
+import { parseSourceFile } from "../connector-parser.js";
+import { renderForm, renderPortal, renderPortalDetail, renderDevBanner, bindUserParam, paginateQuery, detailQuery, collectSectionQueries, findTableSection, renderWorkspaceHome } from "../surface-renderer.js";
+import net from "node:net";
+let USER_PORT = 8787;
+let WRANGLER_PORT = 8788;
+function isPortFree(port) {
+    return new Promise((resolve) => {
+        const srv = net.createServer();
+        srv.once("error", () => resolve(false));
+        srv.once("listening", () => { srv.close(); resolve(true); });
+        srv.listen(port, "127.0.0.1");
+    });
+}
+async function findAvailablePorts(startPort) {
+    let port = startPort;
+    while (port < startPort + 100) {
+        const userFree = await isPortFree(port);
+        const wranglerFree = await isPortFree(port + 1);
+        if (userFree && wranglerFree)
+            return { userPort: port, wranglerPort: port + 1 };
+        port += 2;
+    }
+    throw new Error(`No available port pair found between ${startPort} and ${startPort + 100}`);
+}
+const wsClients = new Set();
+let wss = null;
+function broadcast(event) {
+    const msg = JSON.stringify(event);
+    for (const client of wsClients) {
+        if (client.readyState === 1)
+            client.send(msg);
+    }
+}
+const debounceTimers = new Map();
+function debouncedBroadcast(area, delayMs = 150) {
+    const existing = debounceTimers.get(area);
+    if (existing)
+        clearTimeout(existing);
+    debounceTimers.set(area, setTimeout(() => {
+        debounceTimers.delete(area);
+        broadcast({ type: "refresh", area });
+    }, delayMs));
+}
+function writePidFile(cwd, data) {
+    const mugDir = join(cwd, ".mug");
+    mkdirSync(mugDir, { recursive: true });
+    writeFileSync(join(mugDir, "dev.pid"), JSON.stringify(data, null, 2));
+}
+function cleanPidFile(cwd) {
+    const pidPath = join(cwd, ".mug", "dev.pid");
+    try {
+        unlinkSync(pidPath);
+    }
+    catch { }
+}
+export function readPidFile(cwd) {
+    const pidPath = join(cwd, ".mug", "dev.pid");
+    try {
+        return JSON.parse(readFileSync(pidPath, "utf-8"));
+    }
+    catch {
+        return null;
+    }
+}
+const MUG_FAVICON_SVG = `<svg width="291" height="371" viewBox="0 0 291 371" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M134.129 122.279L140.915 122.8L141.155 124.478L141.394 126.157L151.534 126.674L161.674 127.191L167.245 128.392L172.817 129.593L176.743 130.899L180.668 132.206L179.403 132.915L178.139 133.624L170.306 134.807L162.472 135.99L156.284 135.995L150.097 136V138.406V140.813L103.591 140.606L57.0848 140.4L56.8325 138.2L56.5794 136L51.2438 135.984L45.9073 135.968L40.3186 135.187L34.7299 134.406L30.9376 133.523L27.1452 132.641V131.987V131.334L34.1311 129.714L41.117 128.094L47.362 127.247L53.6078 126.4H59.5374H65.4678V124.438V122.476L70.4577 122.192L75.4477 121.908L101.395 121.834L127.343 121.759L134.129 122.279Z" fill="#71B7FB"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M3.07464 136.078L5.58875 136.957V137.573V138.189L10.5787 139.553L15.5686 140.917L19.6268 142.398L23.6858 143.878L29.8645 144.739L36.0433 145.6H43.9161H51.7891L52.0422 147.8L52.2944 150H103.391H154.488L154.729 147.918L154.97 145.836L167.503 145.398L180.036 144.96L184.827 143.222L189.617 141.485L195.206 139.871L200.795 138.258L201.623 137.208L202.452 136.158L204.418 135.879L206.383 135.6L206.407 231.8L206.431 328H204.315H202.198L201.636 335.2L201.074 342.4H199.138H197.202V344.8V347.2H194.807H192.411V349.6V352H190.016H187.621V354.4V356.8H182.831H178.04V359.2V361.6H173.25H168.46L168.461 363.8L168.461 366H157.084H145.706L145.454 368.2L145.2 370.4H103.391H61.5821L61.329 368.2L61.0767 366L49.3005 365.778L37.5243 365.558V363.578V361.6H33.1331H28.742V359.2V356.8H23.9517H19.1613V354.453V352.106L16.9658 351.853L14.7702 351.6L14.5179 349.4L14.2648 347.2H11.9232H9.58069V342.4V337.6H7.18553H4.79036V332.8V328H2.3952H3.8147e-05V231.6V135.2H0.280282H0.560526L3.07464 136.078ZM19.1613 323.094V243.547V164H23.9517H28.742V239.2V314.4H31.1372H33.5323V321.6V328.8H35.5283H37.5243V330.8V332.8H39.9194H42.3146V335.2V337.6H44.7097H47.1049V342.4V347.2H42.7665H38.4288L38.1757 345L37.9235 342.8L33.4948 342.565L29.0654 342.33L28.1751 339.965L27.2841 337.6H25.649H24.0139L23.7832 330.6L23.5525 323.6L21.3569 323.347L19.1613 323.094Z" fill="#71B7FB"/>
+<path d="M237.972 155.228L239.516 156.056V157.586V159.116L243.708 159.358L247.899 159.6L248.687 161.4L249.475 163.2H251.182H252.889L255.384 163.7L257.879 164.2V166.5V168.8H260.189H262.499L262.961 170.007L263.423 171.214L265.442 172.135L267.46 173.057V175.275V177.494L269.655 177.747L271.851 178L272.101 180.6L272.352 183.2H274.585H276.819L276.438 185.2L276.056 187.2H278.544H281.033V192V196.8H283.428H285.823V204V211.2H288.218H290.613V230V248.8H288.218H285.823V255.547V262.294L283.627 262.547L281.432 262.8L281.192 267.4L280.953 272H278.977H277.001L276.522 274.4L276.043 276.8H274.146H272.25V278.508V280.217L270.454 282.033L268.658 283.85L267.628 285.125L266.598 286.4H264.634H262.67V288.8V291.2H260.274H257.879V293.2V295.2H255.484H253.089V297.6V300H246.303H239.516V302.4V304.8H227.541H215.565V295.622V286.442L227.341 286.222L239.117 286L239.086 283.8L239.054 281.6H243.677H248.299V279.2V276.8H250.694H253.089V274.4V272H255.484H257.879V269.6V267.2H260.274H262.67V264.8V262.4H265.065H267.46V257.492V252.583L269.456 250.73L271.452 248.876V230.038V211.2H269.487H267.522L267.291 204.2L267.061 197.2L264.865 196.947L262.67 196.694V194.347V192H260.274H257.879V190.063V188.127L255.484 187.6L253.089 187.073V185.19V183.306L250.893 183.053L248.698 182.8L248.445 180.6L248.192 178.4H243.907H239.623L239.369 176.2L239.117 174L227.341 173.778L215.565 173.558V163.978V154.4H225.996H236.427L237.972 155.228Z" fill="#71B7FB"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M107.782 6.8V13.6H110.073H112.364L112.858 16.6L113.354 19.6V23.2V26.8L112.866 29.756L112.378 32.7128L110.28 32.956L108.182 33.2L107.929 35.4L107.676 37.6H105.786H103.897L103.644 39.8L103.391 42L101.196 42.2528L99.0001 42.5064V44.0792V45.6512L97.8433 48.4256L96.6864 51.2H95.5527H94.419L93.924 54.2L93.4289 57.2L93.4904 64.4L93.5511 71.6L94.0805 75.6L94.609 79.6L96.8045 79.8528L99.0001 80.1064V82.0528V84H103.391H107.782V79.6V75.2H105.88H103.976L103.495 73.4L103.014 71.6L103.003 65.852L102.992 60.104L103.77 58.052L104.549 56H106.113H107.676L107.929 53.8L108.182 51.6L110.328 51.3512L112.476 51.1032L112.724 48.9512L112.972 46.8L115.167 46.5472L117.363 46.2936V44.4V42.5064L119.559 42.2528L121.754 42L121.992 37.4496L122.23 32.8992L124.387 32.6496L126.544 32.4L126.303 26L126.062 19.6L123.583 12.2392L121.105 4.87841L119.433 4.6392L117.762 4.4L117.51 2.2L117.257 0H112.52H107.782V6.8ZM66.2662 37.548V47.096L65.4878 49.148L64.7093 51.2H63.0926H61.4759V53.6V56H59.0807H56.6856V58.4V60.8H54.2904H51.8952V69.9472V79.0936L54.0908 79.3472L56.2864 79.6L56.5386 81.8L56.7917 84H61.1294H65.4678V79.6V75.2H63.4719H61.4759V70.4V65.6H63.4088H65.3409L65.867 63.2L66.3932 60.8H68.2726H70.152L70.4051 58.6L70.6573 56.4L72.8042 56.1512L74.9519 55.9032L75.1994 53.7512L75.4477 51.6L77.6432 51.3472L79.8388 51.0936V41.9472V32.8H77.4436H75.0485V30.4V28H70.6573H66.2662V37.548ZM146.096 36.6L146.087 45.2L145.592 48.2L145.097 51.2H143.206H141.315V53.6V56H138.919H136.524V58.4V60.8H134.129H131.734V69.9368V79.0728L134.129 79.6L136.524 80.1272V82.0632V84H140.915H145.307V79.6V75.2H143.359H141.413L140.876 71.6096L140.338 68.02L140.801 66.8096L141.264 65.6H143.286H145.307V63.2V60.8H147.649H149.991L150.244 58.6L150.496 56.4L152.692 56.1472L154.887 55.8936V53.5472V51.2H156.883H158.879V42V32.8H156.883H154.887V30.4V28H150.496H146.105L146.096 36.6Z" fill="#71B7FB"/>
+<path d="M145.307 105.2V107.2L147.901 107.222L150.496 107.243L161.274 107.678L172.053 108.113L173.051 108.431L174.049 108.75V110.261V111.772L178.719 112.262L183.39 112.75L189.697 114.747L196.004 116.744L199.797 119.154L203.589 121.565V123.164V124.763L201.78 125.951L199.97 127.139L196.544 128.35L193.118 129.562L190.538 126.981L187.958 124.4L182.8 122.609L177.641 120.818L167.262 118.471L156.883 116.125L149.698 115.261L142.512 114.396L132.217 113.598L121.922 112.8H104.641H87.362L73.0214 113.988L58.6815 115.176L53.0928 116.069L47.5041 116.962L35.7965 119.63L24.0882 122.298L21.0264 123.871L17.9638 125.444L16.0987 127.446L14.2345 129.449L12.0844 128.831L9.93437 128.214L6.51408 126.465L3.09379 124.716L3.3429 122.962L3.59278 121.209L7.73164 118.734L11.8705 116.26L17.2644 114.486L22.6575 112.711L27.637 112.246L32.6158 111.78L33.0892 109.89L33.5627 108H40.2108H46.8598L54.1675 107.48L61.4759 106.961V105.08V103.2H103.391H145.307V105.2Z" fill="#71B7FB"/>
+</svg>`;
+const surfaceErrors = new Map();
+let lastWranglerError = null;
+function renderErrorOverlay(title, message, file, hint) {
+    return `<!DOCTYPE html><html><head><meta charset="utf-8"><title>${title}</title>
+<style>*{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,sans-serif;background:#1a0a0a;color:#e0e0e0;display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px}
+.overlay{max-width:700px;width:100%;background:#1f1010;border:2px solid #c0392b;border-radius:12px;padding:32px;box-shadow:0 0 40px rgba(192,57,43,0.2)}
+h1{color:#e74c3c;font-size:18px;margin-bottom:16px;display:flex;align-items:center;gap:8px}
+h1::before{content:"✕";display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;background:#c0392b;color:white;border-radius:50%;font-size:13px;font-weight:700}
+pre{background:#0d0505;padding:16px;border-radius:8px;overflow-x:auto;font-size:13px;line-height:1.6;color:#ff6b6b;white-space:pre-wrap;margin-bottom:16px;border:1px solid #2a1515}
+.file{color:#888;font-size:13px;margin-bottom:12px;font-family:monospace}.hint{color:#999;font-size:13px;margin-top:8px}
+</style></head><body><div class="overlay">
+<h1>${title}</h1>
+${file ? `<div class="file">${file}</div>` : ""}
+<pre>${message.replace(/</g, "&lt;").replace(/>/g, "&gt;")}</pre>
+${hint ? `<p class="hint">${hint}</p>` : ""}
+</div>
+${LIVE_RELOAD_SCRIPT}
+</body></html>`;
+}
+function parseBreadcrumb(url) {
+    const from = url.searchParams.get("from");
+    const fromLabel = url.searchParams.get("fromLabel");
+    if (!from)
+        return undefined;
+    return { href: from, label: fromLabel || "Back" };
+}
+function loadSurfaceConfigs(cwd) {
+    const surfacesDir = join(cwd, "src", "surfaces");
+    const configs = new Map();
+    if (!existsSync(surfacesDir))
+        return configs;
+    surfaceErrors.clear();
+    for (const file of readdirSync(surfacesDir)) {
+        if (!file.endsWith(".json"))
+            continue;
+        const id = file === "_home.json" ? "_home" : file.replace(/\.json$/, "");
+        if (file === "_home.json") {
+            try {
+                const raw = readFileSync(join(surfacesDir, file), "utf-8");
+                configs.set("_home", JSON.parse(raw));
+            }
+            catch (err) {
+                const msg = err instanceof Error ? err.message : String(err);
+                console.error(`[surfaces] Failed to load ${file}: ${msg}`);
+                surfaceErrors.set(id, msg);
+                broadcast({ type: "error", message: `Surface ${file}: ${msg}` });
+            }
+            continue;
+        }
+        try {
+            const raw = readFileSync(join(surfacesDir, file), "utf-8");
+            const config = JSON.parse(raw);
+            config.surfaceId = config.surfaceId ?? id;
+            if (config.type !== "portal") {
+                const errs = validateFormConfigErrors(`src/surfaces/${file}`, config);
+                if (errs.length > 0) {
+                    const msg = errs.map(e => e.message).join("; ");
+                    console.error(`[surfaces] ${file}: ${msg}`);
+                    surfaceErrors.set(id, msg);
+                    broadcast({ type: "error", message: `Surface ${file}: ${msg}` });
+                }
+            }
+            if (config.branding) {
+                const b = config.branding;
+                if (b.logo && !b.logo.startsWith("/") && !b.logo.startsWith("http"))
+                    b.logo = `/_branding/${encodeURIComponent(resolve(cwd, b.logo))}`;
+                if (b.logoSquare && !b.logoSquare.startsWith("/") && !b.logoSquare.startsWith("http"))
+                    b.logoSquare = `/_branding/${encodeURIComponent(resolve(cwd, b.logoSquare))}`;
+            }
+            configs.set(id, config);
+        }
+        catch (err) {
+            const msg = err instanceof Error ? err.message : String(err);
+            console.error(`[surfaces] Failed to load ${file}: ${msg}`);
+            surfaceErrors.set(id, msg);
+            broadcast({ type: "error", message: `Surface ${file}: ${msg}` });
+        }
+    }
+    return configs;
+}
+async function proxyToWrangler(req, res, path) {
+    try {
+        const body = await readBody(req);
+        const headers = {};
+        for (const [key, value] of Object.entries(req.headers)) {
+            if (value && typeof value === "string")
+                headers[key] = value;
+            else if (Array.isArray(value))
+                headers[key] = value.join(", ");
+        }
+        headers.host = `localhost:${WRANGLER_PORT}`;
+        const upstream = await fetch(`http://localhost:${WRANGLER_PORT}${path}`, {
+            method: req.method ?? "GET",
+            headers,
+            body: req.method !== "GET" && req.method !== "HEAD" ? new Uint8Array(body) : undefined,
+        });
+        res.writeHead(upstream.status, Object.fromEntries(upstream.headers.entries()));
+        const arrayBuf = await upstream.arrayBuffer();
+        res.end(Buffer.from(arrayBuf));
+    }
+    catch {
+        const accept = req.headers.accept ?? "";
+        if (accept.includes("text/html") && lastWranglerError) {
+            res.writeHead(502, { "Content-Type": "text/html; charset=utf-8" });
+            res.end(renderErrorOverlay("Build Error", lastWranglerError, "wrangler dev", "Fix the error and save — the page will reload automatically."));
+        }
+        else if (accept.includes("text/html")) {
+            res.writeHead(502, { "Content-Type": "text/html; charset=utf-8" });
+            res.end(renderErrorOverlay("Worker Unavailable", "Wrangler dev server is not reachable.\nIt may still be starting, or it crashed.", undefined, "Check the terminal for wrangler output."));
+        }
+        else {
+            res.writeHead(502, { "Content-Type": "application/json" });
+            res.end(JSON.stringify({ error: "Wrangler dev server not reachable", detail: lastWranglerError }));
+        }
+    }
+}
+function readBody(req) {
+    return new Promise((resolve, reject) => {
+        const chunks = [];
+        req.on("data", (chunk) => chunks.push(chunk));
+        req.on("end", () => resolve(Buffer.concat(chunks)));
+        req.on("error", reject);
+    });
+}
+function parseCookies(req) {
+    const cookies = {};
+    const header = req.headers.cookie;
+    if (!header)
+        return cookies;
+    for (const pair of header.split(";")) {
+        const [name, ...rest] = pair.trim().split("=");
+        if (name)
+            cookies[name] = decodeURIComponent(rest.join("="));
+    }
+    return cookies;
+}
+function getDevIdentity(req) {
+    const cookies = parseCookies(req);
+    return cookies.mug_dev_identity ?? "";
+}
+function makeDevSession(identity) {
+    if (!identity)
+        return null;
+    return { email: identity, verifiedAt: new Date().toISOString() };
+}
+function queryLocal(database, sql, params) {
+    const cwd = process.cwd();
+    const dbPath = join(cwd, "databases", `${database}.db`);
+    if (!existsSync(dbPath)) {
+        return { rows: [] };
+    }
+    const db = new Database(dbPath, { readonly: true });
+    try {
+        const stmt = db.prepare(sql);
+        const rows = (params.length > 0 ? stmt.all(...params) : stmt.all());
+        return { rows };
+    }
+    finally {
+        db.close();
+    }
+}
+async function queryWrangler(database, sql, params) {
+    const res = await fetch(`http://localhost:${WRANGLER_PORT}/api/query`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ database, sql, params }),
+    });
+    if (!res.ok)
+        throw new Error(`Query failed: ${res.status} ${await res.text()}`);
+    return res.json();
+}
+function getKnownDatabases(cwd) {
+    const dbDir = join(cwd, "databases");
+    if (!existsSync(dbDir))
+        return [];
+    return readdirSync(dbDir).filter((f) => f.endsWith(".db")).map((f) => f.replace(/\.db$/, ""));
+}
+async function seedDatabasesToDOs(cwd) {
+    const dbNames = getKnownDatabases(cwd);
+    if (dbNames.length === 0)
+        return;
+    console.log(`[db] Seeding ${dbNames.length} database${dbNames.length !== 1 ? "s" : ""} into dev DOs...`);
+    for (const dbName of dbNames) {
+        const dbPath = join(cwd, "databases", `${dbName}.db`);
+        const db = new Database(dbPath, { readonly: true });
+        try {
+            const tableRows = db.prepare("SELECT name, sql FROM sqlite_master WHERE type='table' AND name NOT LIKE 'sqlite_%'").all();
+            if (tableRows.length === 0)
+                continue;
+            const tables = {};
+            for (const { name, sql: ddl } of tableRows) {
+                const rows = db.prepare(`SELECT * FROM "${name}"`).all();
+                tables[name] = { ddl, rows };
+            }
+            const res = await fetch(`http://localhost:${WRANGLER_PORT}/api/seed`, {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ database: dbName, tables }),
+                signal: AbortSignal.timeout(10000),
+            });
+            if (res.ok) {
+                const result = (await res.json());
+                console.log(`[db]   ${dbName}: ${result.tables_created} tables, ${result.rows_inserted} rows`);
+            }
+        }
+        catch (err) {
+            console.warn(`[db]   ${dbName}: seed failed — ${err instanceof Error ? err.message : err}`);
+        }
+        finally {
+            db.close();
+        }
+    }
+}
+async function writebackDOsToFiles(cwd) {
+    const dbNames = getKnownDatabases(cwd);
+    if (dbNames.length === 0)
+        return;
+    const dbDir = join(cwd, "databases");
+    mkdirSync(dbDir, { recursive: true });
+    console.log(`[db] Writing back ${dbNames.length} database${dbNames.length !== 1 ? "s" : ""} from DOs...`);
+    for (const dbName of dbNames) {
+        try {
+            const res = await fetch(`http://localhost:${WRANGLER_PORT}/api/export`, {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ database: dbName }),
+                signal: AbortSignal.timeout(10000),
+            });
+            if (!res.ok)
+                continue;
+            const data = (await res.json());
+            if (Object.keys(data.tables).length === 0)
+                continue;
+            const dbPath = join(dbDir, `${dbName}.db`);
+            if (existsSync(dbPath)) {
+                const backup = new Database(dbPath);
+                backup.close();
+            }
+            const db = new Database(dbPath);
+            try {
+                db.pragma("journal_mode = WAL");
+                const existing = db.prepare("SELECT name FROM sqlite_master WHERE type='table' AND name NOT LIKE 'sqlite_%'").all();
+                for (const { name } of existing) {
+                    db.exec(`DROP TABLE IF EXISTS "${name}"`);
+                }
+                for (const [, tableData] of Object.entries(data.tables)) {
+                    db.exec(tableData.ddl);
+                    if (tableData.rows.length === 0)
+                        continue;
+                    const columns = Object.keys(tableData.rows[0]);
+                    const placeholders = columns.map(() => "?").join(", ");
+                    const tableName = tableData.ddl.match(/CREATE TABLE\s+"?([^"\s(]+)"?/i)?.[1] ?? "";
+                    const insert = db.prepare(`INSERT INTO "${tableName}" (${columns.map((c) => `"${c}"`).join(", ")}) VALUES (${placeholders})`);
+                    const insertMany = db.transaction((rows) => {
+                        for (const row of rows) {
+                            insert.run(...columns.map((c) => {
+                                const v = row[c];
+                                if (v === null || v === undefined)
+                                    return null;
+                                if (typeof v === "object")
+                                    return JSON.stringify(v);
+                                return v;
+                            }));
+                        }
+                    });
+                    insertMany(tableData.rows);
+                }
+                console.log(`[db]   ${dbName}: written back`);
+            }
+            finally {
+                db.close();
+            }
+        }
+        catch (err) {
+            console.warn(`[db]   ${dbName}: writeback failed — ${err instanceof Error ? err.message : err}`);
+        }
+    }
+}
+async function triggerWorkflow(workflow, params) {
+    await fetch(`http://localhost:${WRANGLER_PORT}/run/${workflow}`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(params),
+    });
+}
+async function getAuthUsers(config) {
+    const { access } = config;
+    if (access.mode !== "auth" || !access.table || !access.matchColumn)
+        return undefined;
+    const database = config.database ?? config.workspace;
+    try {
+        const result = await queryLocal(database, `SELECT DISTINCT ${access.matchColumn} AS val FROM ${access.table} ORDER BY val`, []);
+        return result.rows.map(r => String(r.val)).filter(Boolean);
+    }
+    catch {
+        return undefined;
+    }
+}
+async function getFormAuthUsers(config, workspaceName) {
+    const access = config.access;
+    if (!access || access.mode !== "auth" || !access.table || !access.matchColumn)
+        return undefined;
+    const database = config.database ?? workspaceName;
+    try {
+        const result = await queryLocal(database, `SELECT DISTINCT ${access.matchColumn} AS val FROM ${access.table} ORDER BY val`, []);
+        return result.rows.map(r => String(r.val)).filter(Boolean);
+    }
+    catch {
+        return undefined;
+    }
+}
+async function resolveDevPrefill(config, fields, session, workspaceName, urlParams) {
+    const values = {};
+    const access = config.access;
+    const database = config.database ?? workspaceName;
+    if (session && access?.mode === "auth" && access.table && access.matchColumn) {
+        const identifier = session.email ?? session.phone;
+        if (identifier) {
+            try {
+                let sql;
+                let params;
+                if (access.query) {
+                    const q = access.query;
+                    const paramCount = (q.match(/:identity/g) || []).length;
+                    sql = q.replace(/:identity/g, "?");
+                    params = Array(paramCount).fill(identifier);
+                }
+                else {
+                    sql = `SELECT * FROM ${access.table} WHERE ${access.matchColumn} = ? LIMIT 1`;
+                    params = [identifier];
+                }
+                const result = await queryLocal(database, sql, params);
+                if (result.rows?.[0])
+                    session.authRow = result.rows[0];
+            }
+            catch { }
+        }
+    }
+    for (const field of fields) {
+        if (!field.prefill)
+            continue;
+        const pf = field.prefill;
+        if (pf.source === "auth" && pf.column && session?.authRow) {
+            values[field.name] = session.authRow[pf.column];
+        }
+        else if (pf.source === "url" && pf.param) {
+            const val = urlParams.get(pf.param);
+            if (val != null)
+                values[field.name] = val;
+        }
+        else if (pf.source === "db" && pf.table && pf.column && pf.match) {
+            const matchVal = pf.match.param ? urlParams.get(pf.match.param)
+                : pf.match.field ? values[pf.match.field]
+                    : undefined;
+            if (matchVal != null) {
+                try {
+                    const result = await queryLocal(database, `SELECT ${pf.column} FROM ${pf.table} WHERE ${pf.match.column} = ? LIMIT 1`, [String(matchVal)]);
+                    if (result.rows?.[0])
+                        values[field.name] = result.rows[0][pf.column];
+                }
+                catch { }
+            }
+        }
+    }
+    return values;
+}
+async function handleFormSubmit(req, res, surfaceConfig, surfaceId, workspaceName) {
+    try {
+        const body = await readBody(req);
+        const formData = JSON.parse(body.toString("utf-8"));
+        const workflow = surfaceConfig.workflow;
+        if (!workflow) {
+            res.writeHead(400, { "Content-Type": "application/json" });
+            res.end(JSON.stringify({ error: "No workflow configured for this surface" }));
+            return;
+        }
+        const identity = getDevIdentity(req);
+        const session = makeDevSession(identity);
+        const params = {
+            ...formData,
+            _surface: surfaceId,
+            _workspace: workspaceName,
+        };
+        if (session) {
+            params._verified_email = session.email;
+            params._verified_phone = session.phone;
+        }
+        await triggerWorkflow(workflow, params);
+        res.writeHead(200, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ status: "ok" }));
+    }
+    catch (err) {
+        const msg = err instanceof Error ? err.message : String(err);
+        console.error(`\n❌ SUBMIT ERROR: /${surfaceId}/submit\n   ${msg}\n`);
+        res.writeHead(500, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ error: msg }));
+    }
+}
+const LIVE_RELOAD_SCRIPT = `<script>(function(){var ws,t;function c(){ws=new WebSocket("ws://"+location.host+"/_dev/ws");ws.onmessage=function(e){try{var d=JSON.parse(e.data);if(d.type==="refresh"||d.type==="reload")location.reload()}catch(x){}};ws.onclose=function(){ws=null;t=setTimeout(c,1000)};ws.onerror=function(){ws&&ws.close()}}c()})()</script>`;
+function injectBanner(html, banner) {
+    const withBanner = html.replace("<body>", `<body>\n${banner}`);
+    if (withBanner.includes("</body>")) {
+        return withBanner.replace("</body>", `${LIVE_RELOAD_SCRIPT}\n</body>`);
+    }
+    return withBanner + LIVE_RELOAD_SCRIPT;
+}
+async function handlePortalList(config, req, res, basePath, wsBranding) {
+    const identity = getDevIdentity(req);
+    const session = makeDevSession(identity);
+    const authUsers = await getAuthUsers(config);
+    const mergedBranding = config.branding || wsBranding ? { ...wsBranding, ...config.branding } : undefined;
+    const banner = renderDevBanner(identity, authUsers, mergedBranding?.accentColor ?? wsBranding?.accentColor, config.workspace, `${config.title ?? config.surfaceId} Portal`);
+    const url = new URL(req.url ?? "/", `http://localhost:${USER_PORT}`);
+    const activeTabId = url.searchParams.get("tab") ?? null;
+    const breadcrumb = parseBreadcrumb(url);
+    const database = config.database ?? config.workspace;
+    const brandedConfig = mergedBranding ? { ...config, branding: mergedBranding } : config;
+    const activeTab = config.tabs.find(t => t.id === activeTabId) ?? config.tabs[0];
+    if (!activeTab) {
+        res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
+        res.end(injectBanner(renderPortal(brandedConfig, new Map(), new Map(), {}, null, session, basePath, breadcrumb), banner));
+        return;
+    }
+    const sectionQueries = [
+        ...collectSectionQueries(config.sections ?? [], "_top"),
+        ...collectSectionQueries(activeTab.sections, activeTab.id),
+    ];
+    const queryResults = new Map();
+    const tableCounts = new Map();
+    const pages = {};
+    for (const [key, val] of url.searchParams.entries()) {
+        if (key.startsWith("page_"))
+            pages[key] = Math.max(1, parseInt(val) || 1);
+    }
+    try {
+        const queryPromises = sectionQueries.map(async ({ key, query }) => {
+            const bound = bindUserParam(query, session);
+            const sectionParts = key.split(":");
+            const sectionIndex = parseInt(sectionParts[sectionParts.length - 1]);
+            const section = activeTab.sections[sectionIndex];
+            const isTable = section?.type === "table";
+            if (isTable) {
+                const tableSection = section;
+                const pageSize = tableSection.pageSize ?? 25;
+                const pageKey = `page_${sectionIndex}`;
+                const page = pages[pageKey] ?? 1;
+                const paginated = paginateQuery(bound.sql, bound.userParams, page, pageSize);
+                const [countResult, dataResult] = await Promise.all([
+                    queryLocal(database, paginated.countSql, paginated.countParams),
+                    queryLocal(database, paginated.dataSql, paginated.dataParams),
+                ]);
+                queryResults.set(key, dataResult.rows);
+                tableCounts.set(key, countResult.rows[0]?.total ?? 0);
+            }
+            else {
+                const result = await queryLocal(database, bound.sql, bound.userParams);
+                queryResults.set(key, result.rows);
+            }
+        });
+        const tabCountQueries = config.tabs
+            .filter(t => t.countQuery)
+            .map(async (t) => {
+            const bound = bindUserParam(t.countQuery, session);
+            const result = await queryLocal(database, bound.sql, bound.userParams);
+            const row = result.rows[0];
+            const val = row ? Number(Object.values(row)[0] ?? 0) : 0;
+            return [t.id, val];
+        });
+        const [, ...tabCountResults] = await Promise.all([Promise.all(queryPromises), ...tabCountQueries]);
+        const tabCounts = new Map(tabCountResults);
+        const html = renderPortal(brandedConfig, queryResults, tableCounts, pages, activeTabId, session, basePath, breadcrumb, tabCounts);
+        res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
+        res.end(injectBanner(html, banner));
+    }
+    catch (err) {
+        res.writeHead(500, { "Content-Type": "text/html; charset=utf-8" });
+        res.end(`<html><body>${banner}<div style="max-width:600px;margin:40px auto;font-family:sans-serif"><h1>Query Error</h1><pre style="background:#fee;padding:16px;border-radius:8px;overflow:auto">${String(err)}</pre><p style="color:#666">Check that the database table exists. You may need to submit a form first to create it.</p></div></body></html>`);
+    }
+}
+async function handlePortalDetail(config, req, res, basePath, rowId, wsBranding) {
+    const identity = getDevIdentity(req);
+    const session = makeDevSession(identity);
+    const authUsers = await getAuthUsers(config);
+    const detailBranding = config.branding || wsBranding ? { ...wsBranding, ...config.branding } : undefined;
+    const banner = renderDevBanner(identity, authUsers, detailBranding?.accentColor ?? wsBranding?.accentColor, config.workspace, `${config.title ?? config.surfaceId} Portal`);
+    const database = config.database ?? config.workspace;
+    const url = new URL(req.url ?? "/", `http://localhost:${USER_PORT}`);
+    const tabId = url.searchParams.get("tab") ?? config.tabs[0]?.id ?? "";
+    const sectionIndex = parseInt(url.searchParams.get("section") ?? "0");
+    const found = findTableSection(config, tabId, sectionIndex);
+    if (!found) {
+        res.writeHead(404, { "Content-Type": "text/html; charset=utf-8" });
+        res.end(`<html><body>${banner}<div style="max-width:600px;margin:40px auto;font-family:sans-serif"><h1>Not Found</h1><p>Table section not found.</p><a href="${basePath}">Back</a></div></body></html>`);
+        return;
+    }
+    const { section: tableSection } = found;
+    const primaryKey = tableSection.primaryKey ?? "id";
+    const bound = bindUserParam(tableSection.query, session);
+    const detail = detailQuery(bound.sql, bound.userParams, primaryKey, rowId);
+    try {
+        const result = await queryLocal(database, detail.sql, detail.params);
+        if (result.rows.length === 0) {
+            res.writeHead(404, { "Content-Type": "text/html; charset=utf-8" });
+            res.end(`<html><body>${banner}<div style="max-width:600px;margin:40px auto;font-family:sans-serif"><h1>Not Found</h1><p>Record not found.</p><a href="${basePath}?tab=${tabId}">Back</a></div></body></html>`);
+            return;
+        }
+        const mergedBranding = config.branding || wsBranding ? { ...wsBranding, ...config.branding } : undefined;
+        const brandedConfig = mergedBranding ? { ...config, branding: mergedBranding } : config;
+        const html = renderPortalDetail(brandedConfig, tableSection, result.rows[0], session, tabId, basePath);
+        res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
+        res.end(injectBanner(html, banner));
+    }
+    catch (err) {
+        res.writeHead(500, { "Content-Type": "text/html; charset=utf-8" });
+        res.end(`<html><body>${banner}<div style="max-width:600px;margin:40px auto;font-family:sans-serif"><h1>Query Error</h1><pre style="background:#fee;padding:16px;border-radius:8px;overflow:auto">${String(err)}</pre></div></body></html>`);
+    }
+}
+async function handlePortalAction(config, req, res) {
+    const identity = getDevIdentity(req);
+    const reqUrl = new URL(req.url ?? "/", `http://localhost:${USER_PORT}`);
+    const body = await readBody(req);
+    const data = JSON.parse(body.toString());
+    const tabId = data.tab ?? reqUrl.searchParams.get("tab") ?? config.tabs[0]?.id ?? "";
+    const sectionIndex = data.sectionIndex ?? Number(reqUrl.searchParams.get("section") ?? "0");
+    const found = findTableSection(config, tabId, sectionIndex);
+    if (!found) {
+        res.writeHead(400, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ error: "Table section not found" }));
+        return;
+    }
+    const action = (found.section.actions ?? []).find(a => a.name === data.action);
+    if (!action) {
+        res.writeHead(400, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ error: `Unknown action: ${data.action}` }));
+        return;
+    }
+    if (!action.workflow) {
+        res.writeHead(200, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ status: "ok", timeline: true }));
+        return;
+    }
+    try {
+        await triggerWorkflow(action.workflow, {
+            action: data.action,
+            ...data.rowData,
+            _verified_email: identity,
+            _surface: config.surfaceId,
+            _workspace: config.workspace,
+        });
+        res.writeHead(200, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ status: "ok" }));
+    }
+    catch (err) {
+        res.writeHead(500, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ error: String(err) }));
+    }
+}
+async function handleNotifySend(req, res, devOverrides = {}) {
+    const raw = await readBody(req);
+    const body = JSON.parse(raw.toString());
+    const override = devOverrides[body.channel];
+    if (!override) {
+        const hint = `Add "dev": { "${body.channel}": "<your-${body.channel}>" } to mug.json`;
+        console.log(`\n[${body.channel}] BLOCKED — no dev.${body.channel} in mug.json`);
+        console.log(`  Would have sent to: ${body.to}`);
+        console.log(`  Fix: ${hint}\n`);
+        res.writeHead(200, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ status: "blocked", channel: body.channel, error: `No dev.${body.channel} in mug.json — ${hint}` }));
+        return;
+    }
+    const originalTo = body.to;
+    const recipient = override;
+    console.log(`[${body.channel}] Redirecting: ${originalTo} → ${recipient}`);
+    const subject = body.channel === "email"
+        ? `[DEV → ${originalTo}] ${body.subject ?? "Notification from Mug"}`
+        : body.subject;
+    try {
+        const token = getAccountToken();
+        const result = await fetch("https://api.mug.work/dev/notify", {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json",
+                Authorization: `Bearer ${token}`,
+            },
+            body: JSON.stringify({
+                workspace: body.workspace,
+                channel: body.channel,
+                to: recipient,
+                message: body.message,
+                subject,
+                fromName: body.fromName,
+                cta: body.cta,
+                branding: body.branding,
+                ...(body.channel === "slack" ? {
+                    blocks: body.blocks,
+                    thread_ts: body.thread_ts,
+                    unfurl_links: body.unfurl_links,
+                    unfurl_media: body.unfurl_media,
+                    slackBotToken: body.slackBotToken,
+                } : {}),
+            }),
+        });
+        if (!result.ok) {
+            const errText = await result.text().catch(() => result.statusText);
+            console.log(`[${body.channel}] delivery_failed: platform API returned ${result.status} — ${errText}`);
+            res.writeHead(200, { "Content-Type": "application/json" });
+            res.end(JSON.stringify({ status: "delivery_failed", error: `Platform API ${result.status}: ${errText}` }));
+            return;
+        }
+        const data = await result.json();
+        if (data.error) {
+            console.log(`[${body.channel}] ${data.status}: ${data.error}`);
+        }
+        else {
+            console.log(`[${body.channel}] ${data.status}`);
+        }
+        res.writeHead(200, { "Content-Type": "application/json" });
+        res.end(JSON.stringify(data));
+    }
+    catch (err) {
+        console.log(`[${body.channel}] delivery error: ${err}`);
+        res.writeHead(200, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ status: "delivery_failed", error: String(err) }));
+    }
+}
+async function handleAiComplete(req, res) {
+    const raw = await readBody(req);
+    const bodyStr = raw.toString();
+    const body = JSON.parse(bodyStr);
+    const promptPreview = (body.prompt ?? "").slice(0, 80).replace(/\n/g, " ");
+    console.log(`[ai] ${body.provider ?? "auto"}/${body.model ?? "auto"} (billing: ${body.billing === "mug-metered" ? "metered" : "byok"})`);
+    console.log(`[ai] prompt: "${promptPreview}${(body.prompt ?? "").length > 80 ? "..." : ""}"`);
+    if (body.system)
+        console.log(`[ai] system: "${body.system.slice(0, 80)}${body.system.length > 80 ? "..." : ""}"`);
+    try {
+        const token = getAccountToken();
+        const result = await fetch("https://api.mug.work/dev/ai", {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json",
+                Authorization: `Bearer ${token}`,
+            },
+            body: bodyStr,
+        });
+        if (!result.ok) {
+            const errText = await result.text().catch(() => result.statusText);
+            console.log(`[ai] failed: platform API returned ${result.status} — ${errText}`);
+            res.writeHead(result.status, { "Content-Type": "application/json" });
+            res.end(JSON.stringify({ error: `AI request failed (${result.status}): ${errText}` }));
+            return;
+        }
+        const data = await result.json();
+        const text = data.text ?? "";
+        console.log(`[ai] response: "${text.slice(0, 120)}${text.length > 120 ? "..." : ""}" (${data.usage?.input_tokens ?? "?"}in/${data.usage?.output_tokens ?? "?"}out)`);
+        res.writeHead(200, { "Content-Type": "application/json" });
+        res.end(JSON.stringify(data));
+    }
+    catch (err) {
+        console.log(`[ai] error: ${err}`);
+        res.writeHead(500, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ error: String(err) }));
+    }
+}
+async function handleAiEmbed(req, res) {
+    const raw = await readBody(req);
+    const bodyStr = raw.toString();
+    const body = JSON.parse(bodyStr);
+    const count = body.texts?.length ?? 0;
+    console.log(`[ai] embed ${count} text(s)`);
+    try {
+        const token = getAccountToken();
+        const result = await fetch("https://api.mug.work/dev/embed", {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json",
+                Authorization: `Bearer ${token}`,
+            },
+            body: bodyStr,
+        });
+        if (!result.ok) {
+            const errText = await result.text().catch(() => result.statusText);
+            console.log(`[ai] embed failed: ${result.status} — ${errText}`);
+            res.writeHead(result.status, { "Content-Type": "application/json" });
+            res.end(JSON.stringify({ error: `Embed request failed (${result.status}): ${errText}` }));
+            return;
+        }
+        const data = await result.json();
+        console.log(`[ai] embedded ${data.vectors?.length ?? 0} vectors (768-dim)`);
+        res.writeHead(200, { "Content-Type": "application/json" });
+        res.end(JSON.stringify(data));
+    }
+    catch (err) {
+        console.log(`[ai] embed error: ${err}`);
+        res.writeHead(500, { "Content-Type": "application/json" });
+        res.end(JSON.stringify({ error: String(err) }));
+    }
+}
+function parseDevOverrides(config) {
+    const dev = config.dev;
+    if (!dev)
+        return {};
+    const overrides = {};
+    for (const [k, v] of Object.entries(dev)) {
+        if (typeof v === "string")
+            overrides[k] = v;
+    }
+    return overrides;
+}
+function loadBranding(cwd, config) {
+    const raw = config.branding;
+    if (!raw)
+        return undefined;
+    const branding = {};
+    const resolvePath = (p) => {
+        if (p.startsWith("http"))
+            return p;
+        const abs = resolve(cwd, p);
+        return `/_branding/${encodeURIComponent(abs)}`;
+    };
+    if (raw.logo)
+        branding.logo = resolvePath(raw.logo);
+    if (raw.logoSquare)
+        branding.logoSquare = resolvePath(raw.logoSquare);
+    if (raw.accentColor)
+        branding.accentColor = raw.accentColor;
+    return branding;
+}
+export async function dev(options = {}) {
+    checkCliVersion();
+    const cwd = process.cwd();
+    const mugJsonPath = join(cwd, "mug.json");
+    if (!existsSync(mugJsonPath)) {
+        console.error("No mug.json found. Run `mug init` first.");
+        process.exit(1);
+    }
+    ensureDevEmail(mugJsonPath);
+    ensureSettings(mugJsonPath);
+    migrateMugJsonSources(mugJsonPath);
+    repairScaffolding(cwd);
+    const config = JSON.parse(readFileSync(mugJsonPath, "utf-8"));
+    if (options.port) {
+        USER_PORT = options.port;
+        WRANGLER_PORT = options.port + 1;
+    }
+    else {
+        const ports = await findAvailablePorts(8787);
+        USER_PORT = ports.userPort;
+        WRANGLER_PORT = ports.wranglerPort;
+    }
+    const name = config.name;
+    const secrets = readSecrets(cwd);
+    const wranglerToml = await generateWranglerToml(cwd, name, config, secrets);
+    const wranglerPath = join(cwd, "wrangler.toml");
+    writeFileSync(wranglerPath, wranglerToml);
+    let branding = loadBranding(cwd, config);
+    let devOverrides = parseDevOverrides(config);
+    let surfaceConfigs = loadSurfaceConfigs(cwd);
+    // Startup diagnostics
+    const diagnostics = [];
+    const sources = (config.sources ?? config.connectors ?? {});
+    for (const [srcName, src] of Object.entries(sources)) {
+        if (src.auth?.value && /^[A-Z][A-Z0-9_]+$/.test(src.auth.value) && !secrets[src.auth.value]) {
+            diagnostics.push(`  ⚠ Secret ${src.auth.value} not set (used by source "${srcName}") — run: mug secret set ${src.auth.value}`);
+        }
+        if (src.syncs) {
+            const missingDbs = new Set();
+            for (const [, syncCfg] of Object.entries(src.syncs)) {
+                const dbName = syncCfg.database;
+                if (dbName && !missingDbs.has(dbName) && !existsSync(join(cwd, "databases", `${dbName}.db`))) {
+                    missingDbs.add(dbName);
+                    diagnostics.push(`  ℹ Database "${dbName}" not found — will be created on first sync`);
+                }
+            }
+        }
+    }
+    for (const [id, errMsg] of surfaceErrors) {
+        diagnostics.push(`  ⚠ Surface "${id}" has config errors: ${errMsg}`);
+    }
+    const reachabilityChecks = [];
+    for (const [srcName, src] of Object.entries(sources)) {
+        if (src.baseUrl) {
+            reachabilityChecks.push(fetch(src.baseUrl, { method: "HEAD", signal: AbortSignal.timeout(2000) })
+                .then((r) => { if (!r.ok)
+                diagnostics.push(`  ⚠ Source "${srcName}": ${src.baseUrl} returned ${r.status}`); })
+                .catch(() => { diagnostics.push(`  ⚠ Source "${srcName}": ${src.baseUrl} — unreachable`); }));
+        }
+    }
+    await Promise.all(reachabilityChecks);
+    if (diagnostics.length > 0) {
+        console.log("\nDiagnostics:");
+        for (const d of diagnostics)
+            console.log(d);
+    }
+    watch(mugJsonPath, () => {
+        try {
+            const updated = JSON.parse(readFileSync(mugJsonPath, "utf-8"));
+            branding = loadBranding(cwd, updated);
+            devOverrides = parseDevOverrides(updated);
+            const overrideInfo = Object.entries(devOverrides).map(([k, v]) => `${k}: ${v}`).join(", ");
+            console.log(`[config] Reloaded${branding?.accentColor ? ` (accent: ${branding.accentColor})` : ""}${overrideInfo ? ` (dev: ${overrideInfo})` : ""}`);
+            debouncedBroadcast("config");
+        }
+        catch { }
+    });
+    const surfacesDir = join(cwd, "src", "surfaces");
+    if (existsSync(surfacesDir)) {
+        watch(surfacesDir, () => {
+            surfaceConfigs = loadSurfaceConfigs(cwd);
+            const ids = [...surfaceConfigs.keys()];
+            if (ids.length > 0) {
+                console.log(`[surfaces] Reloaded: ${ids.join(", ")}`);
+            }
+            debouncedBroadcast("surfaces");
+        });
+    }
+    const watchDirs = [
+        { dir: join(cwd, "src", "workflows"), area: "workflows" },
+        { dir: join(cwd, "src", "agents"), area: "agents" },
+        { dir: join(cwd, "src", "connectors"), area: "sources" },
+    ];
+    for (const { dir, area, delay } of watchDirs) {
+        if (existsSync(dir)) {
+            watch(dir, () => {
+                console.log(`[${area}] Change detected`);
+                debouncedBroadcast(area, delay);
+            });
+        }
+    }
+    const dbDir = join(cwd, "databases");
+    if (existsSync(dbDir)) {
+        let knownDbFiles = new Set(readdirSync(dbDir).filter(f => f.endsWith(".db")));
+        watch(dbDir, () => {
+            const current = new Set(readdirSync(dbDir).filter(f => f.endsWith(".db")));
+            const added = [...current].filter(f => !knownDbFiles.has(f));
+            const removed = [...knownDbFiles].filter(f => !current.has(f));
+            if (added.length > 0 || removed.length > 0) {
+                if (added.length)
+                    console.log(`[db] New: ${added.join(", ")}`);
+                if (removed.length)
+                    console.log(`[db] Removed: ${removed.join(", ")}`);
+                knownDbFiles = current;
+                debouncedBroadcast("databases", 2000);
+            }
+        });
+    }
+    const require = createRequire(import.meta.url);
+    const wranglerBin = dirname(require.resolve("wrangler/package.json"));
+    const wranglerJs = join(wranglerBin, "bin", "wrangler.js");
+    const cliRoot = dirname(dirname(dirname(fileURLToPath(import.meta.url))));
+    const explorerScript = join(cliRoot, "scripts", "build-explorer.ts");
+    if (existsSync(explorerScript)) {
+        const tsxBin = join(cliRoot, "node_modules", ".bin", "tsx");
+        const explorerWatcher = spawn(tsxBin, [explorerScript, "--watch"], {
+            cwd: cliRoot,
+            stdio: ["ignore", "pipe", "pipe"],
+        });
+        explorerWatcher.stdout?.on("data", (data) => {
+            const line = data.toString().trim();
+            if (line)
+                console.log(`[explorer] ${line}`);
+        });
+        explorerWatcher.stderr?.on("data", (data) => {
+            const line = data.toString().trim();
+            if (line && !line.includes("warning"))
+                console.log(`[explorer] ${line}`);
+        });
+    }
+    console.log(`Starting wrangler dev on port ${WRANGLER_PORT}...`);
+    const wrangler = spawn("node", [wranglerJs, "dev", "--port", String(WRANGLER_PORT)], {
+        cwd,
+        stdio: ["ignore", "pipe", "pipe"],
+    });
+    let wranglerReady = false;
+    let wranglerReadyCount = 0;
+    wrangler.stdout?.on("data", (data) => {
+        const line = data.toString().trim();
+        if (line)
+            console.log(`[wrangler] ${line}`);
+        if (line.includes("Ready")) {
+            wranglerReadyCount++;
+            if (wranglerReadyCount === 1) {
+                wranglerReady = true;
+                seedDatabasesToDOs(cwd).catch((err) => {
+                    console.warn(`[db] Seed failed: ${err instanceof Error ? err.message : err}`);
+                });
+            }
+            else {
+                console.log(`[ws] Worker restarted — reloading browsers`);
+                broadcast({ type: "reload" });
+            }
+        }
+    });
+    let errorBuffer = "";
+    wrangler.stderr?.on("data", (data) => {
+        const line = data.toString().trim();
+        if (line)
+            console.log(`[wrangler] ${line}`);
+        if (line.includes("Build failed") || line.includes("ERROR") || line.includes("✘")) {
+            errorBuffer += line + "\n";
+        }
+        if (errorBuffer && (line.includes("Build failed") || line === "" || line.includes("Finished"))) {
+            lastWranglerError = errorBuffer.trim();
+            errorBuffer = "";
+            broadcast({ type: "error", message: lastWranglerError });
+        }
+        if (line.includes("Ready")) {
+            lastWranglerError = null;
+        }
+    });
+    wrangler.on("exit", (code) => {
+        console.error(`Wrangler exited with code ${code}`);
+        process.exit(code ?? 1);
+    });
+    const QUIET_PATHS = new Set(["/favicon.svg", "/favicon.ico", "/explorer/bundle.js", "/health"]);
+    const server = createServer(async (req, res) => {
+        const startTime = Date.now();
+        const url = new URL(req.url ?? "/", `http://localhost:${USER_PORT}`);
+        const path = url.pathname;
+        if (!QUIET_PATHS.has(path) && !path.startsWith("/_branding/") && !path.startsWith("/_files/") && !path.startsWith("/_og")) {
+            res.on("finish", () => {
+                const duration = Date.now() - startTime;
+                const method = (req.method ?? "GET").padEnd(4);
+                const status = res.statusCode;
+                let tag = "proxy";
+                if (path.startsWith("/explorer"))
+                    tag = "explorer";
+                else if (path === "/_notify/send")
+                    tag = "notify";
+                else if (path === "/_ai/complete" || path === "/_ai/embed")
+                    tag = "ai";
+                else if (path.startsWith("/run/"))
+                    tag = "run";
+                else if (surfaceConfigs.has(path.split("/")[1]) || path === "/")
+                    tag = "surface";
+                const color = status < 300 ? "\x1b[32m" : status < 400 ? "\x1b[33m" : status < 500 ? "\x1b[33m" : "\x1b[31m";
+                const reset = "\x1b[0m";
+                console.log(`${color}[${tag}]${reset} ${method} ${path} ${color}${status}${reset} ${duration}ms`);
+            });
+        }
+        if (path === "/_notify/send" && req.method === "POST") {
+            return handleNotifySend(req, res, devOverrides);
+        }
+        if (path === "/_ai/complete" && req.method === "POST") {
+            return handleAiComplete(req, res);
+        }
+        if (path === "/_ai/embed" && req.method === "POST") {
+            return handleAiEmbed(req, res);
+        }
+        if (path.startsWith("/_files/")) {
+            const filePath = join(cwd, "files", path.slice("/_files/".length));
+            if (!existsSync(filePath)) {
+                res.writeHead(404, { "Content-Type": "application/json" });
+                res.end(JSON.stringify({ error: "File not found" }));
+                return;
+            }
+            const ext = filePath.split(".").pop()?.toLowerCase();
+            const mimeTypes = {
+                html: "text/html", css: "text/css", js: "application/javascript", json: "application/json",
+                txt: "text/plain", csv: "text/csv", xml: "application/xml",
+                png: "image/png", jpg: "image/jpeg", jpeg: "image/jpeg", svg: "image/svg+xml",
+                webp: "image/webp", gif: "image/gif", pdf: "application/pdf",
+            };
+            res.writeHead(200, { "Content-Type": mimeTypes[ext ?? ""] ?? "application/octet-stream", "Cache-Control": "no-cache" });
+            res.end(readFileSync(filePath));
+            return;
+        }
+        if (path.startsWith("/_branding/")) {
+            const encoded = path.slice("/_branding/".length);
+            const filePath = decodeURIComponent(encoded);
+            if (!existsSync(filePath)) {
+                res.writeHead(404);
+                res.end("Not found");
+                return;
+            }
+            const ext = filePath.split(".").pop()?.toLowerCase();
+            const mimeTypes = { png: "image/png", jpg: "image/jpeg", jpeg: "image/jpeg", svg: "image/svg+xml", webp: "image/webp", gif: "image/gif" };
+            res.writeHead(200, { "Content-Type": mimeTypes[ext ?? ""] ?? "application/octet-stream", "Cache-Control": "no-cache" });
+            res.end(readFileSync(filePath));
+            return;
+        }
+        if (path === "/_og-image.png") {
+            const localOg = join(cwd, "branding", "og-image.png");
+            if (existsSync(localOg)) {
+                res.writeHead(200, { "Content-Type": "image/png", "Cache-Control": "no-cache" });
+                res.end(readFileSync(localOg));
+                return;
+            }
+            res.writeHead(404);
+            res.end("Not found");
+            return;
+        }
+        if (path === "/favicon.svg" || path === "/favicon.ico") {
+            const svg = branding?.accentColor
+                ? MUG_FAVICON_SVG.replaceAll("#71B7FB", branding.accentColor)
+                : MUG_FAVICON_SVG;
+            res.writeHead(200, { "Content-Type": "image/svg+xml", "Cache-Control": "public, max-age=86400" });
+            res.end(svg);
+            return;
+        }
+        if (path === "/health") {
+            return proxyToWrangler(req, res, path + url.search);
+        }
+        if (path === "/explorer/bundle.js") {
+            let bundlePath = join(cliRoot, "dist", "explorer.js");
+            if (!existsSync(bundlePath))
+                bundlePath = join(cliRoot, "explorer.js");
+            if (existsSync(bundlePath)) {
+                res.writeHead(200, { "Content-Type": "application/javascript", "Cache-Control": "no-cache" });
+                res.end(readFileSync(bundlePath));
+            }
+            else {
+                res.writeHead(404);
+                res.end("Explorer bundle not found. Run: npm run build:explorer");
+            }
+            return;
+        }
+        if (path === "/explorer" || path.startsWith("/explorer/")) {
+            if (path.startsWith("/explorer/api/")) {
+                return handleExplorerApi(req, res, path, url, cwd, config, surfaceConfigs);
+            }
+            const accentColor = branding?.accentColor ?? "#71B7FB";
+            const html = explorerShellHtml(name, accentColor);
+            res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
+            res.end(html);
+            return;
+        }
+        if (path === "/") {
+            const identity = getDevIdentity(req);
+            const allSurfaces = [...surfaceConfigs.entries()]
+                .filter(([id]) => id !== "_home")
+                .map(([id, cfg]) => ({
+                surfaceId: id,
+                title: cfg.title ?? id,
+                description: cfg.description,
+                isPublic: cfg.access?.mode === "public",
+            }));
+            const homeConfig = surfaceConfigs.get("_home");
+            const homeScreenLayout = homeConfig ? homeConfig : null;
+            const html = renderWorkspaceHome({ workspace: name, title: homeScreenLayout?.title, description: homeScreenLayout?.description, accentColor: branding?.accentColor ?? null, branding }, allSurfaces, identity || "dev", homeScreenLayout);
+            const allAuthUsers = new Set();
+            for (const [id, cfg] of surfaceConfigs) {
+                if (id === "_home")
+                    continue;
+                const users = cfg.type === "portal"
+                    ? await getAuthUsers(cfg)
+                    : await getFormAuthUsers(cfg, name);
+                if (users)
+                    users.forEach(u => allAuthUsers.add(u));
+            }
+            const banner = renderDevBanner(identity, allAuthUsers.size > 0 ? [...allAuthUsers].sort() : undefined, branding?.accentColor, name, "Workspace Home Surface");
+            const withBanner = injectBanner(html, banner);
+            res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
+            res.end(withBanner);
+            return;
+        }
+        const segments = path.slice(1).split("/");
+        const surfaceId = segments[0];
+        const surfaceAction = segments[1];
+        const surfaceConfig = surfaceConfigs.get(surfaceId);
+        const configError = surfaceErrors.get(surfaceId);
+        if (configError) {
+            const accept = req.headers.accept ?? "";
+            if (accept.includes("text/html")) {
+                res.writeHead(500, { "Content-Type": "text/html; charset=utf-8" });
+                res.end(renderErrorOverlay("Surface Config Error", configError, `src/surfaces/${surfaceId}.json`, "Fix the error and save — the page will reload automatically."));
+                return;
+            }
+        }
+        if (surfaceConfig && surfaceConfig.type === "portal") {
+            const portalConfig = surfaceConfig;
+            portalConfig.surfaceId = portalConfig.surfaceId ?? surfaceId;
+            portalConfig.workspace = portalConfig.workspace ?? name;
+            portalConfig.timezone = portalConfig.timezone ?? config.settings?.timezone;
+            const basePath = `/${surfaceId}`;
+            if (!surfaceAction) {
+                return handlePortalList(portalConfig, req, res, basePath, branding);
+            }
+            if (surfaceAction === "row" && segments[2]) {
+                return handlePortalDetail(portalConfig, req, res, basePath, segments[2], branding);
+            }
+            if (surfaceAction === "action" && req.method === "POST") {
+                return handlePortalAction(portalConfig, req, res);
+            }
+            if (["auth", "verify", "verify-code"].includes(surfaceAction)) {
+                return proxyToWrangler(req, res, path + url.search);
+            }
+        }
+        if (surfaceConfig) {
+            if (!surfaceAction) {
+                const accept = req.headers.accept ?? "";
+                if (accept.includes("text/html")) {
+                    const identity = getDevIdentity(req);
+                    const basePath = `/${surfaceId}`;
+                    const normalized = { ...surfaceConfig };
+                    if (!normalized.pages && normalized.fields) {
+                        normalized.pages = [{ id: "main", fields: normalized.fields }];
+                    }
+                    if (!normalized.access) {
+                        normalized.access = { mode: "public" };
+                    }
+                    const authUsers = await getFormAuthUsers(normalized, name);
+                    const surfaceType = surfaceConfig.type === "portal" ? "Portal" : "Form";
+                    const surfaceBranding = normalized.branding;
+                    const mergedBranding = surfaceBranding || branding ? { ...branding, ...surfaceBranding } : undefined;
+                    const banner = renderDevBanner(identity, authUsers, mergedBranding?.accentColor ?? branding?.accentColor, name, `${surfaceConfig.title ?? surfaceId} ${surfaceType}`);
+                    const brandedConfig = mergedBranding ? { ...normalized, branding: mergedBranding } : normalized;
+                    try {
+                        const session = makeDevSession(identity);
+                        const allFields = (normalized.pages ?? []).flatMap((p) => p.fields ?? []);
+                        const prefillValues = await resolveDevPrefill(normalized, allFields, session, name, url.searchParams);
+                        const breadcrumb = parseBreadcrumb(url);
+                        const html = renderForm(brandedConfig, session, null, basePath, prefillValues, breadcrumb);
+                        const injected = injectBanner(html, banner);
+                        res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
+                        res.end(injected);
+                    }
+                    catch (err) {
+                        const msg = err instanceof Error ? err.message : String(err);
+                        const stack = err instanceof Error ? err.stack ?? "" : "";
+                        console.error(`\n❌ SURFACE ERROR: /${surfaceId}\n   ${msg}\n   Fix: check src/surfaces/${surfaceId}.json\n`);
+                        res.writeHead(500, { "Content-Type": "text/html; charset=utf-8" });
+                        res.end(`<!DOCTYPE html><html><head><meta charset="utf-8"><title>Surface Error</title>
+<style>body{max-width:700px;margin:60px auto;font-family:system-ui,sans-serif;padding:0 20px}
+h1{color:#c0392b;font-size:20px}pre{background:#f5f5f5;padding:16px;border-radius:6px;overflow-x:auto;font-size:13px;line-height:1.5}
+p{color:#666;font-size:14px}</style></head>
+<body><h1>Error rendering surface "${surfaceId}"</h1>
+<pre>${msg}\n\n${stack}</pre>
+<p>Fix the error in <code>src/surfaces/${surfaceId}.json</code> and reload.</p></body></html>`);
+                    }
+                    return;
+                }
+                res.writeHead(200, { "Content-Type": "application/json" });
+                res.end(JSON.stringify({ surface: surfaceConfig, session: null }));
+                return;
+            }
+            if (surfaceAction === "submit" && req.method === "POST") {
+                return handleFormSubmit(req, res, surfaceConfig, surfaceId, name);
+            }
+            if (["auth", "verify", "verify-code", "upload", "action"].includes(surfaceAction)) {
+                return proxyToWrangler(req, res, path + url.search);
+            }
+        }
+        const WRANGLER_PREFIXES = new Set(["api", "sync", "run", "health", "create-workflow"]);
+        if (segments.length === 1 && !WRANGLER_PREFIXES.has(surfaceId) && !surfaceConfig) {
+            const accept = req.headers.accept ?? "";
+            if (accept.includes("text/html")) {
+                let available = "";
+                for (const [id, cfg] of surfaceConfigs) {
+                    const typeLabel = cfg.type === "portal" ? "portal" : "form";
+                    available += `<li><a href="/${id}">/${id}</a> (${typeLabel})</li>`;
+                }
+                const html = `<!DOCTYPE html><html><head><meta charset="utf-8"><title>Surface not found</title>
+<style>body{max-width:600px;margin:60px auto;font-family:system-ui,sans-serif;color:#333;padding:0 20px}
+h1{color:#c0392b;font-size:22px}h3{margin-top:24px;font-size:15px}pre{background:#f5f5f5;padding:12px;border-radius:6px;overflow-x:auto}
+ul{list-style:none;padding:0}li{padding:4px 0}a{color:#2563eb}p.hint{color:#888;margin-top:32px;font-size:13px}</style></head>
+<body><h1>Surface "${surfaceId}" not found</h1>
+${available ? `<h3>Available surfaces:</h3><ul>${available}</ul>` : "<p>No surfaces configured yet.</p>"}
+<h3>To create this surface:</h3>
+<pre>mug form init ${surfaceId}      # create a form\nmug portal init ${surfaceId}    # create a portal</pre>
+<p class="hint">Surface configs live in src/surfaces/</p></body></html>`;
+                res.writeHead(404, { "Content-Type": "text/html; charset=utf-8" });
+                res.end(html);
+                return;
+            }
+        }
+        if (path.startsWith("/hook/") && req.method === "POST") {
+            const workflowName = path.slice("/hook/".length).split("/").pop() ?? "";
+            const start = Date.now();
+            try {
+                const body = await readBody(req);
+                const upstream = await fetch(`http://localhost:${WRANGLER_PORT}/run/${workflowName}`, {
+                    method: "POST",
+                    headers: { "Content-Type": "application/json" },
+                    body: body.length > 0 ? new Uint8Array(body) : JSON.stringify({}),
+                });
+                const result = await upstream.json();
+                writebackDOsToFiles(cwd).catch(() => { });
+                broadcast({ type: "refresh", area: "workflows" });
+                const dur = Date.now() - start;
+                if (result.webhookResponse) {
+                    const wr = result.webhookResponse;
+                    const respBody = typeof wr.body === "string" ? wr.body : JSON.stringify(wr.body);
+                    const ct = typeof wr.body === "string" ? "text/plain" : "application/json";
+                    console.log(`\x1b[35m[webhook]\x1b[0m POST /hook/${workflowName} ${wr.status} ${dur}ms (respond)`);
+                    res.writeHead(wr.status, { "Content-Type": ct });
+                    res.end(respBody);
+                }
+                else {
+                    console.log(`\x1b[35m[webhook]\x1b[0m POST /hook/${workflowName} 200 ${dur}ms`);
+                    res.writeHead(200, { "Content-Type": "application/json" });
+                    res.end(JSON.stringify({ ok: true, id: result.runId }));
+                }
+            }
+            catch (err) {
+                const msg = err instanceof Error ? err.message : String(err);
+                console.log(`\x1b[31m[webhook]\x1b[0m POST /hook/${workflowName} failed: ${msg}`);
+                res.writeHead(502, { "Content-Type": "application/json" });
+                res.end(JSON.stringify({ error: msg }));
+            }
+            return;
+        }
+        if (path.startsWith("/_dev/run/") && req.method === "POST") {
+            const workflowName = path.slice("/_dev/run/".length);
+            console.log(`\x1b[36m[run]\x1b[0m ${workflowName} starting...`);
+            try {
+                const body = await readBody(req);
+                const upstream = await fetch(`http://localhost:${WRANGLER_PORT}/run/${workflowName}`, {
+                    method: "POST",
+                    headers: { "Content-Type": "application/json" },
+                    body: body.length > 0 ? new Uint8Array(body) : JSON.stringify({}),
+                });
+                const result = await upstream.json();
+                const steps = result.steps ?? [];
+                for (let i = 0; i < steps.length; i++) {
+                    const s = steps[i];
+                    const icon = s.error ? "\x1b[31m✗\x1b[0m" : "\x1b[32m✓\x1b[0m";
+                    const dur = s.durationMs != null ? ` ${s.durationMs}ms` : "";
+                    const detail = s.output ? ` — ${s.output.slice(0, 80)}` : s.error ? ` — ${s.error.slice(0, 80)}` : "";
+                    console.log(`\x1b[36m[run]\x1b[0m   ${i + 1}/${steps.length}: ${s.name} ${icon}${dur}${detail}`);
+                }
+                const statusColor = result.status === "complete" ? "\x1b[32m" : "\x1b[31m";
+                console.log(`\x1b[36m[run]\x1b[0m ${workflowName} ${statusColor}${result.status}\x1b[0m in ${result.durationMs}ms (${result.stepCount} steps)`);
+                writebackDOsToFiles(cwd).catch(() => { });
+                broadcast({ type: "refresh", area: "workflows" });
+                res.writeHead(upstream.status, { "Content-Type": "application/json" });
+                res.end(JSON.stringify(result));
+            }
+            catch (err) {
+                const msg = err instanceof Error ? err.message : String(err);
+                console.log(`\x1b[31m[run]\x1b[0m ${workflowName} failed: ${msg}`);
+                res.writeHead(502, { "Content-Type": "application/json" });
+                res.end(JSON.stringify({ error: msg }));
+            }
+            return;
+        }
+        if (path.startsWith("/run/") && req.method === "POST") {
+            await proxyToWrangler(req, res, path + url.search);
+            writebackDOsToFiles(cwd).catch(() => { });
+            return;
+        }
+        return proxyToWrangler(req, res, path + url.search);
+    });
+    wss = new WebSocketServer({ noServer: true });
+    wss.on("connection", (ws) => {
+        wsClients.add(ws);
+        ws.on("close", () => wsClients.delete(ws));
+    });
+    server.on("upgrade", (req, socket, head) => {
+        const url = new URL(req.url ?? "/", `http://localhost:${USER_PORT}`);
+        if (url.pathname === "/_dev/ws" && wss) {
+            wss.handleUpgrade(req, socket, head, (ws) => { wss.emit("connection", ws, req); });
+        }
+        else {
+            socket.destroy();
+        }
+    });
+    const accentColor = branding?.accentColor ?? "#71B7FB";
+    const pidData = { pid: process.pid, userPort: USER_PORT, wranglerPort: WRANGLER_PORT, workspace: name };
+    let tunnelProcess = null;
+    if (options.tunnel) {
+        try {
+            const cfPath = await new Promise((resolve) => {
+                exec("which cloudflared", (err, stdout) => resolve(err ? null : stdout.trim()));
+            });
+            if (cfPath) {
+                tunnelProcess = spawn(cfPath, ["tunnel", "--url", `http://localhost:${USER_PORT}`], {
+                    stdio: ["ignore", "pipe", "pipe"],
+                });
+                const parseTunnelUrl = (data) => {
+                    const line = data.toString();
+                    const match = line.match(/(https:\/\/[a-z0-9-]+\.trycloudflare\.com)/);
+                    if (match && !pidData.tunnelUrl) {
+                        pidData.tunnelUrl = match[1];
+                        writePidFile(cwd, pidData);
+                        console.log(`  Tunnel: ${pidData.tunnelUrl}`);
+                    }
+                };
+                tunnelProcess.stdout?.on("data", parseTunnelUrl);
+                tunnelProcess.stderr?.on("data", parseTunnelUrl);
+                tunnelProcess.on("exit", (code) => {
+                    if (!shuttingDown)
+                        console.warn(`[tunnel] cloudflared exited with code ${code}`);
+                });
+            }
+            else {
+                console.log(`\n  ⚠ --tunnel requires cloudflared. Install: brew install cloudflared\n`);
+            }
+        }
+        catch { }
+    }
+    let shuttingDown = false;
+    server.listen(USER_PORT, () => {
+        writePidFile(cwd, pidData);
+        const nameDisplay = `\x1b[1m${name}\x1b[0m`;
+        console.log(`\n  ${nameDisplay} dev server`);
+        console.log(`  http://localhost:${USER_PORT}`);
+        console.log(`  http://localhost:${USER_PORT}/explorer`);
+        if (USER_PORT !== 8787) {
+            console.log(`  (ports auto-selected — use --port to pin)`);
+        }
+        console.log(`  [ws] Hot reload active`);
+        exec(`open http://localhost:${USER_PORT}/explorer`);
+        const overrideEntries = Object.entries(devOverrides);
+        if (overrideEntries.length > 0) {
+            console.log(`  Dev overrides:`);
+            for (const [channel, target] of overrideEntries) {
+                console.log(`    ${channel} → ${target}`);
+            }
+        }
+        console.log();
+        const ids = [...surfaceConfigs.keys()];
+        if (ids.length > 0) {
+            console.log(`Surfaces:`);
+            for (const id of ids) {
+                const cfg = surfaceConfigs.get(id);
+                const typeLabel = cfg.type === "portal" ? "portal" : "form";
+                console.log(`  http://localhost:${USER_PORT}/${id}  (${typeLabel})`);
+            }
+            console.log();
+        }
+        else {
+            console.log(`No surfaces found in src/surfaces/. Create one with: mug form init <name>\n`);
+        }
+    });
+    async function shutdown() {
+        if (shuttingDown)
+            return;
+        shuttingDown = true;
+        console.log("\nShutting down...");
+        if (tunnelProcess)
+            tunnelProcess.kill();
+        for (const client of wsClients)
+            client.close();
+        if (wss)
+            wss.close();
+        if (wranglerReady) {
+            await writebackDOsToFiles(cwd).catch((err) => {
+                console.warn(`[db] Writeback failed: ${err instanceof Error ? err.message : err}`);
+            });
+        }
+        wrangler.kill();
+        server.close();
+        cleanPidFile(cwd);
+        process.exit(0);
+    }
+    process.on("SIGINT", () => shutdown());
+    process.on("SIGTERM", () => shutdown());
+}
+async function generateWranglerToml(cwd, name, config, secrets) {
+    let toml = `# Auto-generated by mug dev — do not edit
+name = "${name}"
+main = "src/index.ts"
+compatibility_date = "2025-05-08"
+compatibility_flags = ["nodejs_compat"]
+
+[durable_objects]
+bindings = [{ name = "WORKSPACE_DB", class_name = "WorkspaceDatabase" }]
+
+[[migrations]]
+tag = "v1"
+new_sqlite_classes = ["WorkspaceDatabase"]
+
+[vars]
+ENVIRONMENT = "development"
+WORKSPACE_ID = "${name}"
+`;
+    const sources = config.sources ?? {};
+    if (Object.keys(sources).length > 0) {
+        toml += `MUG_SOURCES = '${JSON.stringify(sources)}'\n`;
+    }
+    const rawBranding = config.branding;
+    if (rawBranding) {
+        const devBranding = {};
+        const subdomain = config.subdomain ?? name;
+        for (const key of ["logo", "logoSquare"]) {
+            const raw = rawBranding[key];
+            if (!raw)
+                continue;
+            const localPath = String(raw);
+            if (localPath.startsWith("http://") || localPath.startsWith("https://")) {
+                devBranding[key] = localPath;
+                continue;
+            }
+            const ext = localPath.split(".").pop()?.toLowerCase() ?? "png";
+            const serveName = `${key === "logoSquare" ? "logo-square" : "logo"}.${ext}`;
+            const prodUrl = `https://${subdomain}.mug.work/_branding/${serveName}`;
+            try {
+                const res = await fetch(prodUrl, { method: "HEAD" });
+                if (res.ok) {
+                    devBranding[key] = prodUrl;
+                    continue;
+                }
+            }
+            catch { }
+            const fullPath = join(cwd, localPath);
+            if (existsSync(fullPath)) {
+                const mimeTypes = { png: "image/png", jpg: "image/jpeg", jpeg: "image/jpeg", svg: "image/svg+xml", webp: "image/webp", gif: "image/gif" };
+                devBranding[key] = `data:${mimeTypes[ext] ?? "image/png"};base64,${readFileSync(fullPath).toString("base64")}`;
+            }
+        }
+        if (rawBranding.accentColor)
+            devBranding.accentColor = String(rawBranding.accentColor);
+        toml += `MUG_BRANDING = '${JSON.stringify(devBranding)}'\n`;
+    }
+    const aiConfig = config.ai;
+    if (aiConfig?.routing) {
+        toml += `MUG_AI_ROUTING = '${JSON.stringify(aiConfig.routing)}'\n`;
+    }
+    if (aiConfig?.billing) {
+        toml += `MUG_AI_BILLING = '${JSON.stringify(aiConfig.billing)}'\n`;
+    }
+    for (const [key, value] of Object.entries(secrets)) {
+        toml += `${key} = "${value.replace(/"/g, '\\"')}"\n`;
+    }
+    const workflows = config.workflows ?? {};
+    const devSources = config.sources ?? {};
+    const syncCrons = Object.values(devSources).flatMap((s) => Object.values(s.syncs ?? {}).map((sync) => sync.schedule));
+    const crons = [
+        ...Object.values(workflows).map((w) => w.schedule),
+        ...syncCrons,
+    ].filter(Boolean);
+    if (crons.length > 0) {
+        toml += `\n[triggers]\ncrons = [${crons.map((c) => `"${c}"`).join(", ")}]\n`;
+    }
+    return toml;
+}
+function titleCase(slug) {
+    return slug.split("-").map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
+}
+function explorerShellHtml(workspaceName, accentColor) {
+    const prettyName = titleCase(workspaceName);
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>${prettyName} — Explorer</title>
+<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@500;600;700&display=swap" media="print" onload="this.media='all'">
+<style>
+  * { box-sizing: border-box; margin: 0; padding: 0; }
+  :root { --accent: ${accentColor}; --bg: #08090C; --bg-card: #13161A; --bg-hover: #1A1E24; --border: #1E2430; --text: #E9E9EA; --text-muted: #A3A6A7; --text-dim: #6b6e70; }
+  body { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif; background: var(--bg); color: var(--text); line-height: 1.5; }
+  h1, h2, h3 { font-family: 'Outfit', sans-serif; }
+  a { color: var(--accent); text-decoration: none; }
+  a:hover { text-decoration: underline; }
+
+  .explorer { max-width: 1200px; margin: 0 auto; }
+  .explorer-header { display: flex; align-items: center; justify-content: space-between; height: 56px; padding: 0 24px; border-bottom: 1px solid var(--border); position: sticky; top: 0; background: var(--bg); z-index: 100; }
+  .explorer-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; }
+  .explorer-logo:hover { text-decoration: none; }
+  .explorer-logo img { width: 22px; height: auto; display: block; }
+  .explorer-workspace-name { font-family: 'Outfit', sans-serif; font-size: 18px; font-weight: 700; color: var(--text); letter-spacing: -0.5px; }
+  .explorer-badge { font-size: 11px; padding: 2px 8px; border-radius: 4px; background: var(--bg-card); border: 1px solid var(--border); color: var(--text-muted); font-weight: 500; }
+  .explorer-header-right { display: flex; align-items: center; gap: 24px; }
+  .explorer-search-wrap { position: relative; }
+  .explorer-search-input-wrap { display: flex; align-items: center; position: relative; }
+  .explorer-search-icon, .explorer-search-input-wrap > svg { position: absolute; left: 10px; width: 14px; height: 14px; color: var(--text-dim); display: block; pointer-events: none; }
+  .explorer-search { padding: 6px 12px 6px 30px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-size: 13px; width: 240px; outline: none; transition: border-color 0.15s; }
+  .explorer-search:focus { border-color: var(--accent); }
+  .explorer-search::placeholder { color: var(--text-dim); }
+  .explorer-search-dropdown { position: absolute; top: 100%; left: 0; right: 0; margin-top: 4px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; z-index: 30; box-shadow: 0 8px 24px rgba(0,0,0,0.4); max-height: 360px; overflow-y: auto; min-width: 320px; }
+  .explorer-search-empty { padding: 12px 16px; font-size: 13px; color: var(--text-dim); }
+  .explorer-search-result { display: flex; align-items: center; gap: 10px; padding: 8px 16px; text-decoration: none; color: var(--text); cursor: pointer; }
+  .explorer-search-result:hover, .explorer-search-result.selected { background: var(--bg-hover); text-decoration: none; }
+  .explorer-search-result-icon, .explorer-search-result svg { width: 14px; height: 14px; color: var(--text-muted); flex-shrink: 0; display: block; }
+  .explorer-search-result-text { flex: 1; min-width: 0; }
+  .explorer-search-result-name { font-size: 13px; font-weight: 500; display: block; }
+  .explorer-search-result-meta { font-size: 11px; color: var(--text-muted); display: block; }
+  .explorer-search-result-category { font-size: 11px; color: var(--text-dim); white-space: nowrap; }
+  .explorer-nav { display: flex; gap: 20px; }
+  .explorer-nav-link { font-size: 14px; font-weight: 500; color: var(--text-muted); padding: 4px 8px; border-radius: 4px; display: flex; align-items: center; gap: 6px; transition: color 0.15s; white-space: nowrap; }
+  .explorer-nav-link:hover { color: var(--text); background: var(--bg-hover); text-decoration: none; }
+  .explorer-nav-link svg { width: 15px; height: 15px; }
+  .explorer-nav-account { background: var(--accent); color: var(--bg) !important; padding: 6px 10px; border-radius: 4px; line-height: 0; transition: background 0.15s; }
+  .explorer-nav-account:hover { background: #93cbfc; text-decoration: none; }
+  .explorer-nav-account svg { width: 18px; height: 18px; }
+  .explorer-hamburger-wrap { display: none; position: relative; }
+  .explorer-hamburger { background: none; border: 1px solid var(--border); border-radius: 6px; cursor: pointer; color: var(--text-muted); padding: 4px 6px; display: flex; align-items: center; transition: all 0.15s; }
+  .explorer-hamburger:hover { color: var(--text); border-color: var(--text-dim); }
+  .explorer-hamburger svg { width: 18px; height: 18px; }
+  .explorer-hamburger-menu { position: absolute; right: 0; top: calc(100% + 8px); background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 4px; min-width: 220px; box-shadow: 0 8px 24px rgba(0,0,0,0.4); z-index: 200; display: flex; flex-direction: column; gap: 2px; }
+  .explorer-hamburger-menu .explorer-nav-link { padding: 8px 12px; border-radius: 6px; }
+  @media (max-width: 1100px) {
+    .explorer-nav-desktop { display: none; }
+    .explorer-hamburger-wrap { display: block; }
+    .explorer-search { width: 160px; }
+  }
+  @media (max-width: 700px) {
+    .explorer-search { width: 120px; }
+    .explorer-badge { display: none; }
+  }
+  .explorer-main { padding: 16px 24px 48px; }
+  .explorer-loading, .explorer-error, .explorer-not-found { padding: 48px 24px; text-align: center; color: var(--text-muted); }
+  .explorer-error { color: #ef4444; }
+
+  .overview-header { margin-bottom: 32px; }
+  .overview-header h1 { font-family: 'Outfit', sans-serif; font-size: 24px; font-weight: 600; color: var(--text); letter-spacing: -0.3px; }
+  .overview-subtitle { font-size: 14px; color: var(--text-muted); }
+
+  .overview-grid { display: flex; flex-direction: column; gap: 32px; }
+  .overview-section h2 { font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-muted); margin-bottom: 12px; display: flex; align-items: center; gap: 6px; }
+  a.section-header { color: var(--text-muted); text-decoration: none; display: flex; align-items: center; gap: 6px; }
+  a.section-header:hover { color: var(--text); text-decoration: none; }
+  .section-icon, .overview-section h2 svg { width: 15px; height: 15px; flex-shrink: 0; display: block; }
+  .section-count { font-size: 12px; background: var(--border); color: var(--text-muted); padding: 1px 8px; border-radius: 10px; }
+
+  .card-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 8px; }
+  .card { display: flex; flex-direction: column; gap: 2px; padding: 12px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; transition: background 0.15s, border-color 0.15s; }
+  .card:hover { background: var(--bg-hover); border-color: var(--border); text-decoration: none; }
+  .card-name { font-size: 14px; font-weight: 500; color: var(--text); }
+  .card-meta { font-size: 12px; color: var(--text-muted); }
+  .card-badge { font-size: 10px; padding: 1px 6px; border-radius: 4px; margin-left: 6px; font-weight: 600; vertical-align: middle; }
+  .card-badge-remote { background: rgba(59,130,246,0.15); color: #3b82f6; }
+  .remote-notice { padding: 12px 16px; background: rgba(59,130,246,0.08); border: 1px solid rgba(59,130,246,0.2); border-radius: 8px; margin-bottom: 16px; font-size: 13px; color: var(--text-muted); display: flex; align-items: center; gap: 10px; }
+  .remote-notice-icon { width: 16px; height: 16px; color: #3b82f6; flex-shrink: 0; }
+  .remote-notice code { background: var(--bg); padding: 2px 6px; border-radius: 4px; font-size: 12px; font-family: 'SF Mono', Menlo, Monaco, monospace; }
+  .remote-columns { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; }
+  .remote-columns .source-tables-label { width: 100%; }
+
+  .empty-state { font-size: 13px; color: var(--text-dim); padding: 16px; border: 1px dashed var(--border); border-radius: 8px; }
+
+  .breadcrumb { font-size: 13px; color: var(--text-muted); margin-bottom: 16px; }
+  .breadcrumb a { color: var(--text-muted); }
+  .breadcrumb a:hover { color: var(--accent); }
+
+  .detail-header { margin-bottom: 20px; }
+  .detail-header-row { display: flex; align-items: center; gap: 12px; }
+  .run-button { background: var(--accent); color: #fff; border: none; border-radius: 6px; padding: 6px 14px; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; }
+  .run-button:hover { filter: brightness(1.1); }
+  .run-button:disabled { opacity: 0.6; cursor: not-allowed; }
+  .detail-header h1 { font-family: 'Outfit', sans-serif; font-size: 22px; font-weight: 600; color: var(--text); display: inline-flex; align-items: center; gap: 8px; margin-right: 12px; letter-spacing: -0.2px; }
+  .detail-header h1 svg { width: 20px; height: 20px; flex-shrink: 0; display: block; }
+  .detail-meta { font-size: 13px; color: var(--text-muted); }
+
+  .detail-relations { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 20px; padding: 12px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; }
+  .relation-group { display: flex; align-items: center; gap: 8px; font-size: 13px; }
+  .relation-label { color: var(--text-dim); }
+  .relation-link { color: var(--accent); padding: 2px 8px; background: rgba(37, 99, 235, 0.1); border-radius: 4px; }
+  .relation-link:hover { background: rgba(37, 99, 235, 0.2); text-decoration: none; }
+
+  .connected-to { margin-bottom: 20px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-card); }
+  .connected-to-toggle { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 12px 20px; background: none; border: none; cursor: pointer; color: var(--text-muted); }
+  .connected-to-toggle:hover { color: var(--text); }
+  .connected-to-empty, .connected-to-empty:hover { cursor: default; color: var(--text-muted); }
+  .connected-to-heading { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; display: flex; align-items: center; gap: 8px; }
+  .connected-to-summary { font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--text-dim); font-size: 12px; }
+  .connected-to-icon, .connected-to-heading > svg { width: 14px; height: 14px; display: block; flex-shrink: 0; }
+  .connected-to-chevron, .connected-to-toggle svg { width: 14px; height: 14px; display: block; }
+  .connected-to-body { padding: 0 20px 16px; }
+  .connected-to .overview-section { margin-bottom: 0; }
+  .connected-to .overview-section + .overview-section { margin-top: 16px; }
+
+  .detail-props { display: flex; flex-direction: column; gap: 4px; margin-bottom: 16px; padding: 12px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; }
+  .prop-row { display: flex; gap: 12px; font-size: 13px; }
+  .prop-label { color: var(--text-dim); min-width: 80px; }
+  .prop-value { color: var(--text); }
+  .prop-warn { color: #f59e0b; }
+
+  .detail-actions { margin-bottom: 16px; }
+  .action-link { display: inline-flex; align-items: center; justify-content: center; padding: 10px 24px; background: var(--accent); color: #08090C; border-radius: 4px; font-size: 14px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; transition: background 0.15s; }
+  .action-link:hover { background: #93cbfc; text-decoration: none; }
+
+  .file-preview { width: 100%; max-height: 120px; object-fit: cover; border-radius: 4px; margin-bottom: 4px; }
+
+  .table-list { display: flex; flex-direction: column; gap: 8px; }
+  .table-card .table-columns { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
+  .col-tag { font-size: 11px; padding: 1px 6px; background: var(--bg-hover); border: 1px solid var(--border); border-radius: 4px; color: var(--text-muted); }
+  .col-tag.col-pk { border-color: var(--accent); color: var(--accent); }
+  .col-type { color: var(--text-dim); margin-left: 2px; }
+
+  .table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 8px; }
+  .data-table { width: 100%; border-collapse: collapse; font-size: 13px; }
+  .data-table th { position: sticky; top: 0; background: var(--bg-card); padding: 8px 12px; text-align: left; border-bottom: 1px solid var(--border); white-space: nowrap; }
+  .th-name { color: var(--text); font-weight: 600; }
+  .th-type { color: var(--text-dim); font-weight: 400; margin-left: 4px; font-size: 11px; }
+  .data-table td { padding: 6px 12px; border-bottom: 1px solid var(--border); max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+  .data-table tr:hover td { background: var(--bg-hover); }
+
+  .cell-null { color: var(--text-dim); font-style: italic; }
+  .cell-number { color: #a78bfa; font-variant-numeric: tabular-nums; }
+  .cell-bool { color: #f59e0b; }
+  .cell-date { color: #34d399; }
+  .cell-email { color: var(--accent); }
+  .cell-url { color: var(--accent); }
+  .cell-text { color: var(--text); }
+
+  .toolbar { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
+  .search-input { padding: 6px 12px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-size: 13px; width: 220px; outline: none; transition: border-color 0.15s; }
+  .search-input:focus { border-color: var(--accent); }
+  .search-input::placeholder { color: var(--text-dim); }
+  .toolbar-btn { padding: 6px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; color: var(--text-muted); cursor: pointer; font-size: 13px; font-weight: 500; white-space: nowrap; transition: background 0.15s, border-color 0.15s, color 0.15s; }
+  .toolbar-btn:hover { background: var(--bg-hover); border-color: #3a4560; color: var(--text); }
+  .toolbar-btn.active { border-color: var(--accent); color: var(--accent); }
+
+  .col-menu-wrap { position: relative; }
+  .dropdown { position: absolute; top: 100%; right: 0; margin-top: 4px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 8px 0; min-width: 200px; max-height: 300px; overflow-y: auto; z-index: 10; box-shadow: 0 8px 24px rgba(0,0,0,0.4); }
+  .dropdown-item { display: flex; align-items: center; gap: 8px; padding: 4px 12px; font-size: 13px; color: var(--text); cursor: pointer; }
+  .dropdown-item:hover { background: var(--bg-hover); }
+  .dropdown-item input[type="checkbox"] { accent-color: var(--accent); }
+
+  .filter-panel { background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 12px; margin-bottom: 12px; display: flex; flex-direction: column; gap: 8px; }
+  .filter-row { display: flex; align-items: center; gap: 6px; }
+  .filter-row select, .filter-value { padding: 5px 8px; background: var(--bg); border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-size: 12px; }
+  .filter-row select { min-width: 120px; }
+  .filter-value { width: 160px; }
+  .filter-remove { background: none; border: none; color: var(--text-dim); cursor: pointer; font-size: 16px; padding: 2px 6px; }
+  .filter-remove:hover { color: #ef4444; }
+  .filter-actions { display: flex; gap: 8px; margin-top: 4px; }
+
+  .sortable-th { cursor: pointer; user-select: none; }
+  .sortable-th:hover { background: var(--bg-hover); }
+  .sort-indicator { color: var(--accent); font-size: 12px; }
+
+  .pagination { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 16px; padding: 12px; }
+  .pagination button { padding: 6px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 4px; color: var(--text); cursor: pointer; font-size: 13px; font-weight: 500; transition: background 0.15s, border-color 0.15s; }
+  .pagination button:hover:not(:disabled) { background: var(--bg-hover); border-color: #3a4560; }
+  .pagination button:disabled { opacity: 0.4; cursor: default; }
+  .page-info { font-size: 13px; color: var(--text-muted); }
+
+  .step-flow { margin-top: 24px; }
+  .step-card-wrap { position: relative; padding-left: 20px; }
+  .step-card-wrap:not(.step-last) { padding-bottom: 0; }
+  .step-connector { position: absolute; left: 8px; top: 0; bottom: 0; width: 2px; background: var(--border); }
+  .step-last > .step-connector { height: 20px; }
+  .step-card-wrap::before { content: ''; position: absolute; left: 4px; top: 16px; width: 10px; height: 10px; border-radius: 50%; background: var(--bg-card); border: 2px solid var(--border); z-index: 1; }
+  .step-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 10px 14px; margin-bottom: 8px; }
+  .step-expandable { cursor: pointer; }
+  .step-expandable:hover { border-color: var(--accent); }
+  .step-card-header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
+  .step-icon, .step-card-header > svg { width: 14px; height: 14px; flex-shrink: 0; display: block; }
+  .step-icon-query, .step-icon-exec, .step-card-header > svg[data-lucide="database"] { color: #3b82f6; }
+  .step-icon-ai, .step-card-header > svg[data-lucide="sparkles"] { color: #a78bfa; }
+  .step-icon-email, .step-card-header > svg[data-lucide="mail"] { color: #22c55e; }
+  .step-icon-sms, .step-card-header > svg[data-lucide="message-square"] { color: #22c55e; }
+  .step-icon-slack, .step-card-header > svg[data-lucide="hash"] { color: #22c55e; }
+  .step-icon-collect, .step-card-header > svg[data-lucide="clipboard"] { color: #f59e0b; }
+  .step-icon-return, .step-card-header > svg[data-lucide="flag"] { color: var(--text-dim); }
+  .step-icon-loop, .step-card-header > svg[data-lucide="repeat"] { color: #3b82f6; }
+  .step-icon-branch, .step-card-header > svg[data-lucide="git-branch"] { color: #f59e0b; }
+  .step-label { font-size: 13px; color: var(--text); flex: 1; min-width: 0; }
+  .step-type-badge { font-size: 10px; padding: 1px 6px; border-radius: 4px; background: var(--bg-hover); color: var(--text-dim); font-weight: 500; text-transform: uppercase; letter-spacing: 0.3px; }
+  .step-duration { font-size: 11px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
+  .step-status { font-size: 13px; font-weight: 700; }
+  .step-status-ok { color: #22c55e; }
+  .step-status-err { color: #ef4444; }
+  .step-expand-icon, .step-card-header > svg[class*="step-expand"] { width: 12px; height: 12px; color: var(--text-dim); }
+  .step-error { border-color: #ef4444; }
+  .step-error-msg { font-size: 12px; color: #ef4444; margin-top: 6px; padding-left: 22px; }
+  .step-detail { margin-top: 8px; padding: 8px 10px; background: var(--bg); border-radius: 6px; overflow-x: auto; }
+  .step-detail pre { font-size: 12px; color: var(--text-muted); margin: 0; white-space: pre-wrap; word-break: break-word; font-family: 'SF Mono', Menlo, Monaco, monospace; }
+
+  .step-loop { background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; margin-bottom: 8px; border-left: 3px solid #3b82f6; }
+  .step-loop-header { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--border); }
+  .step-loop-body { padding: 12px 8px 4px 8px; }
+
+  .step-branch { background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; margin-bottom: 8px; border-left: 3px solid #f59e0b; }
+  .step-branch-header { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--border); }
+  .step-branch-path { padding: 12px 8px 4px 8px; }
+  .step-branch-else { border-top: 1px solid var(--border); }
+  .step-branch-after { border-top: 1px solid var(--border); }
+  .step-branch-path-label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-dim); margin-bottom: 8px; padding-left: 20px; }
+
+  .step-description { font-size: 12px; color: var(--text-muted); padding: 2px 14px 8px 36px; line-height: 1.4; }
+  .detail-description { font-size: 14px; color: var(--text-muted); margin-top: 6px; line-height: 1.5; }
+
+  .step-flow-section { margin-top: 28px; }
+  .step-flow-section-header { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
+  .step-flow-section-title { font-size: 14px; font-weight: 600; color: var(--text); }
+  .step-flow-parse-error { padding: 12px 16px; background: var(--bg-card); border: 1px solid var(--border); border-left: 3px solid #ef4444; border-radius: 8px; margin-top: 24px; color: var(--text-muted); font-size: 13px; }
+
+  .source-syncs-section { margin-top: 28px; }
+  .source-sync-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; margin-bottom: 12px; }
+  .source-sync-header { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--border); }
+  .source-sync-title { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
+  .source-sync-desc { font-size: 12px; color: var(--text-muted); line-height: 1.3; }
+  .source-sync-schedule { font-size: 12px; color: var(--text-dim); margin-left: auto; white-space: nowrap; }
+  .source-sync-group { border-top: 1px solid var(--border); }
+  .source-sync-group:first-child { border-top: none; }
+  .source-sync-name { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; color: var(--text); margin-bottom: 4px; }
+  .source-sync-name-icon { width: 14px; height: 14px; color: #3b82f6; }
+  .source-sync-props { padding: 8px 14px; }
+  .source-sync-props .prop-row { padding: 2px 0; }
+  .source-tables { padding: 4px 14px 10px; }
+  .source-tables-label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-dim); margin-bottom: 6px; }
+  .source-table-row { display: flex; align-items: center; gap: 8px; padding: 4px 0; flex-wrap: wrap; }
+  a.source-table-name { color: var(--text); text-decoration: none; }
+  .source-table-icon { width: 13px; height: 13px; color: var(--text-dim); }
+  .source-table-name { font-size: 13px; font-weight: 500; color: var(--text); }
+  .source-table-pk { font-size: 11px; color: var(--text-dim); background: var(--bg); padding: 1px 6px; border-radius: 4px; }
+  .source-table-endpoint { font-size: 11px; color: var(--text-dim); font-family: 'SF Mono', Menlo, Monaco, monospace; }
+  .source-table-desc { font-size: 12px; color: var(--text-muted); width: 100%; padding-left: 21px; }
+
+  .run-selector { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
+  .run-selector select { background: var(--bg-card); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-size: 13px; padding: 6px 10px; outline: none; }
+  .run-selector select:focus { border-color: var(--accent); }
+  .run-summary { display: flex; align-items: center; gap: 10px; font-size: 12px; color: var(--text-muted); }
+  .run-summary-badge { padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; }
+  .run-summary-complete { background: rgba(34,197,94,0.15); color: #22c55e; }
+  .run-summary-errored { background: rgba(239,68,68,0.15); color: #ef4444; }
+
+  /* Usage page */
+  :root { --usage-green: #22c55e; --usage-yellow: #f59e0b; --usage-red: #ef4444; }
+  .usage-page { }
+  .usage-wrap { max-width: 640px; margin: 0 auto; }
+  .usage-back { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-dim); text-decoration: none; margin-bottom: 24px; }
+  .usage-back:hover { color: var(--text); }
+  .usage-back svg { width: 14px; height: 14px; }
+  .usage-banner { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 8px; font-size: 13px; margin-bottom: 20px; }
+  .usage-banner svg { width: 16px; height: 16px; flex-shrink: 0; }
+  .usage-banner a { margin-left: auto; white-space: nowrap; font-weight: 500; }
+  .usage-banner-yellow { background: rgba(245,158,11,0.12); color: #f59e0b; border: 1px solid rgba(245,158,11,0.25); }
+  .usage-banner-yellow a { color: #f59e0b; }
+  .usage-banner-red { background: rgba(239,68,68,0.12); color: #ef4444; border: 1px solid rgba(239,68,68,0.25); }
+  .usage-banner-red a { color: #ef4444; }
+
+  /* Workspace card */
+  .ws-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 20px 24px; margin-bottom: 24px; }
+  .ws-card-static { cursor: default; }
+  .ws-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
+  .ws-card-right { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex-shrink: 0; }
+  .ws-card-right-top { display: flex; align-items: center; gap: 8px; }
+  .ws-name { font-size: 16px; font-weight: 600; color: var(--text); }
+  .ws-meta { font-size: 13px; color: var(--text-dim); margin-top: 6px; line-height: 1.6; }
+  .ws-meta-row { display: flex; align-items: center; gap: 4px; }
+  .ws-badge { font-size: 11px; padding: 2px 8px; border-radius: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; background: #1a2332; color: var(--accent); flex-shrink: 0; }
+  .ws-auto-row { display: flex; flex-direction: column; gap: 4px; font-size: 11px; color: var(--text-dim); align-items: flex-end; }
+  .ws-auto-label { display: flex; align-items: center; gap: 4px; position: relative; }
+  .ws-auto-info { display: inline-flex; cursor: help; color: var(--text-dim); transition: color 0.15s; }
+  .ws-auto-info:hover { color: var(--text); }
+  .ws-auto-info:hover .ws-auto-tip, .ws-auto-info:focus .ws-auto-tip { display: block; }
+  .ws-auto-tip { display: none; position: absolute; top: calc(100% + 8px); right: 0; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 10px 14px; font-size: 12px; font-weight: 400; color: var(--text-muted); line-height: 1.5; width: 240px; white-space: normal; box-shadow: 0 8px 24px rgba(0,0,0,0.3); z-index: 10; }
+  .ws-auto-value { font-size: 11px; color: var(--text-muted); padding: 2px 6px; background: var(--bg); border: 1px solid var(--border); border-radius: 4px; }
+  .ws-card-bottom { display: flex; justify-content: flex-end; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
+  .ws-card-manage { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--text-dim); text-decoration: none; }
+  .ws-card-manage:hover { color: var(--accent); }
+
+  /* Period picker */
+  .usage-period-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
+  .usage-period-title { font-size: 14px; font-weight: 600; color: var(--text); }
+  .usage-period-select { padding: 4px 8px; background: var(--bg); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-size: 13px; font-family: inherit; cursor: pointer; }
+  .usage-period-select:focus { border-color: var(--accent); outline: none; }
+
+  .usage-tier-badge { font-size: 11px; padding: 2px 8px; border-radius: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; }
+  .usage-tier-free, .usage-tier-starter, .usage-tier-pro, .usage-tier-business { background: #1a2332; color: var(--accent); }
+  .usage-packs { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-muted); padding: 10px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; margin-bottom: 20px; }
+  .usage-packs svg { width: 14px; height: 14px; }
+  .usage-meters { display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px; }
+  .usage-meter { padding: 14px 16px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; }
+  .usage-meter-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
+  .usage-meter-label { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; color: var(--text); }
+  .usage-meter-label svg { width: 14px; height: 14px; color: var(--text-muted); }
+  .usage-meter-pct { font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
+  .usage-bar-track { position: relative; height: 6px; background: var(--bg); border-radius: 3px; overflow: visible; margin-bottom: 8px; }
+  .usage-bar-fill { height: 100%; border-radius: 3px; transition: width 0.3s ease; }
+  .usage-bar-base-marker { position: absolute; top: -2px; width: 2px; height: 10px; background: var(--text-dim); border-radius: 1px; }
+  .usage-meter-values { display: flex; align-items: baseline; gap: 4px; font-size: 12px; font-variant-numeric: tabular-nums; }
+  .usage-meter-values span:first-child { color: var(--text); font-weight: 500; }
+  .usage-meter-limit { color: var(--text-dim); }
+  .usage-ai-section { margin-bottom: 24px; }
+  .usage-ai-toggle { background: none; border: none; color: var(--text-muted); font-size: 13px; cursor: pointer; display: flex; align-items: center; gap: 6px; padding: 8px 0; }
+  .usage-ai-toggle:hover { color: var(--text); }
+  .usage-ai-toggle svg { width: 14px; height: 14px; }
+  .usage-ai-table { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 8px; }
+  .usage-ai-table th { text-align: left; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-dim); padding: 6px 12px; border-bottom: 1px solid var(--border); }
+  .usage-ai-table td { padding: 6px 12px; color: var(--text-muted); border-bottom: 1px solid var(--border); }
+  .usage-ai-table tr:last-child td { border-bottom: none; }
+  .usage-bar-overage { height: 100%; border-radius: 0 3px 3px 0; position: absolute; top: 0; background: #c084fc; }
+  .usage-footer { padding-top: 8px; border-top: 1px solid var(--border); }
+  .usage-footer a { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-muted); }
+  .usage-footer a:hover { color: var(--accent); }
+  .usage-footer svg { width: 14px; height: 14px; }
+
+  /* Overage balance section */
+  .overage-section { margin-top: 8px; margin-bottom: 24px; }
+  .overage-header-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; gap: 12px; }
+  .overage-header-left { display: flex; align-items: center; gap: 6px; }
+  .overage-header-label { font-size: 14px; font-weight: 600; color: var(--text); }
+  .overage-info { display: inline-flex; cursor: help; color: var(--text-dim); transition: color 0.15s; position: relative; }
+  .overage-info:hover { color: var(--text); }
+  .overage-info:hover .overage-tip, .overage-info:focus .overage-tip { display: block; }
+  .overage-tip { display: none; position: absolute; top: calc(100% + 8px); left: 0; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 10px 14px; font-size: 12px; font-weight: 400; color: var(--text-muted); line-height: 1.5; width: 280px; white-space: normal; box-shadow: 0 8px 24px rgba(0,0,0,0.3); z-index: 10; }
+  .overage-manage-link { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--text-muted); text-decoration: none; white-space: nowrap; }
+  .overage-manage-link:hover { color: var(--accent); }
+  .overage-meters { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
+  @media (max-width: 480px) { .overage-meters { grid-template-columns: repeat(2, 1fr); } }
+  .overage-stat { padding: 12px 14px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; }
+  .overage-stat-value { font-size: 16px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; margin-bottom: 2px; }
+  .overage-stat-label { font-size: 11px; color: var(--text-dim); display: flex; align-items: center; gap: 4px; }
+
+  .explorer-bg {
+    position: fixed;
+    bottom: clamp(calc(-25% + 100px), calc(-10% - 150px) + (100vw - 1600px) * 0.015, calc(-10% - 150px));
+    right: clamp(-50%, calc(-5% - 30px) + (100vw - 1600px) * 0.045, calc(-5% - 30px));
+    pointer-events: none;
+    z-index: 0;
+    color: var(--accent);
+    opacity: 0.04;
+  }
+  .explorer-bg svg {
+    width: clamp(250px, 35vw - 60px, 500px);
+    height: auto;
+  }
+  .explorer-bg #wisp-1, .explorer-bg #wisp-2, .explorer-bg #wisp-3 { opacity: 0; will-change: opacity; }
+  @keyframes wisp-fade { 0%, 100% { opacity: 0; } 50% { opacity: 1; } }
+  @keyframes refresh-pulse { 0% { outline: 2px solid var(--accent); outline-offset: -2px; opacity: 0.6; } 100% { outline: 2px solid transparent; outline-offset: 4px; opacity: 0; } }
+  .refresh-flash { animation: refresh-pulse 0.6s ease-out; }
+  .explorer-bg #wisp-2 { animation: wisp-fade 8s ease-in-out 2s infinite both; }
+  .explorer-bg #wisp-1 { animation: wisp-fade 8s ease-in-out 4s infinite both; }
+  .explorer-bg #wisp-3 { animation: wisp-fade 8s ease-in-out 6s infinite both; }
+  .section-toggle { cursor: pointer; display: flex; align-items: center; gap: 6px; user-select: none; }
+  .section-toggle:hover { color: var(--accent); }
+  .toggle-icon { width: 14px; height: 14px; }
+  .soul-content { background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 16px; font-size: 13px; line-height: 1.6; color: var(--text-muted); white-space: pre-wrap; overflow-x: auto; max-height: 400px; overflow-y: auto; }
+  .skill-group { margin-bottom: 16px; }
+  .skill-group-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-dim); margin-bottom: 8px; font-weight: 600; }
+  .skill-item { display: flex; align-items: baseline; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--border); }
+  .skill-name { font-weight: 600; color: var(--text); font-size: 13px; }
+  .skill-desc { color: var(--text-muted); font-size: 12px; }
+  .brain-stats { display: flex; gap: 12px; margin-bottom: 24px; flex-wrap: wrap; }
+  .brain-stat { background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 12px 16px; min-width: 80px; text-align: center; }
+  .brain-stat-value { font-size: 20px; font-weight: 700; color: var(--text); display: block; }
+  .brain-stat-label { font-size: 11px; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.5px; }
+  .brain-tabs { display: flex; gap: 4px; margin-bottom: 16px; border-bottom: 1px solid var(--border); }
+  .brain-tabs button { background: none; border: none; color: var(--text-muted); padding: 8px 16px; font-size: 13px; cursor: pointer; border-bottom: 2px solid transparent; }
+  .brain-tabs button:hover { color: var(--text); }
+  .brain-tabs button.active { color: var(--accent); border-bottom-color: var(--accent); }
+  .brain-list { display: flex; flex-direction: column; gap: 8px; }
+  .brain-item { display: flex; align-items: baseline; gap: 10px; padding: 10px 14px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; font-size: 13px; flex-wrap: wrap; }
+  .brain-item.unresolved { border-left: 3px solid #ef4444; }
+  .brain-item.resolved { opacity: 0.6; }
+  .brain-item-text { flex: 1; color: var(--text-muted); min-width: 200px; }
+  .brain-item-date { font-size: 11px; color: var(--text-dim); white-space: nowrap; }
+  .brain-empty { padding: 40px; text-align: center; color: var(--text-muted); }
+  .brain-empty-tab { padding: 20px; color: var(--text-dim); text-align: center; }
+  .struggle-badge { font-size: 10px; padding: 2px 8px; border-radius: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.3px; white-space: nowrap; }
+  .badge-knowledge_gap { background: #7c3aed22; color: #a78bfa; }
+  .badge-edge_case { background: #f59e0b22; color: #fbbf24; }
+  .badge-cap_hit { background: #ef444422; color: #f87171; }
+  .badge-correction { background: #3b82f622; color: #60a5fa; }
+  .badge-fallback { background: #6b728022; color: #9ca3af; }
+  .entity-name { font-weight: 600; color: var(--text); }
+  .entity-type { font-size: 10px; padding: 2px 8px; border-radius: 10px; background: var(--border); color: var(--text-dim); text-transform: uppercase; }
+  .outcome-badge { width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 11px; font-weight: 700; flex-shrink: 0; }
+  .outcome-badge.effective { background: #22c55e22; color: #4ade80; }
+  .outcome-badge.ineffective { background: #ef444422; color: #f87171; }
+  .outcome-badge.unknown { background: #6b728022; color: #9ca3af; }
+  .session-workflow { font-weight: 600; color: var(--accent); font-size: 12px; }
+  .explorer { position: relative; z-index: 1; }
+
+  @media (max-width: 640px) {
+    .explorer-main { padding: 12px 16px 48px; }
+    .explorer-header { padding: 0 16px; height: 48px; }
+    .card-list { grid-template-columns: 1fr; }
+    .toolbar { flex-direction: column; align-items: stretch; }
+    .search-input { width: 100%; }
+    .filter-row { flex-wrap: wrap; }
+    .data-table { font-size: 12px; }
+    .data-table th, .data-table td { padding: 4px 8px; }
+  }
+</style>
+</head>
+<body>
+<div class="explorer-bg" aria-hidden="true">
+  <svg viewBox="0 0 291 371" fill="none"><path d="M134.129 122.279L140.915 122.8L141.155 124.478L141.394 126.157L151.534 126.674L161.674 127.191L167.245 128.392L172.817 129.593L176.743 130.899L180.668 132.206L179.403 132.915L178.139 133.624L170.306 134.807L162.472 135.99L156.284 135.995L150.097 136V138.406V140.813L103.591 140.606L57.0848 140.4L56.8325 138.2L56.5794 136L51.2438 135.984L45.9073 135.968L40.3186 135.187L34.7299 134.406L30.9376 133.523L27.1452 132.641V131.987V131.334L34.1311 129.714L41.117 128.094L47.362 127.247L53.6078 126.4H59.5374H65.4678V124.438V122.476L70.4577 122.192L75.4477 121.908L101.395 121.834L127.343 121.759L134.129 122.279Z" fill="currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M3.07464 136.078L5.58875 136.957V137.573V138.189L10.5787 139.553L15.5686 140.917L19.6268 142.398L23.6858 143.878L29.8645 144.739L36.0433 145.6H43.9161H51.7891L52.0422 147.8L52.2944 150H103.391H154.488L154.729 147.918L154.97 145.836L167.503 145.398L180.036 144.96L184.827 143.222L189.617 141.485L195.206 139.871L200.795 138.258L201.623 137.208L202.452 136.158L204.418 135.879L206.383 135.6L206.407 231.8L206.431 328H204.315H202.198L201.636 335.2L201.074 342.4H199.138H197.202V344.8V347.2H194.807H192.411V349.6V352H190.016H187.621V354.4V356.8H182.831H178.04V359.2V361.6H173.25H168.46L168.461 363.8L168.461 366H157.084H145.706L145.454 368.2L145.2 370.4H103.391H61.5821L61.329 368.2L61.0767 366L49.3005 365.778L37.5243 365.558V363.578V361.6H33.1331H28.742V359.2V356.8H23.9517H19.1613V354.453V352.106L16.9658 351.853L14.7702 351.6L14.5179 349.4L14.2648 347.2H11.9232H9.58069V342.4V337.6H7.18553H4.79036V332.8V328H2.3952H3.8147e-05V231.6V135.2H0.280282H0.560526L3.07464 136.078ZM19.1613 323.094V243.547V164H23.9517H28.742V239.2V314.4H31.1372H33.5323V321.6V328.8H35.5283H37.5243V330.8V332.8H39.9194H42.3146V335.2V337.6H44.7097H47.1049V342.4V347.2H42.7665H38.4288L38.1757 345L37.9235 342.8L33.4948 342.565L29.0654 342.33L28.1751 339.965L27.2841 337.6H25.649H24.0139L23.7832 330.6L23.5525 323.6L21.3569 323.347L19.1613 323.094Z" fill="currentColor"/><path d="M237.972 155.228L239.516 156.056V157.586V159.116L243.708 159.358L247.899 159.6L248.687 161.4L249.475 163.2H251.182H252.889L255.384 163.7L257.879 164.2V166.5V168.8H260.189H262.499L262.961 170.007L263.423 171.214L265.442 172.135L267.46 173.057V175.275V177.494L269.655 177.747L271.851 178L272.101 180.6L272.352 183.2H274.585H276.819L276.438 185.2L276.056 187.2H278.544H281.033V192V196.8H283.428H285.823V204V211.2H288.218H290.613V230V248.8H288.218H285.823V255.547V262.294L283.627 262.547L281.432 262.8L281.192 267.4L280.953 272H278.977H277.001L276.522 274.4L276.043 276.8H274.146H272.25V278.508V280.217L270.454 282.033L268.658 283.85L267.628 285.125L266.598 286.4H264.634H262.67V288.8V291.2H260.274H257.879V293.2V295.2H255.484H253.089V297.6V300H246.303H239.516V302.4V304.8H227.541H215.565V295.622V286.442L227.341 286.222L239.117 286L239.086 283.8L239.054 281.6H243.677H248.299V279.2V276.8H250.694H253.089V274.4V272H255.484H257.879V269.6V267.2H260.274H262.67V264.8V262.4H265.065H267.46V257.492V252.583L269.456 250.73L271.452 248.876V230.038V211.2H269.487H267.522L267.291 204.2L267.061 197.2L264.865 196.947L262.67 196.694V194.347V192H260.274H257.879V190.063V188.127L255.484 187.6L253.089 187.073V185.19V183.306L250.893 183.053L248.698 182.8L248.445 180.6L248.192 178.4H243.907H239.623L239.369 176.2L239.117 174L227.341 173.778L215.565 173.558V163.978V154.4H225.996H236.427L237.972 155.228Z" fill="currentColor"/><path id="wisp-1" d="M107.782 6.8V13.6H110.073H112.364L112.858 16.6L113.354 19.6V23.2V26.8L112.866 29.756L112.378 32.7128L110.28 32.956L108.182 33.2L107.929 35.4L107.676 37.6H105.786H103.897L103.644 39.8L103.391 42L101.196 42.2528L99.0001 42.5064V44.0792V45.6512L97.8433 48.4256L96.6864 51.2H95.5527H94.419L93.924 54.2L93.4289 57.2L93.4904 64.4L93.5511 71.6L94.0805 75.6L94.609 79.6L96.8045 79.8528L99.0001 80.1064V82.0528V84H103.391H107.782V79.6V75.2H105.88H103.976L103.495 73.4L103.014 71.6L103.003 65.852L102.992 60.104L103.77 58.052L104.549 56H106.113H107.676L107.929 53.8L108.182 51.6L110.328 51.3512L112.476 51.1032L112.724 48.9512L112.972 46.8L115.167 46.5472L117.363 46.2936V44.4V42.5064L119.559 42.2528L121.754 42L121.992 37.4496L122.23 32.8992L124.387 32.6496L126.544 32.4L126.303 26L126.062 19.6L123.583 12.2392L121.105 4.87841L119.433 4.6392L117.762 4.4L117.51 2.2L117.257 0H112.52H107.782V6.8Z" fill="currentColor"/><path id="wisp-2" d="M66.2662 37.548V47.096L65.4878 49.148L64.7093 51.2H63.0926H61.4759V53.6V56H59.0807H56.6856V58.4V60.8H54.2904H51.8952V69.9472V79.0936L54.0908 79.3472L56.2864 79.6L56.5386 81.8L56.7917 84H61.1294H65.4678V79.6V75.2H63.4719H61.4759V70.4V65.6H63.4088H65.3409L65.867 63.2L66.3932 60.8H68.2726H70.152L70.4051 58.6L70.6573 56.4L72.8042 56.1512L74.9519 55.9032L75.1994 53.7512L75.4477 51.6L77.6432 51.3472L79.8388 51.0936V41.9472V32.8H77.4436H75.0485V30.4V28H70.6573H66.2662V37.548Z" fill="currentColor"/><path id="wisp-3" d="M146.096 36.6L146.087 45.2L145.592 48.2L145.097 51.2H143.206H141.315V53.6V56H138.919H136.524V58.4V60.8H134.129H131.734V69.9368V79.0728L134.129 79.6L136.524 80.1272V82.0632V84H140.915H145.307V79.6V75.2H143.359H141.413L140.876 71.6096L140.338 68.02L140.801 66.8096L141.264 65.6H143.286H145.307V63.2V60.8H147.649H149.991L150.244 58.6L150.496 56.4L152.692 56.1472L154.887 55.8936V53.5472V51.2H156.883H158.879V42V32.8H156.883H154.887V30.4V28H150.496H146.105L146.096 36.6Z" fill="currentColor"/><path d="M145.307 105.2V107.2L147.901 107.222L150.496 107.243L161.274 107.678L172.053 108.113L173.051 108.431L174.049 108.75V110.261V111.772L178.719 112.262L183.39 112.75L189.697 114.747L196.004 116.744L199.797 119.154L203.589 121.565V123.164V124.763L201.78 125.951L199.97 127.139L196.544 128.35L193.118 129.562L190.538 126.981L187.958 124.4L182.8 122.609L177.641 120.818L167.262 118.471L156.883 116.125L149.698 115.261L142.512 114.396L132.217 113.598L121.922 112.8H104.641H87.362L73.0214 113.988L58.6815 115.176L53.0928 116.069L47.5041 116.962L35.7965 119.63L24.0882 122.298L21.0264 123.871L17.9638 125.444L16.0987 127.446L14.2345 129.449L12.0844 128.831L9.93437 128.214L6.51408 126.465L3.09379 124.716L3.3429 122.962L3.59278 121.209L7.73164 118.734L11.8705 116.26L17.2644 114.486L22.6575 112.711L27.637 112.246L32.6158 111.78L33.0892 109.89L33.5627 108H40.2108H46.8598L54.1675 107.48L61.4759 106.961V105.08V103.2H103.391H145.307V105.2Z" fill="currentColor"/></svg>
+</div>
+<div id="root"></div>
+<script type="module" src="/explorer/bundle.js"></script>
+<script src="https://unpkg.com/lucide@latest/dist/umd/lucide.min.js"></script>
+<script>
+(function() {
+  var t;
+  new MutationObserver(function() {
+    clearTimeout(t);
+    t = setTimeout(function() { if (window.lucide) lucide.createIcons(); }, 50);
+  }).observe(document.getElementById('root'), { childList: true, subtree: true });
+})();
+</script>
+</body>
+</html>`;
+}
+async function handleExplorerApi(req, res, path, url, cwd, config, surfaceConfigs) {
+    const jsonResponse = (data, status = 200) => {
+        res.writeHead(status, { "Content-Type": "application/json", "Cache-Control": "no-cache" });
+        res.end(JSON.stringify(data));
+    };
+    if (path === "/explorer/api/overview") {
+        const localDbs = getKnownDatabases(cwd);
+        const databases = [];
+        for (const name of localDbs) {
+            const dbPath = join(cwd, "databases", `${name}.db`);
+            let sizeBytes = 0;
+            let tableCount = 0;
+            try {
+                sizeBytes = statSync(dbPath).size;
+                const db = new Database(dbPath, { readonly: true });
+                const tables = db.prepare("SELECT count(*) as c FROM sqlite_master WHERE type='table' AND name NOT LIKE 'sqlite_%'").get();
+                tableCount = tables.c;
+                db.close();
+            }
+            catch { }
+            databases.push({ name, sizeBytes, tableCount, remote: false, local: true });
+        }
+        const dbRemotePath = join(cwd, "databases", ".remote");
+        if (existsSync(dbRemotePath)) {
+            try {
+                const manifest = JSON.parse(readFileSync(dbRemotePath, "utf-8"));
+                for (const [name, info] of Object.entries(manifest.databases ?? {})) {
+                    const existing = databases.find((d) => d.name === name);
+                    const remoteTables = Object.keys(info.tables ?? {});
+                    if (existing) {
+                        existing.remote = true;
+                        existing.remoteTables = remoteTables;
+                    }
+                    else {
+                        databases.push({
+                            name,
+                            sizeBytes: Math.round((info.size_mb ?? 0) * 1024 * 1024),
+                            tableCount: remoteTables.length,
+                            remote: true,
+                            local: false,
+                            remoteTables,
+                        });
+                    }
+                }
+            }
+            catch { }
+        }
+        const allSrcConfigs = config.sources ?? {};
+        for (const [, srcCfg] of Object.entries(allSrcConfigs)) {
+            for (const [syncName, sync] of Object.entries(srcCfg.syncs ?? {})) {
+                const dbName = sync.database;
+                if (!dbName)
+                    continue;
+                const syncFile = join(cwd, `src/sources/${syncName}.ts`);
+                let parsedTables = [];
+                if (existsSync(syncFile)) {
+                    try {
+                        const parsed = parseSourceFile(readFileSync(syncFile, "utf-8"), syncName);
+                        if (parsed)
+                            parsedTables = parsed.tables.map((t) => t.name);
+                    }
+                    catch { }
+                }
+                const existing = databases.find((d) => d.name === dbName);
+                if (existing) {
+                    for (const t of parsedTables) {
+                        if (!existing.remoteTables?.includes(t)) {
+                            existing.remoteTables = [...(existing.remoteTables ?? []), t];
+                            existing.tableCount = existing.remoteTables.length;
+                        }
+                    }
+                }
+                else {
+                    databases.push({
+                        name: dbName,
+                        sizeBytes: 0,
+                        tableCount: parsedTables.length,
+                        remote: true,
+                        local: false,
+                        remoteTables: parsedTables,
+                    });
+                }
+            }
+        }
+        const wfConfigs = config.workflows ?? {};
+        const workflows = Object.entries(wfConfigs).map(([name, cfg]) => {
+            let stepCount = 0;
+            const sourceFile = cfg.file ?? `src/workflows/${name}.ts`;
+            if (existsSync(join(cwd, sourceFile))) {
+                try {
+                    const src = readFileSync(join(cwd, sourceFile), "utf-8");
+                    const tree = parseWorkflowSteps(src, name, sourceFile);
+                    stepCount = countSteps(tree.steps);
+                }
+                catch { }
+            }
+            return { name, schedule: cfg.schedule, webhook: cfg.webhook, stepCount };
+        });
+        const explorerSources = Object.entries(config.sources ?? {}).map(([name, cfg]) => ({
+            name,
+            baseUrl: cfg.baseUrl ?? "",
+            authType: cfg.auth?.type ?? "none",
+            syncs: Object.entries(cfg.syncs ?? {}).map(([syncName, sync]) => ({
+                name: syncName,
+                database: sync.database,
+                schedule: sync.schedule,
+            })),
+        }));
+        const surfaces = [...surfaceConfigs.entries()]
+            .filter(([id]) => id !== "_home")
+            .map(([id, cfg]) => ({
+            name: id,
+            type: cfg.type,
+            accessMode: cfg.access
+                ? cfg.access.mode
+                : "public",
+            title: cfg.title,
+        }));
+        let files = [];
+        const filesDir = join(cwd, "files");
+        if (existsSync(filesDir)) {
+            files = readdirSync(filesDir)
+                .filter((f) => !f.startsWith("."))
+                .map((f) => {
+                const fp = join(filesDir, f);
+                const ext = f.split(".").pop()?.toLowerCase() ?? "";
+                let sizeBytes = 0;
+                try {
+                    sizeBytes = statSync(fp).size;
+                }
+                catch { }
+                return { name: f, sizeBytes, type: ext, remote: false, local: true };
+            });
+        }
+        const filesRemotePath = join(cwd, "files", ".remote");
+        if (existsSync(filesRemotePath)) {
+            try {
+                const manifest = JSON.parse(readFileSync(filesRemotePath, "utf-8"));
+                for (const [name, info] of Object.entries(manifest.files ?? {})) {
+                    const existing = files.find((f) => f.name === name);
+                    if (existing) {
+                        existing.remote = true;
+                    }
+                    else {
+                        const ext = name.split(".").pop()?.toLowerCase() ?? "";
+                        files.push({ name, sizeBytes: info.size_bytes ?? 0, type: ext, remote: true, local: false });
+                    }
+                }
+            }
+            catch { }
+        }
+        const workspace = {
+            name: config.name,
+            accentColor: config.branding?.accentColor ?? undefined,
+            timezone: config.settings?.timezone ?? undefined,
+        };
+        const agentsDir = join(cwd, "src", "agents");
+        let agents = [];
+        if (existsSync(agentsDir)) {
+            const agentFolders = readdirSync(agentsDir).filter((f) => {
+                if (f === "shared-skills")
+                    return false;
+                const p = join(agentsDir, f);
+                return statSync(p).isDirectory() && existsSync(join(p, "agent.json"));
+            });
+            for (const folder of agentFolders) {
+                try {
+                    const config = JSON.parse(readFileSync(join(agentsDir, folder, "agent.json"), "utf-8"));
+                    const agentSkillsDir = join(agentsDir, folder, "skills");
+                    const skillNames = existsSync(agentSkillsDir) ? readdirSync(agentSkillsDir).filter((s) => existsSync(join(agentSkillsDir, s, "SKILL.md"))) : [];
+                    const sharedDir = join(agentsDir, "shared-skills");
+                    const sharedNames = existsSync(sharedDir) ? readdirSync(sharedDir).filter((s) => existsSync(join(sharedDir, s, "SKILL.md"))) : [];
+                    agents.push({
+                        name: config.name ?? folder,
+                        model: config.model,
+                        tools: config.tools,
+                        caps: config.caps,
+                        memory: config.memory,
+                        requireApproval: config.requireApproval,
+                        instructions: config.instructions ?? "soul.md",
+                        skills: skillNames,
+                        sharedSkills: sharedNames,
+                    });
+                }
+                catch { }
+            }
+        }
+        return jsonResponse({ workspace, databases, workflows, sources: explorerSources, surfaces, agents, files });
+    }
+    const dbMatch = path.match(/^\/explorer\/api\/databases\/([^/]+)$/);
+    if (dbMatch) {
+        const dbName = decodeURIComponent(dbMatch[1]);
+        const dbPath = join(cwd, "databases", `${dbName}.db`);
+        if (!existsSync(dbPath)) {
+            const remotePath = join(cwd, "databases", ".remote");
+            if (existsSync(remotePath)) {
+                try {
+                    const manifest = JSON.parse(readFileSync(remotePath, "utf-8"));
+                    const remoteDb = manifest.databases?.[dbName];
+                    if (remoteDb) {
+                        const tables = Object.entries(remoteDb.tables ?? {}).map(([tName, tInfo]) => ({
+                            name: tName,
+                            rowCount: tInfo.row_count ?? 0,
+                            columns: (tInfo.columns ?? []).map((c) => ({ name: c.name, type: c.type, notnull: false, pk: false })),
+                        }));
+                        return jsonResponse({ name: dbName, sizeBytes: Math.round((remoteDb.size_mb ?? 0) * 1024 * 1024), tables, remote: true, pullCommand: `mug pull databases/${dbName}` });
+                    }
+                }
+                catch { }
+            }
+            const srcConfigs = config.sources ?? {};
+            const sourceTables = [];
+            for (const [, srcCfg] of Object.entries(srcConfigs)) {
+                for (const [syncName, sync] of Object.entries(srcCfg.syncs ?? {})) {
+                    if (sync.database !== dbName)
+                        continue;
+                    const syncFile = join(cwd, `src/sources/${syncName}.ts`);
+                    if (!existsSync(syncFile))
+                        continue;
+                    try {
+                        const parsed = parseSourceFile(readFileSync(syncFile, "utf-8"), syncName);
+                        if (parsed) {
+                            for (const t of parsed.tables) {
+                                if (!sourceTables.find((st) => st.name === t.name)) {
+                                    sourceTables.push({ name: t.name, rowCount: 0, columns: [] });
+                                }
+                            }
+                        }
+                    }
+                    catch { }
+                }
+            }
+            if (sourceTables.length > 0) {
+                return jsonResponse({ name: dbName, sizeBytes: 0, tables: sourceTables, remote: true, pullCommand: `mug pull databases/${dbName}` });
+            }
+            return jsonResponse({ error: "Database not found" }, 404);
+        }
+        const db = new Database(dbPath, { readonly: true });
+        try {
+            const tables = db.prepare("SELECT name FROM sqlite_master WHERE type='table' AND name NOT LIKE 'sqlite_%' ORDER BY name").all().map((t) => {
+                const cols = db.prepare(`PRAGMA table_info("${t.name}")`).all();
+                const count = db.prepare(`SELECT count(*) as c FROM "${t.name}"`).get().c;
+                return {
+                    name: t.name,
+                    rowCount: count,
+                    columns: cols.map((c) => ({ name: c.name, type: c.type, notnull: !!c.notnull, pk: !!c.pk })),
+                };
+            });
+            const sourcesList = [];
+            for (const [srcName, srcCfg] of Object.entries(config.sources ?? {})) {
+                for (const [, sync] of Object.entries(srcCfg.syncs ?? {})) {
+                    if (sync.database === dbName) {
+                        sourcesList.push(srcName);
+                        break;
+                    }
+                }
+            }
+            const surfacesList = [];
+            for (const [id, cfg] of surfaceConfigs) {
+                if (id === "_home")
+                    continue;
+                const json = JSON.stringify(cfg);
+                if (json.includes(`"${dbName}"`))
+                    surfacesList.push(id);
+            }
+            return jsonResponse({ name: dbName, sizeBytes: statSync(dbPath).size, tables, sources: sourcesList, surfaces: surfacesList });
+        }
+        finally {
+            db.close();
+        }
+    }
+    const tableMatch = path.match(/^\/explorer\/api\/databases\/([^/]+)\/([^/]+)$/);
+    if (tableMatch) {
+        const dbName = decodeURIComponent(tableMatch[1]);
+        const tableName = decodeURIComponent(tableMatch[2]);
+        const dbPath = join(cwd, "databases", `${dbName}.db`);
+        if (!existsSync(dbPath)) {
+            const remotePath = join(cwd, "databases", ".remote");
+            if (existsSync(remotePath)) {
+                try {
+                    const manifest = JSON.parse(readFileSync(remotePath, "utf-8"));
+                    const remoteTable = manifest.databases?.[dbName]?.tables?.[tableName];
+                    if (remoteTable) {
+                        return jsonResponse({
+                            database: dbName, table: tableName, remote: true, pullCommand: `mug pull databases/${dbName}`,
+                            columns: (remoteTable.columns ?? []).map((c) => ({ name: c.name, type: c.type, notnull: false, pk: false })),
+                            rows: [], totalRows: remoteTable.row_count ?? 0, page: 1, pageSize: 100,
+                        });
+                    }
+                }
+                catch { }
+            }
+            const srcConfigs = config.sources ?? {};
+            for (const [, srcCfg] of Object.entries(srcConfigs)) {
+                for (const [syncName, sync] of Object.entries(srcCfg.syncs ?? {})) {
+                    if (sync.database !== dbName)
+                        continue;
+                    const syncFile = join(cwd, `src/sources/${syncName}.ts`);
+                    if (!existsSync(syncFile))
+                        continue;
+                    try {
+                        const parsed = parseSourceFile(readFileSync(syncFile, "utf-8"), syncName);
+                        const t = parsed?.tables.find((pt) => pt.name === tableName);
+                        if (t) {
+                            return jsonResponse({
+                                database: dbName, table: tableName, remote: true, pullCommand: `mug pull databases/${dbName}`,
+                                columns: [], rows: [], totalRows: 0, page: 1, pageSize: 100,
+                            });
+                        }
+                    }
+                    catch { }
+                }
+            }
+            return jsonResponse({ error: "Database not found" }, 404);
+        }
+        const page = Math.max(1, parseInt(url.searchParams.get("page") ?? "1", 10));
+        const pageSize = Math.min(500, Math.max(1, parseInt(url.searchParams.get("pageSize") ?? "100", 10)));
+        const offset = (page - 1) * pageSize;
+        const db = new Database(dbPath, { readonly: true });
+        try {
+            const tableExists = db.prepare("SELECT name FROM sqlite_master WHERE type='table' AND name = ?").get(tableName);
+            if (!tableExists)
+                return jsonResponse({ error: "Table not found" }, 404);
+            const columns = db.prepare(`PRAGMA table_info("${tableName}")`).all().map((c) => ({
+                name: c.name,
+                type: c.type,
+                notnull: !!c.notnull,
+                pk: !!c.pk,
+            }));
+            const columnNames = new Set(columns.map((c) => c.name));
+            const whereClauses = [];
+            const whereParams = [];
+            const search = url.searchParams.get("search")?.trim();
+            if (search) {
+                const textCols = columns.filter((c) => {
+                    const t = c.type.toUpperCase();
+                    return !t.includes("INT") && !t.includes("REAL") && !t.includes("FLOAT") && !t.includes("NUMERIC") && !t.includes("BLOB");
+                });
+                if (textCols.length > 0) {
+                    const searchOr = textCols.map((c) => `"${c.name}" LIKE ?`).join(" OR ");
+                    whereClauses.push(`(${searchOr})`);
+                    for (const _ of textCols)
+                        whereParams.push(`%${search}%`);
+                }
+            }
+            const filtersRaw = url.searchParams.get("filters");
+            if (filtersRaw) {
+                try {
+                    const filters = JSON.parse(filtersRaw);
+                    for (const f of filters) {
+                        if (!columnNames.has(f.column))
+                            continue;
+                        const col = `"${f.column}"`;
+                        switch (f.op) {
+                            case "eq":
+                                whereClauses.push(`${col} = ?`);
+                                whereParams.push(f.value ?? "");
+                                break;
+                            case "neq":
+                                whereClauses.push(`${col} != ?`);
+                                whereParams.push(f.value ?? "");
+                                break;
+                            case "contains":
+                                whereClauses.push(`${col} LIKE ?`);
+                                whereParams.push(`%${f.value ?? ""}%`);
+                                break;
+                            case "starts_with":
+                                whereClauses.push(`${col} LIKE ?`);
+                                whereParams.push(`${f.value ?? ""}%`);
+                                break;
+                            case "gt":
+                                whereClauses.push(`${col} > ?`);
+                                whereParams.push(f.value ?? 0);
+                                break;
+                            case "gte":
+                                whereClauses.push(`${col} >= ?`);
+                                whereParams.push(f.value ?? 0);
+                                break;
+                            case "lt":
+                                whereClauses.push(`${col} < ?`);
+                                whereParams.push(f.value ?? 0);
+                                break;
+                            case "lte":
+                                whereClauses.push(`${col} <= ?`);
+                                whereParams.push(f.value ?? 0);
+                                break;
+                            case "empty":
+                                whereClauses.push(`(${col} IS NULL OR ${col} = '')`);
+                                break;
+                            case "not_empty":
+                                whereClauses.push(`(${col} IS NOT NULL AND ${col} != '')`);
+                                break;
+                        }
+                    }
+                }
+                catch { }
+            }
+            const whereSQL = whereClauses.length > 0 ? ` WHERE ${whereClauses.join(" AND ")}` : "";
+            let orderSQL = "";
+            const sortRaw = url.searchParams.get("sort");
+            if (sortRaw) {
+                try {
+                    const sorts = JSON.parse(sortRaw);
+                    const validSorts = sorts.filter((s) => columnNames.has(s.column) && (s.dir === "asc" || s.dir === "desc"));
+                    if (validSorts.length > 0) {
+                        orderSQL = ` ORDER BY ${validSorts.map((s) => `"${s.column}" ${s.dir}`).join(", ")}`;
+                    }
+                }
+                catch { }
+            }
+            const countRow = db.prepare(`SELECT count(*) as c FROM "${tableName}"${whereSQL}`).get(...whereParams);
+            const totalRows = countRow.c;
+            const rows = db.prepare(`SELECT * FROM "${tableName}"${whereSQL}${orderSQL} LIMIT ? OFFSET ?`).all(...whereParams, pageSize, offset);
+            return jsonResponse({ database: dbName, table: tableName, columns, rows, totalRows, page, pageSize });
+        }
+        finally {
+            db.close();
+        }
+    }
+    const wfRunDetailMatch = path.match(/^\/explorer\/api\/workflows\/([^/]+)\/runs\/([^/]+)$/);
+    if (wfRunDetailMatch) {
+        const wfName = decodeURIComponent(wfRunDetailMatch[1]);
+        const runId = decodeURIComponent(wfRunDetailMatch[2]);
+        const opsDbPath = join(cwd, "databases", "_mug_ops.db");
+        if (!existsSync(opsDbPath))
+            return jsonResponse({ error: "No run history" }, 404);
+        try {
+            const db = new Database(opsDbPath, { readonly: true });
+            const run = db.prepare("SELECT id, workflow, status, started_at, completed_at, duration_ms, result, error FROM workflow_runs WHERE id = ? AND workflow = ?").get(runId, wfName);
+            if (!run) {
+                db.close();
+                return jsonResponse({ error: "Run not found" }, 404);
+            }
+            const steps = db.prepare("SELECT step_name, step_type, started_at, completed_at, duration_ms, input, output, error, tokens_used FROM workflow_steps WHERE run_id = ? ORDER BY id").all(runId);
+            db.close();
+            return jsonResponse({ run: { id: run.id, workflow: run.workflow, status: run.status, startedAt: run.started_at, completedAt: run.completed_at, durationMs: run.duration_ms, result: run.result ? JSON.parse(run.result) : null, error: run.error }, steps: steps.map(s => ({ name: s.step_name, type: s.step_type, startedAt: s.started_at, completedAt: s.completed_at, durationMs: s.duration_ms, input: s.input, output: s.output, error: s.error, tokensUsed: s.tokens_used })) });
+        }
+        catch {
+            return jsonResponse({ error: "Failed to read run data" }, 500);
+        }
+    }
+    const wfRunsMatch = path.match(/^\/explorer\/api\/workflows\/([^/]+)\/runs$/);
+    if (wfRunsMatch) {
+        const wfName = decodeURIComponent(wfRunsMatch[1]);
+        const opsDbPath = join(cwd, "databases", "_mug_ops.db");
+        if (!existsSync(opsDbPath))
+            return jsonResponse({ runs: [] });
+        try {
+            const db = new Database(opsDbPath, { readonly: true });
+            const runs = db.prepare("SELECT id, status, started_at, completed_at, duration_ms, error FROM workflow_runs WHERE workflow = ? ORDER BY started_at DESC LIMIT 20").all(wfName);
+            db.close();
+            return jsonResponse({ runs: runs.map(r => ({ id: r.id, status: r.status, startedAt: r.started_at, completedAt: r.completed_at, durationMs: r.duration_ms, error: r.error })) });
+        }
+        catch {
+            return jsonResponse({ runs: [] });
+        }
+    }
+    const wfMatch = path.match(/^\/explorer\/api\/workflows\/([^/]+)$/);
+    if (wfMatch) {
+        const wfName = decodeURIComponent(wfMatch[1]);
+        const workflows = config.workflows ?? {};
+        const wfConfig = workflows[wfName];
+        if (!wfConfig)
+            return jsonResponse({ error: "Workflow not found" }, 404);
+        const sourceFile = wfConfig.file ?? `src/workflows/${wfName}.ts`;
+        const sourceExists = existsSync(join(cwd, sourceFile));
+        let databases = [];
+        let steps = null;
+        let description;
+        let parseError;
+        if (sourceExists) {
+            try {
+                const src = readFileSync(join(cwd, sourceFile), "utf-8");
+                const queryMatches = src.matchAll(/ctx\.(?:query|exec)\s*\(\s*['"]([^'"]+)['"]/g);
+                databases = [...new Set([...queryMatches].map((m) => m[1]))];
+                const tree = parseWorkflowSteps(src, wfName, sourceFile);
+                steps = tree.steps;
+                description = tree.description;
+            }
+            catch (e) {
+                parseError = e.message;
+            }
+        }
+        const allSources = config.sources ?? {};
+        const sourcesList = [];
+        for (const [srcName, srcCfg] of Object.entries(allSources)) {
+            const syncDbs = Object.values(srcCfg.syncs ?? {}).map((s) => s.database).filter(Boolean);
+            if (databases.some((db) => syncDbs.includes(db))) {
+                sourcesList.push(srcName);
+            }
+        }
+        const surfacesList = [];
+        for (const [id, cfg] of surfaceConfigs) {
+            if (id === "_home")
+                continue;
+            const json = JSON.stringify(cfg);
+            if (json.includes(wfName))
+                surfacesList.push(id);
+        }
+        return jsonResponse({ name: wfName, description, schedule: wfConfig.schedule, webhook: wfConfig.webhook, sourceFile, sourceExists, databases, sources: sourcesList, surfaces: surfacesList, steps, parseError });
+    }
+    const sourceMatch = path.match(/^\/explorer\/api\/sources\/([^/]+)$/);
+    if (sourceMatch) {
+        const srcName = decodeURIComponent(sourceMatch[1]);
+        const allSources = config.sources ?? {};
+        const srcConfig = allSources[srcName];
+        if (!srcConfig)
+            return jsonResponse({ error: "Source not found" }, 404);
+        const syncs = Object.entries(srcConfig.syncs ?? {}).map(([syncName, sync]) => {
+            const syncFile = `src/sources/${syncName}.ts`;
+            const syncExists = existsSync(join(cwd, syncFile));
+            let parsed = null;
+            let parseError;
+            if (syncExists) {
+                try {
+                    const src = readFileSync(join(cwd, syncFile), "utf-8");
+                    parsed = parseSourceFile(src, syncFile);
+                }
+                catch (e) {
+                    parseError = e.message;
+                }
+            }
+            return {
+                name: syncName,
+                database: sync.database,
+                schedule: sync.schedule,
+                sourceFile: syncFile,
+                sourceExists: syncExists,
+                description: parsed?.description,
+                tables: parsed?.tables ?? [],
+                parseError,
+            };
+        });
+        const databases = [...new Set(syncs.map((s) => s.database).filter(Boolean))];
+        return jsonResponse({ name: srcName, baseUrl: srcConfig.baseUrl ?? "", authType: srcConfig.auth?.type ?? "none", syncs, databases });
+    }
+    const surfMatch = path.match(/^\/explorer\/api\/surfaces\/([^/]+)$/);
+    if (surfMatch) {
+        const surfName = decodeURIComponent(surfMatch[1]);
+        const surfConfig = surfaceConfigs.get(surfName);
+        if (!surfConfig)
+            return jsonResponse({ error: "Surface not found" }, 404);
+        const surfJson = JSON.stringify(surfConfig);
+        const dbNames = getKnownDatabases(cwd);
+        const databases = dbNames.filter((d) => surfJson.includes(`"${d}"`));
+        const allWorkflows = Object.keys(config.workflows ?? {});
+        const workflows = allWorkflows.filter((w) => surfJson.includes(w));
+        const accessMode = surfConfig.access
+            ? surfConfig.access.mode ?? "public"
+            : "public";
+        return jsonResponse({
+            name: surfName,
+            title: surfConfig.title,
+            type: surfConfig.type ?? "form",
+            accessMode,
+            databases,
+            workflows,
+            liveUrl: `/${surfName}`,
+        });
+    }
+    const agentMatch = path.match(/^\/explorer\/api\/agents\/([^/]+)$/);
+    if (agentMatch) {
+        const agentName = decodeURIComponent(agentMatch[1]);
+        const agentDir = join(cwd, "src", "agents", agentName);
+        const configPath = join(agentDir, "agent.json");
+        const sourceExists = existsSync(configPath);
+        let agentConfig = {};
+        let soulContent;
+        let skills = [];
+        let sharedSkills = [];
+        if (sourceExists) {
+            try {
+                agentConfig = JSON.parse(readFileSync(configPath, "utf-8"));
+            }
+            catch { }
+            const soulPath = join(agentDir, agentConfig.instructions ?? "soul.md");
+            if (existsSync(soulPath)) {
+                soulContent = readFileSync(soulPath, "utf-8");
+            }
+            const skillsDir = join(agentDir, "skills");
+            if (existsSync(skillsDir)) {
+                for (const s of readdirSync(skillsDir)) {
+                    const skillFile = join(skillsDir, s, "SKILL.md");
+                    if (existsSync(skillFile)) {
+                        const content = readFileSync(skillFile, "utf-8");
+                        const descMatch = content.match(/^description:\s*(.+)$/m);
+                        skills.push({ name: s, description: descMatch?.[1] });
+                    }
+                }
+            }
+            const sharedDir = join(cwd, "src", "agents", "shared-skills");
+            if (existsSync(sharedDir)) {
+                for (const s of readdirSync(sharedDir)) {
+                    const skillFile = join(sharedDir, s, "SKILL.md");
+                    if (existsSync(skillFile)) {
+                        const content = readFileSync(skillFile, "utf-8");
+                        const descMatch = content.match(/^description:\s*(.+)$/m);
+                        sharedSkills.push({ name: s, description: descMatch?.[1] });
+                    }
+                }
+            }
+        }
+        const allWorkflows = Object.keys(config.workflows ?? {});
+        const workflows = [];
+        for (const wfName of allWorkflows) {
+            const wfFile = join(cwd, "src", "workflows", `${wfName}.ts`);
+            if (existsSync(wfFile)) {
+                try {
+                    const src = readFileSync(wfFile, "utf-8");
+                    if (src.includes(`"${agentName}"`) || src.includes(`'${agentName}'`))
+                        workflows.push(wfName);
+                }
+                catch { }
+            }
+        }
+        return jsonResponse({
+            name: agentConfig.name ?? agentName,
+            model: agentConfig.model ?? "default",
+            tools: agentConfig.tools ?? [],
+            caps: agentConfig.caps ?? {},
+            memory: agentConfig.memory ?? {},
+            requireApproval: agentConfig.requireApproval ?? [],
+            sourceFile: `src/agents/${agentName}/agent.json`,
+            sourceExists,
+            instructionFile: agentConfig.instructions ?? "soul.md",
+            soulContent,
+            skills,
+            sharedSkills,
+            workflows,
+        });
+    }
+    const agentBrainMatch = path.match(/^\/explorer\/api\/agents\/([^/]+)\/brain$/);
+    if (agentBrainMatch) {
+        const agentName = decodeURIComponent(agentBrainMatch[1]);
+        const brainPath = join(cwd, "src", "agents", agentName, "brain.db");
+        if (!existsSync(brainPath)) {
+            return jsonResponse({
+                entityCount: 0, factCount: 0, outcomeCount: 0, struggleCount: 0, sessionCount: 0,
+                entities: [], recentStruggles: [], recentOutcomes: [], recentSessions: [],
+            });
+        }
+        try {
+            const brainDb = new Database(brainPath, { readonly: true });
+            const tables = brainDb.prepare("SELECT name FROM sqlite_master WHERE type='table'").all().map((r) => r.name);
+            const hasSchema = tables.includes("brain_entities");
+            if (!hasSchema) {
+                brainDb.close();
+                return jsonResponse({
+                    entityCount: 0, factCount: 0, outcomeCount: 0, struggleCount: 0, sessionCount: 0,
+                    entities: [], recentStruggles: [], recentOutcomes: [], recentSessions: [],
+                });
+            }
+            const entityCount = brainDb.prepare("SELECT COUNT(*) as c FROM brain_entities").get().c;
+            const factCount = brainDb.prepare("SELECT COUNT(*) as c FROM brain_facts").get().c;
+            const outcomeCount = brainDb.prepare("SELECT COUNT(*) as c FROM brain_outcomes").get().c;
+            const struggleCount = brainDb.prepare("SELECT COUNT(*) as c FROM brain_struggles").get().c;
+            const sessionCount = brainDb.prepare("SELECT COUNT(*) as c FROM brain_sessions").get().c;
+            const entities = brainDb.prepare("SELECT name, type, summary, mention_count FROM brain_entities ORDER BY mention_count DESC LIMIT 50").all();
+            const recentStruggles = brainDb.prepare("SELECT category, description, resolved, recorded_at FROM brain_struggles ORDER BY recorded_at DESC LIMIT 20").all();
+            const recentOutcomes = brainDb.prepare("SELECT action, result, effective, recorded_at FROM brain_outcomes ORDER BY recorded_at DESC LIMIT 20").all();
+            const recentSessions = brainDb.prepare("SELECT id, workflow, goal, started_at, credits_used, turns_used, capped FROM brain_sessions ORDER BY started_at DESC LIMIT 20").all();
+            brainDb.close();
+            return jsonResponse({ entityCount, factCount, outcomeCount, struggleCount, sessionCount, entities, recentStruggles, recentOutcomes, recentSessions });
+        }
+        catch {
+            return jsonResponse({
+                entityCount: 0, factCount: 0, outcomeCount: 0, struggleCount: 0, sessionCount: 0,
+                entities: [], recentStruggles: [], recentOutcomes: [], recentSessions: [],
+            });
+        }
+    }
+    const agentSessionDetailMatch = path.match(/^\/explorer\/api\/agents\/([^/]+)\/sessions\/(.+)$/);
+    if (agentSessionDetailMatch) {
+        const agentName = decodeURIComponent(agentSessionDetailMatch[1]);
+        const runId = decodeURIComponent(agentSessionDetailMatch[2]);
+        const opsDbPath = join(cwd, "databases", "_mug_ops.db");
+        if (!existsSync(opsDbPath))
+            return jsonResponse({ error: "No run history" }, 404);
+        try {
+            const db = new Database(opsDbPath, { readonly: true });
+            const step = db.prepare("SELECT ws.run_id, ws.step_name, ws.step_type, ws.started_at, ws.completed_at, ws.duration_ms, ws.input, ws.output, ws.error, ws.tokens_used, wr.workflow FROM workflow_steps ws JOIN workflow_runs wr ON ws.run_id = wr.id WHERE ws.run_id = ? AND ws.step_type = 'agent' AND ws.step_name LIKE ? ORDER BY ws.id LIMIT 1").get(runId, `%${agentName}%`);
+            if (!step) {
+                db.close();
+                return jsonResponse({ error: "Session not found" }, 404);
+            }
+            let goal = "";
+            let response = "";
+            try {
+                const inp = JSON.parse(step.input ?? "{}");
+                goal = inp.goal ?? "";
+            }
+            catch { }
+            try {
+                response = step.output ?? "";
+            }
+            catch { }
+            const allSteps = db.prepare("SELECT step_name, step_type, started_at, duration_ms, output, error, tokens_used FROM workflow_steps WHERE run_id = ? ORDER BY id").all(runId);
+            db.close();
+            return jsonResponse({
+                session: {
+                    runId: step.run_id, workflow: step.workflow, stepName: step.step_name,
+                    startedAt: step.started_at, completedAt: step.completed_at,
+                    durationMs: step.duration_ms, goal, response,
+                    tokensUsed: step.tokens_used, error: step.error,
+                },
+                allSteps: allSteps.map((s) => ({
+                    name: s.step_name, type: s.step_type, startedAt: s.started_at,
+                    durationMs: s.duration_ms, output: s.output, error: s.error, tokensUsed: s.tokens_used,
+                })),
+            });
+        }
+        catch {
+            return jsonResponse({ error: "Failed to query runs" }, 500);
+        }
+    }
+    const agentSessionsMatch = path.match(/^\/explorer\/api\/agents\/([^/]+)\/sessions$/);
+    if (agentSessionsMatch) {
+        const agentName = decodeURIComponent(agentSessionsMatch[1]);
+        const opsDbPath = join(cwd, "databases", "_mug_ops.db");
+        if (!existsSync(opsDbPath))
+            return jsonResponse({ sessions: [] });
+        try {
+            const db = new Database(opsDbPath, { readonly: true });
+            const rows = db.prepare("SELECT ws.run_id, ws.step_name, ws.started_at, ws.completed_at, ws.duration_ms, ws.input, ws.output, ws.error, ws.tokens_used, wr.workflow FROM workflow_steps ws JOIN workflow_runs wr ON ws.run_id = wr.id WHERE ws.step_type = 'agent' AND ws.step_name LIKE ? ORDER BY ws.started_at DESC LIMIT 50").all(`%${agentName}%`);
+            db.close();
+            const sessions = rows.map((r) => {
+                let goal = "";
+                try {
+                    const inp = JSON.parse(r.input ?? "{}");
+                    goal = inp.goal ?? "";
+                }
+                catch { }
+                return {
+                    runId: r.run_id, workflow: r.workflow, stepName: r.step_name,
+                    startedAt: r.started_at, completedAt: r.completed_at,
+                    durationMs: r.duration_ms, goal,
+                    response: (r.output ?? "").slice(0, 200),
+                    tokensUsed: r.tokens_used, error: r.error,
+                };
+            });
+            return jsonResponse({ sessions });
+        }
+        catch {
+            return jsonResponse({ sessions: [] });
+        }
+    }
+    const changesetDetailMatch = path.match(/^\/explorer\/api\/changesets\/([^/]+)\/([^/]+)$/);
+    if (changesetDetailMatch) {
+        const database = decodeURIComponent(changesetDetailMatch[1]);
+        const changesetId = decodeURIComponent(changesetDetailMatch[2]);
+        try {
+            const proxyRes = await fetch(`http://localhost:${USER_PORT}/changesets/${encodeURIComponent(database)}`, {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ changeset_id: changesetId }),
+            });
+            if (!proxyRes.ok)
+                return jsonResponse({ error: "Failed to fetch changeset" }, proxyRes.status);
+            const data = await proxyRes.json();
+            return jsonResponse(data);
+        }
+        catch {
+            return jsonResponse({ error: "Changeset API not available — is `mug dev` running?" }, 503);
+        }
+    }
+    const changesetRollbackMatch = path.match(/^\/explorer\/api\/changesets\/([^/]+)\/([^/]+)\/rollback$/);
+    if (changesetRollbackMatch && req.method === "POST") {
+        const database = decodeURIComponent(changesetRollbackMatch[1]);
+        const changesetId = decodeURIComponent(changesetRollbackMatch[2]);
+        try {
+            const proxyRes = await fetch(`http://localhost:${USER_PORT}/rollback/${encodeURIComponent(database)}`, {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ changeset_id: changesetId }),
+            });
+            if (!proxyRes.ok)
+                return jsonResponse({ error: "Rollback failed" }, proxyRes.status);
+            const data = await proxyRes.json();
+            return jsonResponse(data);
+        }
+        catch {
+            return jsonResponse({ error: "Rollback API not available" }, 503);
+        }
+    }
+    if (path === "/explorer/api/usage") {
+        try {
+            const token = getAccountToken();
+            const workspace = config.name;
+            let apiUrl = `https://api.mug.work/workspace/${workspace}/usage`;
+            const periodParam = url.searchParams.get("period");
+            if (periodParam)
+                apiUrl += `?period=${encodeURIComponent(periodParam)}`;
+            const result = await fetch(apiUrl, {
+                headers: { Authorization: `Bearer ${token}` },
+            });
+            const data = await result.json();
+            if (!result.ok)
+                return jsonResponse(data, result.status);
+            return jsonResponse(data);
+        }
+        catch (err) {
+            return jsonResponse({ error: `Failed to fetch usage: ${err}` }, 500);
+        }
+    }
+    if (path === "/explorer/api/workspace-info") {
+        try {
+            const token = getAccountToken();
+            const workspace = config.name;
+            const [meRes, billingRes] = await Promise.all([
+                fetch("https://api.mug.work/auth/me", { headers: { Authorization: `Bearer ${token}` } }),
+                fetch(`https://api.mug.work/workspace/${workspace}/billing`, { headers: { Authorization: `Bearer ${token}` } }),
+            ]);
+            const meData = (await meRes.json());
+            const ws = (meData.workspaces ?? []).find((w) => w.name === workspace);
+            const billing = billingRes.ok ? await billingRes.json() : {};
+            return jsonResponse({ workspace: ws ?? null, billing });
+        }
+        catch (err) {
+            return jsonResponse({ error: `Failed to fetch workspace info: ${err}` }, 500);
+        }
+    }
+    if (path === "/explorer/api/files" || path.startsWith("/explorer/api/files/")) {
+        const subpath = path === "/explorer/api/files" ? "" : decodeURIComponent(path.slice("/explorer/api/files/".length));
+        const dirPath = join(cwd, "files", subpath);
+        if (!existsSync(dirPath))
+            return jsonResponse({ error: "Directory not found" }, 404);
+        try {
+            const entries = readdirSync(dirPath, { withFileTypes: true })
+                .filter((e) => !e.name.startsWith("."))
+                .map((e) => {
+                const fp = join(dirPath, e.name);
+                const ext = e.name.split(".").pop()?.toLowerCase() ?? "";
+                let sizeBytes = 0;
+                try {
+                    sizeBytes = statSync(fp).size;
+                }
+                catch { }
+                return { name: e.name, sizeBytes, type: ext, isDir: e.isDirectory() };
+            })
+                .sort((a, b) => {
+                if (a.isDir !== b.isDir)
+                    return a.isDir ? -1 : 1;
+                return a.name.localeCompare(b.name);
+            });
+            return jsonResponse({ path: subpath || "/", files: entries });
+        }
+        catch {
+            return jsonResponse({ error: "Failed to read directory" }, 500);
+        }
+    }
+    jsonResponse({ error: "Not found" }, 404);
+}