chore: catch up Storybook preview, coverage, and story hygiene

Stories were throwing without AuthModal/CreateFlow providers, autodocs was a no-op, and several DS/create-flow screens had no stories.

.cursor/rules/storybook.mdc

@@ -28,16 +28,17 @@ Do **not** colocate `*.stories.*` next to components. The Storybook config
 
 # File naming
 
-- `<ComponentName>.stories.js` — matches 69/70 existing files.
-- Use `.tsx` only when the story genuinely needs types (rare; prefer JS to
-  match the codebase convention).
+- `<ComponentName>.stories.js` — default; keep `.js` unless the story
+  genuinely needs types.
+- Use `.tsx` only when the story uses `Meta` / `StoryObj` (rare).
 - Variants get a suffix: `Button.visual.stories.js`,
   `Footer.responsive.stories.js`.
 
-# Default export shape (CSF2)
+# Default export shape (CSF3)
 
 ```javascript
 import MyComponent from "../../app/components/<area>/MyComponent";
+import { CHIP_PALETTE_OPTIONS } from "../../lib/propNormalization";
 
 export default {
   title: "Components/<SubFolder>/MyComponent",
@@ -51,31 +52,32 @@ export default {
     },
   },
   argTypes: {
-    variant: {
+    palette: {
       control: { type: "select" },
-      options: ["filled", "outline"],
-      description: "The variant (Figma prop)",
+      options: [...CHIP_PALETTE_OPTIONS],
+      description: "The palette (Figma prop)",
     },
     onClick: { action: "clicked" },
   },
 };
 
-export const Default = { args: { variant: "filled" } };
+export const Default = { args: { palette: "default" } };
 ```
 
 ## Title hierarchy
 
 - Design-system components → `Components/<SubFolder>/<Name>` (e.g.
   `Components/Controls/Checkbox`).
-- Pages → `Pages/<PageName>` (folder: `stories/pages/`).
+- Create-flow screens → `Pages/Create Flow/<Step>` (folder: `stories/pages/`).
 - Create flow shared pieces → `Create Flow/<Name>`.
 
 ## `argTypes`
 
 For every Figma enum prop (`variant`, `size`, `state`, `mode`, `palette`,
-…) expose a `select` control listing the **lowercase** option set, sourced
-from the matching `*_OPTIONS` const in `lib/propNormalization.ts`. See
-`.cursor/rules/component-props.mdc`.
+…) expose a `select` control listing the option set, sourced from the matching
+`*_OPTIONS` const in `lib/propNormalization.ts`. See
+`.cursor/rules/component-props.mdc`. Spread with `[...FOO_OPTIONS]` so the
+control receives a mutable array.
 
 # Rely on the global preview — don't re-wrap
 
@@ -83,8 +85,12 @@ from the matching `*_OPTIONS` const in `lib/propNormalization.ts`. See
 
 - `MessagesProvider` with `messages/en` → access copy via `useMessages()`
   inside stories exactly like app code. Never hard-code user-facing strings.
-- `app/globals.css` + `.font-inter` wrapper → design tokens and fonts are
-  already present.
+- `AuthModalProvider` and `CreateFlowProvider` (same stack as
+  `tests/utils/test-utils.tsx`) so `Top` and create-flow screens can mount.
+- `app/globals.css` + Inter / Bricolage Grotesque / Space Grotesk CSS
+  variables + `.font-inter` wrapper.
+- Dark canvas default and Figma breakpoints (`sm` 430, `md` 640, `lg` 1024,
+  `xl` 1440).
 
 Do **not** add your own `MessagesProvider`, font wrapper, or token setup in a
 story. If you need a new global, update `preview.js`.
@@ -92,8 +98,8 @@ story. If you need a new global, update `preview.js`.
 # Interaction tests (`play`)
 
 Use `storybook/test` for interaction assertions — not `@testing-library/*`
-directly. This matches `Checkbox.stories.js` and stays compatible with the
-Vitest portable-stories runner in `.storybook/vitest.setup.js`.
+directly. This matches `Checkbox.stories.js`. Storybook is documentation;
+Vitest component tests remain the source of truth.
 
 ```javascript
 import { within, userEvent, expect } from "storybook/test";