@nurix/etna 0.18.18 → 0.18.20

package/data/harnesses/code/skills/design/data/design-md/library/together-ai.md

@@ -0,0 +1,220 @@
+---
+schema: design-md/v1
+product: Together AI
+provenance: library
+sourced: 2026-07-04
+---
+
+# Together AI — the white-band operator reading
+
+Together AI's surface alternates two registers: near-black hero bands carrying a single piece of brand
+chrome — a three-color orange-magenta-periwinkle gradient ribbon — and bright white technical bands where
+the real content lives (pricing tables, docs, model rows). This entry is the *operator* reading: it lives
+in the **white technical band**, carried onto a CRM, a queue, or a dashboard. What carries: the white
+canvas, stark black ink and black CTA, the uppercase mono-caps eyebrow/label voice, hairline-led flatness,
+the tight 4px radius, and a near-black nav rail — the brand's dark nav made permanent. What stays behind:
+near-black content bands, the gradient ribbon, hero-scale display (64px), the giant `together.ai` wordmark
+banner, the mint/white hero pills, and the dual-surface alternation. The gradient's colors survive only in
+data viz. Both machine blocks are fully valued; judgments where the corpus is silent are annotated `# derived:`.
+
+## 1 Visual Theme
+
+Light by default; dark is opt-in. Flat — hierarchy is carried by hairline `border`, type weight, uppercase
+mono labels, and surface contrast, never by shadow. The register is stark: ink is pure black `foreground`
+(`#000000`) on a pure white canvas — recorded plainly, because the brand's own ink is `#000000` and that
+starkness *is* the voice. The primary action wears black `primary` (`#000000`) — a monochrome CTA, not a
+color; the brand's black pill carried intact. One chromatic accent — a periwinkle-indigo pulled from the
+cool leg of the brand gradient — is reserved for links, selection, and focus; the full three-stop gradient
+stays marketing-only. The persistent nav rail wears the brand's near-black nav color (`sidebar` `#010120`) —
+the dark-nav-over-light-content signature made permanent. Density is `standard`, stepping denser per
+archetype; the brand's pricing tables read like a sheet.
+
+## 2 Color Roles
+
+Light values first; the manifest carries the exact hex (the corpus's native format). One chromatic accent —
+periwinkle-indigo carries interactive meaning; status hues (all derived — the brand documents none) speak only status.
+
+| Role | Value | Allowed where |
+| --- | --- | --- |
+| `background` / `card` / `popover` | canvas white `#ffffff` | page, cards, and overlays — the dominant surface, differentiated by border not brightness |
+| `foreground` | ink black `#000000` | all primary text — stark, per the brand |
+| `muted` | faint neutral `#f5f5f5` | hover rows, subtle fills |
+| `muted-foreground` | body gray `#666666` | labels, captions, mono eyebrows, secondary text |
+| `secondary` | canvas-soft `#ebebeb` | secondary buttons, table-header rails, toggle rails |
+| `border` / `input` | hairline `#e6e6e6` | every separator, grid line, field edge, and card chrome |
+| `primary` | black `#000000` | the one primary action; active nav — a neutral, not a color |
+| `accent` | pale periwinkle `#eeedfd` | selected/hovered rows and nav, on-accent surfaces only |
+| `accent-foreground` | periwinkle-indigo `#4b44dd` | links, selection detail — the single interactive hue |
+| `ring` | periwinkle-indigo `#4b44dd` | the keyboard focus outline — the one accent, so focus never reads as the black CTA |
+| `destructive` | red `#dc2626` | destructive actions and error state only |
+| `success` / `warning` | green `#16a34a` / amber `#d97706` | status signalling only, never chrome |
+
+The three-stop gradient (orange → magenta → periwinkle) and the mint pill are marketing graces — no chrome role here; they survive only as chart hues (see §6, §7).
+
+## 3 Typography
+
+Two faces carry the whole system, and their contrast *is* the brand. `font-sans` is Together's geometric
+display sans (`The Future`, Inter substitute) — headings and body both ride it; tight negative tracking,
+not weight, is the voice, and it never bolds past 500. `font-mono` is the uppercase mono-caps face
+(`PP Neue Montreal Mono`, JetBrains Mono substitute) — the brand's irreducible signature: every eyebrow,
+button label, table-header cell, and system tag is set in it, uppercase, at positive tracking. Headlines
+stay sentence-case; every uppercase moment is the mono. Numeric columns render `tabular-nums`; the 64px
+hero display stays behind.
+
+| Step | Role | Family | Size · line | Weight · tracking |
+| --- | --- | --- | --- | --- |
+| h1 | page title | sans | 24px / 1.25 | `font-weight-strong` · `heading-tracking` |
+| h2 | section head | sans | 20px / 1.3 | `font-weight-strong` · -0.015em |
+| h3 | card / group head | sans | 16px / 1.35 | `font-weight-strong` · -0.01em |
+| body | UI + prose | sans | 14px / 1.45 | `font-weight-normal` |
+| small | labels, meta, dense table | sans | 13px / 1.4 | `font-weight-normal` |
+| mono-label | uppercase eyebrow / header cell | mono | 11px / 1.4 | `font-weight-strong`, +0.05em, uppercase |
+| mono-button | uppercase button label | mono | 13px / 1 | `font-weight-strong`, +0.02em, uppercase |
+| code | IDs, logs, amounts | mono | 13px / 1.5 | `font-weight-normal` |
+
+Never let the mono carry a paragraph; emphasis is weight-to-strong or a switch to the mono face.
+
+## 4 Component Stylings
+
+Every recurring operator component composes from the primitives — no literal values.
+
+- **Button** — `primary`: filled black `primary` on `primary-foreground`, `radius` (4px), never a full pill, label in uppercase mono. Secondary: `secondary` fill, 1px `border`, `foreground`. Ghost: `accent` on hover.
+- **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus draws the periwinkle `ring` at 2px, no glow.
+- **Card** — `card` on a 1px `border`; white-on-white, read by its hairline, never brightness; shadow only when a true overlay lifts (`shadow-intensity`); inset by `density-inset`.
+- **Table row** — height `table-row-height`; `secondary` header fill with uppercase mono header cells; `border` grid lines; `muted` on hover; `tabular-nums` on numeric columns; selection tints `accent`.
+- **Side panel** — detail and edit open in the panel (`side-panel-width`, `side-panel-width-rich` for content-heavy), beside the work, not over it.
+- **Badge** — pill `radius` (9999) allowed here as a brand grace; hairline `border` or status fill, uppercase mono caption; status badges take `success` / `warning` / `destructive`, never `primary`.
+
+## 5 Layout
+
+Base spacing unit 4px; the on-scale ramp is `2 · 4 · 8 · 12 · 16 · 24 · 32 · 48 · 80` (the 80 preserves the
+brand's dramatic section rhythm). Shell dimensions map one-to-one to the layout primitives: the near-black
+sidebar `sidebar-width-expanded` / `sidebar-width-collapsed`, topbar `topbar-height` (the brand's nav
+rhythm), side panel `side-panel-width` / `side-panel-width-rich`, modal cap `modal-width-max`, forms
+`form-max-width`, tables full-width. Rows ride `table-row-height` (40px — the brand's sheet-tight pricing
+row). Density is governed globally by `density-tier` and stepped per archetype by the surface catalog —
+never by absolute overrides.
+
+## 6 Depth
+
+Flat. Hierarchy comes from hairlines, surface polarity, and the dark rail — not shadow:
+
+- **0 — canvas** `background` white, no border.
+- **1 — panel / card** `card` white on a 1px `border`; white-on-white read entirely by the hairline.
+- **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns a soft `md` shadow, navy-tinted (the brand's `rgba(1,1,32,0.1)` drop); modals lean on a tinted scrim, not a heavy shadow.
+- **rail — nav** the persistent sidebar wears near-black `sidebar` (`#010120`) with white text — the brand's dark nav carried, the one dark surface in a light UI.
+
+The gradient is not chrome here — it lives in charts (`chart-1..5` carry the accent indigo, brand magenta, brand orange, deepened mint). Focus is a 2px periwinkle `ring` outline, never a glow, on every interactive element. Three z-levels: content, sticky chrome, overlay.
+
+## 7 Do's & Don'ts
+
+- **Do** keep the canvas pure white and the ink pure black — the stark black-on-white is the brand's technical register.
+- **Do** set every eyebrow, button label, and table-header cell in uppercase mono (`font-mono`) with positive tracking — the two-face contrast is the voice.
+- **Do** reserve black `primary` for the single most important action and the periwinkle `accent-foreground` for links, selection, and focus — one accent, treated as scarce.
+- **Do** dress the persistent nav rail in the near-black `sidebar` (`#010120`) — the brand's dark nav made permanent.
+- **Don't** set headlines in the all-caps mono or let the mono carry a paragraph — every uppercase moment is the mono, every headline is the sans in sentence case.
+- **Don't** promote a second chromatic accent, or reduce the three-stop gradient into UI chrome — it survives only at chart scale.
+- **Don't** full-pill the primary CTA (buttons keep the 4px `radius`; pills stay on badges), or signal elevation with heavy drop shadows — hairlines and surface polarity carry rank.
+
+## 8 Responsive
+
+The operator sweep is 375 / 768 / 1024 / 1440.
+
+| Breakpoint | What changes |
+| --- | --- |
+| 375 | dark sidebar → off-canvas drawer; two-pane list+detail stacks; side panel → full sheet; table rows stack model above values; density holds |
+| 768 | sidebar collapses to the near-black icon rail (`sidebar-width-collapsed`); tables scroll their overflow |
+| 1024 | sidebar expands; two-pane queue+detail holds side by side |
+| 1440 | forms cap at `form-max-width`; tables and dashboards use the full width; section rhythm widens |
+
+## 9 Agent Prompt Guide
+
+Directives the emitting agent follows verbatim:
+
+- Reach for the white canvas and pure-black ink first; float hairline-bordered white `card` surfaces on it, read by border, never by brightness.
+- Set every eyebrow, button label, and table-header cell in uppercase mono (`font-mono`); keep headlines in the sentence-case sans with tight negative tracking. Never bold the sans past 500.
+- Accent only the primary action in black `primary`; let the periwinkle `accent-foreground` be the one chromatic hue, for links, selection, and focus. If two things want the accent, one is not primary.
+- Dress the persistent nav rail in the near-black `sidebar` (`#010120`) — the one dark surface in a light UI.
+- Every numeric column is `tabular-nums`; every ID, code, model slug, and timestamp is `font-mono`. Every workflow completes from the keyboard; the periwinkle `ring` focus outline is always visible.
+- Stay flat — hairline and surface polarity before shadow; reach past a hairline only for a real overlay.
+- Leave the marketing furniture behind: near-black content bands, the gradient ribbon, the 64px hero display, the wordmark banner, the mint/white hero pills. The gradient's colors return only in charts.
+
+```yaml design-primitives
+radius: 4px                                        # corpus: the brand's canonical card/button/table radius (rounded.sm 4px); the 9999 pill stays on badges/the chat orb
+shadow-intensity: 0.3                              # derived: elevation is hairline + surface polarity + the dark rail; the one soft drop is navy-tinted (brand rgba(1,1,32,0.1))
+border-weight: 1px
+density-gap: 1
+density-inset: 1
+font-sans: The Future, Inter, "Helvetica Neue", Arial, sans-serif   # corpus: custom geometric display sans (The Future) for headings and body; Inter is the corpus-named substitute
+font-mono: PP Neue Montreal Mono, "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace   # corpus: uppercase mono-caps face for every eyebrow/label/button/header — the brand signature; JetBrains Mono is the corpus-named substitute
+font-weight-normal: 400                            # corpus: body weight 400
+font-weight-strong: 500                            # corpus: the face never appears above weight 500 (never bold 700)
+heading-tracking: -0.02em                          # corpus: tight negative display tracking (-1.92px@64px, -0.16px@16px) preserved at operator heading scale
+duration-unit: 50ms                                # derived: corpus documents no motion; functional operator base
+duration-fast: 100ms                               # derived: corpus silent on motion
+duration-normal: 150ms                             # derived: corpus silent on motion
+duration-slow: 250ms                               # derived: corpus silent on motion
+ease-default: cubic-bezier(0.4,0,0.2,1)            # derived: corpus silent; standard functional ease
+contrast-boost: 1                                  # derived: stark #000 ink is already maximal; the hairline is intentionally faint per brand
+icon-stroke: 1.75                                  # derived: corpus uses SVG logos/illustration, no icon set; 1.75 suits the tight geometric character
+icon-size-base: 16px                               # derived: corpus silent on icon size; operator standard
+sidebar-width-expanded: 248px                      # derived: corpus has no sidebar (marketing top-nav); operator shell default
+sidebar-width-collapsed: 56px                      # derived: operator icon-rail standard
+topbar-height: 56px                                # derived: from the brand nav-bar rhythm (16px vertical padding on body-md)
+side-panel-width: 420px                            # derived: corpus has no shell; standard operator detail panel
+side-panel-width-rich: 640px                       # derived: content-heavy detail panel
+modal-width-max: 560px                             # derived: corpus modals lean on a tinted scrim, not shadow; operator confirmation cap
+form-max-width: 640px                              # derived: corpus silent on shell; operator form column
+table-row-height: 40px                             # corpus: pricing tables "read more like a sheet" — tight 12px-vertical rows carried
+verbosity: default
+feedback: minimal                                  # derived: the stark black/white, mono-caps, flat register wants terse, engineered feedback, not soft ambient motion
+density-tier: standard                             # derived: white technical bands run sheet-dense; a general operator default holds standard and steps denser per archetype
+product-traits: [ai-platform, dev-tools, dashboard, api-console]
+```
+
+```yaml lever-manifest
+version: 1
+fonts: { sans: "The Future, Inter, \"Helvetica Neue\", Arial, sans-serif", mono: "PP Neue Montreal Mono, \"JetBrains Mono\", ui-monospace, \"SF Mono\", Menlo, monospace" }
+color-tokens:
+  light:
+    background: "#ffffff"
+    foreground: "#000000"
+    card: "#ffffff"
+    card-foreground: "#000000"
+    muted: "#f5f5f5"                               # derived: a faint neutral for hover rows, lighter than the grid hairline
+    muted-foreground: "#666666"                    # derived: brand secondary-text gray #999999 darkened for legible operator metadata (AA)
+    border: "#e6e6e6"                              # derived: brand card/input hairline rgba(0,0,0,0.08) over white, firmed a step for grid legibility
+    input: "#e6e6e6"
+    ring: "#4b44dd"                                # derived: brand periwinkle gradient-leg #bdbbff darkened to a legible interactive indigo — the single accent
+    primary: "#000000"                             # corpus: the black pill CTA carried intact
+    primary-foreground: "#ffffff"
+    accent: "#eeedfd"                              # derived: pale wash of the periwinkle accent for selected/hover rows and nav
+    accent-foreground: "#4b44dd"                   # derived: darkened brand periwinkle — links and selection detail
+    destructive: "#dc2626"                         # derived: corpus documents no error palette; framework red
+    destructive-foreground: "#ffffff"
+    success: "#16a34a"                             # derived: corpus documents no success palette; framework green
+    warning: "#d97706"                             # derived: corpus documents no warning palette; framework amber
+    popover: "#ffffff"
+    popover-foreground: "#000000"
+    secondary: "#ebebeb"                           # corpus: the brand's single soft surface (canvas-soft #ebebeb) — table-header rails, toggle rails, secondary buttons
+    secondary-foreground: "#000000"
+    chart-1: "#4b44dd"                             # accent periwinkle-indigo — primary data series
+    chart-2: "#ef2cc1"                             # corpus: brand gradient magenta leg
+    chart-3: "#fc4c02"                             # corpus: brand gradient orange leg
+    chart-4: "#12a3ad"                             # derived: brand mint #c8f6f9 deepened to a legible cyan data series
+    chart-5: "#666666"                             # derived: neutral gray series
+    sidebar: "#010120"                             # corpus: the brand's near-black nav color (canvas-dark) carried onto the persistent rail
+    sidebar-foreground: "#ffffff"                  # corpus: on-dark text is white
+    sidebar-primary: "#4b44dd"                     # derived: the accent marks the active nav item on the dark rail (brand's black indicator is invisible on dark)
+    sidebar-primary-foreground: "#ffffff"
+    sidebar-accent: "#26263a"                      # corpus: the brand's on-dark hairline tone (surface-dark-soft family) — hover fill on the dark rail
+    sidebar-accent-foreground: "#ffffff"
+    sidebar-border: "#26263a"                      # corpus: on-dark hairline divider within the rail
+    sidebar-ring: "#4b44dd"                        # derived: the accent as focus outline on the dark rail
+spacing-scale: [2, 4, 8, 12, 16, 24, 32, 48, 80]
+radius-scale: [0, 4, 8, 9999]
+shadow-levels: [none, sm, md]
+motion: { durations: [100, 150, 250], easings: ["cubic-bezier(0.4,0,0.2,1)"] }
+icons: { family: lucide, stroke: 1.75 }
+accent-count: 1
+```

package/data/harnesses/code/skills/design/data/design-md/library/uber.md

@@ -0,0 +1,220 @@
+---
+schema: design-md/v1
+product: Uber
+provenance: library
+sourced: 2026-07-04
+---
+
+# Uber — the black-and-white super-app operator design
+
+The operator reading of Uber's monochrome web brand. The marketing theatre stays behind: hero display
+type (52 / 36px), the editorial 4:3 illustrations, the ride-request hero card, and the alternating
+white-then-black band rhythm. What carries is the chassis underneath — a black-and-white duet where pure
+black `primary` (`#000000`) does every conversion job, the pill on every interactive control, a flat
+no-shadow-by-default discipline, the neutral-tracked geometric sans voice, and the polarity-flip as the
+depth cue. Both machine blocks are fully valued; judgment past the corpus is annotated `# derived:`.
+
+## 1 Visual Theme
+
+Light by default; dark is opt-in. The system is a black-and-white duet: a pure white `background`
+canvas, pure black `foreground` ink, and a single accent that is not a colour at all — black `primary`
+(`#000000`) carries the one primary action, the active state, and the polarity-flipped bands. No second
+chromatic accent exists; the identity is the monochrome contrast plus one signature shape — the pill.
+Every interactive control rounds to the pill (`9999`), Uber's irreducible geometry, while cards take a
+soft 16px. Pure black is intentional (the brand ink is true `#000000`, recorded plainly over the generic
+no-pure-black bias). Flat: hierarchy is hairline `border`, type weight, and the polarity-flip, never
+shadow. The anchor surface is a white canvas beside a black `sidebar` — the shell is the duet, at `standard` density.
+
+## 2 Color Roles
+
+Light values (the manifest carries hex — the corpus's native format). One accent: black `primary` is
+the only value that carries meaning; the status hues are derived and speak only status.
+
+| Role | Value | Allowed where |
+| --- | --- | --- |
+| `background` / `card` / `popover` | white `#ffffff` | page, cards, and overlays — the dominant surface |
+| `foreground` | pure black `#000000` | all primary ink and headlines — the brand's true-black ink |
+| `muted` / `secondary` | canvas-soft `#efefef` | hover rows, subtle fills, chip grounds, the gray subtle-pill button |
+| `muted-foreground` | body gray `#5e5e5e` | labels, captions, secondary text |
+| `border` / `input` | pressed gray `#e2e2e2` | every separator, grid line, and field edge |
+| `primary` | black `#000000` | the one primary action; active nav mark; the polarity-flip bands |
+| `accent` | pressed gray `#e2e2e2` | selected / hovered rows — a gray wash, never a hue |
+| `ring` | black `#000000` | the focus outline — maximally visible, keyboard-first |
+| `destructive` | derived red `#d93025` | destructive actions and error state only |
+| `success` / `warning` | derived `#157347` / `#b25000` | status signalling only, never chrome |
+
+Links are ink and underlined, never blue — the `#0000ee` browser-blue in Uber's fine print stays behind.
+The black `sidebar` wears Uber's dark-band tones (`#000000` fill, `#282828` hover); `#afafaf` is placeholder only.
+
+## 3 Typography
+
+One sans, one mono. `font-sans` is Inter — the corpus's substitute for the proprietary UberMove /
+UberMoveText, with `font-feature-settings: "ss01"` approximating UberMove's geometric alternates. One
+family carries body, UI, and headings; weight, not a second face, carries the display voice (the
+two-face split and the hero 52 / 36px sizes stay behind). Tracking is neutral (`0`) — Uber never
+letter-spaces, a stated brand invariant. `font-mono` is Geist Mono for IDs, codes, and timestamps;
+numeric columns render `tabular-nums`.
+
+| Step | Role | Size · line | Weight · tracking |
+| --- | --- | --- | --- |
+| h1 | page title | 24px / 1.25 | `font-weight-strong` · `heading-tracking` (0) |
+| h2 | section head | 20px / 1.3 | `font-weight-strong` · 0 |
+| h3 | card / group head | 16px / 1.4 | `font-weight-strong` · 0 |
+| body | UI + prose | 15px / 1.5 | `font-weight-normal` |
+| small | labels, meta, dense table | 13px / 1.4 | `font-weight-normal` |
+| caption | uppercase eyebrow (rare) | 12px / 1.4 | `font-weight-strong`, `+0.04em`, uppercase |
+| mono | IDs, codes, timestamps | 13px / 1.5 | `font-weight-normal` |
+
+Headlines are sentence-case (the uppercase eyebrow is the rare exception); emphasise by weight, never size or tracking.
+
+## 4 Component Stylings
+
+- **Button** — `primary`: filled black `primary` on `primary-foreground`, pill (`9999`) — the pill IS
+  the signature, kept where other readings would rect. Secondary: white `card` fill, 1px `border`, pill.
+  Subtle: `secondary` gray fill, pill. Ghost: transparent, `muted` hover.
+- **Input** — `background` fill, 1px `border`, the soft `radius` rect (~8px) — inputs are the one
+  control that does **not** pill; focus draws the black `ring` at 2px, no glow.
+- **Card** — `card` surface, 1px `border`, `radius` steps to 16px (Uber's canonical card); shadow only when lifted.
+- **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; selection tints
+  `accent`; `tabular-nums` on numerics; the active-row indicator is a black `primary` left edge.
+- **Side panel** — detail and edit open in the side panel (`side-panel-width` / `-rich`), beside the work, never over it.
+- **Badge** — pill radius, `muted` / status fill, uppercase caption; status badges take
+  `success` / `warning` / `destructive`, never `primary`.
+
+## 5 Layout
+
+Base spacing unit 4px; the on-scale ramp is `4 · 6 · 8 · 12 · 16 · 20 · 24 · 32 · 48` (the brand's own
+tokens, including the 6px sub-step). Shell dimensions map one-to-one to the layout primitives: sidebar
+`sidebar-width-expanded` (248px) / `sidebar-width-collapsed` (56px), topbar `topbar-height` (56px), side
+panel `side-panel-width` (440px) / `side-panel-width-rich` (640px), modal `modal-width-max`, forms
+`form-max-width`, tables full-width. Density is `standard`, governed by `density-tier`, stepped per archetype.
+
+## 6 Depth
+
+Flat, polarity-first. Hierarchy comes from the black/white contrast and hairlines, not shadow:
+
+- **0 — canvas** white `background`, no border.
+- **1 — panel / card** `card` on a 1px `border`; shadow only when it must lift off the canvas.
+- **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns a soft `md`
+  drop (matching Uber's ~0.16-alpha card drop).
+- **band — polarity-flip** inverting to the black `primary` / `sidebar` surface with white text is
+  Uber's signature depth cue: rank by flipping to black, never by stacking a heavier shadow.
+
+Focus is a 2px black `ring` outline (never a glow). Three z-levels: content, sticky chrome, overlay.
+
+## 7 Do's & Don'ts
+
+- **Do** keep the system black-and-white — one black `primary` doing every conversion job; the
+  monochrome contrast is the brand.
+- **Do** pill every interactive control (buttons, chips, badges) — Uber's irreducible geometric
+  signature; inputs are the one exception (the soft `radius` rect).
+- **Do** keep headlines sentence-case with neutral (`0`) tracking — Uber never letter-spaces; apply
+  `tabular-nums` to numeric columns and `font-mono` to IDs, codes, and timestamps.
+- **Don't** introduce a second chromatic accent — orange, blue, or green flattens the monochrome
+  system; the status hues are derived and reserved for status only.
+- **Don't** render links in browser-blue (the `#0000ee` fine-print artifact stays behind), or put a
+  shadow on chrome — flat is the default; shadow lifts only true overlays.
+- **Don't** reach past `radius-scale`, or open detail in a modal when the side panel fits.
+
+## 8 Responsive
+
+The operator sweep is 375 / 768 / 1024 / 1440.
+
+| Breakpoint | What changes |
+| --- | --- |
+| 375 | sidebar → off-canvas drawer; two-pane list+detail stacks; side panel → full sheet; density holds |
+| 768 | sidebar collapses to the icon rail (`sidebar-width-collapsed`); tables scroll their overflow |
+| 1024 | sidebar expands; two-pane queue+detail holds side by side |
+| 1440 | forms cap at `form-max-width`; tables and dashboards use the full width |
+
+## 9 Agent Prompt Guide
+
+- **Carries:** the black-and-white duet; pure black `primary` as the single accent; the pill on every
+  interactive control; the black `sidebar` / band polarity-flip; Inter (`ss01`) at neutral tracking; flat hairline depth.
+- **Stays behind:** the hero display (52 / 36px); the editorial 4:3 illustrations; the ride-request hero
+  card; the alternating-band rhythm at hero scale; the browser-blue link.
+- Lead every list with its table, every entity with its primary read. Accent only the primary action in
+  black — if two things want black, one is not primary.
+- Pill the interactive controls; inputs take the soft rect; keep the `sidebar` black with white actives.
+  Every numeric column is `tabular-nums`, every ID / code / timestamp `font-mono`, the black `ring` always visible.
+- Stay flat — hairline and polarity-flip before shadow; past a hairline only for a real overlay.
+
+```yaml design-primitives
+radius: 12px                                       # derived: corpus card is 16px (rounded.xl); base 12px yields the 16px card at xl and the ~8px input at sm — the pill 9999 (the signature interactive shape) stays in-scale, applied per-control
+shadow-intensity: 0.5                              # derived: corpus default is Level 0 flat; overlays carry a ~0.12–0.16 alpha drop — 0.5 lifts only true overlays, chrome stays flat
+border-weight: 1px
+density-gap: 1
+density-inset: 1
+font-sans: Inter, system-ui, "Helvetica Neue", Arial, sans-serif   # derived: UberMove/UberMoveText are proprietary; corpus names Inter as the closest substitute (font-feature-settings "ss01" approximates UberMove's geometric alternates)
+font-mono: Geist Mono, ui-monospace, SFMono-Regular, monospace     # derived: corpus carries no mono; Geist Mono chosen as the sibling of the corpus-named Geist substitute
+font-weight-normal: 400
+font-weight-strong: 600                            # derived: corpus display is weight 700 across the ramp; the operator reading pulls headings to 600 (the hero 700 stays behind with the display sizes)
+heading-tracking: 0em                              # corpus: Uber never letter-spaces the display face — neutral tracking is a stated brand invariant
+duration-unit: 50ms                                # derived: corpus is silent on motion; operator-standard functional base
+duration-fast: 100ms                               # derived: corpus silent on motion
+duration-normal: 150ms                             # derived: corpus silent on motion
+duration-slow: 200ms                               # derived: corpus silent; kept crisp, not cinematic
+ease-default: cubic-bezier(0.4,0,0.2,1)            # derived: corpus silent; standard functional ease
+contrast-boost: 1                                  # derived: the pressed-gray hairlines read as a grid without boosting
+icon-stroke: 1.75                                  # derived: corpus specifies no stroke; a refined 1.75 suits the clean geometric system
+icon-size-base: 16px                               # derived: corpus silent; sits with the 15px body
+sidebar-width-expanded: 248px                      # derived: corpus has no operator shell; standard nav rail
+sidebar-width-collapsed: 56px                      # derived: standard icon rail
+topbar-height: 56px                                # derived: corpus nav padding (16/32); operator topbar at 56px
+side-panel-width: 440px                            # derived: corpus has no shell; standard detail panel
+side-panel-width-rich: 640px                       # derived: content-heavy detail
+modal-width-max: 560px                             # derived: confirmation-dialog cap
+form-max-width: 640px                              # derived: readable form column (corpus's 490px ride-request hero card stays behind)
+table-row-height: 44px                             # derived: corpus data-cell padding (12/16) → a ~44px row at standard density
+verbosity: default
+feedback: subtle
+density-tier: standard                             # derived: Uber's marketing is generous but not airy; an honest operator standard, stepped per archetype
+product-traits: [dispatch, logistics, operations, marketplace, dashboard]
+```
+
+```yaml lever-manifest
+version: 1
+fonts: { sans: "Inter, system-ui, 'Helvetica Neue', Arial, sans-serif", mono: "Geist Mono, ui-monospace, SFMono-Regular, monospace" }
+color-tokens:
+  light:
+    background: "#ffffff"
+    foreground: "#000000"
+    card: "#ffffff"
+    card-foreground: "#000000"
+    muted: "#efefef"
+    muted-foreground: "#5e5e5e"
+    border: "#e2e2e2"
+    input: "#e2e2e2"
+    ring: "#000000"
+    primary: "#000000"
+    primary-foreground: "#ffffff"
+    accent: "#e2e2e2"
+    accent-foreground: "#000000"
+    destructive: "#d93025"                         # derived: corpus documents no error hue (marketing is monochrome); a restrained red for the status triad, chosen not to read as a second brand accent
+    destructive-foreground: "#ffffff"
+    success: "#157347"                             # derived: corpus has no status palette; restrained green for status only
+    warning: "#b25000"                             # derived: corpus has no status palette; restrained amber for status only
+    popover: "#ffffff"
+    popover-foreground: "#000000"
+    secondary: "#efefef"
+    secondary-foreground: "#000000"
+    chart-1: "#000000"                             # derived: monochrome brand → grayscale-forward chart ramp; categorical differentiation carried by pattern/label, not a second hue
+    chart-2: "#4b4b4b"                             # corpus: hairline-mid
+    chart-3: "#8a8a8a"                             # derived: mid-gray fill between hairline-mid and mute for series spread
+    chart-4: "#afafaf"                             # corpus: mute
+    chart-5: "#d4d4d4"                             # derived: light-gray ramp tail
+    sidebar: "#000000"                             # derived: the shell wears Uber's polarity-flip — the sidebar is the black band (corpus footer/band fill #000000)
+    sidebar-foreground: "#ffffff"
+    sidebar-primary: "#ffffff"                     # derived: the active nav mark on the black band is white (black would vanish)
+    sidebar-primary-foreground: "#000000"
+    sidebar-accent: "#282828"                      # corpus: black-elevated — Uber's documented dark-band hover
+    sidebar-accent-foreground: "#ffffff"
+    sidebar-border: "#282828"                      # derived: the hairline on the black band (black-elevated tone)
+    sidebar-ring: "#ffffff"
+spacing-scale: [4, 6, 8, 12, 16, 20, 24, 32, 48]
+radius-scale: [0, 8, 12, 16, 9999]
+shadow-levels: [none, sm, md]
+motion: { durations: [100, 150, 200], easings: ["cubic-bezier(0.4,0,0.2,1)"] }
+icons: { family: lucide, stroke: 1.75 }
+accent-count: 1
+```