diff --git a/packages/cli/src/serve.ts b/packages/cli/src/serve.ts
index f4a9df5..1f98b85 100644
--- a/packages/cli/src/serve.ts
+++ b/packages/cli/src/serve.ts
@@ -1,5 +1,5 @@
 import { spawn } from "node:child_process";
-import { createReadStream, existsSync, readFileSync } from "node:fs";
+import { createReadStream, existsSync, readFileSync, writeFileSync } from "node:fs";
 import http from "node:http";
 import type { AddressInfo } from "node:net";
 import { dirname, extname, join, normalize, resolve, sep } from "node:path";
@@ -49,6 +49,11 @@ export interface ServeOptions {
 export async function serve(opts: ServeOptions): Promise<void> {
   const webDist = resolveWebDist();
   const upstream = new URL(opts.connection.server);
+  // Layout sidecar: <notebook minus .yaml>.layout.json, beside the notebook —
+  // written by PUT /layout ("Save layout" in the UI), read fresh per page load
+  // so external edits/git pulls apply on reload. Git-committable.
+  const sidecarPath =
+    opts.notebookPath.replace(/\.ya?ml$/i, "") + ".layout.json";
 
   // Config injected into index.html as `window.__DASHBOOK__`, so the bare URL
   // (http://host:port/) loads the served notebook over the same-origin `/og`
@@ -85,6 +90,19 @@ export async function serve(opts: ServeOptions): Promise<void> {
       sendFile(res, opts.notebookPath, ".yaml");
       return;
     }
+    // 2b. layout sidecar persistence (local file I/O — never proxied)
+    if (path === "/layout") {
+      if (req.method !== "PUT") {
+        res.writeHead(405, {
+          "content-type": "text/plain; charset=utf-8",
+          allow: "PUT",
+        });
+        res.end("405 Method Not Allowed");
+        return;
+      }
+      receiveLayout(req, res, sidecarPath);
+      return;
+    }
     // 3. real static files under web-dist (never index.html — that's injected)
     const staticPath = safeJoin(webDist, path);
     if (
@@ -96,8 +114,19 @@ export async function serve(opts: ServeOptions): Promise<void> {
       sendFile(res, staticPath, extname(staticPath));
       return;
     }
-    // 4. SPA fallback — index.html with the view config injected.
-    sendIndex(res, join(webDist, "index.html"), viewConfig);
+    // 4. SPA fallback — index.html with the view config injected. The sidecar
+    // rides the injection (read per request, so a reload picks up external
+    // edits) and canPersistLayout tells the SPA the Save-layout PUT exists.
+    const config: Record<string, unknown> = {
+      ...viewConfig,
+      canPersistLayout: true,
+    };
+    try {
+      config.layout = JSON.parse(readFileSync(sidecarPath, "utf8")) as unknown;
+    } catch {
+      /* no sidecar yet, or unreadable/garbage — the SPA validates anyway */
+    }
+    sendIndex(res, join(webDist, "index.html"), config);
   });
 
   await new Promise<void>((resolvePromise, reject) => {
@@ -156,6 +185,55 @@ function buildOpenUrl(port: number): string {
   return `http://127.0.0.1:${port}/`;
 }
 
+/** Max accepted layout-sidecar body — far above any real notebook's overrides. */
+const LAYOUT_BODY_LIMIT = 256 * 1024;
+
+/**
+ * PUT /layout: collect the JSON body (size-capped), validate it parses, and
+ * pretty-print it to the sidecar so the file diffs cleanly under git.
+ */
+function receiveLayout(
+  req: http.IncomingMessage,
+  res: http.ServerResponse,
+  sidecarPath: string,
+): void {
+  const chunks: Buffer[] = [];
+  let size = 0;
+  let aborted = false;
+  req.on("data", (chunk: Buffer) => {
+    if (aborted) return;
+    size += chunk.length;
+    if (size > LAYOUT_BODY_LIMIT) {
+      aborted = true;
+      res.writeHead(413, { "content-type": "text/plain; charset=utf-8" });
+      res.end("413 Payload Too Large");
+      req.destroy();
+      return;
+    }
+    chunks.push(chunk);
+  });
+  req.on("end", () => {
+    if (aborted) return;
+    let parsed: unknown;
+    try {
+      parsed = JSON.parse(Buffer.concat(chunks).toString("utf8"));
+    } catch {
+      res.writeHead(400, { "content-type": "text/plain; charset=utf-8" });
+      res.end("400 Bad Request: body must be JSON");
+      return;
+    }
+    try {
+      writeFileSync(sidecarPath, `${JSON.stringify(parsed, null, 2)}\n`);
+    } catch (err) {
+      res.writeHead(500, { "content-type": "text/plain; charset=utf-8" });
+      res.end(`500 could not write layout sidecar: ${String(err)}`);
+      return;
+    }
+    res.writeHead(204);
+    res.end();
+  });
+}
+
 function sendFile(res: http.ServerResponse, file: string, ext: string): void {
   const stream = createReadStream(file);
   // Commit the 200 only once the file is confirmed readable (`open`). On a read
diff --git a/packages/web/src/App.tsx b/packages/web/src/App.tsx
index 64cbca1..92a135e 100644
--- a/packages/web/src/App.tsx
+++ b/packages/web/src/App.tsx
@@ -67,7 +67,9 @@ import {
   EMPTY_OVERRIDES,
   isHidden,
   loadOverrides,
+  migrateV2,
   notebookKey,
+  pruneOverrides,
   saveOverrides,
   withColor,
   withHidden,
@@ -167,13 +169,30 @@ function RuntimeApp({ config }: { config: AppConfig }): React.ReactElement {
   >(null);
   const [cmdOpen, setCmdOpen] = useState(false);
 
-  // Layout edit mode: browser-local drag-reorder + width-resize, persisted to
-  // localStorage. An override layer over the declared layout; Reset clears it.
+  // Layout edit mode: drag-reorder + width-resize. Two override layers, both
+  // per-cell: the committed sidecar (`<notebook>.layout.json`, injected by the
+  // view BFF as `config.initialLayout`) is the base; localStorage holds
+  // personal changes since the last save and wins wholesale when present.
+  // "Save layout" writes the effective set to the sidecar and clears the
+  // local layer; Reset clears only the local layer.
   const [editing, setEditing] = useState(false);
   const layoutKey = useMemo(() => notebookKey(config.notebook), [config.notebook]);
-  const [overrides, setOverrides] = useState<LayoutOverrides>(() =>
-    loadOverrides(layoutKey),
+  const liveIds = useMemo(
+    () => new Set(config.notebook.cells.map((c) => c.id)),
+    [config.notebook],
+  );
+  // The committed baseline (the sidecar's contents) — seeded from the page
+  // load and ADVANCED on every successful save, so Reset always falls back to
+  // the latest saved arrangement, not the page-load snapshot.
+  const [committedLayout, setCommittedLayout] = useState<LayoutOverrides | null>(
+    config.initialLayout,
   );
+  const [overrides, setOverrides] = useState<LayoutOverrides>(() => {
+    const local =
+      loadOverrides(layoutKey) ?? migrateV2(config.notebook.title, liveIds);
+    if (local !== null) return pruneOverrides(local, liveIds);
+    return config.initialLayout ?? EMPTY_OVERRIDES;
+  });
   const updateOverrides = useCallback(
     (next: LayoutOverrides) => {
       setOverrides(next);
@@ -182,9 +201,44 @@ function RuntimeApp({ config }: { config: AppConfig }): React.ReactElement {
     [layoutKey],
   );
   const resetLayout = useCallback(() => {
-    setOverrides(EMPTY_OVERRIDES);
+    // Drop the personal layer only — the committed sidecar (if any) remains
+    // the base. Removing a committed arrangement = delete the sidecar file.
+    setOverrides(committedLayout ?? EMPTY_OVERRIDES);
     clearOverrides(layoutKey);
-  }, [layoutKey]);
+  }, [layoutKey, committedLayout]);
+  const [savingLayout, setSavingLayout] = useState(false);
+  // Save-layout outcome — its own notice type (success OR error), announced
+  // by a dedicated bridge (the ToastProvider mounts inside this tree).
+  const [layoutNotice, setLayoutNotice] = useState<LayoutNotice | null>(null);
+  const persistLayout = useCallback(async () => {
+    const effective = pruneOverrides(overrides, liveIds);
+    setSavingLayout(true);
+    try {
+      const res = await fetch("/layout", {
+        method: "PUT",
+        headers: { "content-type": "application/json" },
+        body: JSON.stringify({ version: 1, ...effective }),
+      });
+      if (!res.ok) throw new Error(`PUT /layout returned ${res.status}`);
+      // Disk is now the base — clear the personal layer, keep the canvas
+      // as-is, and advance the committed baseline Reset falls back to.
+      clearOverrides(layoutKey);
+      setOverrides(effective);
+      setCommittedLayout(effective);
+      setLayoutNotice((prev) => ({
+        message: "Layout saved to the notebook's .layout.json",
+        seq: (prev?.seq ?? 0) + 1,
+      }));
+    } catch (err) {
+      setLayoutNotice((prev) => ({
+        message: `Layout save failed: ${err instanceof Error ? err.message : String(err)}`,
+        tone: "error",
+        seq: (prev?.seq ?? 0) + 1,
+      }));
+    } finally {
+      setSavingLayout(false);
+    }
+  }, [overrides, liveIds, layoutKey]);
 
   // Tabs partition the one flat cell list into named pages (host-shell view
   // tier). Derived from the *declared* cells so the bar is stable across runtime
@@ -320,6 +374,7 @@ function RuntimeApp({ config }: { config: AppConfig }): React.ReactElement {
     >
       <ToastProvider>
       <SuccessToastBridge feedback={snapshot.mutationFeedback} />
+      <LayoutToastBridge notice={layoutNotice} />
       <Shell
         header={
           <div className="sticky top-0 z-30 border-b border-border bg-background">
@@ -354,10 +409,23 @@ function RuntimeApp({ config }: { config: AppConfig }): React.ReactElement {
                   size="sm"
                   onClick={resetLayout}
                   className="text-muted-foreground"
+                  title="Discard personal layout changes (the saved .layout.json, if any, remains)"
                 >
                   Reset
                 </Button>
               )}
+              {editing && config.canPersistLayout && (
+                <Button
+                  type="button"
+                  variant="outline"
+                  size="sm"
+                  onClick={() => void persistLayout()}
+                  disabled={savingLayout}
+                  title="Write the current arrangement to the notebook's .layout.json (git-committable)"
+                >
+                  {savingLayout ? "Saving…" : "Save layout"}
+                </Button>
+              )}
               <Button
                 type="button"
                 variant="outline"
@@ -522,6 +590,32 @@ function RuntimeApp({ config }: { config: AppConfig }): React.ReactElement {
  * pre-mount success is never replayed. Errors/no-ops never reach
  * `mutationFeedback`, so this can only announce real successes.
  */
+interface LayoutNotice {
+  message: string;
+  tone?: "error";
+  seq: number;
+}
+
+/** Announces Save-layout outcomes — success or error tone — once per seq. */
+function LayoutToastBridge({
+  notice,
+}: {
+  notice: LayoutNotice | null;
+}): null {
+  const manager = useToastManager();
+  const lastSeq = React.useRef(notice?.seq ?? 0);
+  useEffect(() => {
+    if (notice !== null && notice.seq !== lastSeq.current) {
+      lastSeq.current = notice.seq;
+      manager.add({
+        title: notice.message,
+        ...(notice.tone !== undefined ? { tone: notice.tone } : {}),
+      });
+    }
+  }, [notice, manager]);
+  return null;
+}
+
 export function SuccessToastBridge({
   feedback,
 }: {
diff --git a/packages/web/src/components/ui/toast.tsx b/packages/web/src/components/ui/toast.tsx
index a5aa45a..61d0f3d 100644
--- a/packages/web/src/components/ui/toast.tsx
+++ b/packages/web/src/components/ui/toast.tsx
@@ -21,10 +21,11 @@ const LIMIT = 3;
 interface ToastItem {
   id: number;
   title: string;
+  tone?: "error";
 }
 
 interface ToastManager {
-  add: (options: { title: string }) => void;
+  add: (options: { title: string; tone?: "error" }) => void;
 }
 
 const ToastContext = createContext<ToastManager | null>(null);
@@ -54,9 +55,12 @@ export function ToastProvider({
   }, []);
 
   const add = useCallback(
-    ({ title }: { title: string }) => {
+    ({ title, tone }: { title: string; tone?: "error" }) => {
       const id = nextId.current++;
-      setToasts((prev) => [...prev.slice(-(LIMIT - 1)), { id, title }]);
+      setToasts((prev) => [
+        ...prev.slice(-(LIMIT - 1)),
+        { id, title, ...(tone !== undefined ? { tone } : {}) },
+      ]);
       timers.current.set(
         id,
         setTimeout(() => dismiss(id), TIMEOUT_MS),
@@ -84,9 +88,13 @@ export function ToastProvider({
             <div
               key={toast.id}
               role="status"
-              className="flex items-start justify-between gap-3 rounded-lg border border-border bg-card px-4 py-3 shadow-lg"
+              className={
+                toast.tone === "error"
+                  ? "flex items-start justify-between gap-3 rounded-lg border border-destructive/50 bg-card px-4 py-3 shadow-lg"
+                  : "flex items-start justify-between gap-3 rounded-lg border border-border bg-card px-4 py-3 shadow-lg"
+              }
             >
-              <p className="text-sm text-foreground">{toast.title}</p>
+              <p className={toast.tone === "error" ? "text-sm text-destructive" : "text-sm text-foreground"}>{toast.title}</p>
               <button
                 type="button"
                 aria-label="dismiss"
diff --git a/packages/web/src/config.ts b/packages/web/src/config.ts
index e01531a..64b4c3e 100644
--- a/packages/web/src/config.ts
+++ b/packages/web/src/config.ts
@@ -2,12 +2,26 @@ import { parseNotebook } from "@modernrelay/notebook-core";
 import { Client, ServerSource } from "@modernrelay/notebook-client";
 import type { Source } from "@modernrelay/notebook-core";
 
+import {
+  normalizeOverrides,
+  pruneOverrides,
+  type LayoutOverrides,
+} from "./layout-overrides.js";
+
 import defaultServerNotebookYaml from "../../../examples/company-server.notebook.yaml?raw";
 
 export interface AppConfig {
   notebook: ReturnType<typeof parseNotebook>;
   source: Source;
   label: string;
+  /**
+   * The committed layout sidecar (`<notebook>.layout.json`), injected by the
+   * `view` BFF — the base layer under any personal localStorage tweaks. Null
+   * without a sidecar (or outside the BFF, e.g. Vite dev).
+   */
+  initialLayout: LayoutOverrides | null;
+  /** True when the serving BFF accepts PUT /layout ("Save layout" enabled). */
+  canPersistLayout: boolean;
 }
 
 /**
@@ -21,6 +35,8 @@ interface InjectedConfig {
   graph?: string;
   branch?: string;
   allowRawGq?: boolean;
+  layout?: unknown;
+  canPersistLayout?: boolean;
 }
 declare global {
   interface Window {
@@ -94,6 +110,14 @@ export async function buildConfig(): Promise<AppConfig> {
     token: readToken(server),
     graphId: graph,
   });
+  // Layout sidecar contents ride the injected config (read per page load by
+  // the BFF); validate + prune against this notebook's cells before use.
+  const liveIds = new Set(notebook.cells.map((c) => c.id));
+  const initialLayout =
+    injected.layout !== undefined && injected.layout !== null
+      ? pruneOverrides(normalizeOverrides(injected.layout), liveIds)
+      : null;
+
   return {
     notebook,
     source: new ServerSource(client, {
@@ -101,6 +125,8 @@ export async function buildConfig(): Promise<AppConfig> {
       ...(allowRawGq ? { allowRawGq: true } : {}),
     }),
     label: `server: ${server} · graph: ${graph}${branch ? ` · ${branch}` : ""}`,
+    initialLayout,
+    canPersistLayout: injected.canPersistLayout === true,
   };
 }
 
diff --git a/packages/web/src/layout-overrides.test.ts b/packages/web/src/layout-overrides.test.ts
index b58c907..d263be0 100644
--- a/packages/web/src/layout-overrides.test.ts
+++ b/packages/web/src/layout-overrides.test.ts
@@ -5,7 +5,10 @@ import {
   EMPTY_OVERRIDES,
   isHidden,
   loadOverrides,
+  migrateV2,
+  normalizeOverrides,
   notebookKey,
+  pruneOverrides,
   saveOverrides,
   withColor,
   withHidden,
@@ -20,6 +23,27 @@ const O = (o: Partial<LayoutOverrides>): LayoutOverrides => ({
   ...o,
 });
 
+/** Minimal localStorage stub over a Map (key(i)/length included for migrateV2). */
+function stubStorage(seed: Record<string, string> = {}): Map<string, string> {
+  const store = new Map<string, string>(Object.entries(seed));
+  vi.stubGlobal("window", {
+    localStorage: {
+      getItem: (k: string) => store.get(k) ?? null,
+      setItem: (k: string, v: string) => {
+        store.set(k, v);
+      },
+      removeItem: (k: string) => {
+        store.delete(k);
+      },
+      key: (i: number) => [...store.keys()][i] ?? null,
+      get length() {
+        return store.size;
+      },
+    },
+  });
+  return store;
+}
+
 describe("withLayout", () => {
   it("merges RGL items by `i`, preserving other boxes; no-mutate", () => {
     const base = O({ layout: { a: { x: 0, y: 0, w: 6, h: 8 } } });
@@ -44,18 +68,52 @@ describe("EMPTY_OVERRIDES", () => {
 describe("notebookKey", () => {
   const nb = (title: string, ids: string[]): Notebook =>
     ({ version: 1, title, cells: ids.map((id) => ({ id })) }) as Notebook;
-  it("uses the v2 storage namespace for RGL box layouts", () => {
-    expect(notebookKey(nb("X", ["a"]))).toMatch(/^dashbook:layout:v2:X:/);
+  it("uses the v3 storage namespace, keyed by title alone", () => {
+    expect(notebookKey(nb("X", ["a"]))).toBe("dashbook:layout:v3:X");
   });
-  it("is stable for the same title + cell-id set (order-independent)", () => {
+  it("is STABLE across cell-set changes — editing a notebook must not reset the canvas", () => {
     expect(notebookKey(nb("X", ["a", "b"]))).toBe(
-      notebookKey(nb("X", ["b", "a"])),
+      notebookKey(nb("X", ["a", "c", "d"])),
     );
   });
-  it("changes when the cell-id set changes", () => {
-    expect(notebookKey(nb("X", ["a", "b"]))).not.toBe(
-      notebookKey(nb("X", ["a", "c"])),
+  it("differs between titles", () => {
+    expect(notebookKey(nb("X", ["a"]))).not.toBe(notebookKey(nb("Y", ["a"])));
+  });
+});
+
+describe("pruneOverrides", () => {
+  it("drops layout/colors/hidden entries for cells that no longer exist", () => {
+    const o = O({
+      layout: {
+        live: { x: 0, y: 0, w: 6, h: 8 },
+        gone: { x: 6, y: 0, w: 6, h: 8 },
+      },
+      hidden: ["live", "gone"],
+      colors: { live: "amber", gone: "rose" },
+    });
+    const pruned = pruneOverrides(o, new Set(["live", "other"]));
+    expect(pruned).toEqual(
+      O({
+        layout: { live: { x: 0, y: 0, w: 6, h: 8 } },
+        hidden: ["live"],
+        colors: { live: "amber" },
+      }),
     );
+    expect(o.layout.gone).toBeDefined(); // no-mutate
+  });
+});
+
+describe("normalizeOverrides", () => {
+  it("accepts a well-formed payload and drops malformed parts to empty", () => {
+    const good = O({ layout: { a: { x: 1, y: 2, w: 3, h: 4 } }, hidden: ["b"] });
+    expect(normalizeOverrides(good)).toEqual(good);
+    // a box with a non-numeric field → the whole layout map is dropped to {}
+    expect(
+      normalizeOverrides({ layout: { a: { x: "no", y: 0, w: 1, h: 1 } } }).layout,
+    ).toEqual({});
+    expect(normalizeOverrides(null)).toEqual(EMPTY_OVERRIDES);
+    expect(normalizeOverrides("garbage")).toEqual(EMPTY_OVERRIDES);
+    expect(normalizeOverrides({ hidden: [1, "ok"] }).hidden).toEqual(["ok"]);
   });
 });
 
@@ -96,16 +154,8 @@ describe("colors", () => {
 
 describe("loadOverrides", () => {
   afterEach(() => vi.unstubAllGlobals());
-  it("round-trips layout/hidden/colors and rejects a malformed layout", () => {
-    const store = new Map<string, string>();
-    vi.stubGlobal("window", {
-      localStorage: {
-        getItem: (k: string) => store.get(k) ?? null,
-        setItem: (k: string, v: string) => {
-          store.set(k, v);
-        },
-      },
-    });
+  it("round-trips layout/hidden/colors; null on a key miss", () => {
+    stubStorage();
     const o = O({
       layout: { a: { x: 1, y: 2, w: 3, h: 4 } },
       hidden: ["b"],
@@ -113,8 +163,44 @@ describe("loadOverrides", () => {
     });
     saveOverrides("k", o);
     expect(loadOverrides("k")).toEqual(o);
-    // a box with a non-numeric field → the whole layout map is dropped to {}
-    store.set("k2", JSON.stringify({ layout: { a: { x: "no", y: 0, w: 1, h: 1 } } }));
-    expect(loadOverrides("k2").layout).toEqual({});
+    expect(loadOverrides("missing")).toBeNull();
+  });
+});
+
+describe("migrateV2", () => {
+  afterEach(() => vi.unstubAllGlobals());
+  const v2 = (title: string, hash: string): string =>
+    `dashbook:layout:v2:${title}:${hash}`;
+
+  it("adopts the old arrangement under the v3 key, prunes it, and deletes v2 keys", () => {
+    const arrangement = O({
+      layout: {
+        live: { x: 0, y: 0, w: 6, h: 8 },
+        gone: { x: 6, y: 0, w: 6, h: 8 },
+      },
+    });
+    const store = stubStorage({
+      [v2("Dev", "abc123")]: JSON.stringify(arrangement),
+      [v2("Other", "zzz")]: JSON.stringify(O({ hidden: ["x"] })),
+    });
+    const adopted = migrateV2("Dev", new Set(["live"]));
+    expect(adopted).toEqual(O({ layout: { live: { x: 0, y: 0, w: 6, h: 8 } } }));
+    expect(store.has(v2("Dev", "abc123"))).toBe(false); // v2 gone
+    expect(store.has(v2("Other", "zzz"))).toBe(true); // other titles untouched
+    expect(loadOverrides("dashbook:layout:v3:Dev")).toEqual(adopted); // re-homed
+  });
+
+  it("returns null (and stays silent) when no v2 entry exists for the title", () => {
+    stubStorage();
+    expect(migrateV2("Dev", new Set(["a"]))).toBeNull();
+  });
+
+  it("returns null when the v2 entry prunes to nothing (all cells renamed)", () => {
+    stubStorage({
+      [v2("Dev", "abc")]: JSON.stringify(
+        O({ layout: { gone: { x: 0, y: 0, w: 1, h: 1 } } }),
+      ),
+    });
+    expect(migrateV2("Dev", new Set(["new-cell"]))).toBeNull();
   });
 });
diff --git a/packages/web/src/layout-overrides.ts b/packages/web/src/layout-overrides.ts
index 4a8be10..c7acd4d 100644
--- a/packages/web/src/layout-overrides.ts
+++ b/packages/web/src/layout-overrides.ts
@@ -32,41 +32,115 @@ export const EMPTY_OVERRIDES: LayoutOverrides = {
   colors: {},
 };
 const EMPTY = EMPTY_OVERRIDES;
-const KEY_PREFIX = "dashbook:layout:v2:";
-
-/** djb2 → base36: a compact, stable fingerprint of the cell-id set. */
-function hashIds(ids: string[]): string {
-  const joined = [...ids].sort().join(" ");
-  let h = 5381;
-  for (let i = 0; i < joined.length; i++) {
-    h = ((h << 5) + h + joined.charCodeAt(i)) >>> 0;
-  }
-  return h.toString(36);
-}
+const KEY_PREFIX = "dashbook:layout:v3:";
+const V2_PREFIX = "dashbook:layout:v2:";
 
 /**
- * Stable `localStorage` key for a notebook: title + a fingerprint of its cell-id
- * set, so structurally-different notebooks (and edited ones) don't mis-apply
- * each other's saved arrangements.
+ * Stable `localStorage` key for a notebook — the title alone. Editing the
+ * notebook's cells must NOT reset the arrangement: overrides are per-cell, so
+ * surviving cells keep their boxes and orphans are pruned (`pruneOverrides`).
+ * (v2 keyed on title + a cell-id fingerprint, which wholesale-reset the canvas
+ * on any notebook edit; `migrateV2` adopts those entries once.)
  */
 export function notebookKey(notebook: Notebook): string {
-  return `${KEY_PREFIX}${notebook.title}:${hashIds(notebook.cells.map((c) => c.id))}`;
+  return `${KEY_PREFIX}${notebook.title}`;
+}
+
+/**
+ * Validate an untrusted overrides payload (localStorage, the layout sidecar,
+ * a v2 migration) into a well-formed LayoutOverrides — malformed parts drop
+ * to empty rather than poisoning the canvas.
+ */
+export function normalizeOverrides(parsed: unknown): LayoutOverrides {
+  if (typeof parsed !== "object" || parsed === null) return EMPTY;
+  const o = parsed as Partial<LayoutOverrides>;
+  return {
+    layout: isLayoutMap(o.layout) ? o.layout : {},
+    hidden: Array.isArray(o.hidden)
+      ? o.hidden.filter((x): x is string => typeof x === "string")
+      : [],
+    colors: isColorMap(o.colors) ? o.colors : {},
+  };
 }
 
-export function loadOverrides(key: string): LayoutOverrides {
+/**
+ * Drop overrides for cells that no longer exist in the notebook. Applied at
+ * load and before persisting, so deleted cells' boxes never accumulate or get
+ * written to the sidecar.
+ */
+export function pruneOverrides(
+  o: LayoutOverrides,
+  liveIds: ReadonlySet<string>,
+): LayoutOverrides {
+  const layout: Record<string, CardBox> = {};
+  for (const [id, box] of Object.entries(o.layout)) {
+    if (liveIds.has(id)) layout[id] = box;
+  }
+  const colors: Record<string, string> = {};
+  for (const [id, color] of Object.entries(o.colors)) {
+    if (liveIds.has(id)) colors[id] = color;
+  }
+  return {
+    layout,
+    hidden: o.hidden.filter((id) => liveIds.has(id)),
+    colors,
+  };
+}
+
+/** The stored personal overrides, or null when this browser has none. */
+export function loadOverrides(key: string): LayoutOverrides | null {
   try {
     const raw = window.localStorage.getItem(key);
-    if (!raw) return EMPTY;
-    const parsed = JSON.parse(raw) as Partial<LayoutOverrides>;
-    return {
-      layout: isLayoutMap(parsed.layout) ? parsed.layout : {},
-      hidden: Array.isArray(parsed.hidden)
-        ? parsed.hidden.filter((x): x is string => typeof x === "string")
-        : [],
-      colors: isColorMap(parsed.colors) ? parsed.colors : {},
-    };
+    if (!raw) return null;
+    return normalizeOverrides(JSON.parse(raw));
+  } catch {
+    return null; // unparseable / unavailable storage → no personal layer
+  }
+}
+
+/**
+ * One-time adoption of a pre-v3 arrangement: on a v3 miss, adopt the first
+ * non-empty v2 entry found for this title (keyed `v2:<title>:<fingerprint>`
+ * — the keys embed no timestamp, so when several exist the pick is
+ * arbitrary), re-home it under the stable v3 key, and delete every v2 entry
+ * for the title.
+ */
+export function migrateV2(
+  title: string,
+  liveIds: ReadonlySet<string>,
+): LayoutOverrides | null {
+  try {
+    const prefix = `${V2_PREFIX}${title}:`;
+    const oldKeys: string[] = [];
+    for (let i = 0; i < window.localStorage.length; i++) {
+      const key = window.localStorage.key(i);
+      if (key !== null && key.startsWith(prefix)) oldKeys.push(key);
+    }
+    if (oldKeys.length === 0) return null;
+    let adopted: LayoutOverrides | null = null;
+    for (const key of oldKeys) {
+      const raw = window.localStorage.getItem(key);
+      if (adopted === null && raw) {
+        const candidate = pruneOverrides(
+          normalizeOverrides(JSON.parse(raw)),
+          liveIds,
+        );
+        if (
+          Object.keys(candidate.layout).length > 0 ||
+          candidate.hidden.length > 0 ||
+          Object.keys(candidate.colors).length > 0
+        ) {
+          adopted = candidate;
+        }
+      }
+      window.localStorage.removeItem(key);
+    }
+    if (adopted !== null) {
+      saveOverrides(`${KEY_PREFIX}${title}`, adopted);
+    }
+    return adopted;
   } catch {
-    return EMPTY; // unparseable / unavailable storage → declared defaults
+    return null;
   }
 }