forgecad 0.6.3 → 0.8.0

package/README.md

@@ -107,14 +107,12 @@ When an AI model is asked to generate ForgeCAD models, require this workflow:
 1. Read `docs/permanent/API/model-building/README.md` first.
 2. Read every file listed there.
 3. Read the relevant files in `examples/api/` next.
-4. If the task is exploratory, unfamiliar, or likely to need debugging, start in a `.forge-notebook.json` and iterate there first.
-5. Only then stabilize the result as `.forge.js`, or keep using the notebook when iteration is still active.
-6. Read `docs/permanent/API/runtime/` or `docs/permanent/API/output/` only if the task explicitly needs viewport behavior, reporting, or export.
+4. Read `docs/permanent/API/runtime/` or `docs/permanent/API/output/` only if the task explicitly needs viewport behavior, reporting, or export.
 
 Use this instruction in prompts to avoid missing API capabilities or producing invalid model code:
 
 ```text
-Before generating any ForgeCAD model code, read docs/permanent/API/model-building/README.md, then every file it lists, then the relevant files in examples/api/. If the task is exploratory, unfamiliar, or likely to need debugging, start in a .forge-notebook.json and iterate there first. Only read docs/permanent/API/runtime/ or docs/permanent/API/output/ if the task explicitly needs those areas. Then generate a runnable model using only documented ForgeCAD APIs and patterns from those files.
+Before generating any ForgeCAD model code, read docs/permanent/API/model-building/README.md, then every file it lists, then the relevant files in examples/api/. Only read docs/permanent/API/runtime/ or docs/permanent/API/output/ if the task explicitly needs those areas. Then generate a runnable model using only documented ForgeCAD APIs and patterns from those files.
 ```
 
 Example AI workflows:
@@ -266,12 +264,8 @@ All CLI tools use the same runtime as the browser (`src/forge/headless.ts`), so
 | Task | Command |
 | --- | --- |
 | Validate a script | `forgecad run examples/cup.forge.js` |
-| Validate a notebook preview | `forgecad run examples/api/notebook-iteration.forge-notebook.json` |
-| Inspect notebook cells in the terminal | `forgecad notebook view examples/api/notebook-iteration.forge-notebook.json preview` |
-| Render PNG views | `forgecad render examples/cup.forge.js` |
-| Render a notebook preview | `forgecad render examples/api/notebook-iteration.forge-notebook.json` |
+| Render PNG views | `forgecad render 3d examples/cup.forge.js` |
 | Render orbit GIF (solid + wireframe) | `forgecad capture gif examples/cup.forge.js` |
-| List notebook capture options | `forgecad capture gif examples/api/notebook-assembly-debug.forge-notebook.json --list` |
 | Export sketch SVG | `forgecad export svg examples/constraints/01-fully-constrained-rect.forge.js` |
 | Export exact STEP (supported subset only) | `forgecad export step examples/api/brep-exportable.forge.js` |
 | Export exact BREP (supported subset only) | `forgecad export brep examples/api/brep-exportable.forge.js` |
@@ -286,7 +280,6 @@ All CLI tools use the same runtime as the browser (`src/forge/headless.ts`), so
 ### CLI details
 
 - `render` outputs multi-angle PNGs (`front`, `side`, `top`, `iso`) by default.
-- For `forgecad run`, `forgecad render`, `forgecad capture gif`, and `forgecad capture mp4`, passing a `.forge-notebook.json` uses that notebook's preview cell.
 - `capture gif` outputs a single orbit animation with a full solid pass, then full wireframe pass.
 - `export svg` runs fully in Node (no browser/Puppeteer).
 - `export report` generates searchable-text PDF pages (overview, unique components, BOM, dimensions).
@@ -306,8 +299,6 @@ All CLI tools use the same runtime as the browser (`src/forge/headless.ts`), so
 - `examples/api/exploded-view.forge.js`: exploded layouts + cut-plane visualization
 - `examples/api/brep-exportable.forge.js`: exact-exportable STEP/BREP subset demo
 - `examples/api/geometry-info.forge.js`: inspect backend/provenance info for solids
-- `examples/api/notebook-iteration.forge-notebook.json`: stateful part exploration with pinned intermediate geometry
-- `examples/api/notebook-assembly-debug.forge-notebook.json`: assembly collision and sweep investigation in notebook cells
 
 BREP export support is intentionally tracked as a living parity table in [docs/permanent/API/output/brep-export.md](docs/permanent/API/output/brep-export.md).
 

package/dist/assets/{AdminPage-CeqCUUgu.js → AdminPage-D4bocK4E.js}

@@ -1,5 +1,5 @@
-import { r as reactExports, j as jsxRuntimeExports, L as Link } from "./vendor-react-Dt7-aaJH.js";
-import { u as useAuthStore } from "./index-1CYp3zUp.js";
+import { r as reactExports, j as jsxRuntimeExports, L as Link } from "./vendor-react-CG3i_wp0.js";
+import { u as useAuthStore } from "./index-Pz321YAt.js";
 function formatUptime(seconds) {
   const d = Math.floor(seconds / 86400);
   const h = Math.floor(seconds % 86400 / 3600);
@@ -12,7 +12,7 @@ function formatBytes(bytes) {
   if (bytes === 0) return "0 B";
   const units = ["B", "KB", "MB", "GB"];
   const i = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), units.length - 1);
-  const value = bytes / Math.pow(1024, i);
+  const value = bytes / 1024 ** i;
   return `${value.toFixed(i === 0 ? 0 : 1)} ${units[i]}`;
 }
 function timeAgo(dateStr) {
@@ -71,14 +71,20 @@ function HealthCard({ health }) {
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: dimTextStyle, children: "Status" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: {
-          fontSize: 13,
-          fontWeight: 600,
-          padding: "2px 10px",
-          borderRadius: 6,
-          background: isOk ? "rgba(74, 222, 128, 0.12)" : "rgba(248, 113, 113, 0.12)",
-          color: isOk ? "#4ade80" : "#f87171"
-        }, children: isOk ? "Healthy" : health.status })
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "span",
+          {
+            style: {
+              fontSize: 13,
+              fontWeight: 600,
+              padding: "2px 10px",
+              borderRadius: 6,
+              background: isOk ? "rgba(74, 222, 128, 0.12)" : "rgba(248, 113, 113, 0.12)",
+              color: isOk ? "#4ade80" : "#f87171"
+            },
+            children: isOk ? "Healthy" : health.status
+          }
+        )
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(Row, { label: "Uptime", value: formatUptime(health.uptime) }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(Row, { label: "Version", value: health.version })
@@ -92,17 +98,23 @@ function Row({ label, value }) {
   ] });
 }
 function Badge({ text, color }) {
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: {
-    padding: "2px 8px",
-    borderRadius: 4,
-    fontSize: 11,
-    fontWeight: 600,
-    background: `${color}18`,
-    color,
-    border: `1px solid ${color}40`,
-    textTransform: "uppercase",
-    letterSpacing: "0.03em"
-  }, children: text });
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "span",
+    {
+      style: {
+        padding: "2px 8px",
+        borderRadius: 4,
+        fontSize: 11,
+        fontWeight: 600,
+        background: `${color}18`,
+        color,
+        border: `1px solid ${color}40`,
+        textTransform: "uppercase",
+        letterSpacing: "0.03em"
+      },
+      children: text
+    }
+  );
 }
 function SignupSparkline({ data }) {
   if (!data.length) return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: dimTextStyle, children: "No data" });
@@ -154,45 +166,91 @@ function ProjectBreakdown({ stats }) {
     ] })
   ] });
 }
-function UserTable({ users, total }) {
+function PlanToggle({ userId, currentPlan, onChanged }) {
+  const [loading, setLoading] = reactExports.useState(false);
+  const isPro = currentPlan === "pro";
+  const toggle = async () => {
+    const newPlan = isPro ? "free" : "pro";
+    const label = isPro ? "Downgrade to Free" : "Grant Pro";
+    if (!confirm(`${label} for this user?`)) return;
+    setLoading(true);
+    try {
+      const res = await fetch(`/api/admin/users/${userId}/plan`, {
+        method: "POST",
+        credentials: "include",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ plan: newPlan })
+      });
+      if (res.ok) {
+        onChanged(userId, newPlan);
+      }
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "button",
+    {
+      onClick: toggle,
+      disabled: loading,
+      title: isPro ? "Click to downgrade to Free" : "Click to grant Pro",
+      style: {
+        cursor: loading ? "wait" : "pointer",
+        background: "none",
+        border: "none",
+        padding: 0,
+        opacity: loading ? 0.5 : 1
+      },
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { text: currentPlan, color: isPro ? "#a78bfa" : "#64748b" })
+    }
+  );
+}
+function UserTable({ users, total, onPlanChanged }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { ...cardStyle, padding: 0, overflow: "hidden" }, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { padding: "16px 20px", borderBottom: "1px solid var(--fc-border)", display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { style: { fontSize: 15, fontWeight: 600, color: "var(--fc-text)", margin: 0 }, children: "Users" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { style: { fontSize: 12, color: "var(--fc-textDim)" }, children: [
-        total,
-        " total"
-      ] })
-    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "div",
+      {
+        style: {
+          padding: "16px 20px",
+          borderBottom: "1px solid var(--fc-border)",
+          display: "flex",
+          justifyContent: "space-between",
+          alignItems: "center"
+        },
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { style: { fontSize: 15, fontWeight: 600, color: "var(--fc-text)", margin: 0 }, children: "Users" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { style: { fontSize: 12, color: "var(--fc-textDim)" }, children: [
+            total,
+            " total"
+          ] })
+        ]
+      }
+    ),
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { overflowX: "auto" }, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("table", { style: { width: "100%", borderCollapse: "collapse", minWidth: 700 }, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("thead", { children: /* @__PURE__ */ jsxRuntimeExports.jsx("tr", { style: { borderBottom: "1px solid var(--fc-border)" }, children: ["Name", "Email", "Role", "Plan", "Projects", "Storage", "Joined"].map((h) => /* @__PURE__ */ jsxRuntimeExports.jsx("th", { style: {
-        padding: "10px 16px",
-        textAlign: "left",
-        fontSize: 11,
-        color: "var(--fc-textDim)",
-        fontWeight: 600,
-        textTransform: "uppercase",
-        whiteSpace: "nowrap"
-      }, children: h }, h)) }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("thead", { children: /* @__PURE__ */ jsxRuntimeExports.jsx("tr", { style: { borderBottom: "1px solid var(--fc-border)" }, children: ["Name", "Email", "Role", "Plan", "Projects", "Storage", "Joined"].map((h) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "th",
+        {
+          style: {
+            padding: "10px 16px",
+            textAlign: "left",
+            fontSize: 11,
+            color: "var(--fc-textDim)",
+            fontWeight: 600,
+            textTransform: "uppercase",
+            whiteSpace: "nowrap"
+          },
+          children: h
+        },
+        h
+      )) }) }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("tbody", { children: users.map((user) => /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { style: { borderBottom: "1px solid var(--fc-border)" }, children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs("td", { style: { padding: "10px 16px", fontSize: 13, color: "var(--fc-text)", fontWeight: 500 }, children: [
           user.name,
           !user.emailVerifiedAt && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { title: "Email not verified", style: { color: "#fb923c", marginLeft: 6, fontSize: 11 }, children: "unverified" })
         ] }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("td", { style: { padding: "10px 16px", fontSize: 13, color: "var(--fc-textMuted)" }, children: user.email }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("td", { style: { padding: "10px 16px" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          Badge,
-          {
-            text: user.role,
-            color: user.role === "admin" ? "#4ade80" : "#64748b"
-          }
-        ) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("td", { style: { padding: "10px 16px" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          Badge,
-          {
-            text: user.plan,
-            color: user.plan === "pro" ? "#a78bfa" : "#64748b"
-          }
-        ) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("td", { style: { padding: "10px 16px" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { text: user.role, color: user.role === "admin" ? "#4ade80" : "#64748b" }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("td", { style: { padding: "10px 16px" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(PlanToggle, { userId: user.id, currentPlan: user.plan, onChanged: onPlanChanged }) }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("td", { style: { padding: "10px 16px", fontSize: 13, color: "var(--fc-text)" }, children: user.projectCount }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("td", { style: { padding: "10px 16px", fontSize: 13, color: "var(--fc-textMuted)" }, children: formatBytes(user.storageUsedBytes) }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("td", { style: { padding: "10px 16px", fontSize: 12, color: "var(--fc-textDim)", whiteSpace: "nowrap" }, children: new Date(user.createdAt).toLocaleDateString() })
@@ -210,38 +268,69 @@ const ACTION_COLORS = {
   "share.publish": "#34d399",
   "share.delete": "#f87171",
   "member.add": "#818cf8",
-  "member.remove": "#fb923c"
+  "member.remove": "#fb923c",
+  "license.generate": "#60a5fa",
+  "subscription.created": "#4ade80",
+  "subscription.canceled": "#fb923c",
+  "subscription.expired": "#f87171",
+  "subscription.admin_granted": "#a78bfa",
+  "subscription.admin_revoked": "#f87171"
 };
 function AuditLog({ entries, onLoadMore }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { ...cardStyle, padding: 0, overflow: "hidden" }, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { padding: "16px 20px", borderBottom: "1px solid var(--fc-border)" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { style: { fontSize: 15, fontWeight: 600, color: "var(--fc-text)", margin: 0 }, children: "Recent Activity" }) }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { maxHeight: 400, overflowY: "auto" }, children: [
-      entries.map((entry) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: {
-        padding: "10px 20px",
-        borderBottom: "1px solid var(--fc-border)",
-        display: "flex",
-        alignItems: "center",
-        gap: 12
-      }, children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: {
-          width: 6,
-          height: 6,
-          borderRadius: "50%",
-          background: ACTION_COLORS[entry.action] ?? "var(--fc-textDim)",
-          flexShrink: 0
-        } }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 12, fontWeight: 600, color: "var(--fc-text)", fontFamily: "monospace" }, children: entry.action }),
-            entry.userName && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { style: { fontSize: 12, color: "var(--fc-textMuted)" }, children: [
-              "by ",
-              entry.userName
-            ] })
-          ] }),
-          entry.details && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { fontSize: 11, color: "var(--fc-textDim)", marginTop: 2, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: Object.entries(entry.details).map(([k, v]) => `${k}: ${v}`).join(", ") })
-        ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 11, color: "var(--fc-textDim)", whiteSpace: "nowrap", flexShrink: 0 }, children: timeAgo(entry.createdAt) })
-      ] }, entry.id)),
+      entries.map((entry) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        "div",
+        {
+          style: {
+            padding: "10px 20px",
+            borderBottom: "1px solid var(--fc-border)",
+            display: "flex",
+            alignItems: "center",
+            gap: 12
+          },
+          children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "div",
+              {
+                style: {
+                  width: 6,
+                  height: 6,
+                  borderRadius: "50%",
+                  background: ACTION_COLORS[entry.action] ?? "var(--fc-textDim)",
+                  flexShrink: 0
+                }
+              }
+            ),
+            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 12, fontWeight: 600, color: "var(--fc-text)", fontFamily: "monospace" }, children: entry.action }),
+                entry.userName && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { style: { fontSize: 12, color: "var(--fc-textMuted)" }, children: [
+                  "by ",
+                  entry.userName
+                ] })
+              ] }),
+              entry.details && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "div",
+                {
+                  style: {
+                    fontSize: 11,
+                    color: "var(--fc-textDim)",
+                    marginTop: 2,
+                    overflow: "hidden",
+                    textOverflow: "ellipsis",
+                    whiteSpace: "nowrap"
+                  },
+                  children: Object.entries(entry.details).map(([k, v]) => `${k}: ${v}`).join(", ")
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 11, color: "var(--fc-textDim)", whiteSpace: "nowrap", flexShrink: 0 }, children: timeAgo(entry.createdAt) })
+          ]
+        },
+        entry.id
+      )),
       entries.length === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { padding: 24, textAlign: "center", color: "var(--fc-textDim)", fontSize: 14 }, children: "No activity logged yet" })
     ] }),
     entries.length > 0 && entries.length % 50 === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { padding: "12px 20px", borderTop: "1px solid var(--fc-border)", textAlign: "center" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -296,67 +385,89 @@ function AdminPage() {
       if (d) setAudit((prev) => [...prev, ...d.entries]);
     });
   }, [audit.length]);
+  const handlePlanChanged = reactExports.useCallback((userId, newPlan) => {
+    setUsers((prev) => prev.map((u) => u.id === userId ? { ...u, plan: newPlan } : u));
+  }, []);
   if (!user || user.role !== "admin") {
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      height: "100vh",
-      flexDirection: "column",
-      gap: 16
-    }, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { fontSize: 48 }, children: "🚫" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { style: { color: "var(--fc-text)", margin: 0 }, children: "Admin Access Required" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("p", { style: { color: "var(--fc-textMuted)", margin: 0 }, children: "You don't have permission to access this page." }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(Link, { to: "/", style: { color: "var(--fc-accent)", textDecoration: "none" }, children: "Go home" })
-    ] });
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "div",
+      {
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          height: "100vh",
+          flexDirection: "column",
+          gap: 16
+        },
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { fontSize: 48 }, children: "🚫" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { style: { color: "var(--fc-text)", margin: 0 }, children: "Admin Access Required" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("p", { style: { color: "var(--fc-textMuted)", margin: 0 }, children: "You don't have permission to access this page." }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Link, { to: "/", style: { color: "var(--fc-accent)", textDecoration: "none" }, children: "Go home" })
+        ]
+      }
+    );
   }
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { minHeight: "100vh", display: "flex", flexDirection: "column", background: "var(--fc-bg)" }, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("nav", { style: {
-      height: 56,
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "space-between",
-      padding: "0 24px",
-      background: "var(--fc-bg)",
-      borderBottom: "1px solid var(--fc-border)",
-      flexShrink: 0
-    }, children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsxs(Link, { to: "/", style: {
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "nav",
+      {
+        style: {
+          height: 56,
           display: "flex",
           alignItems: "center",
-          gap: 8,
-          textDecoration: "none",
-          color: "var(--fc-text)"
-        }, children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 20 }, children: "⚒" }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 16, fontWeight: 700, color: "var(--fc-accent)" }, children: "ForgeCAD" })
-        ] }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { text: "Admin", color: "#fb923c" })
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 16 }, children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "button",
-          {
-            onClick: loadData,
-            title: `Last refresh: ${lastRefresh.toLocaleTimeString()}`,
-            style: {
-              background: "none",
-              border: "1px solid var(--fc-border)",
-              color: "var(--fc-textMuted)",
-              padding: "4px 12px",
-              borderRadius: 6,
-              cursor: "pointer",
-              fontSize: 12
-            },
-            children: "Refresh"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(Link, { to: "/app", style: { color: "var(--fc-textMuted)", textDecoration: "none", fontSize: 14 }, children: "Back to App" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 13, color: "var(--fc-textDim)" }, children: user.name })
-      ] })
-    ] }),
+          justifyContent: "space-between",
+          padding: "0 24px",
+          background: "var(--fc-bg)",
+          borderBottom: "1px solid var(--fc-border)",
+          flexShrink: 0
+        },
+        children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsxs(
+              Link,
+              {
+                to: "/",
+                style: {
+                  display: "flex",
+                  alignItems: "center",
+                  gap: 8,
+                  textDecoration: "none",
+                  color: "var(--fc-text)"
+                },
+                children: [
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 20 }, children: "⚒" }),
+                  /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 16, fontWeight: 700, color: "var(--fc-accent)" }, children: "ForgeCAD" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { text: "Admin", color: "#fb923c" })
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 16 }, children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "button",
+              {
+                onClick: loadData,
+                title: `Last refresh: ${lastRefresh.toLocaleTimeString()}`,
+                style: {
+                  background: "none",
+                  border: "1px solid var(--fc-border)",
+                  color: "var(--fc-textMuted)",
+                  padding: "4px 12px",
+                  borderRadius: 6,
+                  cursor: "pointer",
+                  fontSize: 12
+                },
+                children: "Refresh"
+              }
+            ),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Link, { to: "/app", style: { color: "var(--fc-textMuted)", textDecoration: "none", fontSize: 14 }, children: "Back to App" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 13, color: "var(--fc-textDim)" }, children: user.name })
+          ] })
+        ]
+      }
+    ),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("main", { style: { flex: 1, padding: 24, maxWidth: 1200, margin: "0 auto", width: "100%" }, children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 24 }, children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx("h1", { style: { fontSize: 28, fontWeight: 700, color: "var(--fc-text)", margin: 0 }, children: "Dashboard" }),
@@ -372,13 +483,7 @@ function AdminPage() {
             sub: stats ? `+${stats.users.signupsToday} today` : void 0
           }
         ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          StatNumber,
-          {
-            value: (stats == null ? void 0 : stats.projects.total) ?? "-",
-            label: "Total Projects"
-          }
-        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(StatNumber, { value: (stats == null ? void 0 : stats.projects.total) ?? "-", label: "Total Projects" }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           StatNumber,
           {
@@ -387,20 +492,14 @@ function AdminPage() {
             sub: stats ? `${stats.users.activeWeek} this week` : void 0
           }
         ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          StatNumber,
-          {
-            value: stats ? formatBytes(stats.storage.totalBytes) : "-",
-            label: "Storage Used"
-          }
-        )
+        /* @__PURE__ */ jsxRuntimeExports.jsx(StatNumber, { value: stats ? formatBytes(stats.storage.totalBytes) : "-", label: "Storage Used" })
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { style: { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(260px, 1fr))", gap: 16, marginBottom: 20 }, children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx(SignupSparkline, { data: signups }),
         stats && /* @__PURE__ */ jsxRuntimeExports.jsx(UserBreakdown, { stats }),
         stats && /* @__PURE__ */ jsxRuntimeExports.jsx(ProjectBreakdown, { stats })
       ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { marginBottom: 20 }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(UserTable, { users, total: usersTotal }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { marginBottom: 20 }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(UserTable, { users, total: usersTotal, onPlanChanged: handlePlanChanged }) }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(AuditLog, { entries: audit, onLoadMore: loadMoreAudit })
     ] })
   ] });