babavoss 0.12.6 → 0.13.1

package/gui/gui.js

@@ -6,7 +6,8 @@ import {
   ApiError,
   Button,
   Desktop,
-  DesktopFrame,
+  DesktopSkeleton,
+  Eyes,
   FieldError,
   Input,
   Maker,
@@ -19,23 +20,28 @@ import {
   accept,
   api,
   apiHeaders,
+  bindingNote,
+  bindingOf,
   canonicalPath,
   collect,
   describeType,
   effect,
+  formatBinding,
   formatFailure,
   isApps,
+  isMac,
+  keyCommands,
+  keymapOf,
   matchRoute,
+  normalBinding,
   plan,
   resource,
   s,
   system,
   tableOf,
-  useBaba,
   useBabaState,
-  useResource,
   useScope
-} from "./chunk-9gmmm54v.js";
+} from "./chunk-qgzmajan.js";
 import {
   require_jsx_runtime
 } from "./chunk-pk09y98y.js";
@@ -47,7 +53,7 @@ import {
 } from "./chunk-wwqypxre.js";
 
 // src/gui/gui.tsx
-var import_react6 = __toESM(require_react(), 1);
+var import_react9 = __toESM(require_react(), 1);
 var import_client = __toESM(require_client(), 1);
 
 // src/desktop/icons.ts
@@ -386,7 +392,7 @@ function desktop(options) {
         }
       }),
       p.action("desktop-settings", {
-        summary: "set the baba's theme, the same on every page",
+        summary: "set the baba's own theme, as its frames in the Maker show it; voss's pages follow the theme in voss's settings",
         args: { ...sessionArg, theme: s.optional(s.enum(...themes)) },
         run: (w, a) => {
           sync(w);
@@ -825,21 +831,21 @@ function Output({ value }) {
   });
 }
 
-// src/gui/promptware.tsx
+// src/gui/instructions.tsx
 var import_react3 = __toESM(require_react(), 1);
 var jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
-function Promptware({ manifest }) {
+function Instructions({ manifest }) {
   const { fire, read, ready, round } = useBabaState();
   const [plan2, setPlan] = import_react3.useState(null);
   const [error, setError] = import_react3.useState(null);
   import_react3.useEffect(() => {
     if (ready)
-      read("promptware-plan").then((p) => setPlan(p), setError);
+      read("agents-plan").then((p) => setPlan(p), setError);
   }, [ready, round]);
   if (!("pwStatus" in manifest.resources))
     return /* @__PURE__ */ jsx_runtime3.jsx("p", {
       className: "bv-muted",
-      children: "This baba has no promptware system."
+      children: "This baba has no agents system."
     });
   if (!ready)
     return /* @__PURE__ */ jsx_runtime3.jsx("p", {
@@ -872,7 +878,7 @@ function Promptware({ manifest }) {
             children: [
               /* @__PURE__ */ jsx_runtime3.jsx(Button, {
                 variant: "primary",
-                onClick: () => void act("promptware-sync", {}).catch(() => {}),
+                onClick: () => void act("agents-sync", {}).catch(() => {}),
                 children: "Sync now"
               }),
               plan2 && /* @__PURE__ */ jsx_runtime3.jsxs("span", {
@@ -903,17 +909,17 @@ function Promptware({ manifest }) {
   });
 }
 function Declared({ manifest }) {
-  const pw = manifest.promptware;
+  const pw = manifest.instructions;
   const skills = Object.entries(pw.skills);
   return /* @__PURE__ */ jsx_runtime3.jsxs("section", {
     className: "gui-section",
     children: [
       /* @__PURE__ */ jsx_runtime3.jsx("h2", {
-        children: "Promptware"
+        children: "Instructions"
       }),
       !pw.context && skills.length === 0 && pw.hooks.length === 0 && /* @__PURE__ */ jsx_runtime3.jsx("p", {
         className: "bv-muted",
-        children: "Nothing declared yet: give the baba a `context(...)`, a `skill(...)` or a `hook(...)` under `promptware`."
+        children: "Nothing declared yet: give the baba a `context(...)`, a `skill(...)` or a `hook(...)` under `.baba/agents/`."
       }),
       pw.context && /* @__PURE__ */ jsx_runtime3.jsxs("p", {
         className: "bv-muted",
@@ -944,7 +950,7 @@ function Declared({ manifest }) {
       }),
       /* @__PURE__ */ jsx_runtime3.jsx("p", {
         className: "bv-muted",
-        children: "The promptware is the baba's code: edit it under .baba/promptware/; the files below follow."
+        children: "The agentic instructions is the baba's code: edit it under .baba/agents/; the files below follow."
       })
     ]
   });
@@ -982,11 +988,11 @@ function Harness({ manifest }) {
       /* @__PURE__ */ jsx_runtime3.jsxs("p", {
         className: "bv-muted",
         children: [
-          "Declared in .baba/index.ts: ",
+          "The .mdx files under .baba/agents/, each ",
           /* @__PURE__ */ jsx_runtime3.jsx("code", {
-            children: "baba({ systems, promptware, harness })"
+            children: 'export const prompt = { kind: "context" | "skill", … }'
           }),
-          "."
+          "; voss reads them on its own."
         ]
       })
     ]
@@ -994,19 +1000,7 @@ function Harness({ manifest }) {
 }
 
 // src/gui/levels.tsx
-var import_react5 = __toESM(require_react(), 1);
-
-// src/gui/theme.ts
-var themeKey = "babavoss.theme";
-var early = `try{var t=localStorage.getItem(${JSON.stringify(themeKey)});if(t==="light"||t==="dark")document.documentElement.dataset.theme=t}catch(e){}`;
-function theme() {
-  try {
-    const v = localStorage.getItem(themeKey);
-    if (v === "light" || v === "dark")
-      return v;
-  } catch {}
-  return "system";
-}
+var import_react7 = __toESM(require_react(), 1);
 
 // src/gui/wizard.tsx
 var import_react4 = __toESM(require_react(), 1);
@@ -1039,7 +1033,6 @@ var short = (path, home, max = 52) => {
   }
   return t;
 };
-var slug = (s2) => s2.toLowerCase().replace(/[^a-z0-9-]+/g, "-").replace(/^-+|-+$/g, "");
 var isTyping = (e) => e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement || e.target instanceof HTMLSelectElement;
 var Svg = ({ children, size = 16 }) => /* @__PURE__ */ jsx_runtime4.jsx("svg", {
   width: size,
@@ -1115,15 +1108,12 @@ function useInView(list, active) {
     list.current?.querySelector(`[data-i="${active}"]`)?.scrollIntoView({ block: "nearest" });
   }, [list, active]);
 }
-function Folders({ home, start, onBack, onOpened, onVerb }) {
+function Folders({ home, start, onBack, pick }) {
   const [at, setAt] = import_react4.useState(null);
   const [loading, setLoading] = import_react4.useState(true);
   const [error, setError] = import_react4.useState(null);
-  const [busy, setBusy] = import_react4.useState(null);
   const [filter, setFilter] = import_react4.useState("");
   const [active, setActive] = import_react4.useState(0);
-  const [name, setName] = import_react4.useState("");
-  const [title, setTitle] = import_react4.useState("");
   const list = import_react4.useRef(null);
   const filterRef = import_react4.useRef(null);
   const homeDir = at?.home || home;
@@ -1135,9 +1125,6 @@ function Folders({ home, start, onBack, onOpened, onVerb }) {
       setAt(b);
       setError(null);
       setFilter("");
-      setName("");
-      setTitle("");
-      onVerb?.(b.known ? "open" : b.baba ? "remember" : "make");
       if (!(document.activeElement instanceof HTMLInputElement) || document.activeElement === filterRef.current)
         filterRef.current?.focus();
       setActive(back >= 0 ? back + (b.parent ? 1 : 0) : 0);
@@ -1155,26 +1142,9 @@ function Folders({ home, start, onBack, onOpened, onVerb }) {
   ];
   const cur = Math.min(active, Math.max(0, rows.length - 1));
   useInView(list, cur);
-  const act = async () => {
-    if (!at || busy)
-      return;
-    if (at.known) {
-      const p = await getJson("/api/projects");
-      const own = p.projects.find((x) => x.dir === at.path);
-      if (own)
-        onOpened(own.name);
-      return;
-    }
-    const init = !at.baba;
-    setBusy(init ? "Making the baba and installing its packages…" : "Opening the baba…");
-    setError(null);
-    try {
-      const made = await postJson("/api/projects/add", { dir: at.path, init, ...name.trim() ? { name: name.trim() } : {}, ...title.trim() ? { title: title.trim() } : {} });
-      onOpened(made.name);
-    } catch (e) {
-      setError(String(e instanceof Error ? e.message : e));
-      setBusy(null);
-    }
+  const act = () => {
+    if (at && !at.known)
+      pick(at.path);
   };
   const enter = (i) => {
     const r = rows[i];
@@ -1183,7 +1153,7 @@ function Folders({ home, start, onBack, onOpened, onVerb }) {
   };
   import_react4.useEffect(() => {
     const key = (e) => {
-      if (busy || document.querySelector(".desktop-launcher"))
+      if (document.querySelector(".desktop-launcher"))
         return;
       const inField = isTyping(e) && e.target !== filterRef.current;
       if ((e.metaKey || e.ctrlKey) && e.key === "Enter") {
@@ -1236,7 +1206,6 @@ function Folders({ home, start, onBack, onOpened, onVerb }) {
   }, [at, homeDir]);
   const shown = crumbs.length > 5 ? [crumbs[0], { label: "…", path: crumbs[crumbs.length - 4].path }, ...crumbs.slice(-3)] : crumbs;
   const here = at ? short(at.path, homeDir, 44) : "";
-  const leaf = at ? at.path.split("/").filter(Boolean).pop() ?? "" : "";
   return /* @__PURE__ */ jsx_runtime4.jsxs("div", {
     className: "pk-pane pk-fade",
     children: [
@@ -1245,7 +1214,7 @@ function Folders({ home, start, onBack, onOpened, onVerb }) {
         children: [
           /* @__PURE__ */ jsx_runtime4.jsx("span", {
             className: "pk-strip-title",
-            children: "New baba"
+            children: "Choose a folder"
           }),
           /* @__PURE__ */ jsx_runtime4.jsx("span", {
             className: "pk-gap"
@@ -1437,21 +1406,17 @@ function Folders({ home, start, onBack, onOpened, onVerb }) {
                       title: at?.path,
                       children: here
                     }),
-                    ". Remember it to open it here."
+                    ". Add it to the list."
                   ]
                 }) : /* @__PURE__ */ jsx_runtime4.jsxs(jsx_runtime4.Fragment, {
                   children: [
-                    "A new baba goes in ",
+                    "There is no baba in ",
                     /* @__PURE__ */ jsx_runtime4.jsx("span", {
                       className: "pk-here",
                       title: at?.path,
                       children: here
                     }),
-                    ", as ",
-                    /* @__PURE__ */ jsx_runtime4.jsx("code", {
-                      children: ".baba/"
-                    }),
-                    " beside what is there."
+                    " yet: added, it is set up first."
                   ]
                 })
               })
@@ -1460,68 +1425,16 @@ function Folders({ home, start, onBack, onOpened, onVerb }) {
           /* @__PURE__ */ jsx_runtime4.jsxs("div", {
             className: "pk-dock-line",
             children: [
-              at && !at.baba && /* @__PURE__ */ jsx_runtime4.jsxs(jsx_runtime4.Fragment, {
-                children: [
-                  /* @__PURE__ */ jsx_runtime4.jsxs("label", {
-                    className: "pk-field",
-                    children: [
-                      /* @__PURE__ */ jsx_runtime4.jsx("span", {
-                        children: "Name"
-                      }),
-                      /* @__PURE__ */ jsx_runtime4.jsx("input", {
-                        value: name,
-                        placeholder: slug(leaf) || "baba",
-                        spellCheck: false,
-                        disabled: !!busy,
-                        onChange: (e) => setName(e.target.value),
-                        onKeyDown: (e) => {
-                          if (e.key === "Enter") {
-                            e.preventDefault();
-                            act();
-                          }
-                        }
-                      })
-                    ]
-                  }),
-                  /* @__PURE__ */ jsx_runtime4.jsxs("label", {
-                    className: "pk-field is-wide",
-                    children: [
-                      /* @__PURE__ */ jsx_runtime4.jsx("span", {
-                        children: "Title"
-                      }),
-                      /* @__PURE__ */ jsx_runtime4.jsx("input", {
-                        value: title,
-                        placeholder: name.trim() || slug(leaf) || "baba",
-                        disabled: !!busy,
-                        onChange: (e) => setTitle(e.target.value),
-                        onKeyDown: (e) => {
-                          if (e.key === "Enter") {
-                            e.preventDefault();
-                            act();
-                          }
-                        }
-                      })
-                    ]
-                  })
-                ]
-              }),
-              busy && /* @__PURE__ */ jsx_runtime4.jsxs("span", {
-                className: "pk-busy",
-                children: [
-                  /* @__PURE__ */ jsx_runtime4.jsx(Spinner, {}),
-                  busy
-                ]
-              }),
               /* @__PURE__ */ jsx_runtime4.jsx("span", {
                 className: "pk-gap"
               }),
               /* @__PURE__ */ jsx_runtime4.jsxs("button", {
                 type: "button",
                 className: "pk-primary",
-                disabled: !at || !!busy || loading,
-                onClick: () => void act(),
+                disabled: !at || loading || at.known,
+                onClick: act,
                 children: [
-                  !at ? "Make a baba here" : at.known ? "Open it" : at.baba ? "Remember this baba" : "Make a baba here",
+                  at?.known ? "Already in the list" : "Add this folder",
                   /* @__PURE__ */ jsx_runtime4.jsx("kbd", {
                     className: "pk-kbd is-on-primary",
                     children: "⌘↵"
@@ -1567,76 +1480,1448 @@ function Marked({ text, words }) {
   });
 }
 
-// src/gui/levels.tsx
+// src/gui/setup.tsx
+var import_react5 = __toESM(require_react(), 1);
+
+// src/baba/requirements.ts
+var PAGE_WORDS = new Set(["api", "assets", "view", "ws"]);
+var requirements = [
+  {
+    key: "name",
+    title: "Name",
+    summary: "The baba's address and its name at the shell: voss serves it at /NAME/, and the CLI reaches it as voss NAME from anywhere."
+  }
+];
+var NAME = /^[a-z][a-z0-9-]*$/;
+function requirementError(key, value, taken = []) {
+  if (key === "name") {
+    if (!value)
+      return "A baba needs a name.";
+    if (!NAME.test(value))
+      return "Lowercase letters, digits and dashes, starting with a letter.";
+    if (PAGE_WORDS.has(value))
+      return `/${value}/ is the page's own address; choose another.`;
+    if (taken.includes(value))
+      return `Another baba is already called ${value}.`;
+  }
+  return null;
+}
+var nameFrom = (dir) => (dir.split("/").filter(Boolean).pop() ?? "").toLowerCase().replace(/[^a-z0-9-]+/g, "-").replace(/^-+|-+$/g, "").replace(/^[^a-z]+/, "");
+
+// src/gui/setup.tsx
 var jsx_runtime5 = __toESM(require_jsx_runtime(), 1);
-function useProjects() {
-  const [state, setState] = import_react5.useState({ projects: null, home: "" });
+function SetupWizard({ entry, home, taken, onCancel, onDone }) {
+  const asks = requirements.filter((r) => entry.missing.includes(r.key));
+  const steps = [...asks.map((r) => ({ kind: "ask", r })), { kind: "done" }];
+  const [at, setAt] = import_react5.useState(0);
+  const [values, setValues] = import_react5.useState(() => ({ name: nameFrom(entry.dir) }));
+  const [busy, setBusy] = import_react5.useState(false);
+  const [error, setError] = import_react5.useState(null);
+  const field = import_react5.useRef(null), primary = import_react5.useRef(null);
+  const step = steps[at];
+  const why = (k) => requirementError(k, values[k] ?? "", taken);
+  const blocked = step.kind === "ask" && why(step.r.key) !== null;
   import_react5.useEffect(() => {
-    let live = true;
-    getJson("/api/projects").then((j) => {
-      if (live)
-        setState({ projects: j.projects, home: j.home ?? "" });
-    }, () => {
-      if (live)
-        setState({ projects: [], home: "" });
+    if (field.current) {
+      field.current.focus();
+      field.current.select();
+    } else
+      primary.current?.focus();
+  }, [at]);
+  const next = async () => {
+    if (busy || blocked)
+      return;
+    if (step.kind === "ask") {
+      setAt(at + 1);
+      return;
+    }
+    setBusy(true);
+    setError(null);
+    try {
+      const j = await postJson("/api/projects/setup", { dir: entry.dir, values });
+      if (j.name)
+        onDone(j.name);
+      else
+        throw new Error("voss kept it to set up: it still lacks something");
+    } catch (e) {
+      setError(String(e instanceof Error ? e.message : e));
+      setBusy(false);
+    }
+  };
+  const back = () => {
+    if (busy)
+      return;
+    if (at > 0)
+      setAt(at - 1);
+    else
+      onCancel();
+  };
+  import_react5.useEffect(() => {
+    const key = (e) => {
+      if (e.key === "Escape") {
+        e.preventDefault();
+        back();
+      }
+    };
+    addEventListener("keydown", key);
+    return () => removeEventListener("keydown", key);
+  });
+  const where = tilde(entry.dir, home);
+  return /* @__PURE__ */ jsx_runtime5.jsxs("form", {
+    className: "sw-card",
+    "aria-label": "Set up a baba",
+    onSubmit: (e) => {
+      e.preventDefault();
+      next();
+    },
+    children: [
+      /* @__PURE__ */ jsx_runtime5.jsxs("header", {
+        className: "sw-head",
+        children: [
+          /* @__PURE__ */ jsx_runtime5.jsx(Eyes, {
+            size: 28
+          }),
+          /* @__PURE__ */ jsx_runtime5.jsxs("div", {
+            className: "sw-head-text",
+            children: [
+              /* @__PURE__ */ jsx_runtime5.jsx("h1", {
+                children: "Set up a baba"
+              }),
+              /* @__PURE__ */ jsx_runtime5.jsx("p", {
+                title: entry.dir,
+                children: where
+              })
+            ]
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx_runtime5.jsx("ol", {
+        className: "sw-steps",
+        "aria-label": "Steps",
+        children: steps.map((s2, i) => /* @__PURE__ */ jsx_runtime5.jsxs("li", {
+          className: i === at ? "is-here" : i < at ? "is-done" : undefined,
+          "aria-current": i === at ? "step" : undefined,
+          children: [
+            /* @__PURE__ */ jsx_runtime5.jsx("span", {
+              className: "sw-step-dot",
+              children: i + 1
+            }),
+            s2.kind === "ask" ? s2.r.title : entry.baba ? "Save" : "Create"
+          ]
+        }, i))
+      }),
+      /* @__PURE__ */ jsx_runtime5.jsxs("div", {
+        className: "sw-body",
+        children: [
+          step.kind === "ask" ? /* @__PURE__ */ jsx_runtime5.jsxs(jsx_runtime5.Fragment, {
+            children: [
+              /* @__PURE__ */ jsx_runtime5.jsx("label", {
+                className: "sw-label",
+                htmlFor: "sw-field",
+                children: step.r.title
+              }),
+              /* @__PURE__ */ jsx_runtime5.jsx("p", {
+                className: "sw-summary",
+                children: step.r.summary
+              }),
+              /* @__PURE__ */ jsx_runtime5.jsx("input", {
+                id: "sw-field",
+                ref: field,
+                className: `sw-input${why(step.r.key) ? " is-wrong" : ""}`,
+                value: values[step.r.key] ?? "",
+                spellCheck: false,
+                autoComplete: "off",
+                disabled: busy,
+                onChange: (e) => setValues({ ...values, [step.r.key]: e.target.value.toLowerCase() })
+              }),
+              /* @__PURE__ */ jsx_runtime5.jsx("p", {
+                className: `sw-hint${why(step.r.key) ? " is-wrong" : ""}`,
+                children: why(step.r.key) ?? /* @__PURE__ */ jsx_runtime5.jsxs(jsx_runtime5.Fragment, {
+                  children: [
+                    "It opens at ",
+                    /* @__PURE__ */ jsx_runtime5.jsxs("code", {
+                      children: [
+                        "/",
+                        values[step.r.key],
+                        "/"
+                      ]
+                    }),
+                    "."
+                  ]
+                })
+              })
+            ]
+          }) : /* @__PURE__ */ jsx_runtime5.jsxs(jsx_runtime5.Fragment, {
+            children: [
+              /* @__PURE__ */ jsx_runtime5.jsx("p", {
+                className: "sw-summary",
+                children: entry.baba ? /* @__PURE__ */ jsx_runtime5.jsxs(jsx_runtime5.Fragment, {
+                  children: [
+                    "voss writes what it needs into ",
+                    /* @__PURE__ */ jsx_runtime5.jsx("code", {
+                      children: ".baba/package.json"
+                    }),
+                    " and leaves the rest of it as it is."
+                  ]
+                }) : /* @__PURE__ */ jsx_runtime5.jsxs(jsx_runtime5.Fragment, {
+                  children: [
+                    "voss makes a baba here: ",
+                    /* @__PURE__ */ jsx_runtime5.jsx("code", {
+                      children: ".baba/"
+                    }),
+                    " beside what the folder holds, with a first system and its spec, then installs its packages. It takes a moment."
+                  ]
+                })
+              }),
+              /* @__PURE__ */ jsx_runtime5.jsxs("dl", {
+                className: "sw-review",
+                children: [
+                  asks.map((r) => /* @__PURE__ */ jsx_runtime5.jsxs("div", {
+                    children: [
+                      /* @__PURE__ */ jsx_runtime5.jsx("dt", {
+                        children: r.title
+                      }),
+                      /* @__PURE__ */ jsx_runtime5.jsx("dd", {
+                        children: /* @__PURE__ */ jsx_runtime5.jsx("code", {
+                          children: values[r.key]
+                        })
+                      })
+                    ]
+                  }, r.key)),
+                  /* @__PURE__ */ jsx_runtime5.jsxs("div", {
+                    children: [
+                      /* @__PURE__ */ jsx_runtime5.jsx("dt", {
+                        children: "Folder"
+                      }),
+                      /* @__PURE__ */ jsx_runtime5.jsx("dd", {
+                        children: /* @__PURE__ */ jsx_runtime5.jsx("code", {
+                          title: entry.dir,
+                          children: where
+                        })
+                      })
+                    ]
+                  })
+                ]
+              })
+            ]
+          }),
+          error && /* @__PURE__ */ jsx_runtime5.jsx("p", {
+            className: "sw-error",
+            role: "alert",
+            children: error
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx_runtime5.jsxs("footer", {
+        className: "sw-foot",
+        children: [
+          /* @__PURE__ */ jsx_runtime5.jsx("button", {
+            type: "button",
+            className: "sw-button is-quiet",
+            disabled: busy,
+            onClick: back,
+            children: at > 0 ? "Back" : "Cancel"
+          }),
+          /* @__PURE__ */ jsx_runtime5.jsx("span", {
+            className: "sw-gap"
+          }),
+          busy && /* @__PURE__ */ jsx_runtime5.jsxs("span", {
+            className: "sw-busy",
+            children: [
+              /* @__PURE__ */ jsx_runtime5.jsx("span", {
+                className: "pk-spin",
+                "aria-hidden": "true"
+              }),
+              entry.baba ? "Saving…" : "Installing packages…"
+            ]
+          }),
+          /* @__PURE__ */ jsx_runtime5.jsx("button", {
+            ref: primary,
+            type: "submit",
+            className: "sw-button is-primary",
+            disabled: busy || blocked,
+            children: step.kind === "ask" ? "Continue" : entry.baba ? "Save and open" : "Create and open"
+          })
+        ]
+      })
+    ]
+  });
+}
+
+// src/gui/voss-settings.ts
+var import_react6 = __toESM(require_react(), 1);
+
+// src/gui/theme.ts
+var themeKey = "babavoss.theme";
+var early = `try{var t=localStorage.getItem(${JSON.stringify(themeKey)});if(t==="light"||t==="dark")document.documentElement.dataset.theme=t}catch(e){}`;
+var deskColors = { light: "#ECE4D8", dark: "#151312" };
+var firstPaint = `html{background:${deskColors.light};color-scheme:light dark}@media (prefers-color-scheme:dark){html:not([data-theme="light"]){background:${deskColors.dark}}}html[data-theme="dark"]{background:${deskColors.dark}}`;
+function setTheme(next) {
+  try {
+    if (next === "system")
+      localStorage.removeItem(themeKey);
+    else
+      localStorage.setItem(themeKey, next);
+  } catch {}
+  if (next === "system")
+    delete document.documentElement.dataset.theme;
+  else
+    document.documentElement.dataset.theme = next;
+}
+
+// src/gui/voss-settings.ts
+var current = null;
+var saves = 0;
+var listeners = new Set;
+var publish = (s2) => {
+  current = s2;
+  setTheme(s2.theme);
+  for (const l of listeners)
+    l();
+};
+async function fetchSettings() {
+  const at = saves;
+  try {
+    const r = await fetch("/api/settings", { headers: apiHeaders() });
+    if (r.ok) {
+      const s2 = await r.json();
+      if (at === saves)
+        publish(s2);
+    }
+  } catch {}
+}
+async function saveSettings(change) {
+  saves++;
+  const r = await fetch("/api/settings", { method: "POST", headers: { "content-type": "application/json", ...apiHeaders() }, body: JSON.stringify(change) });
+  const j = await r.json();
+  if (!r.ok || j.error)
+    throw new Error(j.error?.message ?? r.statusText);
+  publish(j);
+  return j;
+}
+var watching = 0;
+function useVossSettings() {
+  import_react6.useEffect(() => {
+    if (watching++ === 0) {
+      fetchSettings();
+      addEventListener("focus", onFront);
+      document.addEventListener("visibilitychange", onFront);
+    }
+    return () => {
+      if (--watching === 0) {
+        removeEventListener("focus", onFront);
+        document.removeEventListener("visibilitychange", onFront);
+      }
+    };
+  }, []);
+  return import_react6.useSyncExternalStore((l) => {
+    listeners.add(l);
+    return () => listeners.delete(l);
+  }, () => current);
+}
+var onFront = () => {
+  if (document.visibilityState === "visible")
+    fetchSettings();
+};
+
+// src/gui/lockup.ts
+var lockup = {
+  viewBox: "0 0 745 160",
+  tile: { x: 50, y: 30, width: 100, height: 100, rx: 50 },
+  symbol: { transform: "translate(50.00 30.00) scale(1.0000)", eyes: [{ cx: 39.772, cy: 50, r: 18 }, { cx: 77.5, cy: 50, r: 12.728 }] },
+  word: { transform: "translate(195.00 114.90)", d: "M8 0L8-69.80L32.30-69.80Q42.20-69.80 47.55-64.85Q52.90-59.90 52.90-51.40Q52.90-45.40 49.95-41.80Q47-38.20 41.60-36.60L41.60-36.10Q47.90-34.60 51.55-30.65Q55.20-26.70 55.20-19.50Q55.20-15.10 53.75-11.55Q52.30-8 49.65-5.40Q47-2.80 43.25-1.40Q39.50 0 34.80 0L8 0M20.80-9.50L30.80-9.50Q36.30-9.50 39.05-11.55Q41.80-13.60 41.80-18.60L41.80-21.90Q41.80-26.80 39.05-28.85Q36.30-30.90 30.80-30.90L20.80-30.90L20.80-9.50M20.80-40L29.10-40Q34.40-40 36.95-41.90Q39.50-43.80 39.50-48.50L39.50-51.80Q39.50-56.50 36.95-58.40Q34.40-60.30 29.10-60.30L20.80-60.30 M116.50 0L109 0Q104.30 0 101.75-2.35Q99.20-4.70 98.70-8.90L98.20-8.90Q96.80-4.10 92.70-1.45Q88.60 1.20 82.60 1.20Q74.80 1.20 70.20-2.90Q65.60-7 65.60-14.30Q65.60-29.90 88.50-29.90L97.60-29.90L97.60-33.30Q97.60-38.20 95.20-40.70Q92.80-43.20 87.40-43.20Q82.50-43.20 79.50-41.30Q76.50-39.40 74.40-36.40L67.10-42.60Q69.50-46.90 74.85-49.85Q80.20-52.80 88.70-52.80Q98.90-52.80 104.65-48.05Q110.40-43.30 110.40-33.90L110.40-9.60L116.50-9.60L116.50 0M86.90-7.60Q91.50-7.60 94.55-9.75Q97.60-11.90 97.60-15.60L97.60-22.50L88.80-22.50Q78.30-22.50 78.30-15.90L78.30-13.90Q78.30-10.80 80.60-9.20Q82.90-7.60 86.90-7.60 M126.90 0L126.90-74L139.70-74L139.70-42.50L140.40-42.50Q142.50-47.20 146.15-50Q149.80-52.80 155.80-52.80Q160.20-52.80 163.85-51.15Q167.50-49.50 170.10-46.15Q172.70-42.80 174.10-37.70Q175.50-32.60 175.50-25.80Q175.50-19 174.10-13.90Q172.70-8.80 170.10-5.45Q167.50-2.10 163.85-0.45Q160.20 1.20 155.80 1.20Q149.80 1.20 146.15-1.60Q142.50-4.40 140.40-9.10L139.70-9.10L139.70 0L126.90 0M150.40-9Q156-9 159.05-12.40Q162.10-15.80 162.10-21.70L162.10-29.90Q162.10-35.80 159.05-39.20Q156-42.60 150.40-42.60Q146-42.60 142.85-40.45Q139.70-38.30 139.70-33.90L139.70-17.70Q139.70-13.30 142.85-11.15Q146-9 150.40-9 M236.50 0L229 0Q224.30 0 221.75-2.35Q219.20-4.70 218.70-8.90L218.20-8.90Q216.80-4.10 212.70-1.45Q208.60 1.20 202.60 1.20Q194.80 1.20 190.20-2.90Q185.60-7 185.60-14.30Q185.60-29.90 208.50-29.90L217.60-29.90L217.60-33.30Q217.60-38.20 215.20-40.70Q212.80-43.20 207.40-43.20Q202.50-43.20 199.50-41.30Q196.50-39.40 194.40-36.40L187.10-42.60Q189.50-46.90 194.85-49.85Q200.20-52.80 208.70-52.80Q218.90-52.80 224.65-48.05Q230.40-43.30 230.40-33.90L230.40-9.60L236.50-9.60L236.50 0M206.90-7.60Q211.50-7.60 214.55-9.75Q217.60-11.90 217.60-15.60L217.60-22.50L208.80-22.50Q198.30-22.50 198.30-15.90L198.30-13.90Q198.30-10.80 200.60-9.20Q202.90-7.60 206.90-7.60 M299.20 0L280.80 0L261.70-69.80L276.10-69.80L284.80-34.50L289.90-12.50L290.60-12.50L295.80-34.50L304.60-69.80L318.30-69.80 M350 1.20Q344.10 1.20 339.45-0.70Q334.80-2.60 331.55-6.10Q328.30-9.60 326.55-14.60Q324.80-19.60 324.80-25.80Q324.80-32 326.55-37Q328.30-42 331.55-45.50Q334.80-49 339.45-50.90Q344.10-52.80 350-52.80Q355.80-52.80 360.50-50.90Q365.20-49 368.45-45.50Q371.70-42 373.45-37Q375.20-32 375.20-25.80Q375.20-19.60 373.45-14.60Q371.70-9.60 368.45-6.10Q365.20-2.60 360.50-0.70Q355.80 1.20 350 1.20M350-8.60Q355.50-8.60 358.70-11.95Q361.90-15.30 361.90-21.80L361.90-29.80Q361.90-36.30 358.70-39.65Q355.50-43 350-43Q344.50-43 341.30-39.65Q338.10-36.30 338.10-29.80L338.10-21.80Q338.10-15.30 341.30-11.95Q344.50-8.60 350-8.60 M409.80 1.20Q401.30 1.20 395.10-1.45Q388.90-4.10 385.40-8.60L392.90-15.40Q396.10-11.90 400.25-10Q404.40-8.10 409.90-8.10Q414.70-8.10 417.60-9.70Q420.50-11.30 420.50-14.60Q420.50-17.40 418.55-18.40Q416.60-19.40 413.40-19.90L405.10-21.20Q401.90-21.70 398.85-22.65Q395.80-23.60 393.45-25.30Q391.10-27 389.70-29.65Q388.30-32.30 388.30-36.10Q388.30-44.20 394.35-48.50Q400.40-52.80 411-52.80Q418.50-52.80 423.75-50.70Q429-48.60 432.40-44.80L425.70-37.40Q423.50-39.80 419.85-41.65Q416.20-43.50 410.60-43.50Q400.80-43.50 400.80-37.40Q400.80-34.60 402.80-33.55Q404.80-32.50 408-32L416.20-30.70Q419.50-30.20 422.55-29.25Q425.60-28.30 427.95-26.60Q430.30-24.90 431.70-22.30Q433.10-19.70 433.10-15.90Q433.10-7.90 426.95-3.35Q420.80 1.20 409.80 1.20 M469.80 1.20Q461.30 1.20 455.10-1.45Q448.90-4.10 445.40-8.60L452.90-15.40Q456.10-11.90 460.25-10Q464.40-8.10 469.90-8.10Q474.70-8.10 477.60-9.70Q480.50-11.30 480.50-14.60Q480.50-17.40 478.55-18.40Q476.60-19.40 473.40-19.90L465.10-21.20Q461.90-21.70 458.85-22.65Q455.80-23.60 453.45-25.30Q451.10-27 449.70-29.65Q448.30-32.30 448.30-36.10Q448.30-44.20 454.35-48.50Q460.40-52.80 471-52.80Q478.50-52.80 483.75-50.70Q489-48.60 492.40-44.80L485.70-37.40Q483.50-39.80 479.85-41.65Q476.20-43.50 470.60-43.50Q460.80-43.50 460.80-37.40Q460.80-34.60 462.80-33.55Q464.80-32.50 468-32L476.20-30.70Q479.50-30.20 482.55-29.25Q485.60-28.30 487.95-26.60Q490.30-24.90 491.70-22.30Q493.10-19.70 493.10-15.90Q493.10-7.90 486.95-3.35Q480.80 1.20 469.80 1.20" }
+};
+
+// src/gui/levels.tsx
+var jsx_runtime6 = __toESM(require_jsx_runtime(), 1);
+function useProjects() {
+  const [listed, setListed] = import_react7.useState(null);
+  const reload = async () => {
+    const j = await getJson("/api/projects");
+    const l = { projects: j.projects, pending: j.pending ?? [], home: j.home ?? "" };
+    setListed(l);
+    return l;
+  };
+  import_react7.useEffect(() => {
+    reload().catch(() => setListed({ projects: [], pending: [], home: "" }));
+  }, []);
+  return { listed, reload, set: setListed };
+}
+function pickerRows(projects, pending) {
+  const all = [
+    ...projects.map((p) => ({ kind: "baba", p, dir: p.dir ?? "", depth: 0 })),
+    ...pending.map((e) => ({ kind: "pending", e, dir: e.dir, depth: 0 }))
+  ];
+  const parentOf = (r) => r.kind === "baba" ? r.p.parent : r.e.parent;
+  const names = new Set(projects.map((p) => p.name));
+  const out = [];
+  const place = (r, depth) => {
+    out.push({ ...r, depth });
+    if (r.kind === "baba")
+      for (const c of all.filter((x) => parentOf(x) === r.p.name))
+        place(c, depth + 1);
+  };
+  for (const r of all) {
+    const up = parentOf(r);
+    if (!up || !names.has(up))
+      place(r, 0);
+  }
+  return out;
+}
+var href = (name) => `/${encodeURIComponent(name)}/`;
+var setupHref = (dir) => `/?setup=${encodeURIComponent(dir)}`;
+var setupAsked = () => new URLSearchParams(location.search).get("setup");
+function Root() {
+  const { listed, reload, set } = useProjects();
+  useVossSettings();
+  const [asked, setAsked] = import_react7.useState(setupAsked);
+  import_react7.useEffect(() => {
+    const back = () => setAsked(setupAsked());
+    addEventListener("popstate", back);
+    return () => removeEventListener("popstate", back);
+  }, []);
+  const go = (dir) => {
+    history.pushState(null, "", dir ? setupHref(dir) : "/");
+    setAsked(dir);
+  };
+  import_react7.useEffect(() => {
+    document.title = asked ? "Set up · voss" : "voss";
+  }, [asked]);
+  const ready = asked ? listed?.projects.find((p) => p.dir === asked) : undefined;
+  import_react7.useEffect(() => {
+    if (ready)
+      location.replace(href(ready.name));
+  }, [ready]);
+  if (!listed || ready)
+    return /* @__PURE__ */ jsx_runtime6.jsx("div", {
+      className: "gui-view rt"
     });
+  if (asked) {
+    const entry = listed.pending.find((e) => e.dir === asked);
+    return /* @__PURE__ */ jsx_runtime6.jsx("div", {
+      className: "gui-view rt rt-center",
+      children: entry && !entry.error ? /* @__PURE__ */ jsx_runtime6.jsx(SetupWizard, {
+        entry,
+        home: listed.home,
+        taken: listed.projects.map((p) => p.name),
+        onCancel: () => go(null),
+        onDone: (name) => location.assign(href(name))
+      }) : /* @__PURE__ */ jsx_runtime6.jsxs("div", {
+        className: "sw-card sw-gone",
+        children: [
+          /* @__PURE__ */ jsx_runtime6.jsx("p", {
+            children: entry?.error ? /* @__PURE__ */ jsx_runtime6.jsxs(jsx_runtime6.Fragment, {
+              children: [
+                "The baba in ",
+                /* @__PURE__ */ jsx_runtime6.jsx("code", {
+                  children: tilde(asked, listed.home)
+                }),
+                " did not open: ",
+                entry.error
+              ]
+            }) : /* @__PURE__ */ jsx_runtime6.jsxs(jsx_runtime6.Fragment, {
+              children: [
+                "voss does not remember ",
+                /* @__PURE__ */ jsx_runtime6.jsx("code", {
+                  children: tilde(asked, listed.home)
+                }),
+                "."
+              ]
+            })
+          }),
+          /* @__PURE__ */ jsx_runtime6.jsx("button", {
+            type: "button",
+            className: "sw-button",
+            onClick: () => go(null),
+            children: "Back to the babas"
+          })
+        ]
+      })
+    });
+  }
+  return /* @__PURE__ */ jsx_runtime6.jsx(Picker, {
+    listed,
+    reload,
+    set,
+    setup: go
+  });
+}
+function VossVersion() {
+  const [v, setV] = import_react7.useState(null);
+  import_react7.useEffect(() => {
+    getJson("/api/voss").then(setV, () => {});
+  }, []);
+  if (!v)
+    return null;
+  return /* @__PURE__ */ jsx_runtime6.jsxs("span", {
+    className: "rt-version",
+    title: v.sha ? `voss ${v.version}, ${v.sha.slice(0, 12)}` : `voss ${v.version}`,
+    children: [
+      /* @__PURE__ */ jsx_runtime6.jsxs("span", {
+        className: "rt-version-text",
+        children: [
+          "v",
+          v.version
+        ]
+      }),
+      v.dev && /* @__PURE__ */ jsx_runtime6.jsx("span", {
+        className: "rt-tag",
+        children: /* @__PURE__ */ jsx_runtime6.jsx("span", {
+          className: "rt-version-text",
+          children: "checkout"
+        })
+      })
+    ]
+  });
+}
+function Lockup() {
+  const t = lockup.tile, w = Number(lockup.viewBox.split(" ")[2]);
+  return /* @__PURE__ */ jsx_runtime6.jsxs("svg", {
+    className: "rt-lockup",
+    viewBox: `${t.x} ${t.y} ${w - 2 * t.x} ${t.height}`,
+    role: "img",
+    "aria-label": "Baba Voss",
+    children: [
+      /* @__PURE__ */ jsx_runtime6.jsxs("mask", {
+        id: "rt-lockup-eyes",
+        maskUnits: "userSpaceOnUse",
+        x: t.x,
+        y: t.y,
+        width: t.width,
+        height: t.height,
+        children: [
+          /* @__PURE__ */ jsx_runtime6.jsx("rect", {
+            x: t.x,
+            y: t.y,
+            width: t.width,
+            height: t.height,
+            fill: "#fff"
+          }),
+          /* @__PURE__ */ jsx_runtime6.jsx("g", {
+            transform: lockup.symbol.transform,
+            fill: "#000",
+            children: lockup.symbol.eyes.map((e, i) => /* @__PURE__ */ jsx_runtime6.jsx("circle", {
+              ...e
+            }, i))
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx_runtime6.jsx("rect", {
+        ...t,
+        fill: "currentColor",
+        mask: "url(#rt-lockup-eyes)"
+      }),
+      /* @__PURE__ */ jsx_runtime6.jsx("path", {
+        fill: "currentColor",
+        transform: lockup.word.transform,
+        d: lockup.word.d
+      })
+    ]
+  });
+}
+var Cross = () => /* @__PURE__ */ jsx_runtime6.jsx("svg", {
+  viewBox: "0 0 16 16",
+  width: "16",
+  height: "16",
+  "aria-hidden": "true",
+  children: /* @__PURE__ */ jsx_runtime6.jsx("path", {
+    d: "M4.5 4.5l7 7M11.5 4.5l-7 7",
+    stroke: "currentColor",
+    strokeWidth: "1.5",
+    strokeLinecap: "round"
+  })
+});
+var Glyph = ({ children }) => /* @__PURE__ */ jsx_runtime6.jsx("svg", {
+  width: "16",
+  height: "16",
+  viewBox: "0 0 16 16",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: "1.4",
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  "aria-hidden": "true",
+  children
+});
+var FolderGlyph2 = () => /* @__PURE__ */ jsx_runtime6.jsx(Glyph, {
+  children: /* @__PURE__ */ jsx_runtime6.jsx("path", {
+    d: "M2 4.5c0-.6.4-1 1-1h3l1.5 1.5H13c.6 0 1 .4 1 1V12c0 .6-.4 1-1 1H3c-.6 0-1-.4-1-1z"
+  })
+});
+var Plus = () => /* @__PURE__ */ jsx_runtime6.jsx("svg", {
+  viewBox: "0 0 16 16",
+  width: "16",
+  height: "16",
+  "aria-hidden": "true",
+  children: /* @__PURE__ */ jsx_runtime6.jsx("path", {
+    d: "M8 3.5v9M3.5 8h9",
+    stroke: "currentColor",
+    strokeWidth: "1.6",
+    strokeLinecap: "round"
+  })
+});
+var SetupGlyph = () => /* @__PURE__ */ jsx_runtime6.jsx(Glyph, {
+  children: /* @__PURE__ */ jsx_runtime6.jsx("circle", {
+    cx: "8",
+    cy: "8",
+    r: "5.5",
+    strokeDasharray: "2.2 2"
+  })
+});
+var WarnGlyph = () => /* @__PURE__ */ jsx_runtime6.jsxs(Glyph, {
+  children: [
+    /* @__PURE__ */ jsx_runtime6.jsx("path", {
+      d: "M8 2.5l6 10.5H2z"
+    }),
+    /* @__PURE__ */ jsx_runtime6.jsx("path", {
+      d: "M8 6.5v3M8 11.2v.1"
+    })
+  ]
+});
+var message = (e) => String(e instanceof Error ? e.message : e);
+function Picker({ listed, reload, set, setup }) {
+  const { home } = listed;
+  const rows = import_react7.useMemo(() => pickerRows(listed.projects, listed.pending), [listed]);
+  const [browsing, setBrowsing] = import_react7.useState(false);
+  const [error, setError] = import_react7.useState(null);
+  const [opened, setOpened] = import_react7.useState(null);
+  const [forgot, setForgot] = import_react7.useState(null);
+  import_react7.useEffect(() => {
+    if (!forgot)
+      return;
+    const t = setTimeout(() => setForgot(null), 6000);
+    return () => clearTimeout(t);
+  }, [forgot]);
+  const list = import_react7.useRef(null);
+  const answer = (j) => set({ projects: j.projects, pending: j.pending, home });
+  const add = async (dir) => {
+    setError(null);
+    try {
+      const j = await postJson("/api/projects/add", { dir });
+      answer(j);
+      setBrowsing(false);
+      const waiting = j.pending.find((e) => e.dir === j.dir);
+      if (waiting && !waiting.error)
+        setup(j.dir);
+      return true;
+    } catch (e) {
+      setError(message(e));
+      return false;
+    }
+  };
+  const forget = async (r) => {
+    setError(null);
+    try {
+      answer(await postJson("/api/projects/remove", { dir: r.dir }));
+      setForgot({ dir: r.dir, label: r.kind === "baba" ? r.p.title : tilde(r.dir, home) });
+    } catch (e) {
+      setError(message(e));
+      reload();
+    }
+  };
+  const undo = async () => {
+    const f = forgot;
+    setForgot(null);
+    if (f)
+      try {
+        answer(await postJson("/api/projects/add", { dir: f.dir }));
+      } catch (e) {
+        setError(message(e));
+      }
+  };
+  const open = (r) => {
+    if (r.kind === "baba")
+      location.assign(href(r.p.name));
+    else if (!r.e.error)
+      setup(r.dir);
+    else
+      setOpened(opened === r.dir ? null : r.dir);
+  };
+  const move = (e) => {
+    if (e.key !== "ArrowDown" && e.key !== "ArrowUp")
+      return;
+    const all = [...list.current?.querySelectorAll("[data-row]") ?? []];
+    const field = document.querySelector(".rt-add input");
+    if (field)
+      all.push(field);
+    const i = all.indexOf(document.activeElement);
+    if (i < 0)
+      return;
+    e.preventDefault();
+    all[(i + (e.key === "ArrowDown" ? 1 : -1) + all.length) % all.length]?.focus();
+  };
+  return /* @__PURE__ */ jsx_runtime6.jsxs("div", {
+    className: "gui-view rt",
+    onKeyDown: move,
+    children: [
+      /* @__PURE__ */ jsx_runtime6.jsxs("div", {
+        className: "rt-column",
+        children: [
+          /* @__PURE__ */ jsx_runtime6.jsxs("header", {
+            className: "rt-mark",
+            children: [
+              /* @__PURE__ */ jsx_runtime6.jsxs("h1", {
+                children: [
+                  /* @__PURE__ */ jsx_runtime6.jsx(Lockup, {}),
+                  /* @__PURE__ */ jsx_runtime6.jsx("span", {
+                    className: "rt-hidden",
+                    children: "voss"
+                  })
+                ]
+              }),
+              /* @__PURE__ */ jsx_runtime6.jsx(VossVersion, {})
+            ]
+          }),
+          browsing ? /* @__PURE__ */ jsx_runtime6.jsx("div", {
+            className: "rt-browse",
+            children: /* @__PURE__ */ jsx_runtime6.jsx(Folders, {
+              home,
+              pick: (dir) => void add(dir),
+              onBack: () => setBrowsing(false)
+            })
+          }) : /* @__PURE__ */ jsx_runtime6.jsxs(jsx_runtime6.Fragment, {
+            children: [
+              /* @__PURE__ */ jsx_runtime6.jsxs("ul", {
+                ref: list,
+                className: "rt-list",
+                "aria-label": "Babas",
+                children: [
+                  rows.map((r) => {
+                    const label = r.kind === "baba" ? r.p.title : r.dir.split("/").filter(Boolean).pop() || r.dir;
+                    const failed = r.kind === "pending" && !!r.e.error;
+                    return /* @__PURE__ */ jsx_runtime6.jsxs("li", {
+                      className: `rt-row${failed ? " is-failed" : ""}`,
+                      style: { "--depth": r.depth },
+                      children: [
+                        /* @__PURE__ */ jsx_runtime6.jsxs("button", {
+                          type: "button",
+                          "data-row": true,
+                          className: "rt-row-main",
+                          title: r.kind === "baba" ? `Open ${r.p.title}` : failed ? "Show why it did not open" : `Set up the baba in ${tilde(r.dir, home)}`,
+                          onClick: () => open(r),
+                          children: [
+                            /* @__PURE__ */ jsx_runtime6.jsx("span", {
+                              className: "rt-row-icon",
+                              children: r.kind === "baba" ? /* @__PURE__ */ jsx_runtime6.jsx(Eyes, {
+                                size: 16
+                              }) : failed ? /* @__PURE__ */ jsx_runtime6.jsx(WarnGlyph, {}) : /* @__PURE__ */ jsx_runtime6.jsx(SetupGlyph, {})
+                            }),
+                            /* @__PURE__ */ jsx_runtime6.jsx("span", {
+                              className: "rt-row-label",
+                              children: label
+                            }),
+                            r.kind === "pending" && /* @__PURE__ */ jsx_runtime6.jsx("span", {
+                              className: `rt-tag${failed ? " is-failed" : ""}`,
+                              children: failed ? "Did not open" : "Set up"
+                            }),
+                            /* @__PURE__ */ jsx_runtime6.jsx("span", {
+                              className: "rt-row-note",
+                              children: short(r.dir, home, 44)
+                            })
+                          ]
+                        }),
+                        /* @__PURE__ */ jsx_runtime6.jsx("button", {
+                          type: "button",
+                          className: "rt-row-forget",
+                          "aria-label": `Forget ${label}`,
+                          title: `Forget ${label}: voss stops running it; its files stay`,
+                          onClick: () => void forget(r),
+                          children: /* @__PURE__ */ jsx_runtime6.jsx(Cross, {})
+                        }),
+                        failed && opened === r.dir && r.kind === "pending" && /* @__PURE__ */ jsx_runtime6.jsx("p", {
+                          className: "rt-row-error",
+                          children: r.e.error
+                        })
+                      ]
+                    }, r.dir);
+                  }),
+                  !rows.length && /* @__PURE__ */ jsx_runtime6.jsx("li", {
+                    className: "rt-empty",
+                    children: "No babas yet. Add a folder to start one."
+                  })
+                ]
+              }),
+              /* @__PURE__ */ jsx_runtime6.jsx(AddField, {
+                home,
+                onAdd: add,
+                onBrowse: () => {
+                  setError(null);
+                  setBrowsing(true);
+                }
+              })
+            ]
+          }),
+          error && /* @__PURE__ */ jsx_runtime6.jsx("p", {
+            className: "rt-error",
+            role: "alert",
+            children: error
+          })
+        ]
+      }),
+      forgot && /* @__PURE__ */ jsx_runtime6.jsxs("div", {
+        className: "rt-toast",
+        role: "status",
+        children: [
+          "Forgot ",
+          forgot.label,
+          ". Its files stay.",
+          /* @__PURE__ */ jsx_runtime6.jsx("button", {
+            type: "button",
+            onClick: () => void undo(),
+            children: "Undo"
+          })
+        ]
+      })
+    ]
+  });
+}
+function AddField({ home, onAdd, onBrowse }) {
+  const [text, setText] = import_react7.useState("");
+  const [dirs, setDirs] = import_react7.useState([]);
+  const [at, setAt] = import_react7.useState(-1);
+  const [busy, setBusy] = import_react7.useState(false);
+  const expand = (t) => t === "~" ? home : t.startsWith("~/") ? home + t.slice(1) : t;
+  const full = expand(text.trim());
+  const cut = full.lastIndexOf("/");
+  const parent = cut < 0 ? "" : full.slice(0, cut) || "/", leaf = cut < 0 ? full : full.slice(cut + 1);
+  import_react7.useEffect(() => {
+    if (!parent.startsWith("/")) {
+      setDirs([]);
+      return;
+    }
+    let live = true;
+    const t = setTimeout(() => {
+      getJson(`/api/dirs?path=${encodeURIComponent(parent)}`).then((b) => {
+        if (live)
+          setDirs(b.dirs);
+      }, () => {
+        if (live)
+          setDirs([]);
+      });
+    }, 100);
     return () => {
       live = false;
+      clearTimeout(t);
     };
+  }, [parent]);
+  const shown = dirs.filter((d) => d.name.toLowerCase().startsWith(leaf.toLowerCase()) && d.path !== full).slice(0, 6);
+  const take = (d) => {
+    setText(`${tilde(d.path, home)}/`);
+    setAt(-1);
+  };
+  const submit = async () => {
+    const dir = full.replace(/\/+$/, "") || "/";
+    if (!dir.startsWith("/") || busy)
+      return;
+    setBusy(true);
+    if (await onAdd(dir))
+      setText("");
+    setBusy(false);
+  };
+  return /* @__PURE__ */ jsx_runtime6.jsxs("div", {
+    className: "rt-add",
+    children: [
+      /* @__PURE__ */ jsx_runtime6.jsxs("label", {
+        className: "rt-add-field",
+        children: [
+          /* @__PURE__ */ jsx_runtime6.jsx("span", {
+            className: "rt-row-icon",
+            children: /* @__PURE__ */ jsx_runtime6.jsx(FolderGlyph2, {})
+          }),
+          /* @__PURE__ */ jsx_runtime6.jsx("input", {
+            value: text,
+            placeholder: "Add a folder: type its path, ~/…",
+            spellCheck: false,
+            autoComplete: "off",
+            "aria-label": "Add a folder by its path",
+            disabled: busy,
+            onChange: (e) => {
+              setText(e.target.value);
+              setAt(-1);
+            },
+            onKeyDown: (e) => {
+              if (e.key === "Tab" && !e.shiftKey && shown.length && text.trim()) {
+                e.preventDefault();
+                take(shown[Math.max(0, at)]);
+              } else if ((e.key === "ArrowDown" || e.key === "ArrowUp") && shown.length && text.trim()) {
+                e.preventDefault();
+                e.stopPropagation();
+                const next = at + (e.key === "ArrowDown" ? 1 : -1);
+                setAt(next < -1 ? shown.length - 1 : next >= shown.length ? -1 : next);
+              } else if (e.key === "Enter") {
+                e.preventDefault();
+                if (at >= 0 && shown[at])
+                  take(shown[at]);
+                else
+                  submit();
+              } else if (e.key === "Escape" && text) {
+                e.preventDefault();
+                setText("");
+              }
+            }
+          }),
+          /* @__PURE__ */ jsx_runtime6.jsx("button", {
+            type: "button",
+            className: "rt-add-browse",
+            onClick: onBrowse,
+            children: "Browse"
+          }),
+          /* @__PURE__ */ jsx_runtime6.jsx("button", {
+            type: "button",
+            className: "rt-add-go",
+            "aria-label": busy ? "Adding the folder" : "Add the folder",
+            title: "Add the folder (↵)",
+            disabled: busy || !full.startsWith("/"),
+            onClick: () => void submit(),
+            children: busy ? /* @__PURE__ */ jsx_runtime6.jsx("span", {
+              className: "pk-spin",
+              "aria-hidden": "true"
+            }) : /* @__PURE__ */ jsx_runtime6.jsx(Plus, {})
+          })
+        ]
+      }),
+      shown.length > 0 && text.trim() && /* @__PURE__ */ jsx_runtime6.jsx("ul", {
+        className: "rt-suggest",
+        role: "listbox",
+        "aria-label": "Folders",
+        children: shown.map((d, i) => /* @__PURE__ */ jsx_runtime6.jsx("li", {
+          role: "option",
+          "aria-selected": i === at,
+          children: /* @__PURE__ */ jsx_runtime6.jsxs("button", {
+            type: "button",
+            className: i === at ? "is-active" : undefined,
+            onMouseDown: (e) => e.preventDefault(),
+            onClick: () => take(d),
+            children: [
+              /* @__PURE__ */ jsx_runtime6.jsx("span", {
+                className: "rt-row-icon",
+                children: d.baba ? /* @__PURE__ */ jsx_runtime6.jsx(Eyes, {
+                  size: 14
+                }) : /* @__PURE__ */ jsx_runtime6.jsx(FolderGlyph2, {})
+              }),
+              d.name,
+              d.known ? /* @__PURE__ */ jsx_runtime6.jsx("span", {
+                className: "rt-tag",
+                children: "in the list"
+              }) : d.baba ? /* @__PURE__ */ jsx_runtime6.jsx("span", {
+                className: "rt-tag",
+                children: "baba"
+              }) : null
+            ]
+          })
+        }, d.path))
+      })
+    ]
+  });
+}
+
+// src/gui/settings.tsx
+var import_react8 = __toESM(require_react(), 1);
+var jsx_runtime7 = __toESM(require_jsx_runtime(), 1);
+var pages = [
+  { level: "baba", path: "/", title: "Profile" },
+  { level: "voss", path: "/appearance", title: "Appearance" },
+  { level: "voss", path: "/keyboard", title: "Keyboard" },
+  { level: "voss", path: "/about", title: "About" }
+];
+var SettingsBaba = import_react8.createContext(undefined);
+function Settings({ path, navigate, setTitle }) {
+  const baba = import_react8.useContext(SettingsBaba);
+  const page = pages.find((p) => p.path === path) ?? pages[0];
+  import_react8.useEffect(() => {
+    setTitle("Settings");
   }, []);
-  return state;
+  const link = (p) => /* @__PURE__ */ jsx_runtime7.jsx("button", {
+    type: "button",
+    className: `gui-settings-link${p === page ? " is-active" : ""}`,
+    "aria-current": p === page ? "page" : undefined,
+    onClick: () => navigate(p.path),
+    children: p.title
+  }, p.path);
+  return /* @__PURE__ */ jsx_runtime7.jsxs("div", {
+    className: "gui-settings",
+    children: [
+      /* @__PURE__ */ jsx_runtime7.jsxs("nav", {
+        className: "gui-settings-nav",
+        "aria-label": "Settings",
+        children: [
+          /* @__PURE__ */ jsx_runtime7.jsx("h2", {
+            className: "gui-settings-level",
+            children: "Baba"
+          }),
+          pages.filter((p) => p.level === "baba").map(link),
+          /* @__PURE__ */ jsx_runtime7.jsx("h2", {
+            className: "gui-settings-level",
+            children: "voss"
+          }),
+          pages.filter((p) => p.level === "voss").map(link)
+        ]
+      }),
+      /* @__PURE__ */ jsx_runtime7.jsxs("section", {
+        className: "gui-settings-page",
+        "aria-labelledby": "gui-settings-title",
+        children: [
+          /* @__PURE__ */ jsx_runtime7.jsx("header", {
+            className: "gui-settings-head",
+            children: /* @__PURE__ */ jsx_runtime7.jsx("h1", {
+              id: "gui-settings-title",
+              children: page.title
+            })
+          }),
+          page.path === "/" ? /* @__PURE__ */ jsx_runtime7.jsx(Profile, {
+            baba
+          }) : page.path === "/appearance" ? /* @__PURE__ */ jsx_runtime7.jsx(Appearance, {}) : page.path === "/keyboard" ? /* @__PURE__ */ jsx_runtime7.jsx(Keyboard, {}) : /* @__PURE__ */ jsx_runtime7.jsx(About, {
+            baba
+          })
+        ]
+      })
+    ]
+  });
 }
-var href = (name) => `/${encodeURIComponent(name)}/`;
-var plus = [{ tag: "path", attrs: { d: "M5 12h14" } }, { tag: "path", attrs: { d: "M12 5v14" } }];
-var eyes = [{ tag: "circle", attrs: { cx: "8.1", cy: "12", r: "4.3" } }, { tag: "circle", attrs: { cx: "17.2", cy: "12", r: "3" } }];
-var NEW = "new";
-var babaKey = (name) => `baba:${name}`;
-function pickerApps(projects) {
-  const byName = new Map(projects.map((p) => [p.name, p]));
-  const rows = projects.map((p, i) => {
-    const parent = p.parent ? byName.get(p.parent) : undefined;
-    return { entity: 10 + i, key: babaKey(p.name), title: p.title, group: parent ? `In ${parent.title}` : "Babas", icon: "", many: false, order: i, drawing: eyes };
+function Setting({ title, summary, children }) {
+  return /* @__PURE__ */ jsx_runtime7.jsxs("div", {
+    className: "gui-setting",
+    children: [
+      /* @__PURE__ */ jsx_runtime7.jsxs("div", {
+        className: "gui-setting-text",
+        children: [
+          /* @__PURE__ */ jsx_runtime7.jsx("div", {
+            className: "gui-setting-title",
+            children: title
+          }),
+          summary && /* @__PURE__ */ jsx_runtime7.jsx("div", {
+            className: "gui-setting-summary",
+            children: summary
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx_runtime7.jsx("div", {
+        className: "gui-setting-control",
+        children
+      })
+    ]
   });
-  rows.push({ entity: 2, key: NEW, title: "New baba", group: "Make", icon: "plus", many: false, order: projects.length, drawing: plus });
-  return rows;
 }
-var wizard = { entity: 3, session: 1, app: 2, path: "/", title: "", memory: {} };
-function Root() {
-  const { projects, home } = useProjects();
-  const [open, setOpen] = import_react5.useState(false);
-  const apps = import_react5.useMemo(() => pickerApps(projects ?? []), [projects]);
-  const picture = {
-    session: { entity: 1, key: "main", selected: open ? wizard.entity : null, theme: "system" },
-    theme: theme(),
-    apps,
-    windows: open ? [wizard] : []
+var message2 = (e) => String(e instanceof Error ? e.message : e).replace(/^Error: /, "");
+function Appearance() {
+  const settings = useVossSettings();
+  const current2 = settings?.theme ?? "system";
+  const [error, setError] = import_react8.useState(null);
+  return /* @__PURE__ */ jsx_runtime7.jsx("div", {
+    className: "gui-settings-list",
+    children: /* @__PURE__ */ jsx_runtime7.jsx(Setting, {
+      title: "Theme",
+      summary: /* @__PURE__ */ jsx_runtime7.jsxs(jsx_runtime7.Fragment, {
+        children: [
+          "System follows this computer's light or dark appearance.",
+          error && /* @__PURE__ */ jsx_runtime7.jsx("span", {
+            className: "gui-setting-note is-error",
+            children: error
+          })
+        ]
+      }),
+      children: /* @__PURE__ */ jsx_runtime7.jsx("div", {
+        className: "gui-choices",
+        role: "radiogroup",
+        "aria-label": "Theme",
+        children: themes.map((t) => /* @__PURE__ */ jsx_runtime7.jsx(Button, {
+          variant: t === current2 ? "default" : "quiet",
+          role: "radio",
+          "aria-checked": t === current2,
+          disabled: !settings,
+          onClick: () => {
+            setError(null);
+            saveSettings({ theme: t }).catch((e) => setError(message2(e)));
+          },
+          children: t[0].toUpperCase() + t.slice(1)
+        }, t))
+      })
+    })
+  });
+}
+function Keyboard() {
+  const settings = useVossSettings();
+  const keymap = keymapOf(settings?.keys);
+  const remapped = Object.keys(settings?.keys ?? {}).length > 0;
+  const [error, setError] = import_react8.useState(null);
+  const change = (keys, id) => {
+    setError(null);
+    saveSettings({ keys }).catch((e) => setError({ id, message: message2(e) }));
   };
-  const hand = { fire: (name, args) => {
-    const a = args ?? {};
-    if (name === "desktop-open") {
-      if (a.app === NEW)
-        setOpen(true);
-      else if (a.app?.startsWith("baba:"))
-        location.assign(href(a.app.slice(5)));
-    } else if (name === "desktop-select")
-      setOpen(a.window === wizard.entity);
-    else if (name === "desktop-close")
-      setOpen(false);
-  } };
-  return /* @__PURE__ */ jsx_runtime5.jsx("div", {
-    className: "gui-view",
-    children: /* @__PURE__ */ jsx_runtime5.jsx(DesktopFrame, {
-      picture,
-      title: "voss",
-      hand,
-      render: () => /* @__PURE__ */ jsx_runtime5.jsx(Folders, {
-        home,
-        onBack: () => setOpen(false),
-        onOpened: (name) => location.assign(href(name))
+  return /* @__PURE__ */ jsx_runtime7.jsxs("div", {
+    className: "gui-settings-list",
+    children: [
+      keyCommands.map((c) => {
+        const binding = keymap[c.id], own = settings?.keys?.[c.id] !== undefined;
+        const note = error?.id === c.id ? error.message : binding && bindingNote(binding);
+        return /* @__PURE__ */ jsx_runtime7.jsxs(Setting, {
+          title: c.title,
+          summary: /* @__PURE__ */ jsx_runtime7.jsxs(jsx_runtime7.Fragment, {
+            children: [
+              c.summary,
+              note && /* @__PURE__ */ jsx_runtime7.jsx("span", {
+                className: `gui-setting-note${error?.id === c.id ? " is-error" : ""}`,
+                children: note
+              })
+            ]
+          }),
+          children: [
+            /* @__PURE__ */ jsx_runtime7.jsx(KeyRecorder, {
+              label: c.title,
+              binding,
+              onRecord: (b) => {
+                const other = keyCommands.find((o) => o.id !== c.id && keymap[o.id] === b);
+                if (other)
+                  setError({ id: c.id, message: `${formatBinding(b)} already runs ${other.title}.` });
+                else
+                  change({ [c.id]: b }, c.id);
+              },
+              onInvalid: (m) => setError({ id: c.id, message: m })
+            }),
+            /* @__PURE__ */ jsx_runtime7.jsx(Button, {
+              variant: "quiet",
+              className: own ? "" : "is-hidden",
+              disabled: !own,
+              title: c.default ? `Back to ${formatBinding(c.default)}` : "Back to no key",
+              onClick: () => change({ [c.id]: null }, c.id),
+              children: "Reset"
+            })
+          ]
+        }, c.id);
+      }),
+      /* @__PURE__ */ jsx_runtime7.jsxs("p", {
+        className: "gui-settings-foot bv-muted",
+        children: [
+          "Click a key, then press the new one; Escape cancels. The launcher's arrows, Enter and Escape are fixed.",
+          remapped && /* @__PURE__ */ jsx_runtime7.jsxs(jsx_runtime7.Fragment, {
+            children: [
+              " ",
+              /* @__PURE__ */ jsx_runtime7.jsx(Button, {
+                variant: "quiet",
+                onClick: () => change(Object.fromEntries(keyCommands.map((c) => [c.id, null])), null),
+                children: "Reset all"
+              })
+            ]
+          }),
+          error?.id === null && /* @__PURE__ */ jsx_runtime7.jsx("span", {
+            className: "gui-setting-note is-error",
+            children: error.message
+          })
+        ]
       })
+    ]
+  });
+}
+function Profile({ baba }) {
+  const [name, setName] = import_react8.useState(baba?.name ?? "");
+  const [taken, setTaken] = import_react8.useState([]);
+  const [busy, setBusy] = import_react8.useState(false);
+  const [error, setError] = import_react8.useState(null);
+  import_react8.useEffect(() => {
+    fetch("/api/projects", { headers: apiHeaders() }).then((r) => r.json()).then((j) => setTaken(j.projects.map((p) => p.name).filter((n) => n !== baba?.name)), () => {});
+  }, [baba?.name]);
+  if (!baba)
+    return /* @__PURE__ */ jsx_runtime7.jsx("p", {
+      className: "bv-muted",
+      children: "…"
+    });
+  const why = name === baba.name ? null : requirementError("name", name, taken);
+  const changed = name !== baba.name && !why;
+  const save = async () => {
+    if (!changed || busy)
+      return;
+    setBusy(true);
+    setError(null);
+    try {
+      const r = await fetch("/api/projects/rename", { method: "POST", headers: { "content-type": "application/json", ...apiHeaders() }, body: JSON.stringify({ name: baba.name, to: name }) });
+      const j = await r.json();
+      if (!r.ok || j.error || !j.name)
+        throw new Error(j.error?.message ?? "voss did not open it again");
+      location.assign(`/${encodeURIComponent(j.name)}/settings`);
+    } catch (e) {
+      setError(message2(e));
+      setBusy(false);
+    }
+  };
+  return /* @__PURE__ */ jsx_runtime7.jsx("form", {
+    className: "gui-settings-list",
+    onSubmit: (e) => {
+      e.preventDefault();
+      save();
+    },
+    children: /* @__PURE__ */ jsx_runtime7.jsxs(Setting, {
+      title: "Name",
+      summary: /* @__PURE__ */ jsx_runtime7.jsxs(jsx_runtime7.Fragment, {
+        children: [
+          "What voss calls this baba, at ",
+          /* @__PURE__ */ jsx_runtime7.jsxs("code", {
+            children: [
+              "/",
+              baba.name,
+              "/"
+            ]
+          }),
+          " and as ",
+          /* @__PURE__ */ jsx_runtime7.jsxs("code", {
+            children: [
+              "voss ",
+              baba.name
+            ]
+          }),
+          " on the CLI; not its folder's name, which stays as it is.",
+          why || error ? /* @__PURE__ */ jsx_runtime7.jsx("span", {
+            className: "gui-setting-note is-error",
+            children: why ?? error
+          }) : changed && /* @__PURE__ */ jsx_runtime7.jsxs("span", {
+            className: "gui-setting-note",
+            children: [
+              "Renamed, it moves to ",
+              /* @__PURE__ */ jsx_runtime7.jsxs("code", {
+                children: [
+                  "/",
+                  name,
+                  "/"
+                ]
+              }),
+              "; links to ",
+              /* @__PURE__ */ jsx_runtime7.jsxs("code", {
+                children: [
+                  "/",
+                  baba.name,
+                  "/"
+                ]
+              }),
+              " stop working."
+            ]
+          })
+        ]
+      }),
+      children: [
+        /* @__PURE__ */ jsx_runtime7.jsx("input", {
+          className: "gui-name",
+          value: name,
+          spellCheck: false,
+          autoComplete: "off",
+          "aria-label": "Name",
+          disabled: busy,
+          onChange: (e) => setName(e.target.value.toLowerCase())
+        }),
+        /* @__PURE__ */ jsx_runtime7.jsx(Button, {
+          variant: changed ? "primary" : "quiet",
+          type: "submit",
+          disabled: !changed || busy,
+          children: busy ? "Renaming…" : "Rename"
+        })
+      ]
+    })
+  });
+}
+function KeyRecorder({ label, binding, onRecord, onInvalid }) {
+  const [recording, setRecording] = import_react8.useState(false);
+  const ref = import_react8.useRef(null);
+  return /* @__PURE__ */ jsx_runtime7.jsx("button", {
+    ref,
+    type: "button",
+    className: `gui-key${recording ? " is-recording" : ""}`,
+    "aria-label": recording ? `Press the new key for ${label}` : `${label}: ${binding ? formatBinding(binding) : "no key"}, click to ${binding ? "change" : "set one"}`,
+    onClick: () => setRecording((r) => !r),
+    onBlur: () => setRecording(false),
+    onKeyDown: (e) => {
+      if (!recording)
+        return;
+      e.preventDefault();
+      e.stopPropagation();
+      if (e.key === "Escape" && !e.metaKey && !e.ctrlKey && !e.altKey && !e.shiftKey) {
+        setRecording(false);
+        return;
+      }
+      const pressed = bindingOf(e.nativeEvent);
+      if (!pressed)
+        return;
+      const b = normalBinding(pressed);
+      setRecording(false);
+      if (!b)
+        onInvalid(`${formatBinding(pressed)} is typing, not a command: hold ${isMac() ? "⌘, ⌥ or ⌃" : "Ctrl or Alt"} with it.`);
+      else if (b !== binding)
+        onRecord(b);
+    },
+    children: recording ? "Press keys…" : binding ? formatBinding(binding) : /* @__PURE__ */ jsx_runtime7.jsx("span", {
+      className: "gui-key-none",
+      children: "Not set"
     })
   });
 }
+var tilde2 = (path, home) => home && (path === home || path.startsWith(`${home}/`)) ? `~${path.slice(home.length)}` : path;
+function Fact({ name, value, copy, mono }) {
+  const [copied, setCopied] = import_react8.useState(false);
+  return /* @__PURE__ */ jsx_runtime7.jsxs("div", {
+    className: "gui-fact",
+    children: [
+      /* @__PURE__ */ jsx_runtime7.jsx("dt", {
+        children: name
+      }),
+      /* @__PURE__ */ jsx_runtime7.jsxs("dd", {
+        className: mono ? "is-mono" : undefined,
+        children: [
+          /* @__PURE__ */ jsx_runtime7.jsx("span", {
+            className: "gui-fact-value",
+            title: copy,
+            children: value
+          }),
+          copy && /* @__PURE__ */ jsx_runtime7.jsx("button", {
+            type: "button",
+            className: "gui-fact-copy",
+            "aria-label": `Copy ${name}`,
+            title: copied ? "Copied" : "Copy",
+            onClick: () => {
+              navigator.clipboard?.writeText(copy).then(() => {
+                setCopied(true);
+                setTimeout(() => setCopied(false), 1200);
+              });
+            },
+            children: copied ? "Copied" : "Copy"
+          })
+        ]
+      })
+    ]
+  });
+}
+function Facts({ title, rows }) {
+  return /* @__PURE__ */ jsx_runtime7.jsxs("section", {
+    className: "gui-facts",
+    children: [
+      /* @__PURE__ */ jsx_runtime7.jsx("h2", {
+        children: title
+      }),
+      /* @__PURE__ */ jsx_runtime7.jsx("dl", {
+        children: rows.filter((r) => !!r).map((r) => /* @__PURE__ */ jsx_runtime7.jsx(Fact, {
+          ...r
+        }, r.name))
+      })
+    ]
+  });
+}
+function About({ baba }) {
+  const [p, setP] = import_react8.useState(null);
+  const [failed, setFailed] = import_react8.useState(null);
+  const [copied, setCopied] = import_react8.useState(false);
+  import_react8.useEffect(() => {
+    let live = true;
+    fetch("/api/projects", { headers: apiHeaders() }).then(async (r) => {
+      if (!r.ok)
+        throw new Error(r.statusText);
+      return r.json();
+    }).then((x) => {
+      if (live)
+        setP(x);
+    }, (e) => {
+      if (live)
+        setFailed(String(e));
+    });
+    return () => {
+      live = false;
+    };
+  }, []);
+  if (failed)
+    return /* @__PURE__ */ jsx_runtime7.jsxs("p", {
+      className: "bv-error",
+      children: [
+        "voss did not answer: ",
+        failed
+      ]
+    });
+  if (!p)
+    return /* @__PURE__ */ jsx_runtime7.jsx("p", {
+      className: "bv-muted",
+      children: "…"
+    });
+  const { voss, home } = p, a = voss.about;
+  const here = baba && p.projects.find((x) => x.name === baba.name);
+  const path = (name, full) => ({ name, value: tilde2(full, home), copy: full, mono: true });
+  const m = baba?.manifest;
+  const sections = [
+    { title: "voss", rows: [
+      { name: "Version", value: /* @__PURE__ */ jsx_runtime7.jsxs(jsx_runtime7.Fragment, {
+        children: [
+          voss.version,
+          voss.dev && /* @__PURE__ */ jsx_runtime7.jsx("span", {
+            className: "gui-fact-tag",
+            children: "checkout"
+          }),
+          voss.stale && voss.installed && /* @__PURE__ */ jsx_runtime7.jsxs("span", {
+            className: "gui-fact-tag is-warn",
+            children: [
+              voss.installed.version,
+              " installed, restart to update"
+            ]
+          })
+        ]
+      }), copy: voss.version },
+      { name: "Commit", value: voss.sha ? voss.sha.slice(0, 12) : voss.dev ? "the working tree" : "not stamped", ...voss.sha ? { copy: voss.sha, mono: true } : {} },
+      voss.at && { name: "Packed", value: new Date(voss.at).toLocaleString() },
+      { name: "Address", value: location.origin, copy: location.origin, mono: true },
+      { name: "Process", value: `pid ${voss.pid}${a ? `, since ${new Date(a.started).toLocaleString()}` : ""}` },
+      { name: "Runs as", value: voss.kept ? "the user service" : "a command, until it stops" }
+    ] },
+    ...a ? [
+      { title: "Runtime", rows: [
+        { name: "Bun", value: a.runtime.bun, copy: a.runtime.bun },
+        { name: "Platform", value: `${a.runtime.platform} ${a.runtime.arch}` },
+        path("Executable", a.runtime.executable)
+      ] },
+      { title: "Installation", rows: [
+        path("Framework", a.framework),
+        a.cli && path("CLI", a.cli),
+        path("State", a.root),
+        path("Registry", a.registry),
+        path("Page token", a.token),
+        a.service && path("User service", a.service.file),
+        a.service && path("Service log", a.service.log)
+      ] }
+    ] : [],
+    ...baba ? [{ title: "This baba", rows: [
+      { name: "Name", value: baba.name, copy: baba.name, mono: true },
+      { name: "Title", value: baba.title },
+      here && path("Directory", here.dir),
+      here && path("Code", `${here.dir}/.baba`),
+      here?.parent && { name: "Inside", value: here.parent },
+      { name: "Generation", value: String(baba.gen) },
+      m && { name: "Contract", value: `${m.systems.length} systems, ${Object.keys(m.actions).length} actions, ${Object.keys(m.queries).length} queries, ${(m.apps ?? []).length} apps` },
+      baba.error && { name: "Load", value: /* @__PURE__ */ jsx_runtime7.jsx("span", {
+        className: "gui-fact-error",
+        children: baba.error
+      }) }
+    ] }] : []
+  ];
+  const report = sections.map((s2) => [`# ${s2.title}`, ...s2.rows.filter((r) => !!r).map((r) => `${r.name}: ${r.copy ?? (typeof r.value === "string" ? r.value : "")}`)].join(`
+`)).join(`
+
+`);
+  return /* @__PURE__ */ jsx_runtime7.jsxs("div", {
+    className: "gui-about",
+    children: [
+      sections.map((s2) => /* @__PURE__ */ jsx_runtime7.jsx(Facts, {
+        ...s2
+      }, s2.title)),
+      /* @__PURE__ */ jsx_runtime7.jsxs("p", {
+        className: "gui-settings-foot bv-muted",
+        children: [
+          /* @__PURE__ */ jsx_runtime7.jsx(Button, {
+            variant: "quiet",
+            onClick: () => {
+              navigator.clipboard?.writeText(report).then(() => {
+                setCopied(true);
+                setTimeout(() => setCopied(false), 1200);
+              });
+            },
+            children: copied ? "Copied" : "Copy all"
+          }),
+          "As plain text, for a bug report."
+        ]
+      })
+    ]
+  });
+}
 
 // src/kernel/names.ts
 var buildName = (b) => b.dev ? "source" : b.version || b.sha || "unstamped";
@@ -1649,7 +2934,7 @@ function tellApart(a, b) {
 }
 
 // src/gui/gui.tsx
-var jsx_runtime6 = __toESM(require_jsx_runtime(), 1);
+var jsx_runtime8 = __toESM(require_jsx_runtime(), 1);
 var scope = document.querySelector('meta[name="voss-scope"]')?.getAttribute("content") ?? "";
 async function describe(name, since, signal) {
   const r = await fetch(`/api/describe/${encodeURIComponent(name)}${since ? `?since=${since}` : ""}`, { signal, headers: apiHeaders() });
@@ -1659,9 +2944,9 @@ async function describe(name, since, signal) {
   return d;
 }
 function useDescribed(name) {
-  const [d, setD] = import_react6.useState(null);
-  const [failed, setFailed] = import_react6.useState(null);
-  import_react6.useEffect(() => {
+  const [d, setD] = import_react9.useState(null);
+  const [failed, setFailed] = import_react9.useState(null);
+  import_react9.useEffect(() => {
     const ctl = new AbortController;
     (async () => {
       let since = 0;
@@ -1686,9 +2971,9 @@ function useDescribed(name) {
 }
 var sleep = (ms) => new Promise((r) => setTimeout(r, ms));
 function Stale() {
-  const [b, setB] = import_react6.useState(null);
-  const [restarting, setRestarting] = import_react6.useState(false);
-  import_react6.useEffect(() => {
+  const [b, setB] = import_react9.useState(null);
+  const [restarting, setRestarting] = import_react9.useState(false);
+  import_react9.useEffect(() => {
     let live = true;
     const tick = async () => {
       try {
@@ -1732,27 +3017,27 @@ function Stale() {
     }
     setRestarting(false);
   };
-  return /* @__PURE__ */ jsx_runtime6.jsx("div", {
+  return /* @__PURE__ */ jsx_runtime8.jsx("div", {
     className: "gui-stale",
     role: "status",
-    children: restarting ? /* @__PURE__ */ jsx_runtime6.jsx("span", {
+    children: restarting ? /* @__PURE__ */ jsx_runtime8.jsx("span", {
       children: "Restarting voss…"
-    }) : /* @__PURE__ */ jsx_runtime6.jsxs(jsx_runtime6.Fragment, {
+    }) : /* @__PURE__ */ jsx_runtime8.jsxs(jsx_runtime8.Fragment, {
       children: [
-        /* @__PURE__ */ jsx_runtime6.jsxs("span", {
+        /* @__PURE__ */ jsx_runtime8.jsxs("span", {
           children: [
             "voss ",
-            /* @__PURE__ */ jsx_runtime6.jsx("b", {
+            /* @__PURE__ */ jsx_runtime8.jsx("b", {
               children: installed
             }),
             " is installed; this page runs on ",
-            /* @__PURE__ */ jsx_runtime6.jsx("b", {
+            /* @__PURE__ */ jsx_runtime8.jsx("b", {
               children: running
             }),
             ". Changes on disk wait for the restart."
           ]
         }),
-        /* @__PURE__ */ jsx_runtime6.jsx(Button, {
+        /* @__PURE__ */ jsx_runtime8.jsx(Button, {
           onClick: () => void restart(),
           children: "Restart to update"
         })
@@ -1765,8 +3050,8 @@ function Host() {
   const { d, failed } = useDescribed(scope);
   const parts = location.pathname.split("/").filter(Boolean);
   const to = d && parts.length === 2 && !(d.manifest?.apps ?? []).some((a) => a.key === parts[1]) ? moved[parts[1]] : undefined;
-  const [, moveOn] = import_react6.useState(0);
-  import_react6.useEffect(() => {
+  const [, moveOn] = import_react9.useState(0);
+  import_react9.useEffect(() => {
     if (to) {
       history.replaceState(null, "", `/${encodeURIComponent(scope)}/${to}${location.search}${location.hash}`);
       moveOn((n) => n + 1);
@@ -1775,17 +3060,24 @@ function Host() {
   if (to)
     return null;
   if (!d)
-    return /* @__PURE__ */ jsx_runtime6.jsx("div", {
+    return failed ? /* @__PURE__ */ jsx_runtime8.jsx("div", {
       className: "gui-page",
-      children: /* @__PURE__ */ jsx_runtime6.jsx("p", {
+      children: /* @__PURE__ */ jsx_runtime8.jsxs("p", {
         className: "bv-muted",
-        children: failed ? `${scope} did not answer: ${failed}` : "…"
+        children: [
+          scope,
+          " did not answer: ",
+          failed
+        ]
       })
+    }) : /* @__PURE__ */ jsx_runtime8.jsx("div", {
+      className: "gui-view",
+      children: /* @__PURE__ */ jsx_runtime8.jsx(DesktopSkeleton, {})
     });
   if (!d.manifest)
-    return /* @__PURE__ */ jsx_runtime6.jsx("div", {
+    return /* @__PURE__ */ jsx_runtime8.jsx("div", {
       className: "gui-page",
-      children: /* @__PURE__ */ jsx_runtime6.jsxs("p", {
+      children: /* @__PURE__ */ jsx_runtime8.jsxs("p", {
         className: "bv-error",
         children: [
           d.title,
@@ -1794,23 +3086,23 @@ function Host() {
         ]
       })
     });
-  return /* @__PURE__ */ jsx_runtime6.jsx(ShellPage, {
+  return /* @__PURE__ */ jsx_runtime8.jsx(ShellPage, {
     d
   });
 }
 function Failure({ f }) {
-  return /* @__PURE__ */ jsx_runtime6.jsxs("div", {
+  return /* @__PURE__ */ jsx_runtime8.jsxs("div", {
     className: "gui-notice",
     role: "alert",
     children: [
-      /* @__PURE__ */ jsx_runtime6.jsxs("strong", {
+      /* @__PURE__ */ jsx_runtime8.jsxs("strong", {
         children: [
           "The interface did not ",
           f.stage === "build" ? "build" : f.stage === "load" ? "load" : "render",
           "."
         ]
       }),
-      /* @__PURE__ */ jsx_runtime6.jsx("pre", {
+      /* @__PURE__ */ jsx_runtime8.jsx("pre", {
         className: "gui-failure",
         children: formatFailure(f)
       })
@@ -1838,9 +3130,9 @@ async function loadView(name, v) {
 }
 function useInterface(d) {
   const v = d.view && !d.view.error ? d.view.v : undefined;
-  const [view, setView] = import_react6.useState(() => v !== undefined ? loaded.get(v) ?? null : null);
-  const [failure, setFailure] = import_react6.useState(null);
-  import_react6.useEffect(() => {
+  const [view, setView] = import_react9.useState(() => v !== undefined ? loaded.get(v) ?? null : null);
+  const [failure, setFailure] = import_react9.useState(null);
+  import_react9.useEffect(() => {
     if (v === undefined)
       return;
     let live = true;
@@ -1857,7 +3149,7 @@ function useInterface(d) {
       live = false;
     };
   }, [d.name, v]);
-  import_react6.useEffect(() => {
+  import_react9.useEffect(() => {
     if (!view)
       return;
     const links = view.css.map((href2) => {
@@ -1876,51 +3168,49 @@ function useInterface(d) {
 }
 var useShellSystem = (apps) => {
   const key = JSON.stringify(apps ?? []);
-  return import_react6.useMemo(() => desktop({ apps: apps ?? [] }), [key]);
+  return import_react9.useMemo(() => desktop({ apps: apps ?? [] }), [key]);
 };
 function ShellPage({ d }) {
   const { view, failure } = useInterface(d);
   const system2 = useShellSystem(d.manifest?.apps);
+  const person = useVossSettings();
   const manifest = d.manifest;
-  const components = import_react6.useMemo(() => {
-    const pending = () => failure ? /* @__PURE__ */ jsx_runtime6.jsx(Failure, {
+  const components = import_react9.useMemo(() => {
+    const pending = () => failure ? /* @__PURE__ */ jsx_runtime8.jsx(Failure, {
       f: failure
-    }) : /* @__PURE__ */ jsx_runtime6.jsx("p", {
-      className: "desktop-empty bv-muted",
-      children: "…"
-    });
+    }) : null;
     const out = {
-      maker: ({ path, navigate, setTitle }) => /* @__PURE__ */ jsx_runtime6.jsx(Maker, {
+      maker: ({ path, navigate, setTitle }) => /* @__PURE__ */ jsx_runtime8.jsx(Maker, {
         specs: [],
         title: d.title,
         path,
         navigate,
         setTitle
       }),
-      state: () => /* @__PURE__ */ jsx_runtime6.jsxs("section", {
+      state: () => /* @__PURE__ */ jsx_runtime8.jsxs("section", {
         className: "gui-app",
         children: [
-          d.error && /* @__PURE__ */ jsx_runtime6.jsxs("p", {
+          d.error && /* @__PURE__ */ jsx_runtime8.jsxs("p", {
             className: "bv-error",
             children: [
               "The code did not load; the last generation serves: ",
               d.error
             ]
           }),
-          /* @__PURE__ */ jsx_runtime6.jsx(Inspector, {
+          /* @__PURE__ */ jsx_runtime8.jsx(Inspector, {
             manifest
           })
         ]
       }),
-      contract: () => /* @__PURE__ */ jsx_runtime6.jsx("section", {
+      contract: () => /* @__PURE__ */ jsx_runtime8.jsx("section", {
         className: "gui-app",
-        children: /* @__PURE__ */ jsx_runtime6.jsx(Runner, {
+        children: /* @__PURE__ */ jsx_runtime8.jsx(Runner, {
           manifest
         })
       }),
-      promptware: () => /* @__PURE__ */ jsx_runtime6.jsx("section", {
+      instructions: () => /* @__PURE__ */ jsx_runtime8.jsx("section", {
         className: "gui-app",
-        children: /* @__PURE__ */ jsx_runtime6.jsx(Promptware, {
+        children: /* @__PURE__ */ jsx_runtime8.jsx(Instructions, {
           manifest
         })
       }),
@@ -1929,7 +3219,7 @@ function ShellPage({ d }) {
     for (const sc of manifest.apps ?? []) {
       if (sc.key in out)
         continue;
-      out[sc.key] = sc.key === "view" && !view?.apps[sc.key] ? view?.View ? view.View : !d.view ? () => /* @__PURE__ */ jsx_runtime6.jsx("p", {
+      out[sc.key] = sc.key === "view" && !view?.apps[sc.key] ? view?.View ? view.View : !d.view ? () => /* @__PURE__ */ jsx_runtime8.jsx("p", {
         className: "desktop-empty bv-muted",
         children: "This baba has no interface.tsx yet: its apps are voss's."
       }) : pending : pending;
@@ -1938,65 +3228,36 @@ function ShellPage({ d }) {
       out[k] = v;
     return out;
   }, [view, failure, system2, manifest, d.error, d.view, d.title]);
-  return /* @__PURE__ */ jsx_runtime6.jsx("div", {
+  return /* @__PURE__ */ jsx_runtime8.jsx("div", {
     className: "gui-view",
-    children: /* @__PURE__ */ jsx_runtime6.jsx(ViewBoundary, {
-      fallback: (f) => /* @__PURE__ */ jsx_runtime6.jsx("div", {
+    children: /* @__PURE__ */ jsx_runtime8.jsx(ViewBoundary, {
+      reset: view,
+      fallback: (f) => /* @__PURE__ */ jsx_runtime8.jsx("div", {
         className: "gui-page",
-        children: /* @__PURE__ */ jsx_runtime6.jsx(Failure, {
+        children: /* @__PURE__ */ jsx_runtime8.jsx(Failure, {
           f
         })
       }),
-      children: /* @__PURE__ */ jsx_runtime6.jsx(Desktop, {
-        system: system2,
-        apps: components,
-        title: d.title,
-        root: { label: "voss", href: "/" }
-      })
-    })
-  }, view ? "loaded" : "loading");
-}
-function Settings() {
-  const system2 = import_react6.useMemo(() => desktop({}), []);
-  const current = useResource(system2.desktopSettings)?.theme ?? "system";
-  const { fire } = useBaba();
-  return /* @__PURE__ */ jsx_runtime6.jsxs("section", {
-    className: "gui-app",
-    children: [
-      /* @__PURE__ */ jsx_runtime6.jsx("h2", {
-        children: "Theme"
-      }),
-      /* @__PURE__ */ jsx_runtime6.jsx("p", {
-        className: "bv-muted",
-        children: "The theme every page of this baba shows, kept in its state."
-      }),
-      /* @__PURE__ */ jsx_runtime6.jsx("div", {
-        className: "gui-choices",
-        role: "radiogroup",
-        "aria-label": "Theme",
-        children: themes.map((t) => /* @__PURE__ */ jsx_runtime6.jsx(Button, {
-          variant: t === current ? "default" : "quiet",
-          role: "radio",
-          "aria-checked": t === current,
-          onClick: () => void fire("desktop-settings", { theme: t }),
-          children: t
-        }, t))
-      }),
-      /* @__PURE__ */ jsx_runtime6.jsx("h2", {
-        children: "voss"
-      }),
-      /* @__PURE__ */ jsx_runtime6.jsx("p", {
-        children: /* @__PURE__ */ jsx_runtime6.jsx("a", {
-          href: "/",
-          children: "All babas"
+      children: /* @__PURE__ */ jsx_runtime8.jsx(SettingsBaba.Provider, {
+        value: d,
+        children: /* @__PURE__ */ jsx_runtime8.jsx(Desktop, {
+          system: system2,
+          apps: components,
+          title: d.title,
+          root: { label: "voss", href: "/" },
+          settings: person
         })
       })
-    ]
+    })
   });
 }
 
-class ViewBoundary extends import_react6.Component {
+class ViewBoundary extends import_react9.Component {
   state = { failure: null };
+  componentDidUpdate(before) {
+    if (before.reset !== this.props.reset && this.state.failure)
+      this.setState({ failure: null });
+  }
   static getDerivedStateFromError(err) {
     return { failure: { stage: "render", message: err instanceof Error ? err.message : String(err), detail: err instanceof Error ? err.stack : undefined } };
   }
@@ -2004,12 +3265,12 @@ class ViewBoundary extends import_react6.Component {
     return this.state.failure ? this.props.fallback(this.state.failure) : this.props.children;
   }
 }
-import_client.createRoot(document.getElementById("root")).render(/* @__PURE__ */ jsx_runtime6.jsxs(import_react6.StrictMode, {
+import_client.createRoot(document.getElementById("root")).render(/* @__PURE__ */ jsx_runtime8.jsxs(import_react9.StrictMode, {
   children: [
-    scope ? /* @__PURE__ */ jsx_runtime6.jsx(ScopeProvider, {
+    scope ? /* @__PURE__ */ jsx_runtime8.jsx(ScopeProvider, {
       value: scope,
-      children: /* @__PURE__ */ jsx_runtime6.jsx(Host, {})
-    }) : /* @__PURE__ */ jsx_runtime6.jsx(Root, {}),
-    /* @__PURE__ */ jsx_runtime6.jsx(Stale, {})
+      children: /* @__PURE__ */ jsx_runtime8.jsx(Host, {})
+    }) : /* @__PURE__ */ jsx_runtime8.jsx(Root, {}),
+    /* @__PURE__ */ jsx_runtime8.jsx(Stale, {})
   ]
 }));