@pixel-point/toolcraft 0.0.7 → 0.0.9

package/templates/starter/src/app/starter-acceptance.test.ts

@@ -13,6 +13,7 @@ import {
   getToolcraftControlOrderTargets,
   type ToolcraftComponentAcceptance,
   starterAcceptance,
+  starterControlSectionInventory,
   starterProductReadiness,
   starterTransferMode,
   validateToolcraftAcceptanceCoverage,
@@ -538,7 +539,7 @@ function makeBackgroundSection() {
       includeBackground: {
         defaultValue: true,
         description:
-          "Controls PNG background transparency while preview and video keep the background.",
+          "Controls preview and PNG background visibility while video keeps the background.",
         label: "Include",
         target: "export.includeBackground",
         type: "switch",
@@ -734,13 +735,6 @@ function getProductRuntimeImplementationSource(): string {
   )}`;
 }
 
-function removePngExportCanvasHelperCalls(source: string): string {
-  return source.replace(
-    /\bcreateToolcraftPngExportCanvas\s*\(\s*\{[\s\S]*?\}\s*\)/g,
-    "createToolcraftPngExportCanvas({})",
-  );
-}
-
 function getSchemaBackgroundControlTargets(
   controlTypes: ReadonlySet<string>,
 ): string[] {
@@ -813,6 +807,121 @@ describe("Toolcraft template app acceptance coverage", () => {
     expect(validateToolcraftAcceptanceCoverage(starterSchema, starterAcceptance)).toEqual([]);
   });
 
+  it("requires generated product apps to publish a control section inventory", () => {
+    if (!schemaHasProductSurface()) {
+      expect(starterControlSectionInventory).toEqual([]);
+      return;
+    }
+
+    expect(
+      starterControlSectionInventory.length,
+      "Product apps must export starterControlSectionInventory so section grouping decisions are machine-checkable.",
+    ).toBeGreaterThan(0);
+    expect(
+      validateToolcraftAcceptanceCoverage(
+        starterSchema,
+        starterAcceptance,
+        starterTransferMode,
+        starterControlSectionInventory,
+      ),
+    ).toEqual([]);
+  });
+
+  it("requires fileDrop acceptance to prove upload, clear, and reset lifecycle", () => {
+    const fileDropSchema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                source: {
+                  defaultValue: null,
+                  label: "Source image",
+                  target: "media.source",
+                  type: "fileDrop",
+                },
+              },
+              title: "Source",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(fileDropSchema, [
+        {
+          automated: true,
+          automatedTestName: "source image upload and clear update media",
+          browser: true,
+          browserTestName: "browser: source image upload and clear update media",
+          componentType: "fileDrop",
+          evidence: "media-lifecycle",
+          expectedObservable:
+            "Uploading a source image changes the media preview and Clear removes it.",
+          fixture: "source image fixture",
+          id: "media.source",
+          kind: "control",
+          target: "media.source",
+          userAction: "Upload a source image, then clear the preview.",
+        },
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        "Source / source (media.source) fileDrop acceptance must prove upload/import, clear/remove, and section or global reset remove source media.",
+      ]),
+    );
+  });
+
+  it("accepts fileDrop lifecycle coverage that includes reset", () => {
+    const fileDropSchema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                source: {
+                  defaultValue: null,
+                  label: "Source image",
+                  target: "media.source",
+                  type: "fileDrop",
+                },
+              },
+              title: "Source",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    const errors = validateToolcraftAcceptanceCoverage(fileDropSchema, [
+      {
+        automated: true,
+        automatedTestName: "source image upload clear and reset update media",
+        browser: true,
+        browserTestName: "browser: source image upload clear and reset update media",
+        componentType: "fileDrop",
+        evidence: "media-lifecycle",
+        expectedObservable:
+          "Uploading a source image changes the media preview; Clear, section reset, and global Reset controls remove the source media and restore the empty upload state.",
+        fixture: "source image fixture",
+        id: "media.source",
+        kind: "control",
+        target: "media.source",
+        userAction:
+          "Upload a source image, clear it, upload again, then use section reset and Reset controls.",
+      },
+    ]);
+
+    expect(
+      errors.filter((error) => error.includes("fileDrop acceptance")),
+    ).toEqual([]);
+  });
+
   it("rejects fake video duration browser coverage that falls back to expected duration", () => {
     const fakeCoverage = `
       async function getVideoDuration(page, buffer, mimeType) {
@@ -906,7 +1015,7 @@ describe("Toolcraft template app acceptance coverage", () => {
 
     expect(validateToolcraftAcceptanceCoverage(fixedOutputSchema, starterAcceptance)).toEqual(
       expect.arrayContaining([
-        'canvas.sizing mode "fixed-output" requires a runtime acceptance entry with canvasSizingCoverage "fixed-output-size" explaining why width and height are intentionally non-editable. A user-provided base/default size should normally use "editable-output".',
+        'canvas.sizing mode "fixed-output" requires a runtime acceptance entry with canvasSizingCoverage "fixed-output-size" explaining why width and height are intentionally non-editable. Product/output apps must use "editable-output"; user-provided, reference, fixed-format, or base/default sizes belong in canvas.size as editable initial values.',
       ]),
     );
   });
@@ -959,7 +1068,118 @@ describe("Toolcraft template app acceptance coverage", () => {
       ]),
     ).toEqual(
       expect.arrayContaining([
-        'canvas.sizing canvasSizingCoverage "fixed-output-size" must explain why the product output dimensions are intentionally fixed, not merely initialized from a default size.',
+        'canvas.sizing canvasSizingCoverage "fixed-output-size" must explain why the output dimensions are intentionally fixed for a non-product/internal fixture, not merely initialized from a default size.',
+      ]),
+    );
+  });
+
+  it("rejects fixed canvas sizing justified only by a missing reference size editor", () => {
+    const fixedOutputSchema = defineToolcraft({
+      canvas: {
+        enabled: true,
+        size: { height: 1080, unit: "px", width: 1920 },
+        sizing: { mode: "fixed-output" },
+      },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                prompt: {
+                  defaultValue: "Describe the effect",
+                  label: "Prompt",
+                  orderRole: "input",
+                  target: "generation.prompt",
+                  type: "text",
+                },
+              },
+              title: "Generation",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(fixedOutputSchema, [
+        ...starterAcceptance,
+        {
+          automated: true,
+          automatedTestName: "canvas output remains fixed",
+          browser: true,
+          browserTestName: "browser: canvas output remains fixed",
+          canvasSizingCoverage: "fixed-output-size",
+          componentType: "fixed-output canvas",
+          evidence: "product-output",
+          expectedObservable:
+            "The WebGL output remains fixed at 1920x1080 because the reference app has no user-facing output size editor.",
+          fixture: "default canvas fixture",
+          id: "canvas.sizing",
+          kind: "runtime",
+          userAction: "Open the app.",
+        },
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        expect.stringContaining("cannot be justified by the reference or previous app lacking a size editor"),
+      ]),
+    );
+  });
+
+  it("rejects fixed canvas sizing for exportable product apps even when reference dimensions are fixed", () => {
+    const fixedExportSchema = defineToolcraft({
+      canvas: {
+        enabled: true,
+        size: { height: 900, unit: "px", width: 1440 },
+        sizing: { mode: "fixed-output" },
+      },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                outputActions: {
+                  actions: [
+                    {
+                      icon: "export",
+                      label: "Export PNG",
+                      value: "export.png",
+                    },
+                  ],
+                  target: "actions.output",
+                  type: "panelActions",
+                },
+              },
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(fixedExportSchema, [
+        ...starterAcceptance,
+        {
+          automated: true,
+          automatedTestName: "fixed reference size is preserved",
+          browser: true,
+          browserTestName: "browser: fixed reference size is preserved",
+          canvasSizingCoverage: "fixed-output-size",
+          componentType: "fixed-output canvas",
+          evidence: "product-output",
+          expectedObservable:
+            "The exported shader canvas remains reference-defined and fixed at 1440x900.",
+          fixture: "shader reference fixture",
+          id: "canvas.sizing",
+          kind: "runtime",
+          userAction: "Open the app.",
+        },
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        'Product/output apps with export actions must use canvas.sizing mode "editable-output" so Aspect ratio, Canvas width, and Canvas height are always available. Put reference, fixed-format, or user-requested dimensions in canvas.size as the initial value instead of hiding size controls with "fixed-output".',
       ]),
     );
   });
@@ -1629,10 +1849,12 @@ describe("Toolcraft template app acceptance coverage", () => {
     ).toEqual([
       "Glyphs / glyphRamp (glyph.ramp) builtInFitCheck.checkedBuiltIns contains unknown built-in controls: imaginaryPicker.",
       'Glyphs / glyphRamp (glyph.ramp) builtInFitCheck.closestBuiltIn must be one of the checked built-ins or "none".',
+      "Glyphs / glyphRamp (glyph.ramp) builtInFitCheck.checkedBuiltIns must include collectionActions when the custom control owns a growable, removable, selectable, or reorderable runtime item set.",
+      "Glyphs / glyphRamp (glyph.ramp) builtInFitCheck.checkedBuiltIns must include actions when the custom control exposes local command buttons such as add, remove, delete, duplicate, sort, normalize, or clear.",
     ]);
   });
 
-  it("accepts custom controls with explicit custom control coverage", () => {
+  it("requires collection-like custom controls to compare actions and collectionActions", () => {
     const schema = defineToolcraft({
       canvas: { enabled: true },
       panels: {
@@ -1640,15 +1862,15 @@ describe("Toolcraft template app acceptance coverage", () => {
           sections: [
             {
               controls: {
-                glyphRamp: {
-                  defaultValue: [],
-                  label: "Glyph ramp",
-                  orderRole: "input",
-                  target: "glyph.ramp",
-                  type: "glyphRamp",
+                maskEditor: {
+                  defaultValue: { items: [], selectedId: null },
+                  label: "Mask shapes",
+                  orderRole: "spatial",
+                  target: "masks",
+                  type: "maskEditor",
                 } as never,
               },
-              title: "Glyphs",
+              title: "Masks",
             },
           ],
           title: "Controls",
@@ -1660,18 +1882,18 @@ describe("Toolcraft template app acceptance coverage", () => {
       validateToolcraftAcceptanceCoverage(schema, [
         {
           automated: true,
-          automatedTestName: "glyph ramp changes output",
+          automatedTestName: "mask editor changes output",
           browser: true,
-          browserTestName: "browser: glyph ramp changes output",
+          browserTestName: "browser: mask editor changes output",
           builtInFitCheck: {
-            checkedBuiltIns: ["fileDrop", "imagePicker", "select"],
-            closestBuiltIn: "fileDrop",
+            checkedBuiltIns: ["select", "vector"],
+            closestBuiltIn: "vector",
             productObservable:
-              "Ordering uploaded glyphs changes the rendered glyph ramp output.",
+              "Adding, selecting, deleting, dragging, and resizing masks changes the composited output.",
             whyInsufficient:
-              "FileDrop imports source files, but it does not provide density ordering, per-glyph preview, reorder, and remove behavior in one runtime value.",
+              "Vector can edit one point, but this product needs multiple shape commands, selected item state, deletion, drag, and resize handles.",
           },
-          componentType: "glyphRamp",
+          componentType: "maskEditor",
           customControlCoverage: [
             "built-in-gap",
             "kit-primitives",
@@ -1681,18 +1903,22 @@ describe("Toolcraft template app acceptance coverage", () => {
           ],
           evidence: "product-output",
           expectedObservable:
-            "Choosing and ordering glyphs changes the rendered product output.",
-          fixture: "glyph ramp fixture",
-          id: "glyph.ramp",
+            "Adding rectangle, circle, and triangle masks creates selected editable shapes.",
+          fixture: "uploaded image with masks",
+          id: "masks",
           kind: "control",
-          target: "glyph.ramp",
-          userAction: "Upload, reorder, and remove glyphs.",
+          target: "masks",
+          userAction:
+            "Add each mask shape, select a mask in the list, delete one mask, drag a canvas mask handle, and resize a selected mask.",
         },
       ]),
-    ).toEqual([]);
+    ).toEqual([
+      "Masks / maskEditor (masks) builtInFitCheck.checkedBuiltIns must include collectionActions when the custom control owns a growable, removable, selectable, or reorderable runtime item set.",
+      "Masks / maskEditor (masks) builtInFitCheck.checkedBuiltIns must include actions when the custom control exposes local command buttons such as add, remove, delete, duplicate, sort, normalize, or clear.",
+    ]);
   });
 
-  it("rejects range slider defaults where lower and upper start equal", () => {
+  it("detects collection-like custom controls from the value model instead of entity names", () => {
     const schema = defineToolcraft({
       canvas: { enabled: true },
       panels: {
@@ -1700,18 +1926,15 @@ describe("Toolcraft template app acceptance coverage", () => {
           sections: [
             {
               controls: {
-                opacityRange: {
-                  defaultValue: [0, 0],
-                  label: "Opacity",
-                  max: 100,
-                  min: 0,
-                  step: 1,
-                  target: "field.opacityRange",
-                  type: "rangeSlider",
-                  unit: "%",
-                },
+                patternSet: {
+                  defaultValue: { entries: [], selectedId: null },
+                  label: "Pattern set",
+                  orderRole: "style",
+                  target: "pattern.set",
+                  type: "patternSetEditor",
+                } as never,
               },
-              title: "Field",
+              title: "Pattern",
             },
           ],
           title: "Controls",
@@ -1723,29 +1946,41 @@ describe("Toolcraft template app acceptance coverage", () => {
       validateToolcraftAcceptanceCoverage(schema, [
         {
           automated: true,
-          automatedTestName: "opacity range lower and upper change field output",
+          automatedTestName: "pattern set changes output",
           browser: true,
-          browserTestName: "browser: opacity range lower and upper change field output",
-          componentType: "rangeSlider",
-          controlPartCoverage: ["rangeSlider.lower", "rangeSlider.upper"],
+          browserTestName: "browser: pattern set changes output",
+          builtInFitCheck: {
+            checkedBuiltIns: ["select", "vector"],
+            closestBuiltIn: "select",
+            productObservable:
+              "Editing the chosen pattern entry changes the rendered pattern output.",
+            whyInsufficient:
+              "Select can choose one preset, but this product needs runtime entry state with selected item editing.",
+          },
+          componentType: "patternSetEditor",
+          customControlCoverage: [
+            "built-in-gap",
+            "kit-primitives",
+            "minimal-ui",
+            "product-output",
+            "runtime-state",
+          ],
           evidence: "product-output",
           expectedObservable:
-            "Changing the lower and upper opacity handles changes field alpha output.",
-          fixture: "field opacity range fixture",
-          id: "field.opacityRange",
+            "Editing the pattern set changes the rendered product output.",
+          fixture: "pattern set fixture",
+          id: "pattern.set",
           kind: "control",
-          target: "field.opacityRange",
-          userAction: "Drag both Opacity handles.",
+          target: "pattern.set",
+          userAction: "Edit the selected entry.",
         },
       ]),
-    ).toEqual(
-      expect.arrayContaining([
-        "Field / opacityRange (field.opacityRange) rangeSlider defaultValue must start with different lower and upper values so the two-thumb control does not collapse into a single-value slider.",
-      ]),
-    );
+    ).toEqual([
+      "Pattern / patternSet (pattern.set) builtInFitCheck.checkedBuiltIns must include collectionActions when the custom control owns a growable, removable, selectable, or reorderable runtime item set.",
+    ]);
   });
 
-  it("rejects inline layout groups that include range sliders", () => {
+  it("rejects custom controls justified only by visual chrome", () => {
     const schema = defineToolcraft({
       canvas: { enabled: true },
       panels: {
@@ -1753,29 +1988,263 @@ describe("Toolcraft template app acceptance coverage", () => {
           sections: [
             {
               controls: {
-                opacityRange: {
-                  defaultValue: [10, 80],
-                  label: "Opacity",
-                  max: 100,
-                  min: 0,
-                  step: 1,
-                  target: "field.opacityRange",
-                  type: "rangeSlider",
-                  unit: "%",
-                },
-                speed: {
-                  defaultValue: 1,
-                  label: "Speed",
-                  max: 5,
-                  min: 0,
-                  step: 0.1,
-                  target: "field.speed",
-                  type: "slider",
-                  unit: "x",
-                },
+                shapeButtons: {
+                  defaultValue: "rect",
+                  label: "Shape",
+                  orderRole: "style",
+                  target: "shape.kind",
+                  type: "shapeButtons",
+                } as never,
               },
-              layoutGroups: [
-                {
+              title: "Shape",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schema, [
+        {
+          automated: true,
+          automatedTestName: "shape buttons change output",
+          browser: true,
+          browserTestName: "browser: shape buttons change output",
+          builtInFitCheck: {
+            checkedBuiltIns: ["actions", "segmented", "select"],
+            closestBuiltIn: "segmented",
+            productObservable:
+              "Choosing a shape changes the rendered product geometry.",
+            whyInsufficient:
+              "The custom control uses icon buttons and a compact visual layout.",
+          },
+          componentType: "shapeButtons",
+          customControlCoverage: [
+            "built-in-gap",
+            "kit-primitives",
+            "minimal-ui",
+            "product-output",
+            "runtime-state",
+          ],
+          evidence: "product-output",
+          expectedObservable:
+            "Choosing rectangle, circle, or triangle changes the rendered output.",
+          fixture: "shape fixture",
+          id: "shape.kind",
+          kind: "control",
+          target: "shape.kind",
+          userAction: "Choose each shape icon button.",
+        },
+      ]),
+    ).toEqual([
+      "Shape / shapeButtons (shape.kind) builtInFitCheck.whyInsufficient cannot justify a custom control only with icons, layout, styling, or custom buttons; name the product interaction or value model that built-ins cannot express.",
+    ]);
+  });
+
+  it("does not treat numeric tuple custom values as collection owners", () => {
+    const schema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                focalPoint: {
+                  defaultValue: [0.5, 0.5],
+                  label: "Focal point",
+                  orderRole: "spatial",
+                  target: "focal.point",
+                  type: "focalPointPad",
+                } as never,
+              },
+              title: "Focus",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schema, [
+        {
+          automated: true,
+          automatedTestName: "focal point changes output",
+          browser: true,
+          browserTestName: "browser: focal point changes output",
+          builtInFitCheck: {
+            checkedBuiltIns: ["vector"],
+            closestBuiltIn: "vector",
+            productObservable:
+              "Dragging the focal point changes the rendered focus position.",
+            whyInsufficient:
+              "Vector edits x/y, but this product needs a canvas hit target with validation tied to the rendered focal point.",
+          },
+          componentType: "focalPointPad",
+          customControlCoverage: [
+            "built-in-gap",
+            "kit-primitives",
+            "minimal-ui",
+            "product-output",
+            "runtime-state",
+          ],
+          evidence: "product-output",
+          expectedObservable:
+            "Dragging the focal point changes the rendered product output.",
+          fixture: "focus fixture",
+          id: "focal.point",
+          kind: "control",
+          target: "focal.point",
+          userAction: "Drag the focal point.",
+        },
+      ]),
+    ).toEqual([]);
+  });
+
+  it("accepts custom controls with explicit custom control coverage", () => {
+    const schema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                glyphRamp: {
+                  defaultValue: [],
+                  label: "Glyph ramp",
+                  orderRole: "input",
+                  target: "glyph.ramp",
+                  type: "glyphRamp",
+                } as never,
+              },
+              title: "Glyphs",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schema, [
+        {
+          automated: true,
+          automatedTestName: "glyph ramp changes output",
+          browser: true,
+          browserTestName: "browser: glyph ramp changes output",
+          builtInFitCheck: {
+            checkedBuiltIns: ["actions", "collectionActions", "fileDrop", "imagePicker", "select"],
+            closestBuiltIn: "fileDrop",
+            productObservable:
+              "Ordering uploaded glyphs changes the rendered glyph ramp output.",
+            whyInsufficient:
+              "FileDrop imports source files, but it does not provide density ordering, per-glyph preview, reorder, and remove behavior in one runtime value.",
+          },
+          componentType: "glyphRamp",
+          customControlCoverage: [
+            "built-in-gap",
+            "kit-primitives",
+            "minimal-ui",
+            "product-output",
+            "runtime-state",
+          ],
+          evidence: "product-output",
+          expectedObservable:
+            "Choosing and ordering glyphs changes the rendered product output.",
+          fixture: "glyph ramp fixture",
+          id: "glyph.ramp",
+          kind: "control",
+          target: "glyph.ramp",
+          userAction: "Upload, reorder, and remove glyphs.",
+        },
+      ]),
+    ).toEqual([]);
+  });
+
+  it("rejects range slider defaults where lower and upper start equal", () => {
+    const schema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                opacityRange: {
+                  defaultValue: [0, 0],
+                  label: "Opacity",
+                  max: 100,
+                  min: 0,
+                  step: 1,
+                  target: "field.opacityRange",
+                  type: "rangeSlider",
+                  unit: "%",
+                },
+              },
+              title: "Field",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schema, [
+        {
+          automated: true,
+          automatedTestName: "opacity range lower and upper change field output",
+          browser: true,
+          browserTestName: "browser: opacity range lower and upper change field output",
+          componentType: "rangeSlider",
+          controlPartCoverage: ["rangeSlider.lower", "rangeSlider.upper"],
+          evidence: "product-output",
+          expectedObservable:
+            "Changing the lower and upper opacity handles changes field alpha output.",
+          fixture: "field opacity range fixture",
+          id: "field.opacityRange",
+          kind: "control",
+          target: "field.opacityRange",
+          userAction: "Drag both Opacity handles.",
+        },
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        "Field / opacityRange (field.opacityRange) rangeSlider defaultValue must start with different lower and upper values so the two-thumb control does not collapse into a single-value slider.",
+      ]),
+    );
+  });
+
+  it("rejects inline layout groups that include range sliders", () => {
+    const schema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                opacityRange: {
+                  defaultValue: [10, 80],
+                  label: "Opacity",
+                  max: 100,
+                  min: 0,
+                  step: 1,
+                  target: "field.opacityRange",
+                  type: "rangeSlider",
+                  unit: "%",
+                },
+                speed: {
+                  defaultValue: 1,
+                  label: "Speed",
+                  max: 5,
+                  min: 0,
+                  step: 0.1,
+                  target: "field.speed",
+                  type: "slider",
+                },
+              },
+              layoutGroups: [
+                {
                   columns: 2,
                   controls: ["opacityRange", "speed"],
                   layout: "inline",
@@ -1829,6 +2298,57 @@ describe("Toolcraft template app acceptance coverage", () => {
     );
   });
 
+  it("rejects x units on slider value labels", () => {
+    const schema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                strength: {
+                  defaultValue: 0.4,
+                  label: "Strength",
+                  max: 1,
+                  min: 0,
+                  step: 0.01,
+                  target: "glass.strength",
+                  type: "slider",
+                  unit: "x",
+                },
+              },
+              title: "Glass",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schema, [
+        {
+          automated: true,
+          automatedTestName: "strength changes glass output",
+          browser: true,
+          browserTestName: "browser: strength slider changes glass output",
+          componentType: "slider",
+          evidence: "rendered-pixels",
+          expectedObservable: "Changing Strength changes the rendered glass strength.",
+          fixture: "glass strength fixture",
+          id: "glass.strength",
+          kind: "control",
+          target: "glass.strength",
+          userAction: "Drag the Strength slider.",
+        },
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        'Glass / strength (glass.strength) uses unit "x", but Toolcraft slider values do not use x suffixes. Omit unit for scale, multiplier, intensity, opacity, strength, depth, and shader amount values unless a real measurement unit applies.',
+      ]),
+    );
+  });
+
   it("accepts compound controls only when every semantic value part is declared", () => {
     const gradientSchema = defineToolcraft({
       canvas: { enabled: true },
@@ -2334,9 +2854,9 @@ describe("Toolcraft template app acceptance coverage", () => {
       "PNG export must pass includeBackground from runtime state to createToolcraftPngExportCanvas; do not hardcode PNG transparency or background inclusion in schema only.",
     ).toMatch(/\bcreateToolcraftPngExportCanvas\s*\(\s*\{[\s\S]*\bincludeBackground\s*:/);
     expect(
-      removePngExportCanvasHelperCalls(productRuntimeImplementationSource),
-      "export.includeBackground may only be read by the PNG export helper. Live preview, workspace canvas backing, and video renderers must not become transparent when Include background is off.",
-    ).not.toMatch(/\bexport\.includeBackground\b/);
+      productRuntimeImplementationSource,
+      "Live preview must read include-background state through shouldIncludeToolcraftPreviewBackground(state) so turning Include off hides the product preview background without affecting video export.",
+    ).toMatch(/\bshouldIncludeToolcraftPreviewBackground\b/);
     expect(
       backgroundColorTargets.length,
       "Every product app with Export PNG must expose a user-facing background color control.",
@@ -2346,14 +2866,19 @@ describe("Toolcraft template app acceptance coverage", () => {
       'Every product app with Export PNG must expose export.includeBackground in the required "Background" section as a Switch labeled "Include".',
     ).toBeGreaterThan(0);
 
-    for (const target of [...backgroundColorTargets, ...backgroundToggleTargets]) {
+    for (const target of backgroundColorTargets) {
       expect(
         productRuntimeImplementationSource,
         `Runtime renderer/export code must read ${target}; declaring the control in schema is not enough.`,
       ).toContain(target);
     }
 
-    const imageExportSection = getSchemaImageExportSection();
+    expect(
+      productRuntimeImplementationSource,
+      `Runtime renderer/export code must read ${backgroundToggleTargets.join(", ")} through shouldIncludeToolcraftPreviewBackground(state); declaring the control in schema is not enough.`,
+    ).toMatch(/\bshouldIncludeToolcraftPreviewBackground\b|\bexport\.includeBackground\b/);
+
+    const imageExportSection = getSchemaImageExportSection();
     const imageFormatControl = getSectionControlByTarget(
       imageExportSection,
       "export.image.format",
@@ -2788,9 +3313,9 @@ describe("Toolcraft template app acceptance coverage", () => {
       {
         ...makeControlAcceptance("export.includeBackground", "switch"),
         expectedObservable:
-          "Turning Include background off makes PNG output transparent while live preview, workspace canvas backing, and video output keep the product background.",
+          "Turning Include off makes PNG output transparent, hides the live preview product background, and video output keeps the product background.",
         userAction:
-          "Toggle Include background off, export PNG, then verify the PNG has alpha while the live preview canvas still preserves the background.",
+          "Toggle Include off, verify preview has no product background, export PNG with alpha, and verify video export keeps the background.",
       },
       {
         actionCoverage: ["export.png"],
@@ -2818,7 +3343,7 @@ describe("Toolcraft template app acceptance coverage", () => {
     );
   });
 
-  it("requires include-background acceptance to keep live preview and canvas backing visible", () => {
+  it("requires include-background acceptance to hide preview background and keep video background", () => {
     const schemaWithBackgroundControls = defineToolcraft({
       canvas: {
         enabled: true,
@@ -2875,7 +3400,7 @@ describe("Toolcraft template app acceptance coverage", () => {
     ).toEqual(
       expect.arrayContaining([
         expect.stringContaining(
-          "controls PNG background inclusion and acceptance must prove disabling it makes PNG output transparent while live preview, workspace canvas backing, and video output keep the product background.",
+          "controls background inclusion and acceptance must prove disabling it makes PNG output transparent, hides the live preview product background, and keeps video output with the product background.",
         ),
       ]),
     );
@@ -2933,7 +3458,7 @@ describe("Toolcraft template app acceptance coverage", () => {
           kind: "control",
           target: "actions.output",
           userAction:
-            "Toggle Include background off, export PNG, then verify the PNG has alpha while the live preview canvas still preserves the background.",
+            "Toggle Include off, verify preview has no product background, export PNG with alpha, and verify video export keeps the background.",
         },
       ]),
     ).toEqual(
@@ -3529,6 +4054,78 @@ describe("Toolcraft template app acceptance coverage", () => {
     );
   });
 
+  it("rejects single Actions controls that duplicate their only button label", () => {
+    const schemaWithDuplicateActionLabel = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                wash: {
+                  actions: [{ label: "Wash", value: "wash" }],
+                  defaultValue: null,
+                  label: "Wash",
+                  target: "flow.washSignal",
+                  type: "actions",
+                },
+              },
+              title: "Flow",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schemaWithDuplicateActionLabel, [
+        makeControlAcceptance("flow.washSignal", "actions"),
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        expect.stringContaining(
+          'flow.washSignal) single Actions control label "Wash" duplicates its only button label "Wash". Keep the button as the command and use a short context label such as "Ink wash", "Palette action", or "Current layer".',
+        ),
+      ]),
+    );
+  });
+
+  it("allows single Actions controls with a concise context label", () => {
+    const schemaWithContextActionLabel = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                wash: {
+                  actions: [{ label: "Wash", value: "wash" }],
+                  defaultValue: null,
+                  label: "Ink wash",
+                  target: "flow.washSignal",
+                  type: "actions",
+                },
+              },
+              title: "Flow",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    const errors = validateToolcraftAcceptanceCoverage(schemaWithContextActionLabel, [
+      makeControlAcceptance("flow.washSignal", "actions"),
+    ]);
+
+    expect(errors).not.toEqual(
+      expect.arrayContaining([
+        expect.stringContaining("single Actions control label"),
+      ]),
+    );
+  });
+
   it("allows short Include toggle plus an unlabeled background color in the required row", () => {
     const schema = defineToolcraft({
       canvas: { enabled: true },
@@ -3540,7 +4137,7 @@ describe("Toolcraft template app acceptance coverage", () => {
                 includeBackground: {
                   defaultValue: true,
                   description:
-                    "Controls PNG background transparency while preview and video keep the background.",
+                    "Controls preview and PNG background visibility while video keeps the background.",
                   label: "Include",
                   target: "export.includeBackground",
                   type: "switch",
@@ -3598,7 +4195,7 @@ describe("Toolcraft template app acceptance coverage", () => {
                 },
                 duration: {
                   defaultValue: "8",
-                  label: "Duration",
+                  label: false,
                   target: "animation.duration",
                   type: "text",
                 },
@@ -3628,6 +4225,180 @@ describe("Toolcraft template app acceptance coverage", () => {
     );
   });
 
+  it("rejects CodeTextarea for short single-line text content", () => {
+    const schema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                buttonText: {
+                  defaultValue: "Glass",
+                  label: "Text",
+                  target: "button.text",
+                  type: "code",
+                },
+              },
+              title: "Button",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schema, [
+        makeControlAcceptance("button.text", "code"),
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        expect.stringContaining("uses CodeTextarea for short single-line text"),
+      ]),
+    );
+  });
+
+  it("allows CodeTextarea when a short default documents long multiline intent", () => {
+    const schema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                prompt: {
+                  defaultValue: "Describe the scene",
+                  description:
+                    "Long multiline prompt content for generated output.",
+                  label: "Prompt",
+                  target: "generation.prompt",
+                  type: "code",
+                },
+              },
+              title: "Generation",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schema, [
+        makeControlAcceptance("generation.prompt", "code"),
+      ]),
+    ).not.toEqual(
+      expect.arrayContaining([
+        expect.stringContaining("uses CodeTextarea for short single-line text"),
+      ]),
+    );
+  });
+
+  it("rejects visible parameter labels beside one related toggle", () => {
+    const schema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                loop: {
+                  defaultValue: true,
+                  label: "Loop",
+                  target: "animation.loop",
+                  type: "switch",
+                },
+                duration: {
+                  defaultValue: "8",
+                  label: "Duration",
+                  target: "animation.duration",
+                  type: "text",
+                },
+              },
+              layoutGroups: [
+                {
+                  columns: 2,
+                  controls: ["loop", "duration"],
+                  layout: "inline",
+                },
+              ],
+              title: "Playback",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schema, [
+        makeControlAcceptance("animation.loop", "switch"),
+        makeControlAcceptance("animation.duration", "text"),
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        expect.stringContaining(
+          'Playback layoutGroups inline row "loop, duration" pairs a toggle with parameter labels duration "Duration". In toggle-plus-parameter rows, the non-toggle parameter must use label false; if that label is needed, stack the controls instead.',
+        ),
+      ]),
+    );
+  });
+
+  it("rejects segmented controls in inline half-width layout rows", () => {
+    const schema = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                includeText: {
+                  defaultValue: true,
+                  label: "Include",
+                  target: "text.enabled",
+                  type: "switch",
+                },
+                dragTarget: {
+                  defaultValue: "glass",
+                  label: "Drag",
+                  options: [
+                    { label: "Glass", value: "glass" },
+                    { label: "Text", value: "text" },
+                  ],
+                  target: "text.dragTarget",
+                  type: "segmented",
+                },
+              },
+              layoutGroups: [
+                {
+                  columns: 2,
+                  controls: ["includeText", "dragTarget"],
+                  layout: "inline",
+                },
+              ],
+              title: "Glass Text",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schema, [
+        makeControlAcceptance("text.enabled", "switch"),
+        makeControlAcceptance("text.dragTarget", "segmented"),
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        expect.stringContaining(
+          'Glass Text layoutGroups inline row "includeText, dragTarget" includes segmented control dragTarget. Segmented is full-width and must not share a two-column or half-width row; use Select when a finite choice must fit beside another control.',
+        ),
+      ]),
+    );
+  });
+
   it("rejects long visible toggle labels beside one related parameter", () => {
     const schema = defineToolcraft({
       canvas: { enabled: true },
@@ -4909,7 +5680,6 @@ describe("Toolcraft template app acceptance coverage", () => {
                   step: 0.1,
                   target: "animation.speed",
                   type: "slider",
-                  unit: "x",
                   variant: "continuous",
                 },
                 depth: {
@@ -5802,7 +6572,7 @@ describe("Toolcraft template app acceptance coverage", () => {
       ]),
     ).toEqual(
       expect.arrayContaining([
-        'Controls for product entity "squares.right" are split across sections: Square 1 (Right), Appearance. Keep controls for the same product entity in one semantic section unless the spec names a real workflow split.',
+        'Controls for product entity "squares.right" are split across sections: Square 1 (Right), Appearance. Keep controls for the same product entity in one semantic section unless the Control Section Inventory declares workflowStage and splitReason for every split section.',
       ]),
     );
   });
@@ -5858,6 +6628,252 @@ describe("Toolcraft template app acceptance coverage", () => {
     ).toEqual([]);
   });
 
+  it("rejects stale control section inventory entries", () => {
+    const schemaWithInventoryMismatch = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                kind: {
+                  defaultValue: "soft",
+                  label: "Kind",
+                  options: [
+                    { label: "Soft", value: "soft" },
+                    { label: "Sharp", value: "sharp" },
+                  ],
+                  orderRole: "mode",
+                  target: "shape.kind",
+                  type: "select",
+                },
+                count: {
+                  defaultValue: 12,
+                  label: "Count",
+                  max: 40,
+                  min: 1,
+                  orderRole: "detail",
+                  target: "shape.count",
+                  type: "slider",
+                  variant: "continuous",
+                },
+              },
+              title: "Shape",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(
+        schemaWithInventoryMismatch,
+        [
+          makeControlAcceptance("shape.kind", "select"),
+          makeControlAcceptance("shape.count", "slider"),
+        ],
+        starterTransferMode,
+        [
+          {
+            entity: "Shape",
+            groupingReason: "Shape setup",
+            targets: ["shape.kind"],
+            title: "Shape",
+          },
+        ],
+      ),
+    ).toEqual(
+      expect.arrayContaining([
+        'Control Section Inventory entry "Shape" must include a concrete groupingReason explaining why these controls belong together.',
+        'Control Section Inventory entry "Shape" is missing rendered target "shape.count". The inventory must cover every product control in the section.',
+      ]),
+    );
+  });
+
+  it("allows explicit workflow split evidence for one target entity", () => {
+    const schemaWithWorkflowSplit = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                size: {
+                  defaultValue: 64,
+                  label: "Size",
+                  max: 128,
+                  min: 16,
+                  orderRole: "primary",
+                  target: "object.shape.size",
+                  type: "slider",
+                  unit: "px",
+                  variant: "continuous",
+                },
+              },
+              title: "Shape Structure",
+            },
+            {
+              controls: {
+                count: {
+                  defaultValue: 12,
+                  label: "Count",
+                  max: 40,
+                  min: 1,
+                  orderRole: "detail",
+                  target: "object.shape.count",
+                  type: "slider",
+                  variant: "continuous",
+                },
+              },
+              title: "Shape Density",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(
+        schemaWithWorkflowSplit,
+        [
+          makeControlAcceptance("object.shape.size", "slider"),
+          makeControlAcceptance("object.shape.count", "slider"),
+        ],
+        starterTransferMode,
+        [
+          {
+            entity: "Object shape",
+            groupingReason: "Structure controls tune the physical footprint of the object.",
+            splitReason:
+              "Structure and density are separate workflow stages in this editor.",
+            targets: ["object.shape.size"],
+            title: "Shape Structure",
+            workflowStage: "structure",
+          },
+          {
+            entity: "Object shape",
+            groupingReason: "Density controls tune how many objects appear after structure is set.",
+            splitReason:
+              "Density is separated from structure because users set count after the shape footprint.",
+            targets: ["object.shape.count"],
+            title: "Shape Density",
+            workflowStage: "density",
+          },
+        ],
+      ),
+    ).toEqual([]);
+  });
+
+  it("rejects mode-gated controls split away from their selector section", () => {
+    const schemaWithSplitModeBranch = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                sourceMode: {
+                  defaultValue: "preset",
+                  label: "Source",
+                  options: [
+                    { label: "Preset", value: "preset" },
+                    { label: "Image", value: "image" },
+                  ],
+                  orderRole: "mode",
+                  target: "source.mode",
+                  type: "segmented",
+                },
+              },
+              title: "Source",
+            },
+            {
+              controls: {
+                sourceUpload: {
+                  accept: "image/*",
+                  assetKind: "image",
+                  defaultValue: null,
+                  label: "Image",
+                  orderRole: "input",
+                  target: "source.upload",
+                  type: "fileDrop",
+                  visibleWhen: { equals: "image", target: "source.mode" },
+                },
+              },
+              title: "Image",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schemaWithSplitModeBranch, [
+        makeControlAcceptance("source.mode", "segmented"),
+        makeControlAcceptance("source.upload", "fileDrop"),
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        'Image / sourceUpload is gated by visibleWhen target "source.mode" in Source, but it belongs to the same dependency group. Keep selectors and their dependent controls in one semantic section when they describe one product entity or branch; use visibleWhen/disabledWhen inside that section instead of splitting branch controls into their own section.',
+      ]),
+    );
+  });
+
+  it("rejects selector branch sections even when targets do not share a prefix", () => {
+    const schemaWithSplitOptionBranch = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                shapeKind: {
+                  defaultValue: "generated",
+                  label: "Shape",
+                  options: [
+                    { label: "Generated", value: "generated" },
+                    { label: "Library", value: "library" },
+                  ],
+                  orderRole: "mode",
+                  target: "shape.kind",
+                  type: "segmented",
+                },
+              },
+              title: "Shape",
+            },
+            {
+              controls: {
+                libraryAsset: {
+                  defaultValue: null,
+                  label: "Library",
+                  orderRole: "input",
+                  target: "asset.upload",
+                  type: "fileDrop",
+                  visibleWhen: { equals: "library", target: "shape.kind" },
+                },
+              },
+              title: "Library",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schemaWithSplitOptionBranch, [
+        makeControlAcceptance("shape.kind", "segmented"),
+        makeControlAcceptance("asset.upload", "fileDrop"),
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        'Library / libraryAsset is gated by visibleWhen target "shape.kind" in Shape, but it belongs to the same dependency group. Keep selectors and their dependent controls in one semantic section when they describe one product entity or branch; use visibleWhen/disabledWhen inside that section instead of splitting branch controls into their own section.',
+      ]),
+    );
+  });
+
   it("rejects splitting FontPicker-owned typography into sibling controls", () => {
     const schemaWithSplitTypographyBlock = defineToolcraft({
       canvas: { enabled: true },
@@ -6052,6 +7068,173 @@ describe("Toolcraft template app acceptance coverage", () => {
     );
   });
 
+  it("rejects visible labels for palette variation color banks", () => {
+    const schemaWithLabeledPaletteBank = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                accent1: {
+                  defaultValue: { hex: "#9CE6FF" },
+                  label: "Color 1",
+                  target: "palette.accent1",
+                  type: "color",
+                },
+                accent2: {
+                  defaultValue: { hex: "#FF7A90" },
+                  label: "Color 2",
+                  target: "palette.accent2",
+                  type: "color",
+                },
+                spread: {
+                  defaultValue: 34,
+                  label: "Spread",
+                  max: 100,
+                  min: 0,
+                  target: "palette.spread",
+                  type: "slider",
+                  unit: "%",
+                },
+              },
+              title: "Accent Shades",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schemaWithLabeledPaletteBank, [
+        makeControlAcceptance("palette.accent1", "color"),
+        makeControlAcceptance("palette.accent2", "color"),
+        makeControlAcceptance("palette.spread", "slider"),
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        'Accent Shades / accent1 uses visible label "Color 1" for a palette variation color. When colors only add variety to one shared palette, set label: false or use collectionActions with unlabeled items. Keep visible labels only when each color edits a distinct user-facing entity such as Fill, Stroke, Background, Connector, or Object color.',
+        'Accent Shades / accent2 uses visible label "Color 2" for a palette variation color. When colors only add variety to one shared palette, set label: false or use collectionActions with unlabeled items. Keep visible labels only when each color edits a distinct user-facing entity such as Fill, Stroke, Background, Connector, or Object color.',
+      ]),
+    );
+  });
+
+  it("rejects mixed label visibility inside one palette variation color group", () => {
+    const schemaWithMixedPaletteBankLabels = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                accent1: {
+                  defaultValue: { hex: "#9CE6FF" },
+                  label: false,
+                  target: "palette.accent1",
+                  type: "color",
+                },
+                accent2: {
+                  defaultValue: { hex: "#FF7A90" },
+                  label: "Color 2",
+                  target: "palette.accent2",
+                  type: "color",
+                },
+                accent3: {
+                  defaultValue: { hex: "#FFD166" },
+                  label: false,
+                  target: "palette.accent3",
+                  type: "color",
+                },
+              },
+              title: "Accent Shades",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schemaWithMixedPaletteBankLabels, [
+        makeControlAcceptance("palette.accent1", "color"),
+        makeControlAcceptance("palette.accent2", "color"),
+        makeControlAcceptance("palette.accent3", "color"),
+      ]),
+    ).toEqual(
+      expect.arrayContaining([
+        "Accent Shades mixes labeled and unlabeled color items in one palette variation group. Decide label visibility for the whole group: omit all per-item labels when colors only add variety, or label every item only when each color has a distinct user-facing role.",
+        'Accent Shades / accent2 uses visible label "Color 2" for a palette variation color. When colors only add variety to one shared palette, set label: false or use collectionActions with unlabeled items. Keep visible labels only when each color edits a distinct user-facing entity such as Fill, Stroke, Background, Connector, or Object color.',
+      ]),
+    );
+  });
+
+  it("allows unlabeled palette variation colors and labeled distinct color roles", () => {
+    const schemaWithUsefulColorLabels = defineToolcraft({
+      canvas: { enabled: true },
+      panels: {
+        controls: {
+          sections: [
+            {
+              controls: {
+                accent1: {
+                  defaultValue: { hex: "#9CE6FF" },
+                  label: false,
+                  target: "palette.accent1",
+                  type: "color",
+                },
+                accent2: {
+                  defaultValue: { hex: "#FF7A90" },
+                  label: false,
+                  target: "palette.accent2",
+                  type: "color",
+                },
+                spread: {
+                  defaultValue: 34,
+                  label: "Spread",
+                  max: 100,
+                  min: 0,
+                  target: "palette.spread",
+                  type: "slider",
+                  unit: "%",
+                },
+              },
+              title: "Accent Shades",
+            },
+            {
+              controls: {
+                fill: {
+                  defaultValue: { hex: "#FFFFFF" },
+                  label: "Fill",
+                  target: "object.fill",
+                  type: "color",
+                },
+                stroke: {
+                  defaultValue: { hex: "#111111" },
+                  label: "Stroke",
+                  target: "object.stroke",
+                  type: "color",
+                },
+              },
+              title: "Object Colors",
+            },
+          ],
+          title: "Controls",
+        },
+      },
+    });
+
+    expect(
+      validateToolcraftAcceptanceCoverage(schemaWithUsefulColorLabels, [
+        makeControlAcceptance("palette.accent1", "color"),
+        makeControlAcceptance("palette.accent2", "color"),
+        makeControlAcceptance("palette.spread", "slider"),
+        makeControlAcceptance("object.fill", "color"),
+        makeControlAcceptance("object.stroke", "color"),
+      ]),
+    ).toEqual([]);
+  });
+
   it("requires mode selectors to appear before dependent controls", () => {
     const schemaWithLateModeSelector = {
       ...starterSchema,
@@ -6070,15 +7253,15 @@ describe("Toolcraft template app acceptance coverage", () => {
                   type: "slider",
                   variant: "continuous",
                 },
-                blend: {
+                mode: {
                   defaultValue: "liquid",
-                  label: "Blend",
+                  label: "Mode",
                   options: [
                     { label: "Silk", value: "silk" },
                     { label: "Liquid", value: "liquid" },
                     { label: "Crystal", value: "crystal" },
                   ],
-                  target: "shader.blend",
+                  target: "shader.mode",
                   type: "segmented",
                 },
               },
@@ -6108,23 +7291,23 @@ describe("Toolcraft template app acceptance coverage", () => {
         },
         {
           automated: true,
-          automatedTestName: "blend changes rendered output",
+          automatedTestName: "mode changes rendered output",
           browser: true,
-          browserTestName: "browser: blend selector changes rendered output",
+          browserTestName: "browser: mode selector changes rendered output",
           componentType: "segmented",
           evidence: "rendered-pixels",
-          expectedObservable: "Changing Blend switches shader pattern.",
-          fixture: "blend fixture",
-          id: "shader.blend",
+          expectedObservable: "Changing Mode switches shader pattern.",
+          fixture: "mode fixture",
+          id: "shader.mode",
           kind: "control",
           optionCoverage: "each-visible-item",
-          target: "shader.blend",
-          userAction: "Select each Blend option.",
+          target: "shader.mode",
+          userAction: "Select each Mode option.",
         },
       ]),
     ).toEqual(
       expect.arrayContaining([
-        'Volume / blend (shader.blend) has orderRole "mode" after depth (shader.depth) with orderRole "strength". Move mode/input/primary controls before dependent strength/detail/advanced controls or split them into an earlier section.',
+        'Volume / mode (shader.mode) has orderRole "mode" after depth (shader.depth) with orderRole "strength". Move mode/input/primary controls before dependent strength/detail/advanced controls or split them into an earlier section.',
       ]),
     );
   });