From 703a8caafd1c9db14fa180911928f7904a4ab038 Mon Sep 17 00:00:00 2001
From: Xuu-an <yongen.xuan@andritz.com>
Date: Wed, 15 Apr 2026 17:03:24 +0800
Subject: [PATCH] feat: replace generic design tokens with Andritz W3C DTCG
 token system

Replace the generic Tailwind-style design tokens starter with
Andritz-specific W3C DTCG-aligned token definitions supporting
dark/light themes via a three-layer architecture (primitive,
semantic/semantic-dark, component).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../templates/design-tokens-starter.json      | 865 +++++++++++++++---
 1 file changed, 730 insertions(+), 135 deletions(-)

diff --git a/.claude/skills/design-system/templates/design-tokens-starter.json b/.claude/skills/design-system/templates/design-tokens-starter.json
index 0c775e87..4678d3a7 100644
--- a/.claude/skills/design-system/templates/design-tokens-starter.json
+++ b/.claude/skills/design-system/templates/design-tokens-starter.json
@@ -1,142 +1,737 @@
 {
-  "$schema": "https://design-tokens.org/schema.json",
-  "primitive": {
-    "color": {
-      "gray": {
-        "50": { "$value": "#F9FAFB", "$type": "color" },
-        "100": { "$value": "#F3F4F6", "$type": "color" },
-        "200": { "$value": "#E5E7EB", "$type": "color" },
-        "300": { "$value": "#D1D5DB", "$type": "color" },
-        "400": { "$value": "#9CA3AF", "$type": "color" },
-        "500": { "$value": "#6B7280", "$type": "color" },
-        "600": { "$value": "#4B5563", "$type": "color" },
-        "700": { "$value": "#374151", "$type": "color" },
-        "800": { "$value": "#1F2937", "$type": "color" },
-        "900": { "$value": "#111827", "$type": "color" },
-        "950": { "$value": "#030712", "$type": "color" }
-      },
-      "blue": {
-        "50": { "$value": "#EFF6FF", "$type": "color" },
-        "500": { "$value": "#3B82F6", "$type": "color" },
-        "600": { "$value": "#2563EB", "$type": "color" },
-        "700": { "$value": "#1D4ED8", "$type": "color" },
-        "800": { "$value": "#1E40AF", "$type": "color" }
-      },
-      "red": {
-        "500": { "$value": "#EF4444", "$type": "color" },
-        "600": { "$value": "#DC2626", "$type": "color" },
-        "700": { "$value": "#B91C1C", "$type": "color" }
-      },
-      "green": {
-        "500": { "$value": "#22C55E", "$type": "color" },
-        "600": { "$value": "#16A34A", "$type": "color" }
-      },
-      "yellow": {
-        "500": { "$value": "#EAB308", "$type": "color" }
-      },
-      "white": { "$value": "#FFFFFF", "$type": "color" }
-    },
-    "spacing": {
-      "0": { "$value": "0", "$type": "dimension" },
-      "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" },
-      "16": { "$value": "4rem", "$type": "dimension" }
-    },
-    "fontSize": {
-      "xs": { "$value": "0.75rem", "$type": "dimension" },
-      "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" },
-      "3xl": { "$value": "1.875rem", "$type": "dimension" },
-      "4xl": { "$value": "2.25rem", "$type": "dimension" }
-    },
-    "radius": {
-      "none": { "$value": "0", "$type": "dimension" },
-      "sm": { "$value": "0.125rem", "$type": "dimension" },
-      "default": { "$value": "0.25rem", "$type": "dimension" },
-      "md": { "$value": "0.375rem", "$type": "dimension" },
-      "lg": { "$value": "0.5rem", "$type": "dimension" },
-      "xl": { "$value": "0.75rem", "$type": "dimension" },
-      "full": { "$value": "9999px", "$type": "dimension" }
-    },
-    "shadow": {
-      "none": { "$value": "none", "$type": "shadow" },
-      "sm": { "$value": "0 1px 2px 0 rgb(0 0 0 / 0.05)", "$type": "shadow" },
-      "default": { "$value": "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)", "$type": "shadow" },
-      "md": { "$value": "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)", "$type": "shadow" },
-      "lg": { "$value": "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)", "$type": "shadow" }
-    },
-    "duration": {
-      "fast": { "$value": "150ms", "$type": "duration" },
-      "normal": { "$value": "200ms", "$type": "duration" },
-      "slow": { "$value": "300ms", "$type": "duration" }
-    }
-  },
-  "semantic": {
-    "color": {
-      "background": { "$value": "{primitive.color.gray.50}", "$type": "color" },
-      "foreground": { "$value": "{primitive.color.gray.900}", "$type": "color" },
-      "primary": { "$value": "{primitive.color.blue.600}", "$type": "color" },
-      "primary-hover": { "$value": "{primitive.color.blue.700}", "$type": "color" },
-      "primary-foreground": { "$value": "{primitive.color.white}", "$type": "color" },
-      "secondary": { "$value": "{primitive.color.gray.100}", "$type": "color" },
-      "secondary-foreground": { "$value": "{primitive.color.gray.900}", "$type": "color" },
-      "muted": { "$value": "{primitive.color.gray.100}", "$type": "color" },
-      "muted-foreground": { "$value": "{primitive.color.gray.500}", "$type": "color" },
-      "destructive": { "$value": "{primitive.color.red.600}", "$type": "color" },
-      "destructive-foreground": { "$value": "{primitive.color.white}", "$type": "color" },
-      "border": { "$value": "{primitive.color.gray.200}", "$type": "color" },
-      "ring": { "$value": "{primitive.color.blue.500}", "$type": "color" }
+  "$schema": "https://design-tokens.github.io/community-group/format/",
+  "andritz-precision": {
+    "$description": "Andritz Precision Industrial Design System — The Monolithic Engine",
+    "primitive": {
+      "$description": "Raw design values — foundation layer",
+      "color": {
+        "andritz-blue": {
+          "50": {
+            "$value": "#f0f7ff",
+            "$type": "color"
+          },
+          "100": {
+            "$value": "#e0efff",
+            "$type": "color"
+          },
+          "200": {
+            "$value": "#c6dfff",
+            "$type": "color"
+          },
+          "300": {
+            "$value": "#9bcaff",
+            "$type": "color"
+          },
+          "400": {
+            "$value": "#4d9fd4",
+            "$type": "color"
+          },
+          "500": {
+            "$value": "#0075be",
+            "$type": "color"
+          },
+          "600": {
+            "$value": "#005c97",
+            "$type": "color"
+          },
+          "700": {
+            "$value": "#004a77",
+            "$type": "color"
+          },
+          "800": {
+            "$value": "#003258",
+            "$type": "color"
+          },
+          "900": {
+            "$value": "#001c38",
+            "$type": "color"
+          }
+        },
+        "surface-light": {
+          "lowest": {
+            "$value": "#ffffff",
+            "$type": "color"
+          },
+          "low": {
+            "$value": "#f8fafb",
+            "$type": "color"
+          },
+          "base": {
+            "$value": "#f2f4f5",
+            "$type": "color"
+          },
+          "mid": {
+            "$value": "#eceeef",
+            "$type": "color"
+          },
+          "high": {
+            "$value": "#e6e8e9",
+            "$type": "color"
+          },
+          "highest": {
+            "$value": "#e1e3e4",
+            "$type": "color"
+          }
+        },
+        "surface-dark": {
+          "lowest": {
+            "$value": "#0a0e14",
+            "$type": "color"
+          },
+          "low": {
+            "$value": "#10141a",
+            "$type": "color"
+          },
+          "base": {
+            "$value": "#181c22",
+            "$type": "color"
+          },
+          "mid": {
+            "$value": "#1c2026",
+            "$type": "color"
+          },
+          "high": {
+            "$value": "#262a31",
+            "$type": "color"
+          },
+          "highest": {
+            "$value": "#31353c",
+            "$type": "color"
+          }
+        },
+        "neutral": {
+          "50": {
+            "$value": "#f5f7fa",
+            "$type": "color"
+          },
+          "100": {
+            "$value": "#eef1f6",
+            "$type": "color"
+          },
+          "200": {
+            "$value": "#dfe2eb",
+            "$type": "color"
+          },
+          "300": {
+            "$value": "#c0c7d2",
+            "$type": "color"
+          },
+          "500": {
+            "$value": "#4b5a69",
+            "$type": "color"
+          },
+          "600": {
+            "$value": "#49607f",
+            "$type": "color"
+          },
+          "700": {
+            "$value": "#404751",
+            "$type": "color"
+          },
+          "900": {
+            "$value": "#191c1d",
+            "$type": "color"
+          },
+          "950": {
+            "$value": "#001c38",
+            "$type": "color",
+            "$description": "Deepest black — replaces pure #000000"
+          }
+        },
+        "error": {
+          "100": {
+            "$value": "#ffdad6",
+            "$type": "color"
+          },
+          "300": {
+            "$value": "#ffb4ab",
+            "$type": "color"
+          },
+          "400": {
+            "$value": "#ff6b6b",
+            "$type": "color"
+          },
+          "600": {
+            "$value": "#ba1a1a",
+            "$type": "color"
+          }
+        },
+        "tertiary": {
+          "200": {
+            "$value": "#ffe4cc",
+            "$type": "color"
+          },
+          "400": {
+            "$value": "#ffc9a0",
+            "$type": "color"
+          },
+          "500": {
+            "$value": "#ffb781",
+            "$type": "color",
+            "$description": "Warning/caution tape"
+          }
+        },
+        "success": {
+          "100": {
+            "$value": "#dcfce7",
+            "$type": "color"
+          },
+          "400": {
+            "$value": "#4ade80",
+            "$type": "color"
+          },
+          "600": {
+            "$value": "#1a8a4a",
+            "$type": "color"
+          }
+        }
+      },
+      "spacing": {
+        "0": {
+          "$value": "0",
+          "$type": "dimension"
+        },
+        "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",
+          "$description": "Zone separation (32px)"
+        },
+        "10": {
+          "$value": "2.5rem",
+          "$type": "dimension"
+        },
+        "12": {
+          "$value": "3rem",
+          "$type": "dimension",
+          "$description": "Section gap (48px)"
+        },
+        "16": {
+          "$value": "4rem",
+          "$type": "dimension"
+        },
+        "20": {
+          "$value": "5rem",
+          "$type": "dimension"
+        },
+        "24": {
+          "$value": "6rem",
+          "$type": "dimension"
+        },
+        "32": {
+          "$value": "8rem",
+          "$type": "dimension",
+          "$description": "Hero spacing (128px)"
+        }
+      },
+      "typography": {
+        "font-family": {
+          "primary": {
+            "$value": "'Inter', system-ui, -apple-system, sans-serif",
+            "$type": "fontFamily"
+          },
+          "premium": {
+            "$value": "'Gilroy', 'Inter', system-ui, sans-serif",
+            "$type": "fontFamily"
+          }
+        },
+        "font-size": {
+          "display-lg": {
+            "$value": "3.5rem",
+            "$type": "dimension"
+          },
+          "display-md": {
+            "$value": "2.75rem",
+            "$type": "dimension"
+          },
+          "display-sm": {
+            "$value": "2.25rem",
+            "$type": "dimension"
+          },
+          "headline-lg": {
+            "$value": "2rem",
+            "$type": "dimension"
+          },
+          "headline-md": {
+            "$value": "1.75rem",
+            "$type": "dimension"
+          },
+          "headline-sm": {
+            "$value": "1.5rem",
+            "$type": "dimension"
+          },
+          "title-lg": {
+            "$value": "1.375rem",
+            "$type": "dimension"
+          },
+          "title-md": {
+            "$value": "1.125rem",
+            "$type": "dimension"
+          },
+          "title-sm": {
+            "$value": "1rem",
+            "$type": "dimension"
+          },
+          "body-lg": {
+            "$value": "1rem",
+            "$type": "dimension"
+          },
+          "body-md": {
+            "$value": "0.875rem",
+            "$type": "dimension"
+          },
+          "body-sm": {
+            "$value": "0.75rem",
+            "$type": "dimension"
+          },
+          "label-md": {
+            "$value": "0.75rem",
+            "$type": "dimension"
+          },
+          "label-sm": {
+            "$value": "0.6875rem",
+            "$type": "dimension"
+          }
+        },
+        "font-weight": {
+          "regular": {
+            "$value": 400,
+            "$type": "fontWeight"
+          },
+          "medium": {
+            "$value": 500,
+            "$type": "fontWeight"
+          },
+          "semibold": {
+            "$value": 600,
+            "$type": "fontWeight"
+          },
+          "bold": {
+            "$value": 700,
+            "$type": "fontWeight"
+          }
+        },
+        "letter-spacing": {
+          "tight": {
+            "$value": "-0.02em",
+            "$type": "dimension",
+            "$description": "Headlines — technical manual"
+          },
+          "normal": {
+            "$value": "0",
+            "$type": "dimension"
+          },
+          "wide": {
+            "$value": "0.05em",
+            "$type": "dimension",
+            "$description": "Labels — machined look"
+          },
+          "wider": {
+            "$value": "0.1em",
+            "$type": "dimension",
+            "$description": "Display pairs — engineering drawing"
+          }
+        }
+      },
+      "radius": {
+        "none": {
+          "$value": "0px",
+          "$type": "dimension",
+          "$description": "DEFAULT — Industrial Precision"
+        },
+        "full": {
+          "$value": "9999px",
+          "$type": "dimension",
+          "$description": "Only for avatars/status indicators"
+        }
+      },
+      "shadow": {
+        "ambient-light": {
+          "$value": "0px 12px 32px 0px rgba(0, 28, 56, 0.06)",
+          "$type": "shadow"
+        },
+        "ambient-dark": {
+          "$value": "0px 12px 32px 0px rgba(0, 28, 56, 0.4)",
+          "$type": "shadow"
+        },
+        "glow-primary": {
+          "$value": "0px 0px 8px #9bcaff",
+          "$type": "shadow",
+          "$description": "Dark theme pulse line"
+        }
+      },
+      "duration": {
+        "fast": {
+          "$value": "150ms",
+          "$type": "duration"
+        },
+        "normal": {
+          "$value": "200ms",
+          "$type": "duration"
+        },
+        "slow": {
+          "$value": "300ms",
+          "$type": "duration"
+        }
+      }
     },
-    "spacing": {
-      "component": { "$value": "{primitive.spacing.4}", "$type": "dimension" },
-      "section": { "$value": "{primitive.spacing.12}", "$type": "dimension" }
-    }
-  },
-  "component": {
-    "button": {
-      "bg": { "$value": "{semantic.color.primary}", "$type": "color" },
-      "fg": { "$value": "{semantic.color.primary-foreground}", "$type": "color" },
-      "hover-bg": { "$value": "{semantic.color.primary-hover}", "$type": "color" },
-      "padding-x": { "$value": "{primitive.spacing.4}", "$type": "dimension" },
-      "padding-y": { "$value": "{primitive.spacing.2}", "$type": "dimension" },
-      "radius": { "$value": "{primitive.radius.md}", "$type": "dimension" },
-      "font-size": { "$value": "{primitive.fontSize.sm}", "$type": "dimension" }
+    "semantic": {
+      "$description": "Purpose-based aliases — light theme (default)",
+      "surface": {
+        "default": {
+          "$value": "{primitive.color.surface-light.low}",
+          "$type": "color"
+        },
+        "container": {
+          "$value": "{primitive.color.surface-light.mid}",
+          "$type": "color"
+        },
+        "container-low": {
+          "$value": "{primitive.color.surface-light.base}",
+          "$type": "color"
+        },
+        "container-high": {
+          "$value": "{primitive.color.surface-light.high}",
+          "$type": "color"
+        },
+        "container-highest": {
+          "$value": "{primitive.color.surface-light.highest}",
+          "$type": "color"
+        },
+        "container-lowest": {
+          "$value": "{primitive.color.surface-light.lowest}",
+          "$type": "color"
+        }
+      },
+      "on-surface": {
+        "default": {
+          "$value": "{primitive.color.neutral.900}",
+          "$type": "color"
+        },
+        "variant": {
+          "$value": "{primitive.color.neutral.700}",
+          "$type": "color"
+        }
+      },
+      "primary": {
+        "default": {
+          "$value": "{primitive.color.andritz-blue.500}",
+          "$type": "color"
+        },
+        "text": {
+          "$value": "{primitive.color.andritz-blue.600}",
+          "$type": "color"
+        },
+        "container": {
+          "$value": "{primitive.color.andritz-blue.500}",
+          "$type": "color"
+        },
+        "on-primary": {
+          "$value": "#ffffff",
+          "$type": "color"
+        },
+        "fixed-dim": {
+          "$value": "{primitive.color.andritz-blue.300}",
+          "$type": "color"
+        }
+      },
+      "error": {
+        "default": {
+          "$value": "{primitive.color.error.600}",
+          "$type": "color"
+        },
+        "container": {
+          "$value": "{primitive.color.error.100}",
+          "$type": "color"
+        },
+        "on-error": {
+          "$value": "#ffffff",
+          "$type": "color"
+        }
+      },
+      "outline-variant": {
+        "$value": "{primitive.color.neutral.300}",
+        "$type": "color"
+      },
+      "ghost-border-opacity": {
+        "$value": "0.15",
+        "$type": "number"
+      }
     },
-    "input": {
-      "bg": { "$value": "{semantic.color.background}", "$type": "color" },
-      "border": { "$value": "{semantic.color.border}", "$type": "color" },
-      "focus-ring": { "$value": "{semantic.color.ring}", "$type": "color" },
-      "padding-x": { "$value": "{primitive.spacing.3}", "$type": "dimension" },
-      "padding-y": { "$value": "{primitive.spacing.2}", "$type": "dimension" },
-      "radius": { "$value": "{primitive.radius.md}", "$type": "dimension" }
+    "semantic-dark": {
+      "$description": "Purpose-based aliases — dark theme overrides",
+      "surface": {
+        "default": {
+          "$value": "{primitive.color.surface-dark.low}",
+          "$type": "color"
+        },
+        "container": {
+          "$value": "{primitive.color.surface-dark.mid}",
+          "$type": "color"
+        },
+        "container-low": {
+          "$value": "{primitive.color.surface-dark.base}",
+          "$type": "color"
+        },
+        "container-high": {
+          "$value": "{primitive.color.surface-dark.high}",
+          "$type": "color"
+        },
+        "container-highest": {
+          "$value": "{primitive.color.surface-dark.highest}",
+          "$type": "color"
+        },
+        "container-lowest": {
+          "$value": "{primitive.color.surface-dark.lowest}",
+          "$type": "color"
+        }
+      },
+      "on-surface": {
+        "default": {
+          "$value": "{primitive.color.neutral.200}",
+          "$type": "color"
+        },
+        "variant": {
+          "$value": "{primitive.color.neutral.300}",
+          "$type": "color"
+        }
+      },
+      "primary": {
+        "default": {
+          "$value": "{primitive.color.andritz-blue.500}",
+          "$type": "color"
+        },
+        "text": {
+          "$value": "{primitive.color.andritz-blue.300}",
+          "$type": "color"
+        },
+        "container": {
+          "$value": "{primitive.color.andritz-blue.500}",
+          "$type": "color"
+        },
+        "on-primary": {
+          "$value": "#ffffff",
+          "$type": "color"
+        },
+        "fixed-dim": {
+          "$value": "{primitive.color.andritz-blue.300}",
+          "$type": "color"
+        }
+      },
+      "tertiary": {
+        "$value": "{primitive.color.tertiary.500}",
+        "$type": "color",
+        "$description": "Caution tape — high contrast on navy"
+      },
+      "error": {
+        "default": {
+          "$value": "{primitive.color.error.300}",
+          "$type": "color"
+        },
+        "container": {
+          "$value": "#93000a",
+          "$type": "color"
+        },
+        "on-error": {
+          "$value": "{primitive.color.error.100}",
+          "$type": "color"
+        }
+      },
+      "outline-variant": {
+        "$value": "{primitive.color.neutral.700}",
+        "$type": "color"
+      },
+      "ghost-border-opacity": {
+        "$value": "0.20",
+        "$type": "number"
+      }
     },
-    "card": {
-      "bg": { "$value": "{primitive.color.white}", "$type": "color" },
-      "border": { "$value": "{semantic.color.border}", "$type": "color" },
-      "shadow": { "$value": "{primitive.shadow.default}", "$type": "shadow" },
-      "padding": { "$value": "{primitive.spacing.6}", "$type": "dimension" },
-      "radius": { "$value": "{primitive.radius.lg}", "$type": "dimension" }
-    }
-  },
-  "dark": {
-    "semantic": {
-      "color": {
-        "background": { "$value": "{primitive.color.gray.950}", "$type": "color" },
-        "foreground": { "$value": "{primitive.color.gray.50}", "$type": "color" },
-        "secondary": { "$value": "{primitive.color.gray.800}", "$type": "color" },
-        "muted": { "$value": "{primitive.color.gray.800}", "$type": "color" },
-        "muted-foreground": { "$value": "{primitive.color.gray.400}", "$type": "color" },
-        "border": { "$value": "{primitive.color.gray.800}", "$type": "color" }
+    "component": {
+      "$description": "Component-specific tokens",
+      "button": {
+        "primary-bg-gradient": {
+          "$value": "linear-gradient(135deg, {semantic.primary.text}, {semantic.primary.default})",
+          "$type": "gradient"
+        },
+        "primary-fg": {
+          "$value": "{semantic.primary.on-primary}",
+          "$type": "color"
+        },
+        "secondary-bg": {
+          "$value": "{semantic.surface.container-high}",
+          "$type": "color"
+        },
+        "secondary-fg": {
+          "$value": "{semantic.primary.text}",
+          "$type": "color"
+        },
+        "radius": {
+          "$value": "{primitive.radius.none}",
+          "$type": "dimension"
+        },
+        "padding-x": {
+          "$value": "{primitive.spacing.6}",
+          "$type": "dimension"
+        },
+        "padding-y": {
+          "$value": "{primitive.spacing.2}",
+          "$type": "dimension"
+        },
+        "active-scale": {
+          "$value": "0.98",
+          "$type": "number"
+        },
+        "text-transform": {
+          "$value": "uppercase",
+          "$type": "string"
+        },
+        "letter-spacing": {
+          "$value": "{primitive.typography.letter-spacing.wide}",
+          "$type": "dimension"
+        }
+      },
+      "input": {
+        "bg": {
+          "$value": "{semantic.surface.container-highest}",
+          "$type": "color"
+        },
+        "fg": {
+          "$value": "{semantic.on-surface.default}",
+          "$type": "color"
+        },
+        "border": {
+          "$value": "none",
+          "$type": "string"
+        },
+        "focus-border-bottom": {
+          "$value": "2px solid {semantic.primary.default}",
+          "$type": "string"
+        },
+        "error-bg": {
+          "$value": "{semantic.error.container}",
+          "$type": "color"
+        },
+        "radius": {
+          "$value": "{primitive.radius.none}",
+          "$type": "dimension"
+        }
+      },
+      "card": {
+        "bg": {
+          "$value": "{semantic.surface.container-lowest}",
+          "$type": "color"
+        },
+        "fg": {
+          "$value": "{semantic.on-surface.default}",
+          "$type": "color"
+        },
+        "border": {
+          "$value": "none",
+          "$type": "string"
+        },
+        "shadow": {
+          "$value": "none",
+          "$type": "shadow"
+        },
+        "shadow-elevated": {
+          "$value": "{primitive.shadow.ambient-light}",
+          "$type": "shadow"
+        },
+        "radius": {
+          "$value": "{primitive.radius.none}",
+          "$type": "dimension"
+        },
+        "padding": {
+          "$value": "{primitive.spacing.6}",
+          "$type": "dimension"
+        },
+        "zone-gap": {
+          "$value": "{primitive.spacing.8}",
+          "$type": "dimension"
+        }
+      },
+      "dialog": {
+        "overlay-bg": {
+          "$value": "rgba(0, 28, 56, 0.5)",
+          "$type": "color"
+        },
+        "bg": {
+          "$value": "{semantic.surface.container-lowest}",
+          "$type": "color"
+        },
+        "backdrop-blur": {
+          "$value": "20px",
+          "$type": "dimension"
+        },
+        "surface-opacity": {
+          "$value": "0.85",
+          "$type": "number"
+        },
+        "radius": {
+          "$value": "{primitive.radius.none}",
+          "$type": "dimension"
+        },
+        "shadow": {
+          "$value": "{primitive.shadow.ambient-light}",
+          "$type": "shadow"
+        }
+      },
+      "badge": {
+        "radius": {
+          "$value": "{primitive.radius.none}",
+          "$type": "dimension"
+        },
+        "text-transform": {
+          "$value": "uppercase",
+          "$type": "string"
+        },
+        "letter-spacing": {
+          "$value": "{primitive.typography.letter-spacing.wide}",
+          "$type": "dimension"
+        }
+      },
+      "table": {
+        "border": {
+          "$value": "none",
+          "$type": "string",
+          "$description": "No divider lines — use whitespace or tonal shift"
+        },
+        "header-transform": {
+          "$value": "uppercase",
+          "$type": "string"
+        },
+        "header-tracking": {
+          "$value": "{primitive.typography.letter-spacing.wide}",
+          "$type": "dimension"
+        },
+        "row-separator": {
+          "$value": "{primitive.spacing.8}",
+          "$type": "dimension",
+          "$description": "32px whitespace OR tonal shift"
+        }
       }
     }
   }