diff --git a/frontend/src/stores/__tests__/canvasStore/zones.test.ts b/frontend/src/stores/__tests__/canvasStore/zones.test.ts
index 2a0424c..d9c7c90 100644
--- a/frontend/src/stores/__tests__/canvasStore/zones.test.ts
+++ b/frontend/src/stores/__tests__/canvasStore/zones.test.ts
@@ -1,6 +1,7 @@
 import { describe, it, expect, beforeEach } from 'vitest'
 import { useCanvasStore } from '@/stores/canvasStore'
 import { makeNode } from '@/test/factories'
+import { serializeNode, deserializeApiNode, type ApiNode } from '@/utils/canvasSerializer'
 
 function resetStore() {
   useCanvasStore.setState({
@@ -238,8 +239,14 @@ describe('canvasStore — importZoneSubnet', () => {
 
     const z = useCanvasStore.getState().nodes.find((n) => n.id === 'z1')!
     expect(z.height!).toBeGreaterThan(300)
-    // The renderer reads the persisted size back out of custom_colors.
-    expect(z.data.custom_colors?.height).toBe(z.height)
+
+    // The grown height has to survive a save/load round-trip. A zone has no
+    // height column, so the serializer stashes it in the custom_colors blob
+    // on the way out and hoists it back on the way in.
+    const wire = serializeNode(z) as { custom_colors: { height: number } }
+    expect(wire.custom_colors.height).toBe(z.height)
+    const reloaded = deserializeApiNode(wire as unknown as ApiNode, new Map())
+    expect(reloaded.height).toBe(z.height)
   })
 
   it('keeps the parent ahead of its new children, as React Flow requires', () => {
diff --git a/frontend/src/stores/canvasStore.ts b/frontend/src/stores/canvasStore.ts
index 0d6246f..d38e530 100644
--- a/frontend/src/stores/canvasStore.ts
+++ b/frontend/src/stores/canvasStore.ts
@@ -1072,17 +1072,11 @@ export const useCanvasStore = create<CanvasState>((rawSet, get) => {
 
     set((s) => {
       const updated = s.nodes.map((n) => {
+        // `height` is the only live field: the serializer stashes it into the
+        // custom_colors blob on save, since the nodes table has no height
+        // column for a zone, and hoists it back out on load.
         if (n.id === zoneId) {
-          return grownHeight === zoneHeight
-            ? n
-            : {
-                ...n,
-                height: grownHeight,
-                data: {
-                  ...n.data,
-                  custom_colors: { ...(n.data.custom_colors ?? {}), height: grownHeight },
-                },
-              }
+          return grownHeight === zoneHeight ? n : { ...n, height: grownHeight }
         }
         const at = placements.get(n.id)
         if (!at) return n