# The YouSpot design system This is the constitution and the router: the rules that don't change, and pointers to the files where the values live. It deliberately restates **no** token values and **no** component inventories, because those drift within days of being copied. When this document and a source file disagree, the source file wins; fix this document. Engineering rules for the workspace (branching, gates, bun-vs-npm, plugins) are in `WORKSPACE.md`. Verbal brand (voice, naming, writing style) is in `docs/product/brand/`. ## Principles 1. **A component may reference only contract tokens.** Semantic names like `bg-primary`, `text-muted-foreground`, `border-border`, `rounded-lg`, `shadow-card`, `font-heading`, `bg-accent-soft`, `bg-chrome`. Never a Tailwind palette class (`bg-blue-600`), never raw hex or a color function, never a `dark:` variant. 2. **No hand-rolled `