@songsid/agend 2.3.2-beta.13 → 2.3.2-beta.15

package/dist/ui/fleet-office-pack.js

@@ -35,6 +35,10 @@
 //                                                     the org chart's states (fleet-org.js ORG_STATES) → an area; a
 //                                                     state it does not name goes to "default", else the first area
 //     "door": [640, 700],                             optional: where someone new walks in from (default: bottom middle)
+//     "mailDrop": [640, 420],                         optional (#2736): where a letter from another office lands (more
+//                                                     waiting step GAP px right of it, past any seat); default: the
+//                                                     waypoint nearest the middle off every seat (fleet-office-zones.js
+//                                                     dropPoint)
 //     "waypoints": [{ "id": "hall", "x": 640, "y": 600 }, …], "edges": [["hall", "east"], …],
 //                                                     optional: the walkable graph (else people walk straight)
 //     "straight": true,                               optional (#2634): every walk goes across, then up or down — each
@@ -120,7 +124,7 @@
 //     "seatFor": { "desks": { "0": { "for": ["atlas"], "lend": false } } },
 //                                                     a seat's reservation by area and slot (#2691), in place of the
 //                                                     pack's own for that seat; "for": [] is none (lends nothing)
-//     "door": [640, 700],
+//     "door": [640, 700], "mailDrop": [640, 420],     (#2736: kept beside the offices on disk, as furnitureNight)
 //     "waypoints": [{ "id": "hall", "x": 640, "y": 600 }, …], "edges": [["hall", "east"], …] }
 //                                                     the walkable graph, replaced whole (edges need waypoints)
 //
@@ -246,7 +250,7 @@ function states(v, at) {
 export function checkSkinPack(x, { kept = false } = {}) {
   try {
     obj(x, "pack");
-    keys(x, ["format", "id", "scale", "background", "foreground", "matte", "areas", "stateZones", "door", "waypoints", "edges", "straight", "furniture", "characters", "byInstance", "props", "bubbles", "room", "desk"], "pack");
+    keys(x, ["format", "id", "scale", "background", "foreground", "matte", "areas", "stateZones", "door", "mailDrop", "waypoints", "edges", "straight", "furniture", "characters", "byInstance", "props", "bubbles", "room", "desk"], "pack");
     if (x.format !== 1) throw new Refused("format", "1");
     if (typeof x.id !== "string" || !ID.test(x.id)) throw new Refused("id", "1–40 letters, digits, _ or -");
     if (BUILT_IN.has(x.id) || (!kept && RESERVED.has(x.id))) throw new Refused("id", "a built-in skin's id");
@@ -349,7 +353,8 @@ export function checkSkinPack(x, { kept = false } = {}) {
     const opt = (v, at) => (v === undefined ? undefined : src(v, at));
     return { ok: true, pack: {
       format: 1, id: x.id, scale, background: opt(x.background, "background"), foreground: opt(x.foreground, "foreground"), matte: x.matte === undefined ? undefined : x.matte.toLowerCase(), areas, stateZones,
-      door: x.door === undefined ? { x: LOGICAL.w / 2, y: LOGICAL.h - 10 } : point(x.door, "door"), waypoints, edges, straight: x.straight === true, furniture, characters, byInstance,
+      door: x.door === undefined ? { x: LOGICAL.w / 2, y: LOGICAL.h - 10 } : point(x.door, "door"),
+      mailDrop: x.mailDrop === undefined ? null : point(x.mailDrop, "mailDrop"), waypoints, edges, straight: x.straight === true, furniture, characters, byInstance,
       props: x.props === undefined ? {} : strips(x.props, PROPS, "props", scale), bubbles,
       room: { floor: opt(room.floor, "room.floor"), wall: opt(room.wall, "room.wall") }, desk: { back: opt(desk.back, "desk.back"), front: opt(desk.front, "desk.front"), lit: opt(desk.lit, "desk.lit") },
     } };
@@ -392,7 +397,7 @@ const reserve = (s, r) => { const { for: _f, lend: _l, ...p } = s; return r && r
 export function checkLayoutOverrides(x) {
   try {
     obj(x, "overrides");
-    keys(x, ["pack", "seats", "furniture", "furnitureNight", "seatFor", "door", "waypoints", "edges"], "overrides");
+    keys(x, ["pack", "seats", "furniture", "furnitureNight", "seatFor", "door", "mailDrop", "waypoints", "edges"], "overrides");
     if (typeof x.pack !== "string" || !ID.test(x.pack)) throw new Refused("overrides.pack", "1–40 letters, digits, _ or -");
     const out = { pack: x.pack };
     if (x.seats !== undefined) {
@@ -448,6 +453,7 @@ export function checkLayoutOverrides(x) {
       }
     }
     if (x.door !== undefined) { const q = point(x.door, "overrides.door"); out.door = [q.x, q.y]; }
+    if (x.mailDrop !== undefined) { const q = point(x.mailDrop, "overrides.mailDrop"); out.mailDrop = [q.x, q.y]; }
     if (x.edges !== undefined && x.waypoints === undefined) throw new Refused("overrides.edges", "only with waypoints");
     if (x.waypoints !== undefined) {
       const ids = new Set();
@@ -508,8 +514,9 @@ export function applyOverrides(pack, ov) {
       return { ...f, ...(q ? { x: q[0], y: q[1] } : {}), ...(n ? { night: { ...f.night, x: n[0], y: n[1] } } : {}) };
     });
     const door = ov.door ? { x: ov.door[0], y: ov.door[1] } : pack.door;
+    const mailDrop = ov.mailDrop ? { x: ov.mailDrop[0], y: ov.mailDrop[1] } : pack.mailDrop ?? null;
     const graph = ov.waypoints ? { waypoints: ov.waypoints.map((w) => ({ ...w })), edges: (ov.edges || []).map((e) => [e[0], e[1]]) } : { waypoints: pack.waypoints, edges: pack.edges };
-    return { ok: true, pack: { ...pack, areas, furniture, door, ...graph } };
+    return { ok: true, pack: { ...pack, areas, furniture, door, mailDrop, ...graph } };
   } catch (err) {
     if (err instanceof Refused) return { ok: false, error: err.message };
     throw err;
@@ -575,6 +582,9 @@ export function overridesBetween(pack, edited) {
     if (o.night.x !== f.night.x || o.night.y !== f.night.y) (ov.furnitureNight ||= {})[f.id] = [f.night.x, f.night.y];
   }
   if (pack.door.x !== edited.door.x || pack.door.y !== edited.door.y) ov.door = [edited.door.x, edited.door.y];
+  // #2736: a mail drop placed (the pack has none) or moved from the pack's.
+  const md = pack.mailDrop ?? null, ed = edited.mailDrop ?? null;
+  if (ed && (!md || md.x !== ed.x || md.y !== ed.y)) ov.mailDrop = [ed.x, ed.y];
   if (!same(pack.waypoints, edited.waypoints) || !same(pack.edges, edited.edges)) {
     ov.waypoints = edited.waypoints.map((w) => ({ id: w.id, x: w.x, y: w.y }));
     ov.edges = edited.edges.map((e) => [e[0], e[1]]);

package/dist/ui/fleet-office-store.js

@@ -1,8 +1,10 @@
 // The Office view's data, behind one small seam (fleet-office.js uses only these calls):
 // - the offices people made: the host's (GET / PUT /ui/offices, src/web-office-store.ts — one list for every viewer);
 //   what comes back is checked again here (fleet-office-model.js officesOk), never trusted;
+// - #2716: the whole-fleet office's style, kept on the host for everyone (GET /ui/offices's autoSkin; PUT
+//   /ui/office-style, an admin's) — this browser's own pick (skin(): an admin's copy of it, anyone else's own choice);
 // - this browser's own choices (localStorage; blocked storage: this page only, as the canvas's Canvas/List): which
-//   office is shown, the auto office's member filter, and its style (skin); #2540: the view (zoom and centre) and the
+//   office is shown, the auto office's member filter; #2540: the view (zoom and centre) and the
 //   fit mode (Fit or Fill) per office; #2554: whether All offices shows the lobby tile.
 // - the skin packs an admin uploaded (#2513: GET /ui/office-skins, POST to upload one, DELETE to remove one;
 //   src/web-office-skins.ts). The office editor and the layout editor call saveOffices() with the whole list and the rev
@@ -65,15 +67,26 @@ export function createOfficeStore({ fetch: get = globalThis.fetch, storage } = {
   const write = (k, v) => { try { const s = st(); if (s) s.setItem(k, v); } catch { /* this page only */ } };
   const headers = { "Content-Type": "application/json" };
   return {
-    /** { rev, offices } from the host; null when it could not be read (no offices shown but the auto one). */
+    /**
+     * { rev, offices, autoSkin } from the host (#2716 autoSkin: the whole-fleet office's style, or null: none kept); null
+     * when it could not be read (no offices shown but the auto one).
+     */
     async offices() {
       try {
         const r = await get("/ui/offices", { method: "GET", headers });
         if (!r || !r.ok) return null;
         const d = await r.json();
-        return { rev: Number.isSafeInteger(d && d.rev) ? d.rev : 0, offices: officesOk(d && d.offices) };
+        return { rev: Number.isSafeInteger(d && d.rev) ? d.rev : 0, offices: officesOk(d && d.offices), autoSkin: d && typeof d.autoSkin === "string" && PACK_ID.test(d.autoSkin) ? d.autoSkin : null };
       } catch { return null; }
     },
+    /** #2716: the whole-fleet office's style for everyone (an admin session): { ok, autoSkin } or { ok: false, status, error }. */
+    async saveAutoSkin(skin) {
+      try {
+        const r = await get("/ui/office-style", { method: "PUT", headers, body: JSON.stringify({ skin }) });
+        const d = await r.json().catch(() => ({}));
+        return r.ok ? { ok: true, autoSkin: typeof d.autoSkin === "string" ? d.autoSkin : null } : { ok: false, status: r.status, error: d.error || "office_style_failed" };
+      } catch { return { ok: false, status: 0, error: "office_style_failed" }; }
+    },
     /**
      * Replace the host's list (an admin session; `rev`: the one read — required: the host refuses a save without it,
      * so two editors never overwrite each other unseen). { ok, rev, offices } or { ok: false, status, error }.
@@ -158,6 +171,8 @@ export function createOfficeStore({ fetch: get = globalThis.fetch, storage } = {
     saveFilter: (f) => write(FILTER_KEY, JSON.stringify(filterOk(f))),
     /** The whole fleet's style here: a skin id ("pixel": desks, "studio" and "cozy": zones); none chosen yet: cozy (#2631); an unknown one is the default where used. */
     skin: () => { const v = read(SKIN_KEY); return typeof v === "string" && /^[A-Za-z0-9_-]{1,40}$/.test(v) ? v : "cozy"; },
+    /** #2716: this browser's own pick of it, or null (none made here). */
+    skinChosen: () => { const v = read(SKIN_KEY); return typeof v === "string" && /^[A-Za-z0-9_-]{1,40}$/.test(v) ? v : null; },
     saveSkin: (id) => write(SKIN_KEY, String(id)),
     /** Whether paused and stopped people are left out of the Office here (default: shown). */
     hideAsleep: () => read(ASLEEP_KEY) === "1",

package/dist/ui/fleet-office-view.js

@@ -97,6 +97,14 @@ export function miniFrame(v, size, w, h) {
   const x1 = Math.min(w, (size.w - v.x) / v.k), y1 = Math.min(h, (size.h - v.y) / v.k);
   return { x: x0, y: y0, width: Math.max(0, x1 - x0), height: Math.max(0, y1 - y0) };
 }
+/**
+ * #2737: the whole scene is in view (the overview's frame covers all of it, to half a unit), so the overview would only
+ * repeat the panel — and sit over the one corner of it a person cannot otherwise see.
+ */
+export function wholeInView(v, size, w, h) {
+  const f = miniFrame(v, size, w, h);
+  return f.x <= 0.5 && f.y <= 0.5 && f.x + f.width >= w - 0.5 && f.y + f.height >= h - 0.5;
+}
 
 // ── Kept per device, per office: the zoom and the logical point in the middle (the viewport's size may differ) ──
 

package/dist/ui/fleet-office-zones.js

@@ -140,7 +140,7 @@ export function zonesLayout(pack, nodes, prev = new Map(), { night = false } = {
     return { key: `zone/${n.name}`, node: n, x: s.x - 24, y: s.y - 52, w: 48, h: 66, seat: { x: s.x, y: s.y }, wp: null, area: s.area, slot: s.slot, night: sleepers.has(n.name) };
   });
   return { mode: "zones", rooms: [{ key: "\u0000zones", name: null, lobby: false, x: 0, y: 0, w: LOGICAL.w, h: LOGICAL.h, desks }], areas: pack.areas,
-    waypoints: pack.waypoints || [], edges: pack.edges || [], straight: pack.straight === true, door: pack.door, width: LOGICAL.w, height: LOGICAL.h, seats, crowd, over };
+    waypoints: pack.waypoints || [], edges: pack.edges || [], straight: pack.straight === true, door: pack.door, mailDrop: pack.mailDrop || null, width: LOGICAL.w, height: LOGICAL.h, seats, crowd, over };
 }
 
 // ── Walking ──
@@ -227,7 +227,9 @@ export function walkTargets(desks, graph, t, wander = true, furniture = [], nigh
  */
 export const MAIL = { MAX_WAIT: 60000, GAP: 16, SEARCH: 320, ASLEEP: new Set(["paused", "stopped"]), MAX: 20 };
 /**
- * Where the `n`th waiting letter lands: `n` GAPs along from the waypoint nearest the room's middle — the nearest whose
+ * Where the `n`th waiting letter lands. #2736: the layout's `mailDrop` when it has one — the `n`th of the slots GAP
+ * apart rightwards from it that no seat is on (never beyond the room's right edge); fewer than that, today's rule. Otherwise `n`
+ * GAPs along from the waypoint nearest the room's middle — the nearest whose
  * spot (offset included) no seat of the office is on, taken or free (someone may sit there any moment; #2561 likewise);
  * with none, the nearest point round the middle (rings GAP·2 apart, inside the room) that no seat is on; with none of
  * those either, null — the letter is not delivered here (never on a seat).
@@ -236,6 +238,12 @@ export function dropPoint(L, n = 0) {
   const mid = { x: L.width / 2, y: L.height * 0.55 }, d = (p, q) => Math.hypot(p.x - q.x, p.y - q.y);
   const seats = [...Object.values(L.areas || {}).flatMap((a) => a.seats || []), ...desksIn(L).map((q) => q.seat)];
   const onSeat = (p) => seats.some((q) => d(p, q) < 4);
+  // #2751 review: the nth off-seat slot (slots GAP apart from the mailDrop), so two letters never share one.
+  const md = L.mailDrop;
+  if (md) for (let i = 0, free = 0; md.x + i * MAIL.GAP <= L.width; i++) {
+    const p = { x: Math.round(md.x + i * MAIL.GAP), y: Math.round(md.y) };
+    if (!onSeat(p) && free++ === n) return p;
+  }
   const spots = (L.waypoints || []).map((w) => ({ x: Math.round(w.x + n * MAIL.GAP), y: Math.round(w.y), from: w }))
     .filter((p) => !onSeat(p.from) && !onSeat(p)).sort((p, q) => d(p.from, mid) - d(q.from, mid));
   if (spots.length) return { x: spots[0].x, y: spots[0].y };

package/dist/ui/fleet-office.js

@@ -75,7 +75,7 @@ import { applyOverrides, fitNight, fitSeatFor, stripBox } from "./fleet-office-p
 import { ALL_ID, LOBBY_TILE, OV, createCrossFlights, cropToRooms, fromTile, inTile, labelAt, lobbyNodes, overviewOk, tileAt, tileBox, tileLayout, visibleTiles } from "./fleet-office-overview.js";
 import { centreOn, gestureState, gestures, miniPoint, toScreen, toWorld, wheelFactor, zoomKey, zoomTo } from "./fleet-canvas-view.js";
 import { OK_MAX, OK_MIN, clampPan, desksK, edgeMatte, edgeStrips, fitScene, layerScale, miniBox, miniFrame, openingView, pinchOffice, savedOf, stepK, viewFromSaved,
-  zoomLabel, zoomOffice } from "./fleet-office-view.js";
+  wholeInView, zoomLabel, zoomOffice } from "./fleet-office-view.js";
 
 register("orgo", {
   en: {
@@ -89,6 +89,8 @@ register("orgo", {
     b_paused: "Zzz…|Back later", b_stopped: "Off duty|Zzz…", b_needs: "Need you!|A question for you|Over here!",
     b_crashed: "Ouch, crashed|Help!", b_stuck: "Hmm, stuck?|Still thinking…",
     hideAsleep: "Hide paused and stopped", nightOn: "Bedtime 0–6: the idle sleep", layoutIgnored: "Its saved layout does not fit this style: drawn as the style's own.",
+    styleForAll: "The whole fleet's style, for everyone: every device and share link", styleHere: "The whole fleet's style in this browser",
+    styleFailed: "The style was not saved for everyone ({0}).", styleBusy: "Too many changes. Try again in a minute.",
     fit: "Fit the office", overview: "Overview: click to move there", fullscreen: "Fullscreen", exitFullscreen: "Exit fullscreen",
     fill: "Fill", fillTitle: "Fill the panel (the scene's overflow is cropped; drag to see it)", zoomLevel: "Zoom {0}",
     allOffices: "All offices", labelAll: "All offices: each office is a tile, drawn in its own style. Drag to pan; the wheel, a pinch, + and − zoom, 0 fits, F is fullscreen. Double-click a tile to open that office.",
@@ -105,6 +107,8 @@ register("orgo", {
     b_paused: "Zzz…|晚點回來", b_stopped: "下班了|Zzz…", b_needs: "需要你！|有個問題|在這裡！",
     b_crashed: "糟糕，當掉了|救命！", b_stuck: "嗯，卡住了？|還在想…",
     hideAsleep: "隱藏暫停與停止的成員", nightOn: "0–6 點就寢：閒著的人去睡", layoutIgnored: "它儲存的配置不適用這個風格：以風格本身的配置顯示。",
+    styleForAll: "整個 fleet 的風格，所有人共用：每台裝置與分享連結都一樣", styleHere: "這個瀏覽器裡整個 fleet 的風格",
+    styleFailed: "風格沒有替所有人儲存（{0}）。", styleBusy: "變更太頻繁，請一分鐘後再試。",
     fit: "顯示整個辦公室", overview: "總覽：點一下移到那裡", fullscreen: "全螢幕", exitFullscreen: "結束全螢幕",
     fill: "填滿", fillTitle: "填滿整個面板（超出的部分會被裁切，拖曳即可看到）", zoomLevel: "縮放 {0}",
     allOffices: "所有辦公室", labelAll: "所有辦公室：每間辦公室是一格，以它自己的風格顯示。拖曳平移；滾輪、雙指、+ 和 − 縮放，0 顯示全部，F 切換全螢幕。雙擊一格即可開啟那間辦公室。",
@@ -531,7 +535,12 @@ export function Office({ view, traffic, q = "", lease, onOpen, assetUrl, assetIm
   const [editing, setEditing] = useState(false);
   const [choice, setChoice] = useState(() => opening ?? store.choice());
   const [filter, setFilter] = useState(() => store.filter());
-  const [style, setStyle] = useState(() => store.skin());
+  // #2716: the whole-fleet office's style — the host's (for everyone) and this browser's own pick. An admin sees the
+  // host's (their own pick only while the host keeps none) and picks for everyone; anyone else's own pick, else the host's.
+  const [hostStyle, setHostStyle] = useState(undefined);            // undefined: not read yet; null: none kept
+  const [ownStyle, setOwnStyle] = useState(() => store.skinChosen());
+  const [styleErr, setStyleErr] = useState("");
+  const style = canEdit ? hostStyle ?? ownStyle ?? "cozy" : ownStyle ?? hostStyle ?? "cozy";
   const [hideAsleep, setHideAsleep] = useState(() => store.hideAsleep());
   // Bedtime (#2568), when it is on here: the idle sleep from NIGHT.FROM to NIGHT.TO on this device's clock (read every NIGHT.TICK).
   const [nightOn, setNightOn] = useState(() => store.nightOn());
@@ -572,15 +581,34 @@ export function Office({ view, traffic, q = "", lease, onOpen, assetUrl, assetIm
   // The editor's save and its 409 re-read are stamped when sent (`ask`), never when answered; `adopt` returns the
   // snapshot in force, so a re-read the stream overtook leaves the editor's draft on the newer one.
   const asked = useRef(0), shown = useRef(null);                      // a counter; shown: { rev, offices, arrived }
+  const migrated = useRef(false);                                     // #2716: this page's own style sent up
   const ask = () => ++asked.current;
   const adopt = (d, askedAt) => {
     const cur = shown.current;
     if (!d) return cur;
     if (cur && d.rev < cur.rev && askedAt <= cur.arrived) return cur;
     shown.current = { rev: d.rev, offices: d.offices, arrived: ++asked.current };
-    setStored(d.offices); setStoredRev(d.rev);
+    setStored(d.offices); setStoredRev(d.rev); setHostStyle(d.autoSkin || null);
     return shown.current;
   };
+  // #2716: an admin's own pick from before the host kept one (or since an older host's save dropped it) goes up once.
+  useEffect(() => {
+    if (!canEdit || hostStyle !== null || !ownStyle || migrated.current || !lease) return;
+    migrated.current = true;
+    void store.saveAutoSkin(ownStyle).then((r) => { if (r.ok && lease.current()) setHostStyle(r.autoSkin); });
+  }, [canEdit, hostStyle]);
+  /** #2716: a style picked here — this browser's own; an admin's, for everyone (on failure: said, and read again). */
+  const pickStyle = (id) => {
+    store.saveSkin(id); setOwnStyle(id); setTip(null); setStyleErr("");
+    if (!canEdit || !lease) return;
+    const was = hostStyle;
+    setHostStyle(id);
+    void store.saveAutoSkin(id).then((r) => {
+      if (!lease.current() || r.ok) return;
+      setHostStyle(was);
+      setStyleErr(to(r.status === 429 ? "styleBusy" : "styleFailed", r.error));
+    });
+  };
   useEffect(() => {
     if (!lease) return undefined;
     const read = async () => { const at = ask(); const d = await store.offices(); if (lease.current()) adopt(d, at); };
@@ -832,6 +860,9 @@ export function Office({ view, traffic, q = "", lease, onOpen, assetUrl, assetIm
     if (mb && mb.style) {                                              // the overview: inside the stage, scaled to it
       const b = miniBox(size, L.width, L.height);
       for (const [a, val] of [["left", b.x], ["top", b.y], ["width", b.w], ["height", b.h]]) mb.style.setProperty(a, `${val}px`);
+      // #2737: hidden while a single office is all in view (it would show what the panel shows); All offices keeps it.
+      if (!overview && wholeInView(v, size, L.width, L.height)) mb.setAttribute("data-whole", "");
+      else mb.removeAttribute("data-whole");
     }
     const pc = pctRef.current;
     if (pc) { const lb = zoomLabel(v.k); if (pc.textContent !== lb) pc.textContent = lb; pc.setAttribute("aria-label", to("zoomLevel", lb)); }
@@ -1243,7 +1274,7 @@ export function Office({ view, traffic, q = "", lease, onOpen, assetUrl, assetIm
     <div class="oo-bar">
       <label class="oo-pick"><span class="oo-pick-label">${to("office")}</span>${officeSelect("oo-office")}</label>
       ${auto ? html`<label class="oo-pick"><span class="oo-pick-label">${to("styleLabel")}</span>
-        <select class="tb-select" value=${STYLES.includes(style) || packs.some((pk) => pk.id === style) ? style : skin.id} onChange=${(e) => { store.saveSkin(e.target.value); setStyle(e.target.value); setTip(null); }}>
+        <select class="tb-select" value=${STYLES.includes(style) || packs.some((pk) => pk.id === style) ? style : skin.id} title=${to(canEdit ? "styleForAll" : "styleHere")} onChange=${(e) => pickStyle(e.target.value)}>
           ${styles.map((id) => html`<option key=${id} value=${id}>${to(`style_${id}`)}</option>`)}
           ${packs.map((pk) => html`<option key=${`pack:${pk.id}`} value=${pk.id}>${pk.name}</option>`)}
         </select></label>` : null}
@@ -1259,6 +1290,7 @@ export function Office({ view, traffic, q = "", lease, onOpen, assetUrl, assetIm
         ${lobbyAll.length ? null : html`<span class="muted oo-note oo-lobby-none">${to("lobbyEveryone")}</span>`}` : null}
       ${custom && baseSkin.id !== custom.skin && !loading ? html`<span class="muted oo-note">${to("skinUnknown", styleName(custom.skin))}</span>` : null}
       ${placed.ignored ? html`<span class="muted oo-note">${to("layoutIgnored")}</span>` : null}
+      ${styleErr && auto ? html`<span class="note oo-note oo-style-err" role="status">${styleErr}</span>` : null}
       ${L.unseated ? html`<span class="muted oo-note">${to("unseated", L.unseated)}</span>` : null}
       ${canEdit && storedRev !== null ? html`<button type="button" class="btn btn-sm oo-edit" onClick=${() => { if (!overview) setEditing(true); }} disabled=${!!layout || overview}
         title=${overview ? to("overviewNoEdit") : undefined}>${t("orge.edit")}</button>` : null}

package/dist/ui/office-share-dialog.js

@@ -1,6 +1,9 @@
 // #2636: Office share links on the dashboard — the Office's Share… dialog (make one: which office, how long, whether
 // agents' own lines show; then its URL to copy) and the list of open ones (Settings → Access & security, and under the
 // dialog's form): each with its office, when it ends, whether lines show and who made it, Revoke and Revoke all.
+// #2716: the whole-fleet office can be shared too ("auto", the default while it is the one shown); #2715: the link's
+// look — light or dark as this dashboard shows it now (the default, the device's when it follows the device), or the
+// viewer's device's.
 // GET / POST /ui/office-share, DELETE /ui/office-share/<id|all> (web-api.ts): an admin session on the dashboard reached
 // directly only; the public link never offers these.
 import { html, useEffect, useState } from "/assets/app-html.js";
@@ -11,7 +14,8 @@ import { toast } from "/assets/ui-toast.js";
 register("oshare", {
   en: {
     share: "Share…", title: "Share the office", lead: "Anyone with the link can watch this office live — names and states, nothing else — until it ends. No sign-in.",
-    office: "Office", allOffices: "All offices", how: "For", text: "Include agents' own status lines", create: "Create link", creating: "Starting the link…",
+    office: "Office", allOffices: "All offices", wholeFleet: "Whole fleet", how: "For",
+    look: "Look", lookAuto: "The viewer's device (light or dark)", lookLight: "Light", lookDark: "Dark", text: "Include agents' own status lines", create: "Create link", creating: "Starting the link…",
     made: "Anyone with this link can watch until {0}.", copy: "Copy link", copied: "Link copied", open: "Open links", none: "No share links are open.",
     ends: "until {0}", withText: "with status lines", by: "by {0}", revoke: "Revoke", revokeAll: "Revoke all", close: "Close", failed: "The link could not be made.",
     m15: "15 minutes", m30: "30 minutes", h1: "1 hour", h2: "2 hours", h4: "4 hours", h8: "8 hours", h24: "24 hours",
@@ -22,7 +26,8 @@ register("oshare", {
   },
   "zh-TW": {
     share: "分享…", title: "分享辦公室", lead: "拿到連結的人都能即時觀看這間辦公室（只有名稱與狀態），直到連結結束，不需要登入。",
-    office: "辦公室", allOffices: "所有辦公室", how: "時間", text: "包含 agent 自己的狀態文字", create: "建立連結", creating: "正在啟動連結…",
+    office: "辦公室", allOffices: "所有辦公室", wholeFleet: "整個 fleet", how: "時間",
+    look: "外觀", lookAuto: "依觀看者的裝置（淺色或深色）", lookLight: "淺色", lookDark: "深色", text: "包含 agent 自己的狀態文字", create: "建立連結", creating: "正在啟動連結…",
     made: "拿到這個連結的人可以觀看到 {0}。", copy: "複製連結", copied: "已複製連結", open: "開啟中的連結", none: "目前沒有開啟中的分享連結。",
     ends: "到 {0} 為止", withText: "含狀態文字", by: "由 {0} 建立", revoke: "撤銷", revokeAll: "全部撤銷", close: "關閉", failed: "無法建立連結。",
     m15: "15 分鐘", m30: "30 分鐘", h1: "1 小時", h2: "2 小時", h4: "4 小時", h8: "8 小時", h24: "24 小時",
@@ -44,6 +49,16 @@ export function refusalText(d) {
   return ["disabled", "office", "duration", "too_many"].includes(e) ? to(`e_${e}`) : to("failed");
 }
 
+/**
+ * #2715: the look a new link takes by default — what this dashboard shows now: its chosen light or dark, or (following
+ * the device) the device's; unknown, the viewer's own.
+ */
+export function defaultLook(theme = globalThis.AgendTheme && typeof globalThis.AgendTheme.get === "function" ? globalThis.AgendTheme.get() : null,
+  media = typeof globalThis.matchMedia === "function" ? globalThis.matchMedia : null) {
+  if (theme === "light" || theme === "dark") return theme;
+  try { return media ? (media("(prefers-color-scheme: dark)").matches ? "dark" : "light") : "auto"; } catch { return "auto"; }
+}
+
 /** The open shares, read (and re-read after a change): { enabled, shares } or null while unread / unavailable. */
 export function useShares(get = globalThis.fetch, rev = 0) {
   const [d, setD] = useState(null);
@@ -67,7 +82,7 @@ export function ShareList({ shares, names = {}, get = globalThis.fetch, onChange
   if (!shares || !shares.length) return html`<p class="muted os-none">${to("none")}</p>`;
   return html`<div class="os-list">
     <ul class="os-rows">${shares.map((s) => html`<li key=${s.id} class="os-row">
-      <span class="os-what"><strong>${s.office === "all" ? to("allOffices") : names[s.office] || s.office_name || s.office}</strong>
+      <span class="os-what"><strong>${s.office === "all" ? to("allOffices") : s.office === "auto" ? to("wholeFleet") : names[s.office] || s.office_name || s.office}</strong>
         <span class="muted"> · ${to("ends", when(s.expiresAt))}${s.text ? ` · ${to("withText")}` : ""}</span></span>
       <button type="button" class="btn btn-sm" disabled=${busy} onClick=${() => revoke(s.id)}>${to("revoke")}</button>
     </li>`)}</ul>
@@ -75,9 +90,13 @@ export function ShareList({ shares, names = {}, get = globalThis.fetch, onChange
   </div>`;
 }
 
-/** Share…: make a link for one office (the one shown, by default) or all of them. `offices`: the stored ones. */
+/**
+ * Share…: make a link for one office (the one shown, by default), all of them, or (#2716) the whole-fleet office
+ * (`current` null: the one shown). `offices`: the stored ones.
+ */
 export function ShareDialog({ offices = [], current = null, get = globalThis.fetch, onClose }) {
-  const [office, setOffice] = useState(current && offices.some((o) => o.id === current) ? current : "all");
+  const [office, setOffice] = useState(current === null ? "auto" : current === "all" || offices.some((o) => o.id === current) ? current : "all");
+  const [theme, setTheme] = useState(() => defaultLook());
   const [minutes, setMinutes] = useState(60);
   const [text, setText] = useState(false);
   const [busy, setBusy] = useState(false);
@@ -89,7 +108,7 @@ export function ShareDialog({ offices = [], current = null, get = globalThis.fet
   const create = async () => {
     setBusy(true); setError("");
     try {
-      const r = await get("/ui/office-share", { method: "POST", headers: JSON_HEADERS, body: JSON.stringify({ office, minutes, text }) });
+      const r = await get("/ui/office-share", { method: "POST", headers: JSON_HEADERS, body: JSON.stringify({ office, minutes, text, theme }) });
       const d = await r.json().catch(() => ({}));
       if (r.ok && d && typeof d.url === "string") setMade(d); else setError(refusalText(d));
     } catch { setError(to("failed")); }
@@ -110,13 +129,18 @@ export function ShareDialog({ offices = [], current = null, get = globalThis.fet
       </div>` : html`<div class="os-form">
         <label class="field"><span>${to("office")}</span>
           <select class="tb-select" value=${office} onChange=${(e) => setOffice(e.target.value)} disabled=${busy}>
-            ${offices.length > 1 || !offices.length ? html`<option value="all">${to("allOffices")}</option>` : null}
+            <option value="auto">${to("wholeFleet")}</option>
+            ${offices.length > 1 || office === "all" ? html`<option value="all">${to("allOffices")}</option>` : null}
             ${offices.map((o) => html`<option key=${o.id} value=${o.id}>${o.name}</option>`)}
           </select></label>
         <label class="field"><span>${to("how")}</span>
           <select class="tb-select" value=${String(minutes)} onChange=${(e) => setMinutes(Number(e.target.value))} disabled=${busy}>
             ${DURATIONS.map(([k, m]) => html`<option key=${k} value=${String(m)}>${to(k)}</option>`)}
           </select></label>
+        <label class="field"><span>${to("look")}</span>
+          <select class="tb-select os-look" value=${theme} onChange=${(e) => setTheme(e.target.value)} disabled=${busy}>
+            ${[["auto", "lookAuto"], ["light", "lookLight"], ["dark", "lookDark"]].map(([v, k]) => html`<option key=${v} value=${v}>${to(k)}</option>`)}
+          </select></label>
         <label class="check"><input type="checkbox" checked=${text} onChange=${(e) => setText(e.target.checked)} disabled=${busy} /> ${to("text")}</label>
         ${error ? html`<p class="err os-err" role="alert">${error}</p>` : null}
       </div>`}

package/dist/ui/panel-log.js

@@ -62,7 +62,7 @@ register("log", {
     ev_backend_unreachable: "CLI unreachable", ev_startup_backend_unreachable: "CLI unreachable at start", ev_backend_launch_warning: "Launch warning",
     ev_clear_action: "Conversation cleared", ev_normal_exit_action: "Exited", ev_reply_drop_detected: "A reply went missing",
     ev_reply_drop_recovered: "Missing reply recovered", ev_reply_drop_unrecovered: "Missing reply not recovered",
-    ev_supervision_ended: "Supervision ended", ev_tmux_server_crash: "tmux crashed", ev_malformed_tool_call: "Malformed tool call", ev_health_check_error: "Health check error", ev_context_lost: "Started fresh: context lost", ev_working_state: "Working-state journal",
+    ev_supervision_ended: "Supervision ended", ev_tmux_server_crash: "tmux crashed", ev_malformed_tool_call: "Malformed tool call", ev_health_check_error: "Health check error", ev_context_lost: "Started fresh: context lost", ev_working_state: "Working-state journal", ev_kiro_reconcile: "Kiro conversation reconciliation",
   },
   "zh-TW": {
     offTitle: "紀錄未開啟",
@@ -100,7 +100,7 @@ register("log", {
     ev_backend_unreachable: "連不到 CLI", ev_startup_backend_unreachable: "啟動時連不到 CLI", ev_backend_launch_warning: "啟動警告",
     ev_clear_action: "對話已清除", ev_normal_exit_action: "已結束", ev_reply_drop_detected: "有回覆遺失",
     ev_reply_drop_recovered: "遺失的回覆已補回", ev_reply_drop_unrecovered: "遺失的回覆沒有補回",
-    ev_supervision_ended: "監督結束", ev_tmux_server_crash: "tmux 當掉", ev_malformed_tool_call: "格式錯誤的工具呼叫", ev_health_check_error: "健康檢查錯誤", ev_context_lost: "改用全新對話：context 遺失", ev_working_state: "工作狀態紀錄",
+    ev_supervision_ended: "監督結束", ev_tmux_server_crash: "tmux 當掉", ev_malformed_tool_call: "格式錯誤的工具呼叫", ev_health_check_error: "健康檢查錯誤", ev_context_lost: "改用全新對話：context 遺失", ev_working_state: "工作狀態紀錄", ev_kiro_reconcile: "Kiro 對話接續處理",
   },
 });
 const tl = (key, ...a) => t(`log.${key}`, ...a);

package/dist/ui/settings-strings.js

@@ -185,6 +185,7 @@ register("settings", {
     wizardBackendFound: "Found on this host: {0}",
     wizardBackendNone: "No backend CLI found on this host — install one first.",
     wizardAgentName: "First agent name",
+    wizardGeneralNote: "This agent is the General: it answers in the chat's own General topic and hands work to the agents you add later.",
     wizardAgentWhich: "Which agent answers on this bot",
     wizardAgentNew: "A new agent",
     wizardAgentExisting: "An agent you already have",
@@ -838,6 +839,7 @@ register("settings", {
     wizardBackendFound: "在這台主機上找到：{0}",
     wizardBackendNone: "這台主機上找不到任何後端 CLI —— 請先安裝一個。",
     wizardAgentName: "第一個 agent 名稱",
+    wizardGeneralNote: "這個 agent 就是 General：它在聊天本身的 General 主題回覆，並把工作分給你之後加入的 agent。",
     wizardAgentWhich: "由哪個 agent 在這個機器人上回覆",
     wizardAgentNew: "新的 agent",
     wizardAgentExisting: "既有的 agent",

package/dist/ui/settings-wizard.js

@@ -44,7 +44,11 @@ export function SetupWizard({ ctx, onClose }) {
       const agents = Array.isArray(e.agents) ? e.agents : [];
       const names = new Set(agents.map((a) => a.name));
       let n = 1; while (names.has(`agent-${n}`)) n++;
-      setW({ step: 1, env: e, backend: (e.backends || [])[0] || "claude-code", working_directory: "", instance_name: `agent-${n}`,
+      // M-2069: on a fleet with no chat connection and no General, the new agent is the General — named "general" (unless
+      // an agent has that name already: #2744 review).
+      const general = !!e.first_general && !names.has("general");
+      setW({ step: 1, env: e, backend: (e.backends || [])[0] || "claude-code", working_directory: "", instance_name: general ? "general" : `agent-${n}`,
+        general, defaultName: `agent-${n}`, nameTyped: false,
         agent: agents.length ? "existing" : "new", existing_name: agents.length ? agents[0].name : "",
         platform: "telegram", token: "", group_id: "", guild_id: "", general_channel_id: "", admin_user_id: "",
         identity: null, guilds: [], plan: null, offset: 0 });
@@ -54,6 +58,11 @@ export function SetupWizard({ ctx, onClose }) {
   // Every field the plan or a probe is about moves the revision (#1529 review r2): a plan or Detect that began before an
   // edit — target, admin, backend, directory, name — is dropped when it lands, never committed or written over the edit.
   const set = (k) => (v) => { bump(); setW((x) => ({ ...x, [k]: v })); };
+  // #2744 review: the General works in its own folder — a typed directory makes the new agent a worker, so a name not
+  // typed by hand goes back to agent-N (and "general" again once the directory is cleared).
+  const asGeneral = (x) => x.general && !x.working_directory;
+  const setDir = (v) => { bump(); setW((x) => { const next = { ...x, working_directory: v };
+    return x.nameTyped ? next : { ...next, instance_name: asGeneral(next) ? "general" : x.defaultName }; }); };
   // No token env: the plan generates one (#1519 P1: AGEND_<PLATFORM>_<ID>_TOKEN, unique) and the commit carries the plan's.
   // An existing agent (#1519 P7) is named and nothing else: the server keeps its directory and backend.
   const input = () => ({
@@ -144,9 +153,10 @@ export function SetupWizard({ ctx, onClose }) {
         <p class="note">${tn("wizardAgentExistingNote")}</p></div>` : html`${which}<div class="field"><label for="wz-be">${tn("wizardBackend")}</label>
         <${Select} id="wz-be" value=${w.backend} onChange=${set("backend")} options=${w.env.backends && w.env.backends.length ? w.env.backends : BACKENDS} />
         <p class="note">${w.env.backends && w.env.backends.length ? tn("wizardBackendFound", w.env.backends.join(", ")) : tn("wizardBackendNone")}</p></div>
-      <div class="field"><label for="wz-wd">${tn("wizardDir")}</label><input id="wz-wd" type="text" placeholder="/home/you/projects/app" aria-describedby="wz-wd-note" value=${dirText} onInput=${(e) => set("working_directory")(onDirText(e.target.value))} />
+      <div class="field"><label for="wz-wd">${tn("wizardDir")}</label><input id="wz-wd" type="text" placeholder="/home/you/projects/app" aria-describedby="wz-wd-note" value=${dirText} onInput=${(e) => setDir(onDirText(e.target.value))} />
         <p class="note" id="wz-wd-note">${w.env.workspaces_dir && w.instance_name ? tn("wizardDirDefault", `${w.env.workspaces_dir}/${w.instance_name}`) : tn("wizardDirDefaultName")}</p></div>
-      <div class="field"><label for="wz-name">${agents.length ? tn("wizardAgentNewName") : tn("wizardAgentName")}</label><input id="wz-name" type="text" value=${nameText} onInput=${(e) => set("instance_name")(onNameText(e.target.value))} /></div>`;
+      <div class="field"><label for="wz-name">${agents.length ? tn("wizardAgentNewName") : tn("wizardAgentName")}</label><input id="wz-name" type="text" value=${nameText} onInput=${(e) => { const v = onNameText(e.target.value); bump(); setW((x) => ({ ...x, instance_name: v, nameTyped: true })); }} />
+        ${asGeneral(w) ? html`<p class="note">${tn("wizardGeneralNote")}</p>` : null}</div>`;
   } else if (w.step === 2) {
     body = html`<div class="seg-inline" role="group" aria-label=${tn("wizardPlatform")}>
         ${["telegram", "discord"].map((p) => html`<button key=${p} type="button" class=${`btn${w.platform === p ? " btn-primary" : ""}`} aria-pressed=${w.platform === p ? "true" : "false"}
@@ -169,7 +179,8 @@ export function SetupWizard({ ctx, onClose }) {
     body = !w.plan ? html`<p class="note">${tn("wizardPlanLoading")}</p>` : html`
       <p><strong>${tn("wizardWillWrite")}</strong></p>
       <pre class="s-yaml">${toYaml({ channels: [w.plan.channel], instances: { [w.plan.instance.name]: { working_directory: w.plan.instance.working_directory, backend: w.plan.instance.backend, channel_id: w.plan.instance.channel_id,
-        ...(w.plan.instance.topic && w.plan.instance.topic.to != null ? { topic_id: w.plan.instance.topic.to } : {}) } } })}</pre>
+        ...(w.plan.instance.topic && w.plan.instance.topic.to != null ? { topic_id: w.plan.instance.topic.to } : {}),
+        ...(w.plan.instance.general ? { general_topic: true, ...(w.plan.instance.general.topic_id != null ? { topic_id: w.plan.instance.general.topic_id } : {}) } : {}) } } })}</pre>
       ${w.plan.instance && w.plan.instance.existing ? html`<p class="note">${tn("wizardAgentExistingNote")}</p>` : null}
       ${w.plan.instance && w.plan.instance.topic ? html`<p class="feedback warning">${w.plan.instance.topic.to == null
         ? tn("wizardTopicNotCarried", w.plan.instance.topic.from) : tn("wizardTopicGeneral")}</p>` : null}

package/dist/ui/shared/app.css

@@ -1798,6 +1798,8 @@ strong.org-name { font-size: var(--fs-sm); color: var(--text); }
 .oo-zoom .oo-fill { font-size: 11px; font-weight: var(--fw-semibold); }
 .oo-zoom .oo-fill.on { background: var(--accent-dim); color: var(--text); }
 .oo-stage.editing .oo-mini { display: none; }
+/* #2737: a single office all in view (the page sets data-whole): the overview would repeat the panel. */
+.oo-mini[data-whole] { display: none; }
 .oo-mini-scene { fill: var(--bg); }
 .oo-mini-room { fill: var(--surface); stroke: var(--border-strong); stroke-width: 6; }
 .oo-mini-dot { fill: var(--text-3); }
@@ -1851,6 +1853,10 @@ html.oo-immersive .p-fleet > .panel-body { z-index: 50; }
 .ol-seat > circle { fill: var(--ok); }
 .ol-furniture > rect { fill: var(--warn); }
 .ol-door > rect { fill: var(--danger); }
+/* #2736: the mail drop — an envelope; dashed while it is the automatic spot (the pack names none). */
+.ol-mail > rect { fill: var(--accent-dim); }
+.ol-mail > .ol-flap { fill: none; stroke: var(--text); stroke-width: 1.5; pointer-events: none; }
+.ol-mail.auto > rect { stroke-dasharray: 3 2; fill-opacity: 0.6; }
 /* #2665: an item's night place — a moon on a faint disc, a thin dashed line to its day place. */
 .ol-night > circle { fill: var(--surface); fill-opacity: 0.85; }
 .ol-night > .ol-moon { fill: var(--warn); stroke: none; pointer-events: none; }

package/dist/ui/shared/setup-host-text.js

@@ -35,6 +35,8 @@ export const HOST_MESSAGES = [
   // Conflicts (agentConflict, newConnectionConflict, webOnlyConflict, token-env-name.ts).
   ["an agent called \"{0}\" already exists — connect it as an existing agent, or choose another name", "已經有名為「{0}」的 agent —— 請把它當作既有的 agent 連接，或換一個名稱"],
   ["there is no agent called \"{0}\"", "沒有名為「{0}」的 agent"],
+  ["the General agent works in its own folder — leave the working directory empty to make \"{0}\" the General, or choose another name", "General agent 使用自己的資料夾 —— 若要讓「{0}」成為 General，請把工作目錄留空，或換一個名稱"],
+  ["the name \"{0}\" is kept for the fleet's General agent — choose another name", "「{0}」這個名稱保留給 fleet 的 General agent —— 請換一個名稱"],
   ["a connection called \"{0}\" already exists — a new connection never replaces one", "已經有名為「{0}」的連線 —— 新的連線不會取代既有的連線"],
   ["this fleet already has a chat connection — add the agent with New agent instead", "這個 fleet 已經有聊天連線 —— 請改用「新增 Agent」加入 agent"],
   ["{0} is reserved", "{0} 是保留名稱"],

package/dist/web-api.js

@@ -450,7 +450,7 @@ function handleAppIcon(req, res, url, ctx, method) {
 }
 /**
  * #2636: Office share links — GET /ui/office-share (the open ones, and whether this fleet offers them), POST { office,
- * minutes?, text? } (a new one; answers its URL once its tunnel is up, or why not), DELETE /ui/office-share/<id|all>.
+ * minutes?, text?, theme? } (a new one; #2715 theme "auto" | "light" | "dark"; answers its URL once its tunnel is up, or why not), DELETE /ui/office-share/<id|all>.
  * An admin session only — on the dashboard reached directly, or (the user, #2636 follow-up) a fleet admin signed in over
  * the /web public link: the same check either way. Never the CLI token, a read-only session or a guest. The share's own
  * tunnel and gateway stay apart from /web's. The person is asked again once the body is in.
@@ -515,12 +515,13 @@ function handleOfficeShare(req, res, url, ctx, path, method) {
             return;
         }
         if (!body || typeof body !== "object" || Array.isArray(body) || typeof body.office !== "string"
-            || (body.minutes !== undefined && typeof body.minutes !== "number") || (body.text !== undefined && typeof body.text !== "boolean")) {
-            json(res, 400, { error: "office (string), minutes? (number), text? (boolean)" });
+            || (body.minutes !== undefined && typeof body.minutes !== "number") || (body.text !== undefined && typeof body.text !== "boolean")
+            || (body.theme !== undefined && typeof body.theme !== "string")) {
+            json(res, 400, { error: "office (string), minutes? (number), text? (boolean), theme? (auto, light or dark)" });
             return;
         }
         const made = await service.create({ office: body.office, owner: now.person, ...(typeof body.minutes === "number" ? { minutes: body.minutes } : {}),
-            ...(typeof body.text === "boolean" ? { text: body.text } : {}) });
+            ...(typeof body.text === "boolean" ? { text: body.text } : {}), ...(typeof body.theme === "string" ? { theme: body.theme } : {}) });
         if (!made.ok) {
             const status = made.error === "disabled" ? 404 : made.error === "tunnel" ? 503 : made.error === "too_many" ? 409 : 400;
             json(res, status, { error: made.error, ...(made.reason ? { reason: made.reason } : {}) });
@@ -2484,6 +2485,75 @@ export function handleWebRequest(req, res, url, ctx) {
         });
         return true;
     }
+    // #2716: PUT /ui/office-style { skin }: the whole-fleet office's style for every viewer, device and share link (a skin
+    // id, or null for the default; read back as GET /ui/offices's autoSkin). Who may save the offices may set it, as they
+    // would: an admin session, never the CLI token or the public link; asked again once the body is in; counted with the
+    // offices' saves. Every page hears `offices` and reads again.
+    if (method === "PUT" && path === "/ui/office-style") {
+        const store = ctx.officeStore;
+        if (!store) {
+            json(res, 404, { error: "Offices are not kept on this fleet" });
+            return true;
+        }
+        if (gatewayRequestContext(req)) {
+            json(res, 403, { error: "offices_not_over_public_link" });
+            return true;
+        }
+        const who = () => {
+            const verdict = evaluateWebRequest(req, url, ctx.webToken ?? null, ctx.webSessions, { touch: false });
+            if (verdict.kind !== "allow")
+                return { status: 401 };
+            return verdict.via === "session" && verdict.session?.tier === "admin" ? { person: verdict.session.owner ? webPersonKey(verdict.session.owner) : "admin-session" } : { status: 403 };
+        };
+        const refuse = (status) => json(res, status, { error: status === 401 ? WEB_TOKEN_INVALID_MESSAGE : "offices_need_an_admin_session" });
+        const first = who();
+        if ("status" in first) {
+            refuse(first.status);
+            return true;
+        }
+        (async () => {
+            let body;
+            try {
+                body = await parseBody(req);
+            }
+            catch {
+                json(res, 400, { error: "Invalid JSON" });
+                return;
+            }
+            if (!permitWebContinuation(req, res, ctx))
+                return;
+            const now = who();
+            if ("status" in now) {
+                refuse(now.status);
+                return;
+            }
+            if (!body || typeof body !== "object" || Array.isArray(body) || !("skin" in body) || Object.keys(body).some(k => k !== "skin")) {
+                json(res, 400, { error: "office_style_invalid", detail: "{ skin: a skin id, or null }" });
+                return;
+            }
+            const limiter = ctx.officeWrites, allowed = limiter ? limiter.check(now.person) : { ok: true };
+            if (!allowed.ok) {
+                res.setHeader("Retry-After", String(allowed.retry_after_s));
+                json(res, 429, { error: "offices_rate_limited", retry_after_s: allowed.retry_after_s });
+                return;
+            }
+            const r = store.setAutoSkin(body.skin);
+            if (!r.ok) {
+                json(res, r.status, { error: r.error, ...(r.detail ? { detail: r.detail } : {}) });
+                return;
+            }
+            limiter?.record(now.person);
+            ctx.emitSseEvent("offices", { rev: r.rev });
+            json(res, 200, { rev: r.rev, autoSkin: r.autoSkin });
+        })().catch(err => {
+            ctx.logger.error({ err: err.message }, "Saving the office style failed");
+            try {
+                json(res, 500, { error: "Saving the office style failed" });
+            }
+            catch { /* already answered */ }
+        });
+        return true;
+    }
     // #2578: GET /ui/office-acts { acts }: the agents' live acts (office_set), read as the offices are (the public link
     // too, which has no stream); every change also comes as `office_acts` on the stream. Nothing here writes one.
     if (method === "GET" && path === "/ui/office-acts") {