---
phase: {N}
slug: {phase-slug}
status: draft
shadcn_initialized: false
preset: none
created: {date}
---

# Phase {N} - UI Design Contract

> Visual and interaction contract for frontend phases. Generated by gsd-ui-researcher, verified by gsd-ui-checker.

---

## Design System

| Property          | Value                               |
| ----------------- | ----------------------------------- |
| Tool              | {shadcn / none}                     |
| Preset            | {preset string or "not applicable"} |
| Component library | {radix / base-ui / none}            |
| Icon library      | {library}                           |
| Font              | {font}                              |

---

## Spacing Scale

Declared values (must be multiples of 4):

| Token | Value | Usage                     |
| ----- | ----- | ------------------------- |
| xs    | 4px   | Icon gaps, inline padding |
| sm    | 8px   | Compact element spacing   |
| md    | 16px  | Default element spacing   |
| lg    | 24px  | Section padding           |
| xl    | 32px  | Layout gaps               |
| 2xl   | 48px  | Major section breaks      |
| 3xl   | 64px  | Page-level spacing        |

Exceptions: {list any, or "none"}

---

## Typography

| Role    | Size | Weight   | Line Height |
| ------- | ---- | -------- | ----------- |
| Body    | {px} | {weight} | {ratio}     |
| Label   | {px} | {weight} | {ratio}     |
| Heading | {px} | {weight} | {ratio}     |
| Display | {px} | {weight} | {ratio}     |

---

## Color

| Role            | Value | Usage                         |
| --------------- | ----- | ----------------------------- |
| Dominant (60%)  | {hex} | Background, surfaces          |
| Secondary (30%) | {hex} | Cards, sidebar, nav           |
| Accent (10%)    | {hex} | {list specific elements only} |
| Destructive     | {hex} | Destructive actions only      |

Accent reserved for: {explicit list - never "all interactive elements"}

---

## Copywriting Contract

| Element                  | Copy                               |
| ------------------------ | ---------------------------------- |
| Primary CTA              | {specific verb + noun}             |
| Empty state heading      | {copy}                             |
| Empty state body         | {copy + next step}                 |
| Error state              | {problem + solution path}          |
| Destructive confirmation | {action name}: {confirmation copy} |

---

## Registry Safety

| Registry           | Blocks Used | Safety Gate                 |
| ------------------ | ----------- | --------------------------- |
| shadcn official    | {list}      | not required                |
| {third-party name} | {list}      | shadcn view + diff required |

---

## Checker Sign-Off

- [ ] Dimension 1 Copywriting: PASS
- [ ] Dimension 2 Visuals: PASS
- [ ] Dimension 3 Color: PASS
- [ ] Dimension 4 Typography: PASS
- [ ] Dimension 5 Spacing: PASS
- [ ] Dimension 6 Registry Safety: PASS

**Approval:** {pending / approved YYYY-MM-DD}