feat(design-systems): central prose — guidance on the system, rationale on tokens

Last piece of the architecture in #2296. The operator: "the prose doesn't have
to live as one offs, there's a central system for managing it."

Two fields, both free-form:

  design_systems.guidance   the narrative a token table cannot hold — aesthetic,
                            voice and tone, what is deliberately out of scope.
  design_tokens.rationale   WHY a token is this value, which is a different
                            question from `purpose` (what it is FOR). "Success
                            equals Moss, aligned by design" is a rationale;
                            "page bg, deepest surface" is a purpose. Rules carry
                            the first routinely and a token row had nowhere to
                            put it.

Free-form rather than a column per category, deliberately. A schema with
`voice`, `aesthetic` and `scope` columns would bake one rulebook's table of
contents into every install (rule #115), leaving the next install three empty
columns and nowhere for what it actually cares about. Both nullable: a design
system with no prose at all is complete, not a draft.

`rationale` cascades like `purpose` — deepest non-empty wins — so an app
overriding a colour keeps the family's reasoning rather than blanking it. Same
argument as `supersedes`: the override was about the value, not the meaning.

In the generated sheet the inline comment prefers `purpose` and falls back to
`rationale`, so a token carrying only the why still says something instead of
rendering bare.

frontend/src/api/designSystems.ts

@@ -12,6 +12,8 @@ export interface DesignSystem {
   owner_user_id: number;
   title: string;
   description: string;
+  /** Narrative a token table cannot hold: aesthetic, voice, what's out of scope. */
+  guidance: string;
   parent_id: number | null;
   created_at: string | null;
   updated_at: string | null;
@@ -26,6 +28,8 @@ export interface DesignToken {
   value_by_mode: Record<string, string>;
   group_name: string | null;
   purpose: string | null;
+  /** WHY it is this value — distinct from `purpose`, which is what it is FOR. */
+  rationale: string | null;
   /** Literal values this token should be used INSTEAD OF, e.g. ["#fff"].
    *
    *  How a design system records what a prohibition was trying to say: not
@@ -56,6 +60,7 @@ export interface ResolvedToken {
   name: string;
   group_name: string | null;
   purpose: string | null;
+  rationale: string | null;
   supersedes: string[];
   order_index: number;
   value_by_mode: Record<string, string>;
@@ -72,13 +77,19 @@ export const fetchDesignSystem = (id: number) =>
 export const createDesignSystem = (body: {
   title: string;
   description?: string;
+  guidance?: string;
   parent_id?: number | null;
 }) => apiPost<DesignSystem>("/api/design-systems", body);
 
 /** Omit `parent_id` to leave it alone; send `null` to make the system a family. */
 export const updateDesignSystem = (
   id: number,
-  body: { title?: string; description?: string; parent_id?: number | null },
+  body: {
+    title?: string;
+    description?: string;
+    guidance?: string;
+    parent_id?: number | null;
+  },
 ) => apiPatch<DesignSystem>(`/api/design-systems/${id}`, body);
 
 export const deleteDesignSystem = (id: number) =>
@@ -101,6 +112,7 @@ export const createDesignToken = (
     value_by_mode?: Record<string, string>;
     group_name?: string | null;
     purpose?: string | null;
+    rationale?: string | null;
     supersedes?: string[];
     order_index?: number;
   },