1.0.5 Design system & brand

Define Motir's visual language before any design Subtask runs. Without this, every design prompt would produce a different look — buttons that disagree, spacing that fights, typography that varies per page. The output of this Story is the reference every later "design" Subtask prompt is expected to honor.

Prerequisites: Prerequisite for every design Subtask in v1. Story 1.1 (auth pages), Story 1.2 (workspace switcher), Story 1.3 (project creation modal), Story 1.5 (app shell), and all of Epic 2/3 UI work depend on this. Epic 4's prompt-generation agent must inject the design-system reference into every design-type prompt.

Verification

• Open a terminal and run:

   git checkout story/PROD-1.0.5-design-system
   pnpm dev
  

• Open http://localhost:3000/_tokens in your browser. You should see:

  • The color palette as labeled swatches (12 colors).
  • The type scale (xs/sm/base/lg/xl).
  • Every primitive component (Button, Input, Textarea, Card, Modal, Pill, Tooltip, Toast, Spinner) rendered with every variant.
  • The Empty-state and Error-state sample components.

• Open /docs/design-system.md and skim the table of contents. The doc should cover: Tokens, Primitives, Patterns, Voice & tone, Don'ts. You don't need to read every word — just confirm the structure is complete and the screenshots are present.

• Confirm CI is green on the Story PR.

• Confirm the designed starter exists (1.0.5.6 output):

  • Visit https://github.com/moooon-B-V/nextjs-prisma-vercel-starter-with-design
  • Confirm the "Use this template" button is visible (marks it as a GitHub Template).
  • Click "Use this template" to create a throwaway test repo; clone it; run pnpm install && ./scripts/db-up.sh && pnpm dev; confirm http://localhost:3000/tokens renders the full design system specimen page; delete the throwaway repo.

• If all five checks pass, approve and merge the PR. If anything is missing or off, add a comment and Motir will produce a follow-up Subtask to fix it.