@oddessentials/agent-guild 0.28.1 → 0.30.0

package/README.md

@@ -160,8 +160,10 @@ vX.Y.Z** switches over when you are ready. The version badge opens
 
 **Keep notes at hand.** **Notes** in the top bar opens a notepad for prompts,
 commands and to-dos in the side panel, next to your terminals. It saves up to
-100,000 characters as you type and keeps them in this browser, never on the
-manager; every tab of the page shows the same notes.
+100,000 characters as you type. The same notes follow every browser signed in
+to this manager, including one opened through remote access. This browser
+keeps a copy too: if the manager is unreachable, the line under the title
+says the notes are saved in this browser only, and they sync when it is back.
 
 **GitHub beside your work.** **GitHub** in the top bar opens the side panel.
 Sign in to one or more GitHub accounts, then search the repositories of all

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oddessentials/agent-guild",
-  "version": "0.28.1",
+  "version": "0.30.0",
   "description": "Launch and watch AI coding-assistant terminal sessions from one local web page. A bundled session manager owns the terminals so the page can close and reconnect.",
   "license": "MIT",
   "repository": {

package/src/manager/config.mjs

@@ -45,6 +45,8 @@ export const paths = {
   get accounts() { return path.join(dataDir(), 'accounts'); },
   get github() { return path.join(dataDir(), 'github'); },
   get remoteAccess() { return path.join(dataDir(), 'remote-access.json'); },
+  /** The shared notepad. A missing file means it was never stored. */
+  get notes() { return path.join(dataDir(), 'notes.json'); },
   get log() { return path.join(dataDir(), 'manager.log'); },
   /** Launchers for agent-guild-report, put first on every session's PATH. */
   get shims() { return path.join(dataDir(), 'bin'); },

package/src/manager/folder-browser.mjs

@@ -16,6 +16,20 @@ export function folderSegments(dir, paths = path) {
   return segments;
 }
 
+const WINDOWS_RESERVED = /^(con|prn|aux|nul|com[1-9¹²³]|lpt[1-9¹²³])(\..*)?$/i;
+
+export function folderNameProblem(name, platform = process.platform) {
+  if (!name) return 'Enter a folder name.';
+  if (name === '.' || name === '..') return 'Choose a different folder name.';
+  if (/[/\\]/.test(name)) return 'A folder name cannot contain / or \\.';
+  if (/[\u0000-\u001f]/.test(name)) return 'A folder name cannot contain control characters.';
+  if (platform !== 'win32') return null;
+  if (/[<>:"|?*]/.test(name)) return 'A folder name cannot contain < > : " | ? or *.';
+  if (/[. ]$/.test(name)) return 'A folder name cannot end with a dot or a space.';
+  if (WINDOWS_RESERVED.test(name)) return `Windows reserves the name ${name}.`;
+  return null;
+}
+
 export function createFolderBrowser({ platform = process.platform, home = os.homedir(), limit = 2000, driveTimeoutMs = 500, fsp = fs.promises } = {}) {
   const paths = platform === 'win32' ? path.win32 : path.posix;
 
@@ -59,7 +73,30 @@ export function createFolderBrowser({ platform = process.platform, home = os.hom
     return folders.filter(Boolean).sort(byName);
   }
 
-  return {
+  const browser = {
+    async create(rawParent, rawName) {
+      if (typeof rawParent !== 'string' || !rawParent.trim() || rawParent.includes('\0')) throw failure(400, 'bad_path', 'The folder must be a path.');
+      const name = typeof rawName === 'string' ? rawName.trim() : '';
+      const problem = folderNameProblem(name, platform);
+      if (problem) throw failure(400, 'bad_name', problem);
+      const parent = paths.resolve(rawParent.trim());
+      const missing = () => failure(409, 'folder_missing', `${parent} no longer exists.`);
+      try {
+        if (!(await fsp.stat(parent)).isDirectory()) throw missing();
+      } catch (error) {
+        if (error.status) throw error;
+        throw error.code === 'ENOENT' || error.code === 'ENOTDIR' ? missing() : failure(409, 'folder_unreadable', `Agent Guild cannot read ${parent}.`);
+      }
+      const dir = paths.join(parent, name);
+      try {
+        await fsp.mkdir(dir);
+      } catch (error) {
+        if (error.code === 'EEXIST') throw failure(409, 'folder_exists', `${name} already exists in ${parent}.`);
+        if (error.code === 'ENOENT') throw missing();
+        throw failure(409, 'folder_unwritable', `Agent Guild cannot create ${dir}.`);
+      }
+      return browser.list(dir);
+    },
     async list(raw) {
       if (raw !== undefined && raw !== null && (typeof raw !== 'string' || raw.includes('\0'))) {
         throw failure(400, 'bad_path', 'The folder must be a path.');
@@ -82,4 +119,5 @@ export function createFolderBrowser({ platform = process.platform, home = os.hom
       };
     },
   };
+  return browser;
 }

package/src/manager/main.mjs

@@ -13,6 +13,7 @@ import { NewsFeed } from './news.mjs';
 import { Changelog } from './changelog.mjs';
 import { GitHub } from './github.mjs';
 import { createManagerServer } from './server.mjs';
+import { createNotesStore } from './notes.mjs';
 import { RemoteAccess, loadRemoteAccess } from './remote-access.mjs';
 import { SelfUpdate } from './self-update.mjs';
 import { resolveBaseEnv, pathReader } from './shell-env.mjs';
@@ -138,6 +139,7 @@ export async function startManager({ port = resolvePort(), host = DEFAULT_HOST,
     extraHosts: remoteSettings.config.access.hosts,
     extraOrigins: remoteSettings.config.access.origins,
     remoteAccess,
+    notes: createNotesStore(paths.notes),
     launcher: launcherPath(),
     onShutdownRequest: ({ restart = false } = {}) => shutdown('requested via API', { restart }).then(() => process.exit(0)),
   });

package/src/manager/notes.mjs

@@ -0,0 +1,120 @@
+// One notepad for every browser signed in to this manager.
+// A missing file means notes were never stored. An empty string is a notepad
+// the user cleared; those two must stay distinct so an old browser cannot
+// put cleared notes back.
+
+import fs from 'node:fs';
+import path from 'node:path';
+import { randomUUID } from 'node:crypto';
+
+export const NOTES_LIMIT = 100000;
+/** Larger than the API's usual 64 KiB body, and enough for a full notepad after JSON escaping. */
+export const NOTES_BODY_LIMIT = 1024 * 1024;
+const NOTES_FILE_LIMIT = 2 * 1024 * 1024;
+
+function notesError(code, message, status, notes) {
+  // The store reports an unreadable file once, so the server does not log every request that hits it.
+  const error = Object.assign(new Error(message), { code, status, logged: code === 'notes_unreadable' });
+  if (notes) error.notes = notes;
+  return error;
+}
+
+/** @returns {{ revision: string, text: string } | null} null when the file is not there yet */
+function readNotes(file) {
+  let stat;
+  try { stat = fs.statSync(file); } catch (error) {
+    if (error.code === 'ENOENT') return null;
+    throw notesError('notes_unreadable', 'Notes could not be read.', 500);
+  }
+  if (!stat.isFile() || stat.size > NOTES_FILE_LIMIT) throw notesError('notes_unreadable', 'Notes could not be read.', 500);
+  let value;
+  try { value = JSON.parse(fs.readFileSync(file, 'utf8')); } catch {
+    throw notesError('notes_unreadable', 'Notes could not be read.', 500);
+  }
+  if (!value || value.version !== 1 || typeof value.revision !== 'string' || !value.revision || value.revision.length > 100
+    || typeof value.text !== 'string' || value.text.length > NOTES_LIMIT) {
+    throw notesError('notes_unreadable', 'Notes could not be read.', 500);
+  }
+  return { revision: value.revision, text: value.text };
+}
+
+function writeNotes(file, notes) {
+  const contents = `${JSON.stringify({ version: 1, revision: notes.revision, text: notes.text }, null, 2)}\n`;
+  fs.mkdirSync(path.dirname(file), { recursive: true, mode: 0o700 });
+  const next = `${file}.${randomUUID()}.tmp`;
+  let descriptor;
+  try {
+    descriptor = fs.openSync(next, 'wx', 0o600);
+    fs.writeFileSync(descriptor, contents);
+    fs.fsyncSync(descriptor);
+    fs.closeSync(descriptor);
+    descriptor = undefined;
+    fs.renameSync(next, file);
+  } finally {
+    if (descriptor !== undefined) fs.closeSync(descriptor);
+    try { fs.unlinkSync(next); } catch { /* renamed, or never created */ }
+  }
+  try { fs.chmodSync(file, 0o600); } catch { /* not supported on Windows */ }
+}
+
+/**
+ * @param {string} [file] omit for an in-memory store (tests). The real manager passes its notes file.
+ * @param {{ warn?: (message: string) => void }} [options] where the one line about an unreadable file goes
+ */
+export function createNotesStore(file, { warn = (message) => console.warn(message) } = {}) {
+  let current = { revision: null, text: '' };
+  let loaded = !file;
+  let warned = false;
+
+  /** An unreadable file is read again next time, so fixing or removing it needs no restart. */
+  function ensure() {
+    if (loaded) return;
+    let read;
+    try { read = readNotes(file); } catch (error) {
+      if (!warned) warn(`[notes] ${file} cannot be read, so notes are not shared until it is fixed or removed.`);
+      warned = true;
+      throw error;
+    }
+    warned = false;
+    current = read ?? { revision: null, text: '' };
+    loaded = true;
+  }
+
+  function snapshot() {
+    ensure();
+    return { revision: current.revision, text: current.text };
+  }
+
+  function save(body) {
+    ensure();
+    if (!body || typeof body.text !== 'string') throw notesError('bad_notes', 'Notes must be text.', 400);
+    if (body.text.length > NOTES_LIMIT) {
+      throw notesError('notes_too_long', `Notes hold up to ${NOTES_LIMIT.toLocaleString('en-US')} characters.`, 400);
+    }
+    const revision = body.revision ?? null;
+    if (revision !== null && (typeof revision !== 'string' || !revision || revision.length > 100)) {
+      throw notesError('bad_notes', 'Notes must be text.', 400);
+    }
+    if (revision !== current.revision) {
+      throw notesError('stale_notes', 'Notes changed in another browser.', 409, { revision: current.revision, text: current.text });
+    }
+    const next = { revision: randomUUID(), text: body.text };
+    if (file) writeNotes(file, next);
+    current = next;
+    loaded = true;
+    return { revision: next.revision, text: next.text };
+  }
+
+  return {
+    snapshot,
+    save,
+    /** `{ known: false }` when the file cannot be read, so a client does not treat that as an empty notepad. */
+    helloRevision() {
+      try {
+        return { known: true, revision: snapshot().revision };
+      } catch {
+        return { known: false };
+      }
+    },
+  };
+}

package/src/manager/server.mjs

@@ -12,6 +12,7 @@ import { createViews } from './github-views.mjs';
 import { createFolderOpener } from './folder-opener.mjs';
 import { createFolderBrowser } from './folder-browser.mjs';
 import { normalizeAccess } from './access-policy.mjs';
+import { NOTES_BODY_LIMIT, createNotesStore } from './notes.mjs';
 
 const require = createRequire(import.meta.url);
 const API = '/api/v1';
@@ -63,7 +64,7 @@ class HttpError extends Error {
   }
 }
 
-function readJsonBody(req) {
+function readJsonBody(req, max = MAX_BODY) {
   return new Promise((resolve, reject) => {
     let size = 0;
     const chunks = [];
@@ -71,7 +72,7 @@ function readJsonBody(req) {
     req.on('data', (chunk) => {
       if (tooLarge) return; // drain the rest so the 413 response can be read
       size += chunk.length;
-      if (size > MAX_BODY) {
+      if (size > max) {
         tooLarge = true;
         chunks.length = 0;
         reject(new HttpError(413, 'request body too large', 'too_large'));
@@ -113,6 +114,8 @@ export function createManagerServer({
   extraHosts = [],
   extraOrigins = [],
   remoteAccess = null,
+  /** In-memory when omitted, so a test server never reads the user's notes file. */
+  notes = createNotesStore(),
   folderOpener = createFolderOpener({ resolveCwd: (cwd) => manager.resolveCwd(cwd) }),
   folderBrowser = createFolderBrowser(),
   /** The double-click launcher file for this platform, or null when the package carries none. */
@@ -252,6 +255,15 @@ export function createManagerServer({
 
     requireAuth(req, url);
 
+    if (route === '/notes' && method === 'GET') {
+      return sendJson(res, 200, { notes: notes.snapshot() });
+    }
+    if (route === '/notes' && method === 'PUT') {
+      const saved = notes.save(await readJsonBody(req, NOTES_BODY_LIMIT));
+      broadcast({ type: 'notes.updated', notes: saved });
+      return sendJson(res, 200, { notes: saved });
+    }
+
     if (remoteAccess && route === '/remote-access' && method === 'GET') {
       return sendJson(res, 200, { remoteAccess: remoteAccess.snapshot() });
     }
@@ -287,6 +299,10 @@ export function createManagerServer({
     if (route === '/folders' && method === 'GET') {
       return sendJson(res, 200, await folderBrowser.list(url.searchParams.get('path') ?? undefined));
     }
+    if (route === '/folders' && method === 'POST') {
+      const { path: parent, name } = await readJsonBody(req);
+      return sendJson(res, 201, await folderBrowser.create(parent, name));
+    }
     if (route === '/upgrade' && method === 'POST') {
       const session = await manager.upgrade();
       return sendJson(res, 201, { session: session.toJSON() });
@@ -482,12 +498,13 @@ export function createManagerServer({
       else serveStatic(req, res, url.pathname);
     } catch (err) {
       const status = err.status || 500;
-      if (status >= 500) console.error('[server]', err);
+      if (status >= 500 && !err.logged) console.error('[server]', err);
       if (!res.headersSent) {
         const error = { code: err.code || 'error', message: err.message };
         if (err.running !== undefined) error.running = err.running;
         if (err.pending !== undefined) error.pending = err.pending;
         if (err.target !== undefined) error.target = err.target;
+        if (err.notes !== undefined) error.notes = err.notes;
         sendJson(res, status, { error });
       }
     }
@@ -535,7 +552,11 @@ export function createManagerServer({
 
   function handleEvents(ws, req) {
     eventClients.add(ws);
-    safeSend(ws, { type: 'hello', version, pid: process.pid, platform: process.platform, startedAt, launcher, folderOpener: folderOpenerFor(req), remoteAccess: remoteAccess ? { available: true } : null, upgrade: upgradeInfo(), sessions: manager.list() });
+    const hello = { type: 'hello', version, pid: process.pid, platform: process.platform, startedAt, launcher, folderOpener: folderOpenerFor(req), remoteAccess: remoteAccess ? { available: true } : null, upgrade: upgradeInfo(), sessions: manager.list() };
+    const notesHello = notes.helloRevision();
+    if (notesHello.known) hello.notesRevision = notesHello.revision;
+    else hello.notesUnreadable = true;
+    safeSend(ws, hello);
     ws.on('close', () => eventClients.delete(ws));
     ws.on('message', () => { /* events socket is server -> client only */ });
   }

package/web/app.js

@@ -23,6 +23,7 @@ const GITHUB_ACCOUNT_KEY = 'agentGuild.githubAccount';
 const CLONE_PARENT_KEY = 'agentGuild.cloneParent';
 const HIDDEN_FOLDERS_KEY = 'agentGuild.showHiddenFolders';
 const RECENT_CWDS_KEY = 'agentGuild.recentCwds';
+const RECENT_CLONE_PARENTS_KEY = 'agentGuild.recentCloneParents';
 const GITHUB_REPO_KEY = 'agentGuild.githubRepo';
 const GITHUB_RECENT_KEY = 'agentGuild.githubRecent';
 const GITHUB_VIEW_KEY = 'agentGuild.githubView';
@@ -30,6 +31,7 @@ const SESSION_ORDER_KEY = 'agentGuild.sessionOrder';
 const SOUND_KEY = 'agentGuild.sound';
 const VOICE_KEY = 'agentGuild.voice';
 const NOTES_KEY = 'agentGuild.notes';
+const NOTES_REV_KEY = 'agentGuild.notesRevision';
 const DOCK_KEY = 'agentGuild.dock';
 const DOCK_WIDTH_KEY = 'agentGuild.dockWidth';
 const PANES_KEY = 'agentGuild.panes';
@@ -365,35 +367,63 @@ function moveInMenu(e) {
 /** Notes share the page's storage with every other setting, so they stay far below the browser's limit for it. */
 const NOTES_LIMIT = 100000;
 const NOTES_STATUS = {
-  saved: 'Saved in this browser as you type',
+  saved: 'Saved and synced across your browsers',
+  local: 'Saved in this browser only. Syncs when the manager is back.',
+  damaged: 'Not syncing: the manager’s notes file is damaged. Saved in this browser only.',
   long: `Not saved: notes hold up to ${NOTES_LIMIT.toLocaleString('en-US')} characters. Shorten them to save.`,
   refused: 'Not saved: the browser’s storage for this page is full or turned off. Copy what you need before you close the page.',
 };
+/** How long a burst of typing waits before one save to the manager. */
+const NOTES_PUSH_MS = 400;
+/** Browsers drop a keepalive request larger than 64 KiB, so a bigger notepad waits for the next open. */
+const NOTES_KEEPALIVE_BYTES = 60 * 1024;
 /**
  * `saved`: the notes as this page last read or wrote them in storage. `status`: whether the text in the
- * panel is saved, too `long` or `refused`; `shown`: the status the line under the title shows.
+ * panel is saved, too `long` or `refused`; `sync`: whether the manager has it (`ok`), could not be reached
+ * (`local`) or cannot read its notes file (`damaged`); `shown`: the status the line under the title shows.
+ * `base`: the manager revision this page last saved from. `acked`: the text of that revision.
+ * `flight`: the save to the manager under way. Text typed meanwhile is sent when it finishes.
  */
-const notesView = { saved: '', status: 'saved', shown: 'saved' };
+const notesView = { saved: '', status: 'saved', sync: 'ok', shown: 'saved', base: null, acked: null, timer: 0, flight: null };
 
 /** Shows notes another tab saved since this page last read or wrote them. Saved notes win over text this page could not save. */
 function refreshNotes() {
   let text;
   // Unlike load(), a read that fails is not taken for empty notes.
   try { text = localStorage.getItem(NOTES_KEY) ?? ''; } catch { return; }
-  if (text === notesView.saved) return;
-  notesView.saved = text;
-  notesView.status = 'saved';
-  $('notes-text').value = text;
+  const revision = load(NOTES_REV_KEY);
+  if (text === notesView.saved && revision === notesView.base) return;
+  if (text !== notesView.saved) {
+    notesView.saved = text;
+    notesView.status = 'saved';
+    $('notes-text').value = text;
+  }
+  // The revision is kept only while the stored text is the one it names, so that text is on the manager.
+  if (revision) notesView.acked = text;
+  if (revision !== notesView.base) notesView.base = revision;
   renderNotesStatus();
   guardLeaving();
 }
 
-/** Saves the notes on every change; emptying them removes the saved copy. */
+/** Saves the notes on every change; emptying them removes the saved copy. This stays in the browser. */
 function saveNotes() {
   const text = $('notes-text').value;
-  if (text.length > NOTES_LIMIT) notesView.status = 'long';
-  else if (!save(NOTES_KEY, text || null)) notesView.status = 'refused';
-  else {
+  if (text.length > NOTES_LIMIT) {
+    notesView.status = 'long';
+    renderNotesStatus();
+    guardLeaving();
+    return;
+  }
+  // A reload can tell these keystrokes have not reached the manager: the stored revision goes first, so
+  // stored text never sits beside a revision it does not match. The revision in memory stays, for the save.
+  // An empty panel is probed with the same text, and that must not look like a new edit.
+  const revision = text !== notesView.saved ? load(NOTES_REV_KEY) : null;
+  if (revision) save(NOTES_REV_KEY, null);
+  if (!save(NOTES_KEY, text || null)) {
+    // The stored text did not change, so it still matches its revision.
+    if (revision) save(NOTES_REV_KEY, revision);
+    notesView.status = 'refused';
+  } else {
     notesView.status = 'saved';
     notesView.saved = text;
   }
@@ -403,16 +433,30 @@ function saveNotes() {
 
 /** The line under the title is a live region, so it is rewritten only when the status changes. */
 function renderNotesStatus() {
-  if (notesView.shown === notesView.status) return;
-  notesView.shown = notesView.status;
+  // A problem saving in this browser outranks one reaching the manager.
+  const shown = notesView.status === 'saved' && notesView.sync !== 'ok' ? notesView.sync : notesView.status;
+  if (notesView.shown === shown) return;
+  notesView.shown = shown;
   const sub = $('notes-sub');
-  sub.textContent = NOTES_STATUS[notesView.status];
-  sub.classList.toggle('warn', notesView.status !== 'saved');
+  sub.textContent = NOTES_STATUS[shown];
+  sub.classList.toggle('warn', shown !== 'saved');
+}
+
+/** Whether the manager has the notes. Typing never changes this, so the line does not flicker. */
+function setNotesSync(sync) {
+  if (notesView.sync === sync) return;
+  notesView.sync = sync;
+  renderNotesStatus();
+}
+
+/** A save or read that failed. A file the manager cannot read is reported as such; anything else is unreachable. */
+function notesFailed(error) {
+  setNotesSync(error?.code === 'notes_unreadable' ? 'damaged' : 'local');
 }
 
 /** Another tab saved the notes, or cleared this page's storage. */
 function notesStored(e) {
-  if (e.key === NOTES_KEY || e.key === null) refreshNotes();
+  if (e.key === NOTES_KEY || e.key === NOTES_REV_KEY || e.key === null) refreshNotes();
 }
 
 function openNotes({ focus = true } = {}) {
@@ -429,6 +473,181 @@ function toggleNotes() {
   else openNotes();
 }
 
+function sharedPrefix(left, right) {
+  const end = Math.min(left.length, right.length);
+  let i = 0;
+  while (i < end && left.charCodeAt(i) === right.charCodeAt(i)) i += 1;
+  return i;
+}
+
+/** Takes the manager's notes. A selection that still sits in the unchanged prefix stays put. */
+function adoptNotes(notes) {
+  const area = $('notes-text');
+  const next = notes.text;
+  if (typeof next !== 'string') return;
+  if (next !== area.value) {
+    const start = area.selectionStart;
+    const end = area.selectionEnd;
+    const previous = area.value;
+    const focused = document.activeElement === area;
+    area.value = next;
+    if (focused) {
+      const keep = sharedPrefix(previous, next);
+      if (start <= keep && end <= keep) area.setSelectionRange(start, end);
+    }
+  }
+  notesView.saved = next;
+  notesView.acked = next;
+  notesView.base = notes.revision ?? null;
+  notesView.status = 'saved';
+  notesView.sync = 'ok';
+  // Revision last, and only over text that was stored: a stored revision always names the stored text.
+  save(NOTES_REV_KEY, null);
+  if (save(NOTES_KEY, next || null)) save(NOTES_REV_KEY, notes.revision || null);
+  renderNotesStatus();
+  guardLeaving();
+}
+
+function notesPushable() {
+  const text = $('notes-text').value;
+  if (notesView.status !== 'saved' || text.length > NOTES_LIMIT) return false;
+  if (text === notesView.acked) return false;
+  if (notesView.base == null && text === '') return false;
+  return true;
+}
+
+function scheduleNotesPush(delay = NOTES_PUSH_MS) {
+  clearTimeout(notesView.timer);
+  notesView.timer = 0;
+  if (!notesPushable()) return Promise.resolve();
+  if (delay === 0) return pushNotes();
+  notesView.timer = setTimeout(() => { notesView.timer = 0; void pushNotes(); }, delay);
+  return Promise.resolve();
+}
+
+/** The page is being hidden or closed: send what the debounce still holds. */
+function flushNotes() {
+  void scheduleNotesPush(0);
+}
+
+/**
+ * One save to the manager at a time, so two of this page's own saves can never race each other. Text typed
+ * while a save is under way follows it. A conflict sends this page's text once more at the manager's revision:
+ * the latest typing wins, and the text on screen is never replaced by an older copy.
+ */
+function pushNotes() {
+  // The save under way checks for newer text when it finishes.
+  if (notesView.flight) return notesView.flight;
+  const run = (async () => {
+    let resent = false;
+    for (;;) {
+      if (!notesPushable()) return;
+      const outcome = await sendNotes($('notes-text').value);
+      if (outcome === 'stale' && !resent) resent = true;
+      else if (outcome !== 'ok') return;
+    }
+  })();
+  notesView.flight = run;
+  return run.finally(() => { notesView.flight = null; });
+}
+
+/** @returns {Promise<'ok'|'stale'|'failed'>} `stale`: the manager moved on, and `base` now names its revision. */
+async function sendNotes(text) {
+  const body = { revision: notesView.base, text };
+  // A hidden page may be closing: keepalive lets the save outlive it, for bodies the browser allows.
+  const keepalive = document.visibilityState === 'hidden'
+    && new TextEncoder().encode(JSON.stringify(body)).length <= NOTES_KEEPALIVE_BYTES;
+  let payload;
+  try {
+    payload = (await api('PUT', '/notes', body, { keepalive })).notes;
+  } catch (error) {
+    if (error instanceof AuthError) {
+      showAuth(error.message);
+      return 'failed';
+    }
+    if (error.code !== 'stale_notes' || !error.notes || typeof error.notes.text !== 'string') {
+      notesFailed(error);
+      return 'failed';
+    }
+    // The manager already holds exactly this text, saved by another tab or an earlier request.
+    if (error.notes.text === $('notes-text').value) {
+      adoptNotes(error.notes);
+      return 'ok';
+    }
+    notesView.base = error.notes.revision ?? null;
+    return 'stale';
+  }
+  if (!payload || typeof payload.text !== 'string') {
+    notesFailed();
+    return 'failed';
+  }
+  if ($('notes-text').value === text) adoptNotes(payload);
+  else {
+    // Typing went on during the save: the newer text follows from this revision.
+    notesView.base = payload.revision ?? notesView.base;
+    setNotesSync('ok');
+  }
+  return 'ok';
+}
+
+/** Another browser's save. Our own echo matches the text already on screen and only adopts the revision. */
+function applyServerNotes(notes) {
+  if (!notes || typeof notes.text !== 'string') return;
+  const area = $('notes-text');
+  if (notes.text === area.value) {
+    adoptNotes(notes);
+    return;
+  }
+  if (notesView.acked !== null && area.value !== notesView.acked) {
+    notesView.base = notes.revision ?? notesView.base;
+    return;
+  }
+  adoptNotes(notes);
+}
+
+/** The notes part of hello. A missing revision means this manager cannot share notes. */
+async function catchUpNotes(revision, unreadable) {
+  if (unreadable) {
+    setNotesSync('damaged');
+    return;
+  }
+  if (revision === undefined) return;
+  // Hello can arrive before the first read. Load this browser's copy before deciding, unless typing has started.
+  if (notesView.saved === '' && $('notes-text').value === '' && notesView.acked === null) refreshNotes();
+  const local = $('notes-text').value;
+  // No file yet, or it was removed. Text this browser has is the first copy. An empty panel writes nothing.
+  if (revision === null) notesView.acked = local ? null : '';
+  if (revision === null || revision === notesView.base) {
+    if (notesPushable()) await scheduleNotesPush(0);
+    else setNotesSync('ok');
+    return;
+  }
+  await pullNotes();
+}
+
+/** The manager moved on while this page was away. Its copy wins unless this browser has edits it never sent. */
+async function pullNotes() {
+  let notes;
+  try {
+    notes = (await api('GET', '/notes')).notes;
+  } catch (error) {
+    if (error instanceof AuthError) showAuth(error.message);
+    else notesFailed(error);
+    return;
+  }
+  if (!notes || typeof notes.text !== 'string') return;
+  const local = $('notes-text').value;
+  // `acked` is unknown only when this browser holds text no revision names: an edit that never reached the manager.
+  const unsent = local !== notes.text && (notesView.acked === null ? local !== '' : local !== notesView.acked);
+  if (!unsent) {
+    adoptNotes(notes);
+    return;
+  }
+  notesView.base = notes.revision ?? null;
+  setNotesSync('ok');
+  await scheduleNotesPush(0);
+}
+
 // ---- dock -----------------------------------------------------------------
 
 const DOCK_PANELS = ['github', 'notes'];
@@ -716,9 +935,10 @@ function renderAgents(container, agents, shells = []) {
 
 class AuthError extends Error {}
 
-async function api(method, path, body) {
+async function api(method, path, body, options = {}) {
   const res = await fetch(`/api/v1${path}`, {
     method,
+    keepalive: options.keepalive === true,
     headers: {
       Authorization: `Bearer ${state.token}`,
       ...(body ? { 'Content-Type': 'application/json' } : {}),
@@ -767,68 +987,78 @@ async function openWorkingFolder() {
   }
 }
 
-// ---- recent working folders -----------------------------------------------
+// ---- recent folders ---------------------------------------------------------
 
-const recentView = { open: false, typed: false, active: -1 };
+const RECENT_FIELDS = {
+  cwd: { input: 'cwd', list: 'cwd-recent', key: RECENT_CWDS_KEY, pick: (dir) => useFolder(dir) },
+  clone: { input: 'github-parent', list: 'github-parent-recent', key: RECENT_CLONE_PARENTS_KEY, pick: (dir) => setCloneParent(dir) },
+};
+const recentView = { field: null, typed: false, active: -1 };
 
-function recentCwds() {
-  return readRecentFolders(load(RECENT_CWDS_KEY));
+function recentFolders(field) {
+  return readRecentFolders(load(RECENT_FIELDS[field].key));
 }
 
-function rememberCwd(dir) {
-  if (dir) save(RECENT_CWDS_KEY, JSON.stringify(rememberFolder(recentCwds(), dir, { caseless: state.platform === 'win32' })));
+function rememberRecent(field, dir) {
+  if (dir) save(RECENT_FIELDS[field].key, JSON.stringify(rememberFolder(recentFolders(field), dir, { caseless: state.platform === 'win32' })));
 }
 
-function renderRecentCwds() {
-  const input = $('cwd'), list = $('cwd-recent');
-  const shown = recentView.open ? matchFolders(recentCwds(), recentView.typed ? input.value : '') : [];
-  recentView.active = Math.min(recentView.active, shown.length - 1);
+function renderRecent(field) {
+  const { input: inputId, list: listId } = RECENT_FIELDS[field];
+  const input = $(inputId), list = $(listId);
+  const open = recentView.field === field;
+  const shown = open ? matchFolders(recentFolders(field), recentView.typed ? input.value : '') : [];
+  if (open) recentView.active = Math.min(recentView.active, shown.length - 1);
   list.replaceChildren(...shown.map((dir, i) => {
     const option = el('li', 'cwd-recent-option', dir);
-    option.id = `cwd-recent-${i}`;
+    option.id = `${listId}-${i}`;
     option.setAttribute('role', 'option');
-    option.setAttribute('aria-selected', String(i === recentView.active));
+    option.setAttribute('aria-selected', String(open && i === recentView.active));
     option.addEventListener('pointerdown', (e) => e.preventDefault());
-    option.addEventListener('click', () => pickRecentCwd(dir));
+    option.addEventListener('click', () => pickRecent(field, dir));
     return option;
   }));
   list.hidden = !shown.length;
   input.setAttribute('aria-expanded', String(!list.hidden));
-  if (recentView.active >= 0) input.setAttribute('aria-activedescendant', `cwd-recent-${recentView.active}`);
+  if (open && recentView.active >= 0) input.setAttribute('aria-activedescendant', `${listId}-${recentView.active}`);
   else input.removeAttribute('aria-activedescendant');
 }
 
-function showRecentCwds(typed = false) {
-  Object.assign(recentView, { open: true, typed, active: -1 });
-  renderRecentCwds();
+function showRecent(field, typed = false) {
+  const previous = recentView.field;
+  Object.assign(recentView, { field, typed, active: -1 });
+  if (previous && previous !== field) renderRecent(previous);
+  renderRecent(field);
 }
 
-function hideRecentCwds() {
-  Object.assign(recentView, { open: false, active: -1 });
-  renderRecentCwds();
+function hideRecent(field) {
+  if (recentView.field !== field) return;
+  Object.assign(recentView, { field: null, active: -1 });
+  renderRecent(field);
 }
 
-function pickRecentCwd(dir) {
-  hideRecentCwds();
-  useFolder(dir);
+function pickRecent(field, dir) {
+  hideRecent(field);
+  RECENT_FIELDS[field].pick(dir);
 }
 
-function recentCwdKeys(e) {
-  const options = $('cwd-recent').hidden ? [] : [...$('cwd-recent').children];
+function recentKeys(field, e) {
+  const list = $(RECENT_FIELDS[field].list);
+  const options = list.hidden ? [] : [...list.children];
   if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {
     e.preventDefault();
-    if (!recentView.open) showRecentCwds();
-    const count = $('cwd-recent').children.length;
+    if (recentView.field !== field) showRecent(field);
+    const count = list.children.length;
     if (!count) return;
     recentView.active = e.key === 'ArrowDown' ? (recentView.active + 1) % count : recentView.active <= 0 ? count - 1 : recentView.active - 1;
-    renderRecentCwds();
-    $(`cwd-recent-${recentView.active}`).scrollIntoView?.({ block: 'nearest' });
+    renderRecent(field);
+    $(`${RECENT_FIELDS[field].list}-${recentView.active}`).scrollIntoView?.({ block: 'nearest' });
   } else if (e.key === 'Enter' && recentView.active >= 0 && options[recentView.active]) {
     e.preventDefault();
-    pickRecentCwd(options[recentView.active].textContent);
+    pickRecent(field, options[recentView.active].textContent);
   } else if (e.key === 'Escape' && options.length) {
     e.preventDefault();
-    hideRecentCwds();
+    hideRecent(field);
   }
 }
 
@@ -854,7 +1084,52 @@ function chooseFolder(field) {
   browseTo($(FOLDER_FIELDS[field].input).value.trim());
 }
 
+function showNewFolder(open) {
+  $('folder-new').hidden = !open;
+  $('folder-new-open').setAttribute('aria-expanded', String(open));
+  if (open) $('folder-new-name').value = '';
+  renderFolderBrowser();
+  (open ? $('folder-new-name') : $('folder-new-open')).focus();
+}
+
+async function createFolder(e) {
+  e?.preventDefault();
+  const parent = folderView.listing?.path;
+  const name = $('folder-new-name').value.trim();
+  if (!parent || !name || folderView.loading) return;
+  const request = ++folderView.request;
+  folderView.loading = true;
+  folderView.error = null;
+  renderFolderBrowser();
+  try {
+    const listing = await api('POST', '/folders', { path: parent, name });
+    if (request !== folderView.request) return;
+    folderView.listing = listing;
+    $('folder-filter').value = '';
+    $('folder-new').hidden = true;
+    $('folder-new-open').setAttribute('aria-expanded', 'false');
+  } catch (err) {
+    if (request !== folderView.request) return;
+    if (err instanceof AuthError) {
+      $('folder-browser').close();
+      return showAuth(err.message);
+    }
+    folderView.error = err.message || 'Could not create the folder.';
+  }
+  folderView.loading = false;
+  renderFolderBrowser();
+  if ($('folder-browser').open) ($('folder-new').hidden ? $('folder-use') : $('folder-new-name')).focus();
+}
+
+function newFolderKeys(e) {
+  if (e.key !== 'Escape') return;
+  e.preventDefault();
+  showNewFolder(false);
+}
+
 async function browseTo(dir) {
+  $('folder-new').hidden = true;
+  $('folder-new-open').setAttribute('aria-expanded', 'false');
   const request = ++folderView.request;
   folderView.loading = true;
   folderView.error = null;
@@ -908,6 +1183,8 @@ function renderFolderBrowser() {
   status.classList.toggle('error', Boolean(error));
   $('folder-current').textContent = listing?.path ?? '';
   $('folder-use').disabled = loading || !listing;
+  $('folder-new-open').disabled = loading || !listing;
+  $('folder-new-create').disabled = loading || !listing || !$('folder-new-name').value.trim();
 }
 
 function folderBrowserClosed() {
@@ -925,11 +1202,9 @@ function useBrowsedFolder() {
   if (!dir || folderView.loading) return;
   const field = folderView.field;
   $('folder-browser').close();
+  rememberRecent(field, dir);
   if (field === 'clone') setCloneParent(dir);
-  else {
-    rememberCwd(dir);
-    useFolder(dir);
-  }
+  else useFolder(dir);
 }
 
 function moveInFolders(e) {
@@ -2418,7 +2693,7 @@ async function startSession(provider, card, { resume, cwd, account = selectedAcc
       ({ session } = await api('POST', '/sessions', { ...body, cwd: working || undefined }));
     }
     upsertSession(session);
-    rememberCwd(session.cwd);
+    rememberRecent('cwd', session.cwd);
     closeHistory({ focusOpener: false });
     openPanel(session.id);
   } catch (err) {
@@ -2628,7 +2903,7 @@ const GITHUB_SCOPES = {
   repo: 'Read and write access to your repositories, private ones included, so you can browse repositories and create or edit issues.',
   'write:public_key': 'Add the SSH key Agent Guild creates for this account.',
 };
-const githubView = { accountId: null, repos: null, reposFor: null, loading: null, error: null, parentError: null, card: null, started: new Set(), announced: new Set() };
+const githubView = { accountId: null, repos: null, reposFor: null, loading: null, error: null, parentError: null, card: null, started: new Map(), announced: new Set() };
 let githubLoading = null;
 
 function el(tag, className, ...children) {
@@ -3093,8 +3368,9 @@ function renderGitHubRepos(github, account, repos) {
 }
 
 async function startClone(account, fullName) {
-  const { session } = await api('POST', '/github/clone', { account: account.id, repo: fullName, parent: cloneParent() });
-  githubView.started.add(session.id);
+  const parent = cloneParent();
+  const { session } = await api('POST', '/github/clone', { account: account.id, repo: fullName, parent });
+  githubView.started.set(session.id, parent);
   upsertSession(session);
   openPanel(session.id);
 }
@@ -3204,8 +3480,10 @@ function noticeClone(s) {
   githubPick.origins.clear();
   if (dockShows('github')) loadRepos();
   if (!githubView.started.has(s.id)) return;
-  if (clonedPath(s)) toast(`Cloned ${s.clone.repo} into ${s.clone.path}.`, 12000, { label: 'Use folder', run: () => useFolder(s.clone.path) });
-  else toast(`Cloning ${s.clone?.repo ?? 'the repository'} did not finish. Its session shows why.`, 8000);
+  if (clonedPath(s)) {
+    rememberRecent('clone', githubView.started.get(s.id));
+    toast(`Cloned ${s.clone.repo} into ${s.clone.path}.`, 12000, { label: 'Use folder', run: () => useFolder(s.clone.path) });
+  } else toast(`Cloning ${s.clone?.repo ?? 'the repository'} did not finish. Its session shows why.`, 8000);
 }
 
 function useFolder(dir) {
@@ -5110,6 +5388,9 @@ function connectEvents() {
       // A changelog.updated sent while the socket was down is lost; catch up the open panel.
       if ($('changelog').open) loadChangelog();
       if (dockShows('github')) loadGitHub();
+      catchUpNotes(msg.notesRevision, msg.notesUnreadable === true);
+    } else if (msg.type === 'notes.updated') {
+      applyServerNotes(msg.notes);
     } else if (msg.type === 'remote-access.updated') {
       state.remoteAccessUI?.updated();
     } else if (msg.type === 'news.updated') {
@@ -5398,7 +5679,7 @@ document.addEventListener('keydown', (e) => {
 addEventListener('scroll', () => { if (tipFor) hideTip(); }, true);
 addEventListener('resize', () => { if (tipFor) hideTip(); });
 $('notes-open').addEventListener('click', firstClick(toggleNotes));
-$('notes-text').addEventListener('input', saveNotes);
+$('notes-text').addEventListener('input', () => { saveNotes(); void scheduleNotesPush(); });
 addEventListener('storage', notesStored);
 // On load, and again for a page back from the back/forward cache, which may have missed another tab's notes.
 addEventListener('pageshow', refreshNotes);
@@ -5415,12 +5696,16 @@ $('news').addEventListener('close', () => {
   newsView.opener = null;
 });
 document.addEventListener('visibilitychange', () => {
-  if (document.visibilityState !== 'visible') stopDictation();
+  if (document.visibilityState !== 'visible') {
+    stopDictation();
+    flushNotes();
+  }
   if (document.visibilityState === 'visible' && state.connected && Date.now() - newsLoadedAt > 60000) loadNews();
   if (document.visibilityState === 'visible' && dockShows('github') && githubShownView() === 'actions') loadView('actions');
   else scheduleRuns();
 });
 addEventListener('pagehide', () => {
+  flushNotes();
   state.pageAway = true;
   activityFavicon.setPaused(true);
   terminalCopy.close();
@@ -5587,11 +5872,13 @@ $('panel-stop').addEventListener('click', () => {
 });
 $('cwd').value = load(CWD_KEY) || '';
 $('cwd-pick').addEventListener('click', firstClick(() => chooseFolder('cwd')));
-$('cwd').addEventListener('focus', () => showRecentCwds());
-$('cwd').addEventListener('click', () => { if (!recentView.open) showRecentCwds(); });
-$('cwd').addEventListener('input', () => showRecentCwds(true));
-$('cwd').addEventListener('blur', hideRecentCwds);
-$('cwd').addEventListener('keydown', recentCwdKeys);
+for (const [field, { input }] of Object.entries(RECENT_FIELDS)) {
+  $(input).addEventListener('focus', () => showRecent(field));
+  $(input).addEventListener('click', () => { if (recentView.field !== field) showRecent(field); });
+  $(input).addEventListener('input', () => showRecent(field, true));
+  $(input).addEventListener('blur', () => hideRecent(field));
+  $(input).addEventListener('keydown', (e) => recentKeys(field, e));
+}
 $('folder-cancel').addEventListener('click', () => $('folder-browser').close());
 $('folder-browser').addEventListener('click', (e) => { if (e.target === $('folder-browser')) $('folder-browser').close(); });
 $('folder-browser').addEventListener('close', folderBrowserClosed);
@@ -5605,6 +5892,11 @@ $('folder-hidden').addEventListener('change', (e) => {
   renderFolderBrowser();
 });
 $('folder-use').addEventListener('click', useBrowsedFolder);
+$('folder-new-open').addEventListener('click', () => showNewFolder($('folder-new').hidden));
+$('folder-new-cancel').addEventListener('click', () => showNewFolder(false));
+$('folder-new').addEventListener('submit', createFolder);
+$('folder-new-name').addEventListener('input', renderFolderBrowser);
+$('folder-new-name').addEventListener('keydown', newFolderKeys);
 $('cwd-open').addEventListener('click', firstClick(openWorkingFolder));
 try { state.accounts = JSON.parse(load(ACCOUNTS_KEY)) || {}; } catch { state.accounts = {}; }
 try { state.shellPicks = JSON.parse(load(SHELLS_KEY)) || {}; } catch { state.shellPicks = {}; }

package/web/index.html

@@ -244,7 +244,8 @@
       <div id="github-clone-into" class="history-form github-form">
         <label for="github-parent">Clone into</label>
         <div class="cwd-field single">
-          <input id="github-parent" type="text" placeholder="Folder that holds your clones" spellcheck="false" autocomplete="off">
+          <input id="github-parent" type="text" placeholder="Folder that holds your clones" spellcheck="false" autocomplete="off" role="combobox" aria-autocomplete="list" aria-expanded="false" aria-controls="github-parent-recent">
+          <ul id="github-parent-recent" class="cwd-recent above" role="listbox" aria-label="Recent clone folders" hidden></ul>
           <div class="cwd-tools">
             <button id="github-parent-pick" class="cwd-tool" type="button" aria-label="Choose a folder…" title="Connect to the session manager to choose folders" disabled>
               <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">
@@ -257,7 +258,7 @@
       </div>
     </section>
     <section id="notes" class="dock-panel notes-panel" role="tabpanel" aria-labelledby="notes-title" hidden>
-      <p id="notes-sub" class="dock-sub sub" aria-live="polite">Saved in this browser as you type</p>
+      <p id="notes-sub" class="dock-sub sub" aria-live="polite">Saved and synced across your browsers</p>
       <div class="dock-body">
         <textarea id="notes-text" class="notes-text" aria-labelledby="notes-title" aria-describedby="notes-sub" autocomplete="off" placeholder="Prompts, commands, to-dos: anything you want to keep at hand"></textarea>
       </div>
@@ -434,7 +435,13 @@
       <button id="folder-up" class="btn" type="button">Up</button>
       <button id="folder-home" class="btn folder-chip" type="button">Home</button>
       <div id="folder-roots" class="folder-roots"></div>
+      <button id="folder-new-open" class="btn folder-new-open" type="button" aria-expanded="false" aria-controls="folder-new">New folder</button>
     </div>
+    <form id="folder-new" class="history-tools folder-new" hidden>
+      <input id="folder-new-name" type="text" placeholder="New folder name" aria-label="New folder name" spellcheck="false" autocomplete="off" autocapitalize="off" enterkeyhint="done">
+      <button id="folder-new-create" class="btn primary" type="submit">Create</button>
+      <button id="folder-new-cancel" class="btn" type="button">Cancel</button>
+    </form>
     <div class="history-tools">
       <input id="folder-filter" type="search" placeholder="Filter folders" aria-label="Filter folders" spellcheck="false" autocomplete="off">
       <label class="history-here"><input id="folder-hidden" type="checkbox"><span>Show hidden</span></label>

package/web/skins/gnomeland/skin.css

@@ -243,7 +243,7 @@
   }
   .btn.primary:hover { filter: brightness(1.08); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 0 0 1px rgba(233, 196, 122, 0.6), 0 5px 16px rgba(40, 70, 30, 0.35); }
   .btn.danger:hover { border-color: var(--danger); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 14%, transparent); }
-  .cwd input, .auth input, .history-tools input[type="search"], .history-form input, .github-fields input, .github-fields select, .notes-text { background: var(--panel-strong); }
+  .cwd input, .auth input, .history-tools input[type="search"], .folder-new input, .history-form input, .github-fields input, .github-fields select, .notes-text { background: var(--panel-strong); }
 
   .models, .news-panel, .dock, .auth, .news-latest, .menu:popover-open { background: var(--panel-strong); backdrop-filter: blur(16px); }
   .models, .news-panel { box-shadow: var(--dialog-shadow); }
@@ -362,7 +362,7 @@
   .btn.primary { border-color: #6a8f3a; background: linear-gradient(#55924a, #35662f); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(233, 196, 122, 0.3), 0 0 16px rgba(110, 170, 80, 0.3); }
   .btn.danger { color: #f59a8c; }
   .btn.danger:hover { border-color: #b8402f; box-shadow: 0 0 12px rgba(240, 123, 106, 0.3); }
-  .cwd input, .auth input, .history-tools input[type="search"], .history-form input, .github-fields input, .github-fields select, .notes-text { border-color: #4a3824; background: rgba(10, 7, 4, 0.7); }
+  .cwd input, .auth input, .history-tools input[type="search"], .folder-new input, .history-form input, .github-fields input, .github-fields select, .notes-text { border-color: #4a3824; background: rgba(10, 7, 4, 0.7); }
 
   .models::backdrop, .news-panel::backdrop { background: rgba(6, 4, 2, 0.66); }
   .terminal-panel { border-color: #5a4226; box-shadow: 0 0 0 1px rgba(233, 196, 122, 0.06), 0 30px 80px rgba(0, 0, 0, 0.7); }

package/web/skins/goblinville/skin.css

@@ -249,7 +249,7 @@
   }
   .btn.primary:hover { filter: brightness(1.08); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 0 0 1px rgba(227, 166, 119, 0.6), 0 5px 16px rgba(20, 70, 56, 0.35); }
   .btn.danger:hover { border-color: var(--danger); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 14%, transparent); }
-  .cwd input, .auth input, .history-tools input[type="search"], .history-form input, .github-fields input, .github-fields select, .notes-text { background: var(--panel-strong); }
+  .cwd input, .auth input, .history-tools input[type="search"], .folder-new input, .history-form input, .github-fields input, .github-fields select, .notes-text { background: var(--panel-strong); }
 
   .models, .news-panel, .dock, .auth, .news-latest, .menu:popover-open { background: var(--panel-strong); backdrop-filter: blur(16px); }
   .models, .news-panel { box-shadow: var(--dialog-shadow); }
@@ -369,7 +369,7 @@
   .btn.primary { border-color: #3f9a80; background: linear-gradient(#2f8a73, #1b5a4b); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 0 0 1px rgba(227, 166, 119, 0.3), 0 0 16px rgba(60, 170, 140, 0.3); }
   .btn.danger { color: #f59a8c; }
   .btn.danger:hover { border-color: #b8402f; box-shadow: 0 0 12px rgba(240, 123, 106, 0.3); }
-  .cwd input, .auth input, .history-tools input[type="search"], .history-form input, .github-fields input, .github-fields select, .notes-text { border-color: #3a4a3f; background: rgba(5, 8, 6, 0.7); }
+  .cwd input, .auth input, .history-tools input[type="search"], .folder-new input, .history-form input, .github-fields input, .github-fields select, .notes-text { border-color: #3a4a3f; background: rgba(5, 8, 6, 0.7); }
 
   .models::backdrop, .news-panel::backdrop { background: rgba(2, 5, 3, 0.66); }
   .terminal-panel { border-color: #5a3a22; box-shadow: 0 0 0 1px rgba(227, 166, 119, 0.06), 0 30px 80px rgba(0, 0, 0, 0.7); }

package/web/skins/grove/skin.css

@@ -244,7 +244,7 @@
   }
   .btn.primary:hover { filter: brightness(1.07); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 6px 20px rgba(45, 107, 69, 0.36); }
   .btn.danger:hover { border-color: var(--danger); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 14%, transparent); }
-  .cwd input, .auth input, .history-tools input[type="search"], .history-form input, .github-fields input, .github-fields select, .notes-text { background: var(--paper-strong); }
+  .cwd input, .auth input, .history-tools input[type="search"], .folder-new input, .history-form input, .github-fields input, .github-fields select, .notes-text { background: var(--paper-strong); }
 
   .models, .news-panel, .dock, .auth, .news-latest, .menu:popover-open { background: var(--paper-strong); backdrop-filter: blur(16px); }
   .models, .news-panel { box-shadow: var(--dialog-shadow); }
@@ -371,7 +371,7 @@
   .btn.primary { background: linear-gradient(135deg, #4a8c5e, #2a6340); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 0 18px rgba(80, 160, 105, 0.35); }
   .btn.danger { color: #ff9a8e; }
   .btn.danger:hover { border-color: #b8443a; box-shadow: 0 0 12px rgba(240, 122, 108, 0.3); }
-  .cwd input, .auth input, .history-tools input[type="search"], .history-form input, .github-fields input, .github-fields select, .notes-text { border-color: #2e4a3d; background: rgba(4, 10, 8, 0.7); }
+  .cwd input, .auth input, .history-tools input[type="search"], .folder-new input, .history-form input, .github-fields input, .github-fields select, .notes-text { border-color: #2e4a3d; background: rgba(4, 10, 8, 0.7); }
 
   .models::backdrop, .news-panel::backdrop { background: rgba(2, 6, 5, 0.66); }
   .terminal-panel { border-color: #2e4a3d; box-shadow: 0 0 0 1px rgba(140, 210, 160, 0.06), 0 30px 80px rgba(0, 0, 0, 0.7); }

package/web/skins/guild/skin.css

@@ -480,7 +480,7 @@
   }
   .btn.primary:hover { border-color: #b8892f; filter: brightness(1.08); }
   .btn.danger:hover { border-color: #c4625d; }
-  .cwd input, .auth input, .history-tools input[type="search"], .history-form input, .notes-text {
+  .cwd input, .auth input, .history-tools input[type="search"], .folder-new input, .history-form input, .notes-text {
     border-color: #dccba5; background: #fffdf8; box-shadow: inset 0 1px 2px rgba(70, 48, 12, 0.06);
   }
   .auth { border-color: #e4d6b6; box-shadow: var(--card-shadow); }

package/web/skins/orbital/skin.css

@@ -246,7 +246,7 @@
   }
   .btn.primary:hover { filter: brightness(1.08); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 6px 20px rgba(122, 79, 232, 0.4); }
   .btn.danger:hover { border-color: var(--danger); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 14%, transparent); }
-  .cwd input, .auth input, .history-tools input[type="search"], .history-form input, .github-fields input, .github-fields select, .notes-text { background: var(--glass-strong); }
+  .cwd input, .auth input, .history-tools input[type="search"], .folder-new input, .history-form input, .github-fields input, .github-fields select, .notes-text { background: var(--glass-strong); }
 
   .models, .news-panel, .dock, .auth, .news-latest, .menu:popover-open { background: var(--glass-strong); backdrop-filter: blur(16px); }
   .models, .news-panel { box-shadow: var(--dialog-shadow); }
@@ -367,7 +367,7 @@
   .btn.primary { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 0 18px rgba(106, 92, 240, 0.45); }
   .btn.danger { color: #ff8c9c; }
   .btn.danger:hover { border-color: #c23a52; box-shadow: 0 0 12px rgba(255, 107, 129, 0.3); }
-  .cwd input, .auth input, .history-tools input[type="search"], .history-form input, .github-fields input, .github-fields select, .notes-text { border-color: #26355c; background: rgba(4, 7, 16, 0.7); }
+  .cwd input, .auth input, .history-tools input[type="search"], .folder-new input, .history-form input, .github-fields input, .github-fields select, .notes-text { border-color: #26355c; background: rgba(4, 7, 16, 0.7); }
 
   .models::backdrop, .news-panel::backdrop { background: rgba(2, 4, 10, 0.66); }
   .terminal-panel { border-color: #2a3a66; box-shadow: 0 0 0 1px rgba(120, 170, 255, 0.06), 0 30px 80px rgba(0, 0, 0, 0.7); }

package/web/styles.css

@@ -743,13 +743,15 @@ a.news-link:visited { color: var(--muted); }
 }
 .notes-text:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
 .notes-panel .sub.warn { color: var(--warn); }
+/* Room below the status line for the field's focus ring, and for a warning that wraps to two lines. */
+.notes-panel .dock-sub { flex-shrink: 0; padding-bottom: 8px; line-height: 1.4; }
 @media (pointer: coarse) {
   /* iOS zooms in on a field with smaller text when it takes focus. */
   .notes-text { font-size: 16px; }
 }
 
 .history-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 14px 0; }
-.history-tools input[type="search"] {
+.history-tools input[type="search"], .folder-new input {
   flex: 1 1 220px; min-width: 0; padding: 7px 10px; border-radius: var(--radius); border: 1px solid var(--border);
   background: var(--surface); color: var(--text); font: inherit; font-size: 0.9rem;
 }
@@ -1035,6 +1037,9 @@ a.btn.github-out::after {
 .folder-crumb:focus-visible, .folder-row:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
 .folder-places, .folder-roots { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
 .folder-places .btn { min-height: 36px; }
+.folder-new-open { margin-left: auto; }
+.folder-new { flex-wrap: nowrap; }
+.folder-new input { flex: 1; min-width: 0; }
 .folder-list { display: flex; flex-direction: column; }
 .folder-row {
   display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px; border: 0; border-bottom: 1px solid var(--border);
@@ -1047,6 +1052,9 @@ a.btn.github-out::after {
 .folder-footer { justify-content: space-between; }
 .folder-current { flex: 1; min-width: 0; font-family: ui-monospace, "Cascadia Code", "SF Mono", Menlo, Consolas, monospace; font-size: 0.8rem; overflow-wrap: anywhere; }
 .folder-footer .btn { min-height: 42px; }
+@media (pointer: coarse), (max-width: 640px) {
+  .folder-places .btn, .folder-new .btn, .folder-new input, .folder-footer .btn, #folder-cancel { min-height: 44px; }
+}
 .cwd-recent {
   position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 5; margin: 0; padding: 4px; list-style: none;
   border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.3);
@@ -1056,4 +1064,5 @@ a.btn.github-out::after {
   color: var(--text); font-family: ui-monospace, "Cascadia Code", "SF Mono", Menlo, Consolas, monospace; font-size: 0.82rem; overflow-wrap: anywhere; cursor: pointer;
 }
 .cwd-recent-option:hover, .cwd-recent-option[aria-selected="true"] { background: color-mix(in srgb, var(--accent) 14%, transparent); }
-@media (pointer: coarse) { .cwd-recent-option { min-height: 46px; } }
+@media (pointer: coarse), (max-width: 640px) { .cwd-recent-option { min-height: 46px; } }
+.cwd-recent.above { top: auto; bottom: calc(100% + 4px); }