# Change: refactor TrueGrowth UI system

## Why

TrueGrowth currently mixes a custom workbench shell, legacy Drawnix/opentu TDesign surfaces, tdesign icons, local SCSS controls, and partial Lucide usage. This makes new pages drift visually and makes Codex-driven development inconsistent.

The product needs one free, locally controlled UI system so future pages stay stable, efficient, and visually aligned with the orange Aurora-style AI workbench direction.

## What Changes

- Add a local `@/ui` component entry for shadcn-style components built on TrueGrowth tokens
- Standardize the visual language around white/near-black surfaces, thin borders, soft shadows, compact forms, Lucide icons, and `#ff5b00` primary actions
- Treat the approved `/image` AI image-generation page as the golden UI reference for every page, dialog, drawer, popover, and migration review
- Add guard rails that prevent new app UI from importing TDesign or tdesign icons
- Add page templates for list, form, and generator surfaces
- Define TDesign as a compatibility boundary for legacy Drawnix/opentu UI while migration continues

## Impact

- Affected specs: `ui-design-system`, `workbench-shell`
- Affected code:
  - `apps/web/src/ui/`
  - `apps/web/src/styles.scss`
  - `apps/web/src/app/app.tsx`
  - `scripts/check-truegrowth-ui-system.mjs`
  - `docs/TRUEGROWTH_UI_SYSTEM.md`
  - `docs/TRUEGROWTH_GOLDEN_IMAGE_PAGE_UI.md`