@ggui-ai/ui-visual-tester 0.10.0 → 0.12.0

package/fixture/fixture-runtime.js

@@ -20288,7 +20288,10 @@
   var variantStyles = {
     primary: {
       backgroundColor: "var(--ggui-color-primary-600, #0284c7)",
-      color: "#ffffff",
+      // The on-accent PAIR, never a literal (ggui#589 round 7): a theme
+      // whose primary is bright (slime) pairs dark ink via onPrimary —
+      // hardcoded white was unreadable on it.
+      color: "var(--ggui-color-onPrimary, #ffffff)",
       border: "none"
     },
     secondary: {
@@ -20308,7 +20311,7 @@
     },
     danger: {
       backgroundColor: "var(--ggui-color-error-600, #dc2626)",
-      color: "#ffffff",
+      color: "var(--ggui-color-onError, #ffffff)",
       border: "none"
     }
   };
@@ -20496,7 +20499,7 @@
       alignItems: "center",
       justifyContent: "center",
       transition: "all 0.2s"
-    }, children: (checked || indeterminate) && (0, import_jsx_runtime10.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", style: { color: "#ffffff" }, children: indeterminate ? (0, import_jsx_runtime10.jsx)("path", { d: "M2.5 6H9.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) : (0, import_jsx_runtime10.jsx)("path", { d: "M2.5 6L5 8.5L9.5 3.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] }), (label || description) && (0, import_jsx_runtime10.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "2px" }, children: [label && (0, import_jsx_runtime10.jsx)("span", { style: {
+    }, children: (checked || indeterminate) && (0, import_jsx_runtime10.jsx)("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", style: { color: "var(--ggui-color-onPrimary, #ffffff)" }, children: indeterminate ? (0, import_jsx_runtime10.jsx)("path", { d: "M2.5 6H9.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) : (0, import_jsx_runtime10.jsx)("path", { d: "M2.5 6L5 8.5L9.5 3.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) })] }), (label || description) && (0, import_jsx_runtime10.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "2px" }, children: [label && (0, import_jsx_runtime10.jsx)("span", { style: {
       fontSize: "var(--ggui-font-size-sm, 14px)",
       fontWeight: "var(--ggui-font-weight-medium, 500)",
       color: "var(--ggui-color-onSurfaceVariant, #52525b)"
@@ -25073,7 +25076,9 @@
       left: coords.left,
       transform: getTransform(),
       backgroundColor: "var(--ggui-color-onSurface, #18181b)",
-      color: "#ffffff",
+      // Inverse pair: text on the inverted (onSurface) ground is
+      // the surface color — white was only right for light themes.
+      color: "var(--ggui-color-surface, #ffffff)",
       padding: "6px 10px",
       borderRadius: "var(--ggui-shape-radius-md, 8px)",
       fontSize: "var(--ggui-font-size-xs, 12px)",
@@ -25234,7 +25239,7 @@
       if (variant === "pills") {
         return {
           ...base,
-          color: isActive ? "#ffffff" : "var(--ggui-color-onSurfaceVariant, #52525b)",
+          color: isActive ? "var(--ggui-color-onPrimary, #ffffff)" : "var(--ggui-color-onSurfaceVariant, #52525b)",
           backgroundColor: isActive ? "var(--ggui-color-primary-600, #0284c7)" : "transparent",
           borderRadius: "var(--ggui-shape-radius-md, 6px)"
         };
@@ -42344,7 +42349,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
 
   // ../protocol/dist/gadgets/stdlib-gadgets.js
   var STDLIB_GADGETS_PACKAGE = "@ggui-ai/gadgets";
-  var STDLIB_GADGETS_VERSION = "0.10.0";
+  var STDLIB_GADGETS_VERSION = "0.12.0";
   var STDLIB_GADGETS = [
     {
       package: STDLIB_GADGETS_PACKAGE,
@@ -43108,14 +43113,29 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
      * existing props back believing it changed the UI, and this field is
      * its feedback channel.
      */
-    warning: external_exports.string().optional()
+    warning: external_exports.string().optional(),
+    /**
+     * Schema attestation (ggui#560): identity hash of the enforced props
+     * schema this mutation was validated against — the same schema the
+     * paired handshake disclosed. Present when the session declares a
+     * `propsSpec`; equal to the handshake's `propsSchemaHash` under the
+     * session-continuity guarantee, so a mismatch is the observable form
+     * of a contract changing mid-session.
+     */
+    propsSchemaHash: external_exports.string().optional(),
+    /** Present with `propsSchemaHash`; same profile classifier as the handshake's. */
+    propsSchemaProfile: external_exports.string().optional()
   });
   var amendOutputSchema = external_exports.object({
     sessionId: external_exports.string(),
     updated: external_exports.boolean(),
     resourceUri: external_exports.string(),
     /** Same no-op feedback channel as ggui_update's `warning`. */
-    warning: external_exports.string().optional()
+    warning: external_exports.string().optional(),
+    /** Schema attestation (ggui#560) — same semantics as ggui_update's. */
+    propsSchemaHash: external_exports.string().optional(),
+    /** Present with `propsSchemaHash`. */
+    propsSchemaProfile: external_exports.string().optional()
   });
   var declareToolCatalogInputSchema = external_exports.object({
     toolCatalog: external_exports.record(external_exports.string(), external_exports.object({ name: external_exports.string(), version: external_exports.string().optional() }).strict()).describe("Per-app canonical tool identities: bare tool name -> its server's initialize-declared serverInfo. Host/library-supplied; not an agent action.")
@@ -43279,10 +43299,27 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
   var GGUI_CSS_VAR_KEY_RE = /^--ggui-[a-zA-Z0-9-]+$/;
   var CSS_VALUE_SAFE_RE = /^[^;{}<>@]*$/;
   var cssValue = external_exports.string().min(1).max(256).regex(CSS_VALUE_SAFE_RE, "css value contains a disallowed character").refine((v) => !v.includes("/*"), "css value may not contain a comment");
+  var cssVariableMap = external_exports.record(external_exports.string().regex(GGUI_CSS_VAR_KEY_RE, "css var key must be --ggui-*"), cssValue).refine((m) => Object.keys(m).length <= 200, "too many css variables (max 200)");
   var appThemeSchema = external_exports.object({
     mode: external_exports.enum(["light", "dark"]),
-    cssVariables: external_exports.record(external_exports.string().regex(GGUI_CSS_VAR_KEY_RE, "css var key must be --ggui-*"), cssValue).refine((m) => Object.keys(m).length <= 200, "too many css variables (max 200)"),
-    name: external_exports.string().min(1).max(64).optional()
+    cssVariables: cssVariableMap,
+    name: external_exports.string().min(1).max(64).optional(),
+    /**
+     * The REGISTERED base ladder, delivered (runtime theme
+     * registration): both modes' resolved variable sets ride the
+     * envelope so a mid-session mode switch is a local operation and
+     * delivery never depends on the iframe being able to fetch. The
+     * renderer injects the mode-selected set BELOW `cssVariables` (the
+     * per-app overlay) in the documented precedence. `documentHash` is
+     * the registration's identity: it joins painted ladders to
+     * registration records, and a receiver holding the hash may be
+     * served a future envelope without the variable sets.
+     */
+    base: external_exports.object({
+      documentHash: external_exports.string().regex(/^[0-9a-f]{64}$/, "documentHash must be sha256 lowercase hex"),
+      light: cssVariableMap,
+      dark: cssVariableMap
+    }).strict().optional()
   }).strict();
 
   // ../protocol/dist/registry/canonicalize-contract.js
@@ -43989,6 +44026,115 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     return code.replace(/__GGUI_META__[\s\S]*?__GGUI_META_END__/g, "").replace(/__GGUI_STREAM_SPEC__[\s\S]*?__GGUI_STREAM_SPEC_END__/g, "");
   }
 
+  // ../design/dist/themes/consumed-tokens.manifest.json
+  var consumed_tokens_manifest_default = {
+    version: 1,
+    tokens: [
+      "--ggui-color-container",
+      "--ggui-color-error-100",
+      "--ggui-color-error-200",
+      "--ggui-color-error-50",
+      "--ggui-color-error-500",
+      "--ggui-color-error-600",
+      "--ggui-color-error-700",
+      "--ggui-color-error-800",
+      "--ggui-color-info-100",
+      "--ggui-color-info-200",
+      "--ggui-color-info-50",
+      "--ggui-color-info-500",
+      "--ggui-color-info-700",
+      "--ggui-color-info-800",
+      "--ggui-color-neutral-100",
+      "--ggui-color-neutral-200",
+      "--ggui-color-neutral-300",
+      "--ggui-color-neutral-400",
+      "--ggui-color-neutral-50",
+      "--ggui-color-neutral-500",
+      "--ggui-color-neutral-600",
+      "--ggui-color-neutral-800",
+      "--ggui-color-onContainer",
+      "--ggui-color-onError",
+      "--ggui-color-onPrimary",
+      "--ggui-color-onSurface",
+      "--ggui-color-onSurfaceVariant",
+      "--ggui-color-outline",
+      "--ggui-color-outlineVariant",
+      "--ggui-color-primary",
+      "--ggui-color-primary-100",
+      "--ggui-color-primary-200",
+      "--ggui-color-primary-300",
+      "--ggui-color-primary-400",
+      "--ggui-color-primary-50",
+      "--ggui-color-primary-500",
+      "--ggui-color-primary-600",
+      "--ggui-color-primary-700",
+      "--ggui-color-primary-800",
+      "--ggui-color-primary-900",
+      "--ggui-color-success-100",
+      "--ggui-color-success-200",
+      "--ggui-color-success-50",
+      "--ggui-color-success-500",
+      "--ggui-color-success-700",
+      "--ggui-color-success-800",
+      "--ggui-color-surface",
+      "--ggui-color-surface-gradient",
+      "--ggui-color-surface-subtle",
+      "--ggui-color-surface-sunken",
+      "--ggui-color-surfaceVariant",
+      "--ggui-color-warning-100",
+      "--ggui-color-warning-200",
+      "--ggui-color-warning-50",
+      "--ggui-color-warning-500",
+      "--ggui-color-warning-700",
+      "--ggui-color-warning-800",
+      "--ggui-flash-color",
+      "--ggui-font-family-mono",
+      "--ggui-font-family-sans",
+      "--ggui-font-lineHeight-normal",
+      "--ggui-font-size-2xl",
+      "--ggui-font-size-3xl",
+      "--ggui-font-size-4xl",
+      "--ggui-font-size-base",
+      "--ggui-font-size-lg",
+      "--ggui-font-size-sm",
+      "--ggui-font-size-xl",
+      "--ggui-font-size-xs",
+      "--ggui-font-weight-bold",
+      "--ggui-font-weight-medium",
+      "--ggui-font-weight-normal",
+      "--ggui-font-weight-semibold",
+      "--ggui-radius-md",
+      "--ggui-radius-sm",
+      "--ggui-shape-radius-full",
+      "--ggui-shape-radius-lg",
+      "--ggui-shape-radius-md",
+      "--ggui-shape-radius-sm",
+      "--ggui-shape-radius-xl",
+      "--ggui-shape-shadow-lg",
+      "--ggui-shape-shadow-md",
+      "--ggui-shape-shadow-sm",
+      "--ggui-shape-shadow-xl",
+      "--ggui-spacing-1",
+      "--ggui-spacing-10",
+      "--ggui-spacing-12",
+      "--ggui-spacing-2",
+      "--ggui-spacing-2xl",
+      "--ggui-spacing-3",
+      "--ggui-spacing-4",
+      "--ggui-spacing-5",
+      "--ggui-spacing-6",
+      "--ggui-spacing-8",
+      "--ggui-spacing-lg",
+      "--ggui-spacing-md",
+      "--ggui-spacing-sm",
+      "--ggui-spacing-xl",
+      "--ggui-spacing-xs"
+    ]
+  };
+
+  // ../design/dist/themes/consumed-tokens.js
+  var consumedTokenManifest = consumed_tokens_manifest_default.tokens;
+
   // ../design/dist/themes/definitions/_shared.js
   var standardSemanticScales = {
     light: {
@@ -44337,7 +44483,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "50": { $value: "#fbf3e0", $type: "color" },
         "100": { $value: "#f3e1b0", $type: "color" },
         "200": { $value: "#e6c46e", $type: "color" },
-        "500": { $value: "#a87b0e", $type: "color" },
+        "500": { $value: "#8e680c", $type: "color" },
         // draft
         "600": { $value: "#86620b", $type: "color" },
         "700": { $value: "#654a08", $type: "color" },
@@ -44347,7 +44493,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "50": { $value: "#fbe7e3", $type: "color" },
         "100": { $value: "#f4bbb1", $type: "color" },
         "200": { $value: "#ea8a7a", $type: "color" },
-        "500": { $value: "#d93822", $type: "color" },
+        "500": { $value: "#cc3520", $type: "color" },
         // signal
         "600": { $value: "#ae2d1b", $type: "color" },
         "700": { $value: "#822214", $type: "color" },
@@ -44717,7 +44863,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "400": { $value: "#22d3ee", $type: "color" },
         "500": { $value: "#06b6d4", $type: "color" },
         "600": { $value: "#0891b2", $type: "color" },
-        "700": { $value: "#0e7490", $type: "color" },
+        "700": { $value: "#1085a5", $type: "color" },
         "800": { $value: "#155e75", $type: "color" },
         "900": { $value: "#164e63", $type: "color" }
       },
@@ -44727,7 +44873,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "200": { $value: "#1a1a24", $type: "color" },
         "300": { $value: "#25252f", $type: "color" },
         "400": { $value: "#3a3a48", $type: "color" },
-        "500": { $value: "#55556a", $type: "color" },
+        "500": { $value: "#5d5d74", $type: "color" },
         "600": { $value: "#8888a0", $type: "color" },
         "700": { $value: "#aaaabe", $type: "color" },
         "800": { $value: "#d0d0e0", $type: "color" },
@@ -44854,7 +45000,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "200": { $value: "#111118", $type: "color" },
         "300": { $value: "#1a1a24", $type: "color" },
         "400": { $value: "#3a3a48", $type: "color" },
-        "500": { $value: "#55556a", $type: "color" },
+        "500": { $value: "#5a5a70", $type: "color" },
         "600": { $value: "#8888a0", $type: "color" },
         "700": { $value: "#aaaabe", $type: "color" },
         "800": { $value: "#d0d0e0", $type: "color" },
@@ -45088,7 +45234,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "200": { $value: "#e7e4de", $type: "color" },
         "300": { $value: "#d5d0c8", $type: "color" },
         "400": { $value: "#b8b0a4", $type: "color" },
-        "500": { $value: "#9a9084", $type: "color" },
+        "500": { $value: "#988d81", $type: "color" },
         "600": { $value: "#7a7068", $type: "color" },
         "700": { $value: "#5e5650", $type: "color" },
         "800": { $value: "#3e3a36", $type: "color" },
@@ -45101,7 +45247,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "50": { $type: "color", $value: "#f0f4ee" },
         "100": { $type: "color", $value: "#dde6d8" },
         "200": { $type: "color", $value: "#c6d4be" },
-        "500": { $type: "color", $value: "#6b8f5e" },
+        "500": { $type: "color", $value: "#5b7950" },
         "600": { $type: "color", $value: "#58754d" },
         "700": { $type: "color", $value: "#43583a" },
         "800": { $type: "color", $value: "#2f3e29" }
@@ -45110,7 +45256,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "50": { $type: "color", $value: "#faf6ea" },
         "100": { $type: "color", $value: "#f4ebcb" },
         "200": { $type: "color", $value: "#ecdda4" },
-        "500": { $type: "color", $value: "#c9a84c" },
+        "500": { $type: "color", $value: "#886f29" },
         "600": { $type: "color", $value: "#a88a3a" },
         "700": { $type: "color", $value: "#7e672c" },
         "800": { $type: "color", $value: "#59481f" }
@@ -45238,7 +45384,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "50": { $type: "color", $value: "#faeae9" },
         "100": { $type: "color", $value: "#f1cac8" },
         "200": { $type: "color", $value: "#e4a5a1" },
-        "500": { $type: "color", $value: "#cf6f6a" },
+        "500": { $type: "color", $value: "#d17570" },
         "600": { $type: "color", $value: "#a85753" },
         "700": { $type: "color", $value: "#7d403c" },
         "800": { $type: "color", $value: "#552a27" }
@@ -45439,7 +45585,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "400": { $value: "#f472b6", $type: "color" },
         "500": { $value: "#ec4899", $type: "color" },
         "600": { $value: "#db2777", $type: "color" },
-        "700": { $value: "#be185d", $type: "color" },
+        "700": { $value: "#e42574", $type: "color" },
         "800": { $value: "#9d174d", $type: "color" },
         "900": { $value: "#831843", $type: "color" }
       },
@@ -45449,7 +45595,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "200": { $value: "#19191e", $type: "color" },
         "300": { $value: "#232329", $type: "color" },
         "400": { $value: "#3b3b44", $type: "color" },
-        "500": { $value: "#5a5a68", $type: "color" },
+        "500": { $value: "#5e5e6c", $type: "color" },
         "600": { $value: "#8a8a9a", $type: "color" },
         "700": { $value: "#b0b0be", $type: "color" },
         "800": { $value: "#d4d4de", $type: "color" },
@@ -45481,7 +45627,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       outline: { $value: "#3b3b44", $type: "color" },
       outlineVariant: { $value: "#232329", $type: "color" },
       // Primary role pair — onPrimary is deep noir so hot pink CTAs pop.
-      onPrimary: { $value: "#09090b", $type: "color" },
+      onPrimary: { $value: "#ffffff", $type: "color" },
       primaryContainer: { $value: "#9d174d", $type: "color" },
       // primary-800
       onPrimaryContainer: { $value: "#fce7f3", $type: "color" },
@@ -45741,15 +45887,31 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "200": { $value: "#f8f0df", $type: "color" },
         "300": { $value: "#f0e4c9", $type: "color" },
         "400": { $value: "#dccba5", $type: "color" },
-        "500": { $value: "#bfaa80", $type: "color" },
+        "500": { $value: "#aa8e56", $type: "color" },
         "600": { $value: "#9a8660", $type: "color" },
         "700": { $value: "#746448", $type: "color" },
         "800": { $value: "#504530", $type: "color" },
         "900": { $value: "#352e20", $type: "color" }
       },
-      success: standardSemanticScales.light.success,
-      warning: standardSemanticScales.light.warning,
-      error: standardSemanticScales.light.error,
+      // #594 founder-approved light override (2026-08-22): shared success-500
+      // is sub-AA as TEXT on botanical's warm paper — override the 500 stop
+      // only, light only (same pattern as warning/error below).
+      success: {
+        ...standardSemanticScales.light.success,
+        "500": { $type: "color", $value: "#17843f" }
+      },
+      // #594 founder-approved light overrides (2026-08-22): the shared
+      // standardSemantic 500s are sub-AA as TEXT on botanical's warm paper
+      // (#fefcf8) — override ONLY the 500 stop, only in light; the shared
+      // scales stay untouched for every other theme and for dark.
+      warning: {
+        ...standardSemanticScales.light.warning,
+        "500": { $type: "color", $value: "#a06707" }
+      },
+      error: {
+        ...standardSemanticScales.light.error,
+        "500": { $type: "color", $value: "#e51414" }
+      },
       info: standardSemanticScales.light.info,
       // Semantic roles
       surface: { $value: "#fefcf8", $type: "color" },
@@ -45761,7 +45923,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       outline: { $value: "#f0e4c9", $type: "color" },
       outlineVariant: { $value: "#f8f0df", $type: "color" },
       // Primary role pair — onPrimary is cream for the leaf-green brand hex.
-      onPrimary: { $value: "#fefcf8", $type: "color" },
+      onPrimary: { $value: "#332407", $type: "color" },
       primaryContainer: { $value: "#dcfce7", $type: "color" },
       // primary-100
       onPrimaryContainer: { $value: "#14532d", $type: "color" },
@@ -46058,7 +46220,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "50": { $value: "#f4f7ec", $type: "color" },
         "100": { $value: "#e3ecd0", $type: "color" },
         "200": { $value: "#c8d8a5", $type: "color" },
-        "500": { $value: "#6b8e3d", $type: "color" },
+        "500": { $value: "#5c7a35", $type: "color" },
         // brand: olive
         "600": { $value: "#587634", $type: "color" },
         "700": { $value: "#465c29", $type: "color" },
@@ -46068,7 +46230,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "50": { $value: "#fbf3e3", $type: "color" },
         "100": { $value: "#f6e2bb", $type: "color" },
         "200": { $value: "#eac786", $type: "color" },
-        "500": { $value: "#c98e2e", $type: "color" },
+        "500": { $value: "#956922", $type: "color" },
         // brand: amber-orange
         "600": { $value: "#a87725", $type: "color" },
         "700": { $value: "#825c1d", $type: "color" },
@@ -46108,7 +46270,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       outline: { $value: "#dad8cc", $type: "color" },
       outlineVariant: { $value: "#ebe9df", $type: "color" },
       // Primary role pair — text on Crail CTAs is ivory, container is Crail-50.
-      onPrimary: { $value: "#faf9f5", $type: "color" },
+      onPrimary: { $value: "#15130a", $type: "color" },
       // Ivory
       primaryContainer: { $value: "#fbf2ee", $type: "color" },
       // primary-50
@@ -46219,7 +46381,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "50": { $value: "#2a1410", $type: "color" },
         "100": { $value: "#52271f", $type: "color" },
         "200": { $value: "#7a3a2e", $type: "color" },
-        "500": { $value: "#d56b59", $type: "color" },
+        "500": { $value: "#d7705f", $type: "color" },
         // brand: brick (lifted for dark)
         "600": { $value: "#df8576", $type: "color" },
         "700": { $value: "#e3a294", $type: "color" },
@@ -46466,7 +46628,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "50": { $value: "#ecfdf5", $type: "color" },
         "100": { $value: "#d1fae5", $type: "color" },
         "200": { $value: "#a7f3d0", $type: "color" },
-        "500": { $value: "#0e9d6e", $type: "color" },
+        "500": { $value: "#0b815a", $type: "color" },
         // brand emerald
         "600": { $value: "#0b8259", $type: "color" },
         "700": { $value: "#086847", $type: "color" },
@@ -46476,7 +46638,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "50": { $value: "#fff8eb", $type: "color" },
         "100": { $value: "#fdecc8", $type: "color" },
         "200": { $value: "#fbd897", $type: "color" },
-        "500": { $value: "#e08515", $type: "color" },
+        "500": { $value: "#a66210", $type: "color" },
         // brand amber
         "600": { $value: "#b86b0e", $type: "color" },
         "700": { $value: "#90530a", $type: "color" },
@@ -46587,7 +46749,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         "300": { $value: "#2a2839", $type: "color" },
         // outline
         "400": { $value: "#3e3c50", $type: "color" },
-        "500": { $value: "#5e5c70", $type: "color" },
+        "500": { $value: "#636176", $type: "color" },
         // muted
         "600": { $value: "#8b8898", $type: "color" },
         "700": { $value: "#b8b6c2", $type: "color" },
@@ -46694,6 +46856,353 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     zIndex: standardZIndex
   };
 
+  // ../design/dist/themes/definitions/guuey-brand.js
+  var shared8 = {
+    font: {
+      family: {
+        sans: {
+          $value: '"DM Sans", system-ui, -apple-system, sans-serif',
+          $type: "fontFamily"
+        },
+        mono: {
+          $value: '"JetBrains Mono", ui-monospace, monospace',
+          $type: "fontFamily"
+        }
+      },
+      size: {
+        sm: { $value: "0.875rem", $type: "dimension" },
+        base: { $value: "1rem", $type: "dimension" },
+        lg: { $value: "1.125rem", $type: "dimension" },
+        xl: { $value: "1.25rem", $type: "dimension" },
+        "2xl": { $value: "1.5rem", $type: "dimension" }
+      },
+      weight: {
+        normal: { $value: "400", $type: "fontWeight" },
+        medium: { $value: "500", $type: "fontWeight" },
+        semibold: { $value: "600", $type: "fontWeight" },
+        bold: { $value: "700", $type: "fontWeight" }
+      },
+      lineHeight: {
+        tight: { $value: "1.25", $type: "number" },
+        normal: { $value: "1.5", $type: "number" },
+        relaxed: { $value: "1.75", $type: "number" }
+      }
+    },
+    spacing: {
+      "1": { $value: "0.25rem", $type: "dimension" },
+      "2": { $value: "0.5rem", $type: "dimension" },
+      "3": { $value: "0.75rem", $type: "dimension" },
+      "4": { $value: "1rem", $type: "dimension" },
+      "5": { $value: "1.25rem", $type: "dimension" },
+      "6": { $value: "1.5rem", $type: "dimension" },
+      "8": { $value: "2rem", $type: "dimension" },
+      "10": { $value: "2.5rem", $type: "dimension" },
+      "12": { $value: "3rem", $type: "dimension" }
+    },
+    // NOTE: `shape` is per-mode (round 4) — radius is shared via
+    // `sharedRadius` below, but shadows split: dark wants near-none ink
+    // (a visible black blob under a card on a dark surface was the
+    // round-3 "borders looking ugly" residual's shadow half), light
+    // wants classic soft grey.
+    motion: {
+      duration: {
+        fast: { $value: "120ms", $type: "duration" },
+        normal: { $value: "200ms", $type: "duration" },
+        slow: { $value: "400ms", $type: "duration" },
+        ambient: { $value: "2000ms", $type: "duration" }
+      },
+      easing: {
+        default: { $value: "cubic-bezier(0.4, 0, 0.2, 1)", $type: "cubicBezier" },
+        bounce: {
+          $value: "cubic-bezier(0.68, -0.55, 0.27, 1.55)",
+          $type: "cubicBezier"
+        },
+        spring: { $value: "cubic-bezier(0.22, 1, 0.36, 1)", $type: "cubicBezier" }
+      },
+      transition: {
+        fast: { $value: "120ms cubic-bezier(0.4, 0, 0.2, 1)", $type: "transition" },
+        normal: { $value: "200ms cubic-bezier(0.4, 0, 0.2, 1)", $type: "transition" },
+        slow: { $value: "400ms cubic-bezier(0.4, 0, 0.2, 1)", $type: "transition" },
+        colors: {
+          $value: "color 200ms cubic-bezier(0.4, 0, 0.2, 1), background-color 200ms cubic-bezier(0.4, 0, 0.2, 1), border-color 200ms cubic-bezier(0.4, 0, 0.2, 1)",
+          $type: "transition"
+        },
+        opacity: { $value: "opacity 200ms cubic-bezier(0.4, 0, 0.2, 1)", $type: "transition" },
+        transform: { $value: "transform 200ms cubic-bezier(0.22, 1, 0.36, 1)", $type: "transition" }
+      },
+      keyframes: {
+        "fade-in": {
+          $value: "0%{opacity:0}100%{opacity:1}",
+          $type: "keyframes"
+        },
+        "slide-up": {
+          $value: "0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}",
+          $type: "keyframes"
+        },
+        "pulse-soft": {
+          $value: "0%{opacity:1}50%{opacity:0.65}100%{opacity:1}",
+          $type: "keyframes"
+        }
+      }
+    },
+    accessibility: {
+      focusRing: {
+        color: { $value: "#B8FF3A", $type: "color" },
+        width: { $value: "2px", $type: "dimension" },
+        offset: { $value: "2px", $type: "dimension" }
+      },
+      reducedMotion: {
+        duration: { $value: "0ms", $type: "duration" }
+      },
+      highContrast: {
+        borderWidth: { $value: "2px", $type: "dimension" },
+        textColor: { $value: "#FFFFFF", $type: "color" },
+        backgroundColor: { $value: "#000000", $type: "color" },
+        linkColor: { $value: "#CCFF66", $type: "color" }
+      }
+    },
+    zIndex: standardZIndex
+  };
+  var sharedRadius = {
+    sm: { $value: "0.375rem", $type: "dimension" },
+    md: { $value: "0.5rem", $type: "dimension" },
+    lg: { $value: "0.75rem", $type: "dimension" },
+    xl: { $value: "1rem", $type: "dimension" },
+    full: { $value: "9999px", $type: "dimension" }
+  };
+  var darkShadows = {
+    sm: { $value: "0 1px 2px rgba(0, 0, 0, 0.2)", $type: "shadow" },
+    md: { $value: "0 2px 8px rgba(0, 0, 0, 0.25)", $type: "shadow" },
+    lg: { $value: "0 6px 16px rgba(0, 0, 0, 0.28)", $type: "shadow" },
+    xl: { $value: "0 10px 24px rgba(0, 0, 0, 0.3)", $type: "shadow" }
+  };
+  var lightShadows = {
+    sm: { $value: "0 1px 2px rgba(26, 29, 36, 0.06)", $type: "shadow" },
+    md: { $value: "0 2px 8px rgba(26, 29, 36, 0.08)", $type: "shadow" },
+    lg: { $value: "0 6px 16px rgba(26, 29, 36, 0.1)", $type: "shadow" },
+    xl: { $value: "0 12px 28px rgba(26, 29, 36, 0.12)", $type: "shadow" }
+  };
+  var guueyBrandDark = {
+    $name: "guuey-brand-v1",
+    $description: "The guuey product brand (dark) \u2014 slate-ink surfaces, slime #B8FF3A accent, DM Sans.",
+    $metadata: {
+      font: "DM Sans",
+      fontUrl: "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap",
+      philosophy: "Agent-native. Slime on slate.",
+      // Round 5 (founder-ruled): the guuey host clips the view with its
+      // own rounded rim — the HOST owns the card silhouette; the theme
+      // paints no border on the root layer. Inner hairlines stay.
+      frameless: true
+    },
+    color: {
+      // Inverted dark ladder — 50 darkest, 900 lightest; slime pinned at
+      // 500, the portal's lifted #CCFF66 at the hover stop (600).
+      primary: {
+        "50": { $value: "#141D05", $type: "color" },
+        "100": { $value: "#28390B", $type: "color" },
+        "200": { $value: "#3F5A11", $type: "color" },
+        "300": { $value: "#5F8719", $type: "color" },
+        "400": { $value: "#8CC627", $type: "color" },
+        "500": { $value: "#B8FF3A", $type: "color" },
+        // slime (brand)
+        "600": { $value: "#CCFF66", $type: "color" },
+        // lifted hover (portal)
+        "700": { $value: "#DBFF8F", $type: "color" },
+        // pressed / emphasized
+        "800": { $value: "#E9FFB8", $type: "color" },
+        "900": { $value: "#F6FFE0", $type: "color" }
+      },
+      // Slate-ink foundation from the portal surface family: sunken →
+      // surface → elevated → surfaceVariant, then up through the greys
+      // to paper (#F6F5EE).
+      neutral: {
+        "50": { $value: "#0E1014", $type: "color" },
+        // sunken
+        "100": { $value: "#1A1D24", $type: "color" },
+        // surface
+        "200": { $value: "#232630", $type: "color" },
+        // elevated
+        "300": { $value: "#242938", $type: "color" },
+        // surfaceVariant
+        "400": { $value: "#3B4152", $type: "color" },
+        "500": { $value: "#878C99", $type: "color" },
+        // hint text
+        "600": { $value: "#B7BAC4", $type: "color" },
+        // secondary text
+        "700": { $value: "#D5D6DC", $type: "color" },
+        "800": { $value: "#E8E7E2", $type: "color" },
+        "900": { $value: "#F6F5EE", $type: "color" }
+        // paper (text)
+      },
+      // BRAND RULE: success IS slime — never green. Same family as
+      // primary so an "Available" pill and a slime CTA read as one brand.
+      success: {
+        "50": { $value: "#141D05", $type: "color" },
+        "100": { $value: "#28390B", $type: "color" },
+        "200": { $value: "#3F5A11", $type: "color" },
+        "500": { $value: "#B8FF3A", $type: "color" },
+        // slime (brand rule)
+        "600": { $value: "#CCFF66", $type: "color" },
+        "700": { $value: "#DBFF8F", $type: "color" },
+        "800": { $value: "#E9FFB8", $type: "color" }
+      },
+      warning: {
+        "50": { $value: "#33240A", $type: "color" },
+        "100": { $value: "#5C420F", $type: "color" },
+        "200": { $value: "#8A6318", $type: "color" },
+        "500": { $value: "#FFB020", $type: "color" },
+        // portal warning
+        "600": { $value: "#FFC24D", $type: "color" },
+        "700": { $value: "#FFD37D", $type: "color" },
+        "800": { $value: "#FFE5AE", $type: "color" }
+      },
+      error: {
+        "50": { $value: "#33110E", $type: "color" },
+        "100": { $value: "#5E1F1B", $type: "color" },
+        "200": { $value: "#8F2F2A", $type: "color" },
+        "500": { $value: "#FF5B5B", $type: "color" },
+        // portal error
+        "600": { $value: "#FF7D7A", $type: "color" },
+        "700": { $value: "#FF9F9C", $type: "color" },
+        "800": { $value: "#FFC3C0", $type: "color" }
+      },
+      info: {
+        "50": { $value: "#0A2733", $type: "color" },
+        "100": { $value: "#12455C", $type: "color" },
+        "200": { $value: "#1E6A8A", $type: "color" },
+        "500": { $value: "#3AC8FF", $type: "color" },
+        // portal info
+        "600": { $value: "#66D4FF", $type: "color" },
+        "700": { $value: "#92E0FF", $type: "color" },
+        "800": { $value: "#BFECFF", $type: "color" }
+      },
+      // M3 roles — portal values verbatim.
+      surface: { $value: "#1A1D24", $type: "color" },
+      onSurface: { $value: "#F6F5EE", $type: "color" },
+      surfaceVariant: { $value: "#242938", $type: "color" },
+      onSurfaceVariant: { $value: "#B7BAC4", $type: "color" },
+      container: { $value: "#232630", $type: "color" },
+      // elevated
+      onContainer: { $value: "#F6F5EE", $type: "color" },
+      // Round 4 (portal stops): .14 IS the base hairline; .18 is the
+      // STRONG stop (no DtcgTheme slot — strong/interactive strokes
+      // ride primary borders + the slime focusRing, receipted by the
+      // Select button). Dividers sit softer still.
+      outline: { $value: "rgba(246, 245, 238, 0.14)", $type: "color" },
+      outlineVariant: { $value: "rgba(246, 245, 238, 0.1)", $type: "color" },
+      onPrimary: { $value: "#0E1014", $type: "color" },
+      // ink on slime
+      primaryContainer: { $value: "#242938", $type: "color" },
+      // portal
+      onPrimaryContainer: { $value: "#CCFF66", $type: "color" },
+      // portal
+      onError: { $value: "#33110E", $type: "color" },
+      errorContainer: { $value: "#5E1F1B", $type: "color" },
+      onErrorContainer: { $value: "#FFC3C0", $type: "color" },
+      // Pink accent — the portal's tertiary. (Purple #9B6AFF has no
+      // DtcgTheme slot; see the file docstring.)
+      tertiary: { $value: "#FF4FB0", $type: "color" },
+      onTertiary: { $value: "#0E1014", $type: "color" },
+      tertiaryContainer: { $value: "#451A35", $type: "color" },
+      onTertiaryContainer: { $value: "#FFC1E4", $type: "color" }
+    },
+    ...shared8,
+    shape: { radius: sharedRadius, shadow: darkShadows }
+  };
+  var guueyBrandLight = {
+    $name: "guuey-brand-v1",
+    $description: "The guuey product brand (light, provisional) \u2014 paper surfaces, slime accent held for fills, darkened slime for text emphasis.",
+    $metadata: guueyBrandDark.$metadata,
+    color: {
+      // Normal (non-inverted) ramps; slime stays the 500 fill anchor,
+      // text-emphasis stops (600/700) darken for contrast on paper.
+      primary: {
+        "50": { $value: "#F6FFE0", $type: "color" },
+        "100": { $value: "#E9FFB8", $type: "color" },
+        "200": { $value: "#DBFF8F", $type: "color" },
+        "300": { $value: "#CCFF66", $type: "color" },
+        "400": { $value: "#B8FF3A", $type: "color" },
+        "500": { $value: "#9FE01C", $type: "color" },
+        "600": { $value: "#7DB214", $type: "color" },
+        // 700 is the 'emphasized' TEXT stop — AA on paper (round 7 sweep).
+        "700": { $value: "#476809", $type: "color" },
+        "800": { $value: "#3F5A11", $type: "color" },
+        "900": { $value: "#28390B", $type: "color" }
+      },
+      neutral: {
+        "50": { $value: "#FBFAF6", $type: "color" },
+        "100": { $value: "#F6F5EE", $type: "color" },
+        "200": { $value: "#E8E7E2", $type: "color" },
+        "300": { $value: "#D5D6DC", $type: "color" },
+        "400": { $value: "#B7BAC4", $type: "color" },
+        "500": { $value: "#6E7380", $type: "color" },
+        "600": { $value: "#4A4F5C", $type: "color" },
+        "700": { $value: "#333846", $type: "color" },
+        "800": { $value: "#242938", $type: "color" },
+        "900": { $value: "#1A1D24", $type: "color" }
+      },
+      // Semantic -500s are TEXT stops on paper ('success'/'warning'/…
+      // tones + Alert) — every 500 below clears AA on #FFFFFF (round 7
+      // sweep; the pre-sweep pastel values measured 2.5–4.3).
+      success: {
+        "50": { $value: "#F6FFE0", $type: "color" },
+        "100": { $value: "#E9FFB8", $type: "color" },
+        "200": { $value: "#DBFF8F", $type: "color" },
+        "500": { $value: "#517709", $type: "color" },
+        "600": { $value: "#476809", $type: "color" },
+        "700": { $value: "#35510B", $type: "color" },
+        "800": { $value: "#28390B", $type: "color" }
+      },
+      warning: {
+        "50": { $value: "#FFF4DD", $type: "color" },
+        "100": { $value: "#FFE5AE", $type: "color" },
+        "200": { $value: "#FFD37D", $type: "color" },
+        "500": { $value: "#9C6205", $type: "color" },
+        "600": { $value: "#7C4D04", $type: "color" },
+        "700": { $value: "#5E3A03", $type: "color" },
+        "800": { $value: "#3F2702", $type: "color" }
+      },
+      error: {
+        "50": { $value: "#FFE9E8", $type: "color" },
+        "100": { $value: "#FFC3C0", $type: "color" },
+        "200": { $value: "#FF9F9C", $type: "color" },
+        "500": { $value: "#CC2F2F", $type: "color" },
+        "600": { $value: "#A62626", $type: "color" },
+        "700": { $value: "#7E1D1D", $type: "color" },
+        "800": { $value: "#5E1F1B", $type: "color" }
+      },
+      info: {
+        "50": { $value: "#E5F7FF", $type: "color" },
+        "100": { $value: "#BFECFF", $type: "color" },
+        "200": { $value: "#92E0FF", $type: "color" },
+        "500": { $value: "#0B739E", $type: "color" },
+        "600": { $value: "#085572", $type: "color" },
+        "700": { $value: "#06455D", $type: "color" },
+        "800": { $value: "#0A3346", $type: "color" }
+      },
+      surface: { $value: "#FFFFFF", $type: "color" },
+      onSurface: { $value: "#1A1D24", $type: "color" },
+      surfaceVariant: { $value: "#F6F5EE", $type: "color" },
+      onSurfaceVariant: { $value: "#4A4F5C", $type: "color" },
+      container: { $value: "#FBFAF6", $type: "color" },
+      onContainer: { $value: "#1A1D24", $type: "color" },
+      outline: { $value: "rgba(26, 29, 36, 0.18)", $type: "color" },
+      outlineVariant: { $value: "rgba(26, 29, 36, 0.10)", $type: "color" },
+      onPrimary: { $value: "#0E1014", $type: "color" },
+      primaryContainer: { $value: "#E9FFB8", $type: "color" },
+      onPrimaryContainer: { $value: "#28390B", $type: "color" },
+      onError: { $value: "#FFFFFF", $type: "color" },
+      errorContainer: { $value: "#FFE9E8", $type: "color" },
+      onErrorContainer: { $value: "#8A1F1F", $type: "color" },
+      tertiary: { $value: "#D6247F", $type: "color" },
+      onTertiary: { $value: "#FFFFFF", $type: "color" },
+      tertiaryContainer: { $value: "#FFDCEE", $type: "color" },
+      onTertiaryContainer: { $value: "#6B1240", $type: "color" }
+    },
+    ...shared8,
+    shape: { radius: sharedRadius, shadow: lightShadows }
+  };
+
   // ../design/dist/themes/ThemeProvider.js
   var import_jsx_runtime56 = __toESM(require_jsx_runtime(), 1);
   var import_react37 = __toESM(require_react(), 1);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ggui-ai/ui-visual-tester",
-  "version": "0.10.0",
+  "version": "0.12.0",
   "description": "Behavioral validator for ggui-generated component code. Renders a component in real Chromium via Playwright, clicks each action declared in its contract, and verifies the action actually does something — mutating bound state or dispatching to the agent. Catches buttons wired to no-op handlers that structural validators miss. Playwright is an optional peer dependency, injected by the caller.",
   "keywords": [
     "ggui",
@@ -48,9 +48,9 @@
   "dependencies": {
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "@ggui-ai/protocol": "0.10.0",
-    "@ggui-ai/wire": "0.10.0",
-    "@ggui-ai/design": "0.10.0"
+    "@ggui-ai/design": "0.12.0",
+    "@ggui-ai/protocol": "0.12.0",
+    "@ggui-ai/wire": "0.12.0"
   },
   "devDependencies": {
     "@playwright/test": "^1.60.0",