@nurix/etna 0.18.18 → 0.18.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (100) hide show
  1. package/data/harness-index.json +1 -1
  2. package/data/harnesses/code/harness.json +2 -2
  3. package/data/harnesses/code/rules/general.md +2 -1
  4. package/data/harnesses/code/skills/design/SKILL.md +65 -0
  5. package/data/harnesses/code/skills/design/data/catalog/rules.csv +132 -0
  6. package/data/harnesses/code/skills/design/data/design-md/SCHEMA.md +317 -0
  7. package/data/harnesses/code/skills/design/data/design-md/library/airbnb.md +235 -0
  8. package/data/harnesses/code/skills/design/data/design-md/library/airtable.md +232 -0
  9. package/data/harnesses/code/skills/design/data/design-md/library/anthropic-claude.md +220 -0
  10. package/data/harnesses/code/skills/design/data/design-md/library/apple.md +220 -0
  11. package/data/harnesses/code/skills/design/data/design-md/library/binance.md +223 -0
  12. package/data/harnesses/code/skills/design/data/design-md/library/bmw.md +219 -0
  13. package/data/harnesses/code/skills/design/data/design-md/library/cal.md +220 -0
  14. package/data/harnesses/code/skills/design/data/design-md/library/clay.md +220 -0
  15. package/data/harnesses/code/skills/design/data/design-md/library/clickhouse.md +220 -0
  16. package/data/harnesses/code/skills/design/data/design-md/library/cohere.md +227 -0
  17. package/data/harnesses/code/skills/design/data/design-md/library/coinbase.md +237 -0
  18. package/data/harnesses/code/skills/design/data/design-md/library/composio.md +220 -0
  19. package/data/harnesses/code/skills/design/data/design-md/library/cursor.md +220 -0
  20. package/data/harnesses/code/skills/design/data/design-md/library/elevenlabs.md +220 -0
  21. package/data/harnesses/code/skills/design/data/design-md/library/expo.md +228 -0
  22. package/data/harnesses/code/skills/design/data/design-md/library/figma.md +221 -0
  23. package/data/harnesses/code/skills/design/data/design-md/library/framer.md +236 -0
  24. package/data/harnesses/code/skills/design/data/design-md/library/hashicorp.md +220 -0
  25. package/data/harnesses/code/skills/design/data/design-md/library/ibm.md +234 -0
  26. package/data/harnesses/code/skills/design/data/design-md/library/intercom.md +240 -0
  27. package/data/harnesses/code/skills/design/data/design-md/library/kraken.md +236 -0
  28. package/data/harnesses/code/skills/design/data/design-md/library/linear-app.md +237 -0
  29. package/data/harnesses/code/skills/design/data/design-md/library/lovable.md +220 -0
  30. package/data/harnesses/code/skills/design/data/design-md/library/meta.md +220 -0
  31. package/data/harnesses/code/skills/design/data/design-md/library/minimax.md +220 -0
  32. package/data/harnesses/code/skills/design/data/design-md/library/mintlify.md +220 -0
  33. package/data/harnesses/code/skills/design/data/design-md/library/miro.md +233 -0
  34. package/data/harnesses/code/skills/design/data/design-md/library/mistral-ai.md +220 -0
  35. package/data/harnesses/code/skills/design/data/design-md/library/mongodb.md +236 -0
  36. package/data/harnesses/code/skills/design/data/design-md/library/notion.md +220 -0
  37. package/data/harnesses/code/skills/design/data/design-md/library/nvidia.md +222 -0
  38. package/data/harnesses/code/skills/design/data/design-md/library/ollama.md +226 -0
  39. package/data/harnesses/code/skills/design/data/design-md/library/opencode-ai.md +223 -0
  40. package/data/harnesses/code/skills/design/data/design-md/library/posthog.md +234 -0
  41. package/data/harnesses/code/skills/design/data/design-md/library/raycast.md +220 -0
  42. package/data/harnesses/code/skills/design/data/design-md/library/replicate.md +220 -0
  43. package/data/harnesses/code/skills/design/data/design-md/library/resend.md +285 -0
  44. package/data/harnesses/code/skills/design/data/design-md/library/revolut.md +225 -0
  45. package/data/harnesses/code/skills/design/data/design-md/library/runwayml.md +219 -0
  46. package/data/harnesses/code/skills/design/data/design-md/library/sanity.md +251 -0
  47. package/data/harnesses/code/skills/design/data/design-md/library/sentry.md +244 -0
  48. package/data/harnesses/code/skills/design/data/design-md/library/shopify.md +227 -0
  49. package/data/harnesses/code/skills/design/data/design-md/library/slack.md +240 -0
  50. package/data/harnesses/code/skills/design/data/design-md/library/spacex.md +252 -0
  51. package/data/harnesses/code/skills/design/data/design-md/library/spotify.md +248 -0
  52. package/data/harnesses/code/skills/design/data/design-md/library/stripe.md +241 -0
  53. package/data/harnesses/code/skills/design/data/design-md/library/supabase.md +255 -0
  54. package/data/harnesses/code/skills/design/data/design-md/library/superhuman.md +226 -0
  55. package/data/harnesses/code/skills/design/data/design-md/library/tesla.md +233 -0
  56. package/data/harnesses/code/skills/design/data/design-md/library/theverge.md +248 -0
  57. package/data/harnesses/code/skills/design/data/design-md/library/together-ai.md +220 -0
  58. package/data/harnesses/code/skills/design/data/design-md/library/uber.md +220 -0
  59. package/data/harnesses/code/skills/design/data/design-md/library/vercel.md +220 -0
  60. package/data/harnesses/code/skills/design/data/design-md/library/voltagent.md +245 -0
  61. package/data/harnesses/code/skills/design/data/design-md/library/warp.md +220 -0
  62. package/data/harnesses/code/skills/design/data/design-md/library/webflow.md +220 -0
  63. package/data/harnesses/code/skills/design/data/design-md/library/wired.md +220 -0
  64. package/data/harnesses/code/skills/design/data/design-md/library/wise.md +220 -0
  65. package/data/harnesses/code/skills/design/data/design-md/library/x-ai.md +220 -0
  66. package/data/harnesses/code/skills/design/data/design-md/library/zapier.md +238 -0
  67. package/data/harnesses/code/skills/design/data/design-md/nurix.md +217 -0
  68. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/command-center.tsx +249 -0
  69. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/create-edit.tsx +249 -0
  70. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/dashboard.tsx +248 -0
  71. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/entity-detail.tsx +245 -0
  72. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/list-detail.tsx +223 -0
  73. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/log-stream.tsx +249 -0
  74. package/data/harnesses/code/skills/design/data/operator-pack/fixtures.md +88 -0
  75. package/data/harnesses/code/skills/design/data/operator-pack/surface-catalog.md +132 -0
  76. package/data/harnesses/code/skills/design/data/operator-pack/trust-rubric.md +76 -0
  77. package/data/harnesses/code/skills/design/references/create.md +126 -0
  78. package/data/harnesses/code/skills/design/references/diagnosis.md +108 -0
  79. package/data/harnesses/code/skills/design/references/hard-rules.md +155 -0
  80. package/data/harnesses/code/skills/design/references/improve.md +85 -0
  81. package/data/harnesses/code/skills/design/references/interaction.md +77 -0
  82. package/data/harnesses/code/skills/design/references/introspect.md +100 -0
  83. package/data/harnesses/code/skills/design/references/lifecycle.md +73 -0
  84. package/data/harnesses/code/skills/design/references/personality.md +504 -0
  85. package/data/harnesses/code/skills/design/references/structure.md +138 -0
  86. package/data/harnesses/code/skills/design/scripts/derive-personality.mjs +706 -0
  87. package/data/harnesses/code/skills/design/scripts/detector.mjs +898 -0
  88. package/data/harnesses/code/skills/design/scripts/generate-fixtures.mjs +551 -0
  89. package/data/harnesses/code/skills/design/scripts/hook-config.json +11 -0
  90. package/data/harnesses/code/skills/design/scripts/phase-gate.mjs +386 -0
  91. package/data/harnesses/code/skills/design/scripts/preship-sweep.mjs +280 -0
  92. package/data/harnesses/code/skills/design/scripts/render-rung.mjs +690 -0
  93. package/data/harnesses/code/skills/design/scripts/scaffold.mjs +552 -0
  94. package/data/harnesses/code/skills/design/scripts/self-integrity.mjs +432 -0
  95. package/data/harnesses/etna/CLAUDE.md +1 -1
  96. package/data/harnesses/etna/harness.json +2 -2
  97. package/data/harnesses/etna/rules/general.md +2 -1
  98. package/data/harnesses/mobile/harness.json +2 -2
  99. package/data/harnesses/mobile/rules/general.md +2 -1
  100. package/package.json +1 -1
@@ -0,0 +1,220 @@
1
+ ---
2
+ schema: design-md/v1
3
+ product: Raycast
4
+ provenance: library
5
+ sourced: 2026-07-04
6
+ ---
7
+
8
+ # Raycast — operator reading of a categorically-dark developer system
9
+
10
+ Raycast is the rare brand where the doctrine's light default yields: it is *categorically dark* — one
11
+ continuous near-black canvas with no light variant in the source. This entry carries that identity onto
12
+ operator surfaces: the chrome of Raycast's own command palette (near-black surfaces, hairline borders,
13
+ a single white action, ss03-Inter), with the marketing theatre left behind. Because the brand is
14
+ dark-only, the manifest's single color map holds the near-black surfaces directly — brand tokens win
15
+ over the light-default floor, and there is no light variant. Corpus-silent judgments are `# derived:`.
16
+
17
+ ## 1 Visual Theme
18
+
19
+ Dark by default; there is no light variant. Flat and shadowless — hierarchy is a four-step surface
20
+ ladder (`background` → `card` → `muted` → overlay), never a drop shadow. Chrome is monochrome: white is
21
+ the single action color, and every primary button is a white rounded-rect on near-black. Color is
22
+ reserved — four saturated hues (blue, green, yellow, red) speak status and category only, never chrome.
23
+ The anchor surface is the near-black canvas carrying hairline-bordered cards; the single accent is
24
+ white. Density is `dense` — Raycast's command-palette chrome runs tight, and operator surfaces inherit it.
25
+
26
+ ## 2 Color Roles
27
+
28
+ Dark is native — the manifest's one color map holds these near-black values directly. One monochrome
29
+ action — white — carries every primary; the saturated hues speak only status.
30
+
31
+ | Role | Value | Allowed where |
32
+ | --- | --- | --- |
33
+ | `background` | near-black `#07080a` (canvas) | the dominant page surface, edge to edge |
34
+ | `foreground` | off-white `#f4f4f6` (ink) | primary ink on the canvas |
35
+ | `card` / `popover` | `#0d0d0d` (surface) | cards and overlays — one notch above canvas |
36
+ | `muted` / `secondary` | `#101111` (elevated) | inputs, tertiary buttons, active chips |
37
+ | `muted-foreground` | `#9c9c9d` (mute) | labels, captions, metadata |
38
+ | `border` / `input` | hairline `#242728` | every card edge, grid line, and field border |
39
+ | `primary` | white `#ffffff` | the one primary action — a white pill on black |
40
+ | `primary-foreground` | black `#000000` | text on the white action |
41
+ | `accent` | `#121212` (surface-card) | selected/active rows and nav — a surface lift, not a hue |
42
+ | `ring` | white `#ffffff` | focus outline — the action color, unmistakable |
43
+ | `destructive` | `#ff6161` | destructive actions and error status |
44
+ | `success` / `warning` | `#59d499` / `#ffc533` | status signalling only, never chrome |
45
+
46
+ The four saturated category hues (blue `#57c1ff`, green `#59d499`, yellow `#ffc533`, red `#ff6161`)
47
+ are status/illustration only — never a chrome button, never body text. White carries every action.
48
+
49
+ ## 3 Typography
50
+
51
+ One sans, one mono. `font-sans` is Inter with `font-feature-settings: "calt","kern","liga","ss03"`
52
+ enabled globally — the ss03 alternate `g` is the brand's signature and must stay on; without it the
53
+ type reads as plain Inter and loses the voice. `font-mono` is JetBrains Mono for IDs, codes,
54
+ timestamps, log lines (Raycast's marketing rarely shows mono; operator work needs it). Letter spacing
55
+ is *positive* — Raycast opens type rather than tightening it, so headings track `+0.01em`, the rare
56
+ operator system that does. Numeric columns render `tabular-nums`.
57
+
58
+ | Step | Role | Size · line | Weight · tracking |
59
+ | --- | --- | --- | --- |
60
+ | h1 | page title | 24px / 1.3 | `font-weight-strong` · `heading-tracking` |
61
+ | h2 | section head | 20px / 1.4 | `font-weight-strong` · `heading-tracking` |
62
+ | h3 | card / group head | 16px / 1.4 | `font-weight-strong` |
63
+ | body | UI + prose | 14px / 1.5 | `font-weight-normal` |
64
+ | small | labels, meta, dense table | 13px / 1.4 | `font-weight-normal` |
65
+ | caption | uppercase eyebrow | 12px / 1.5 | `font-weight-strong`, `+0.03em`, uppercase |
66
+
67
+ Hero display (56–64px) stays behind. Emphasise by weight one step, never by size.
68
+
69
+ ## 4 Component Stylings
70
+
71
+ - **Button** — `primary`: filled white `primary` on `primary-foreground`, `radius`, a rounded rect,
72
+ never a 9999 pill. Secondary: transparent, `foreground`. Tertiary: `secondary` (elevated) fill.
73
+ - **Input** — `secondary` (elevated) fill, 1px `border` (`border-weight`), `radius`; focus *brightens
74
+ the border* to the `ring`, never a glow.
75
+ - **Card** — `card` surface, 1px `border`, `radius`; no shadow (the surface ladder carries lift),
76
+ inset by `density-inset`.
77
+ - **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; row selection
78
+ tints `accent` (the surface-card lift); `tabular-nums` on numeric columns.
79
+ - **Side panel** — detail and edit open beside the work (`side-panel-width`, `side-panel-width-rich`),
80
+ not over it.
81
+ - **Badge** — hairline `border`, `muted`/status fill; status badges take `success` / `warning` /
82
+ `destructive`, never `primary`; info renders as `accent`-blue on a translucent tint.
83
+ - **Keycap** — a signature primitive: keyboard-shortcut hints render as small keycap glyphs (surface
84
+ fill, faint gradient, tight `radius`). Carry them onto operator shortcut affordances.
85
+
86
+ ## 5 Layout
87
+
88
+ Base unit 8px with 2/4/12px tight steps; the on-scale ramp is `2 · 4 · 8 · 12 · 16 · 24 · 32 · 48 ·
89
+ 64` (the 96px marketing section rhythm stays behind). Shell dimensions map one-to-one to the layout
90
+ primitives: sidebar `sidebar-width-expanded` / `sidebar-width-collapsed`, topbar `topbar-height` (56px,
91
+ the brand's own nav height), side panel `side-panel-width` / `side-panel-width-rich`, modal cap
92
+ `modal-width-max`, forms `form-max-width`, tables full-width. Density is `dense` globally
93
+ (`density-tier`), stepped per archetype by the surface catalog — never by absolute overrides.
94
+
95
+ ## 6 Depth
96
+
97
+ Flat and shadowless — the defining trait. Hierarchy comes from the surface ladder, not shadow:
98
+
99
+ - **0 — canvas** `background` `#07080a`, no border.
100
+ - **1 — surface / card** `card` `#0d0d0d` on a 1px `border`, one notch above canvas.
101
+ - **2 — elevated** `muted` `#101111` for inputs, active chips, and nav selection.
102
+ - **3 — overlay** `popover` / side panel / modal — separated by the surface lift plus a hairline;
103
+ `shadow-intensity` is 0, because the brand has no drop shadows at all.
104
+
105
+ Focus is a `ring` outline in white (the action color), always visible; three z-levels: content, chrome, overlay.
106
+
107
+ ## 7 Do's & Don'ts
108
+
109
+ - **Do** keep the canvas near-black and build every elevation from the surface ladder.
110
+ - **Do** keep chrome monochrome — white is the one action color; reserve it for the single primary.
111
+ - **Do** enable Inter's `ss03` (with `calt`/`kern`/`liga`) globally; without it the type loses its voice.
112
+ - **Do** carry shortcut hints as keycap glyphs; `tabular-nums` on numerics, `font-mono` on IDs/codes/timestamps.
113
+ - **Don't** add a drop shadow — depth is the surface ladder, never shadow.
114
+ - **Don't** promote a second chromatic action — the four saturated hues are status/category only, never chrome.
115
+ - **Don't** fully-round the CTA — the primary is a rounded rect at `radius`, not a 9999 pill.
116
+ - **Don't** reach for the red diagonal-stripe hero gradient or hero-scale display type — they stay behind.
117
+ - **Don't** pad cards 32px+; run tight at 16–24px.
118
+
119
+ ## 8 Responsive
120
+
121
+ The operator sweep is 375 / 768 / 1024 / 1440.
122
+
123
+ | Breakpoint | What changes |
124
+ | --- | --- |
125
+ | 375 | sidebar → off-canvas drawer; two-pane list+detail stacks; side panel → full sheet; the near-black canvas holds |
126
+ | 768 | sidebar collapses to the icon rail (`sidebar-width-collapsed`); tables scroll their overflow |
127
+ | 1024 | sidebar expands; two-pane list+detail holds side by side |
128
+ | 1440 | forms cap at `form-max-width`; tables and dashboards use the full width |
129
+
130
+ ## 9 Agent Prompt Guide
131
+
132
+ - Treat the default theme as dark — the color map already resolves to near-black; synthesize no light variant.
133
+ - Build depth from the surface ladder (`background` → `card` → `muted` → overlay); never a drop shadow.
134
+ - Keep chrome monochrome: white is the action. If two elements want white, one of them is not primary.
135
+ - Enable Inter's `ss03` (with `calt`/`kern`/`liga`) globally; render shortcut hints as keycap glyphs.
136
+ - The four saturated hues are status/category only — `success`/`warning`/`destructive`/info — never chrome.
137
+ - **Carries over:** near-black canvas + surface ladder, hairline borders, the monochrome white action,
138
+ tight 6–10px radius, ss03-Inter, positive heading tracking, keycap shortcut glyphs.
139
+ - **Stays behind:** the red diagonal-stripe hero gradient, hero-scale display (56–64px), full-bleed
140
+ product-screenshot heroes, the 96px marketing section rhythm.
141
+
142
+ ```yaml design-primitives
143
+ radius: 8px # rationale: rounded.md (8px) is Raycast's standard button/input/card radius; scale still offers 6/10/16
144
+ shadow-intensity: 0 # derived: the system has no drop-shadow elevation at all — depth is the surface ladder
145
+ border-weight: 1px
146
+ density-gap: 0.85 # derived: command-palette chrome is tight; the operator adaptation runs dense
147
+ density-inset: 0.85 # derived: same dense bias on component insets
148
+ font-sans: Inter, system-ui, sans-serif # rationale: Inter is the whole system's face; enable ss03 globally (see §3)
149
+ font-mono: JetBrains Mono, ui-monospace, monospace # derived: corpus names JetBrains/Geist Mono for code chips; operator IDs and logs need a mono — JetBrains chosen
150
+ font-weight-normal: 400
151
+ font-weight-strong: 500 # derived: Raycast headings and emphasis sit at 500 — the light weight is signature (display reaches 600, but hero display stays behind)
152
+ heading-tracking: 0.01em # derived: Raycast opens type with positive tracking (+0.2px on headings) rather than tightening — rare and signature
153
+ duration-unit: 50ms # derived: corpus documents no motion; standard operator base
154
+ duration-fast: 100ms # derived: corpus silent on motion
155
+ duration-normal: 150ms # derived: corpus silent on motion
156
+ duration-slow: 250ms # derived: corpus silent on motion
157
+ ease-default: cubic-bezier(0.4,0,0.2,1) # derived: corpus silent; standard functional ease
158
+ contrast-boost: 1.05 # derived: hairlines on near-black read faint; a small boost keeps the dense table grid legible
159
+ icon-stroke: 1.75 # derived: refined operator stroke matching Raycast's fine hairline aesthetic (one step under lucide's 2)
160
+ icon-size-base: 16px # derived: standard operator icon size; corpus silent
161
+ sidebar-width-expanded: 240px # derived: operator shell dim (corpus is marketing-nav only); a tight rail for Raycast's compact character
162
+ sidebar-width-collapsed: 56px # derived: icon rail; echoes the corpus 56px nav height
163
+ topbar-height: 56px # rationale: primary-nav height in the corpus is 56px
164
+ side-panel-width: 420px # derived: standard operator side panel; corpus silent
165
+ side-panel-width-rich: 640px # derived: content-heavy side panel; corpus silent
166
+ modal-width-max: 560px # derived: modest confirmation modal; corpus silent
167
+ form-max-width: 640px # derived: standard operator form column; corpus silent
168
+ table-row-height: 36px # derived: dense, echoing the tight command-palette row (6px 10px padding)
169
+ verbosity: compact # derived: Raycast's UI is spare and keyboard-first — minimal chrome copy
170
+ feedback: subtle
171
+ density-tier: dense
172
+ product-traits: [dev-tools, command-palette, launcher, productivity]
173
+ ```
174
+
175
+ ```yaml lever-manifest
176
+ version: 1
177
+ fonts: { sans: "Inter, system-ui, sans-serif", mono: "JetBrains Mono, ui-monospace, monospace" }
178
+ color-tokens:
179
+ light: # dark-native brand: the single required map carries Raycast's near-black surfaces directly — brand tokens win over the light-default floor; there is no separate light variant
180
+ background: "#07080a"
181
+ foreground: "#f4f4f6"
182
+ card: "#0d0d0d"
183
+ card-foreground: "#f4f4f6"
184
+ muted: "#101111"
185
+ muted-foreground: "#9c9c9d"
186
+ border: "#242728"
187
+ input: "#242728"
188
+ ring: "#ffffff"
189
+ primary: "#ffffff"
190
+ primary-foreground: "#000000"
191
+ accent: "#121212"
192
+ accent-foreground: "#ffffff"
193
+ destructive: "#ff6161"
194
+ destructive-foreground: "#07080a" # derived: near-black text is legible on the bright coral; white on #ff6161 fails contrast
195
+ success: "#59d499"
196
+ warning: "#ffc533"
197
+ popover: "#0d0d0d"
198
+ popover-foreground: "#f4f4f6"
199
+ secondary: "#101111"
200
+ secondary-foreground: "#f4f4f6"
201
+ chart-1: "#57c1ff"
202
+ chart-2: "#59d499"
203
+ chart-3: "#ffc533"
204
+ chart-4: "#ff6161"
205
+ chart-5: "#b48cff" # derived: fifth categorical hue — corpus gives four accents; a cool violet completes the set on near-black
206
+ sidebar: "#07080a"
207
+ sidebar-foreground: "#cdcdcd"
208
+ sidebar-primary: "#ffffff"
209
+ sidebar-primary-foreground: "#000000"
210
+ sidebar-accent: "#101111"
211
+ sidebar-accent-foreground: "#ffffff"
212
+ sidebar-border: "#242728"
213
+ sidebar-ring: "#ffffff"
214
+ spacing-scale: [2, 4, 8, 12, 16, 24, 32, 48, 64]
215
+ radius-scale: [0, 4, 6, 8, 10, 16, 9999]
216
+ shadow-levels: [none, sm]
217
+ motion: { durations: [100, 150, 250], easings: ["cubic-bezier(0.4,0,0.2,1)"] }
218
+ icons: { family: lucide, stroke: 1.75 }
219
+ accent-count: 1
220
+ ```
@@ -0,0 +1,220 @@
1
+ ---
2
+ schema: design-md/v1
3
+ product: Replicate
4
+ provenance: library
5
+ sourced: 2026-07-04
6
+ ---
7
+
8
+ # Replicate — the warm-cream operator reading
9
+
10
+ Replicate's public surfaces read as an ML lab notebook crossed with a print zine: a warm cream canvas,
11
+ ink-dark type, dark monospace code wells, and one hot-orange accent used like a stamp. This entry is the
12
+ *operator* reading of that brand — the same warmth and single accent, carried onto a CRM, a queue, or a
13
+ dashboard. The hero-scale display grotesque, full-bleed orange bands, the gradient mesh, and contributor
14
+ mosaics stay behind as marketing furniture. What carries: the cream-not-white temperature, the ink
15
+ foreground, the scarce orange, the soft-rounded corners, and the strict font lanes. Both machine blocks
16
+ are fully valued; every judgment away from the marketing brand is annotated `# derived:` where it lands.
17
+
18
+ ## 1 Visual Theme
19
+
20
+ Light by default; dark is opt-in. Flat: hierarchy is color-blocking and hairlines, not shadow — surfaces
21
+ step warm (bone sidebar → cream canvas → white cards) and elevation is a surface swap, never a heavy drop.
22
+ A single accent, Replicate `primary` (hot orange `#ea2804`), is reserved for the one action that matters on
23
+ a surface — treated as a stamp, one orange element per view. The field is warm: the canvas is cream `#f9f7f3`,
24
+ never pure white, and ink is `#202020`, a warm near-black. Corners are soft (`radius` 10px) — the brand has
25
+ no sharp edges — but the marketing full-pill treatment stays behind except on badges. Density is `standard`:
26
+ editorial warmth wants a little air, operator restraint keeps it from sprawling.
27
+
28
+ ## 2 Color Roles
29
+
30
+ Light values first (the manifest carries the exact hex). One accent — `primary` is the only chromatic hue
31
+ that carries meaning; status and focus hues speak only their function.
32
+
33
+ | Role | Value | Allowed where |
34
+ | --- | --- | --- |
35
+ | `background` | cream `#f9f7f3` | the page canvas — the dominant warm surface, never pure white |
36
+ | `card` / `popover` | white `#ffffff` | data cards, tables, inputs, overlays — the only place white appears |
37
+ | `foreground` | warm ink `#202020` | all primary text |
38
+ | `muted` / `secondary` | bone `#f3f0e8` | hover rows, subtle fills, secondary buttons, inset groups |
39
+ | `muted-foreground` | charcoal `#575757` | labels, captions, metadata, secondary text |
40
+ | `border` / `input` | hairline `#dfddda` | every separator, grid line, and field edge |
41
+ | `primary` | orange `#ea2804` | the one primary action; active nav; inline links |
42
+ | `accent` | pale peach `#fbe9e3` | selected/hovered rows and nav, on-accent surfaces only |
43
+ | `ring` | focus blue `#3b82f6` | the keyboard focus outline — deliberately cool, so focus never reads as the orange CTA |
44
+ | `destructive` | red `#b3261e` | destructive actions and error state only |
45
+ | `success` / `warning` | green `#2b9a66` / gold `#b7791f` | status signalling only, never chrome |
46
+
47
+ The hero glow, hero pink, and orange bands are marketing graces: they carry no role here (see §7).
48
+
49
+ ## 3 Typography
50
+
51
+ Two lanes, strictly kept. `font-sans` is basier-square (Geist or Inter substitute) — UI, body, and headings
52
+ all ride it; heading weight and tight tracking, not a second family, carry emphasis. `font-mono` is JetBrains
53
+ Mono for IDs, model slugs, codes, timestamps, and log lines. The hero display grotesque `rb-freigeist-neue`
54
+ is hero-scale (72px+) and stays behind. Numeric columns render `tabular-nums` so figures align down a column.
55
+
56
+ | Step | Role | Size · line | Weight · tracking |
57
+ | --- | --- | --- | --- |
58
+ | h1 | page title | 24px / 1.3 | `font-weight-strong` · `heading-tracking` |
59
+ | h2 | section head | 20px / 1.4 | `font-weight-strong` · `heading-tracking` |
60
+ | h3 | card / group head | 16px / 1.4 | `font-weight-strong` · `heading-tracking` |
61
+ | body | UI + prose | 14px / 1.5 | `font-weight-normal` |
62
+ | small | labels, meta, dense table | 13px / 1.4 | `font-weight-normal` |
63
+ | caption | eyebrow / footnote | 12px / 1.33 | `font-weight-strong`, uppercase |
64
+
65
+ Body weight stays 400 — emphasis is weight-to-strong or a switch to `font-mono`, never a bump to 500.
66
+
67
+ ## 4 Component Stylings
68
+
69
+ Every recurring operator component composes from the primitives — no literal values.
70
+
71
+ - **Button** — `primary`: filled `primary` on `primary-foreground`, `radius`, soft-cornered, not pill.
72
+ Secondary: `secondary` fill, `border`, `foreground`. Ghost: transparent, `accent` on hover. Pressed
73
+ darkens `primary` one step.
74
+ - **Input** — `card` fill, 1px `border` (`border-weight`), `radius`; focus draws the `ring` at 2px, no glow.
75
+ - **Card** — white `card` on the cream canvas, 1px `border`, `radius`; shadow only when a true overlay lifts
76
+ (`shadow-intensity`); inset by `density-inset`.
77
+ - **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
78
+ numeric columns; row selection tints `accent`.
79
+ - **Side panel** — detail and edit open in the side panel (`side-panel-width`, `side-panel-width-rich` for
80
+ content-heavy), beside the work, not over it.
81
+ - **Badge** — pill (`radius-scale` 9999) is allowed here as a brand grace; hairline `border` or status fill,
82
+ uppercase caption; status badges take `success` / `warning` / `destructive`, never `primary`. Code and log
83
+ panels invert to an ink-dark fill with `font-mono` — the one place dark blocking appears in operator chrome.
84
+
85
+ ## 5 Layout
86
+
87
+ Base spacing unit 4px; the on-scale ramp is `2 · 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64 · 96`. Shell dimensions
88
+ map one-to-one to the layout primitives: sidebar `sidebar-width-expanded` / `sidebar-width-collapsed`, topbar
89
+ `topbar-height` (the brand's 60px nav rhythm), side panel `side-panel-width` / `side-panel-width-rich`, modal
90
+ cap `modal-width-max`, forms `form-max-width`, tables full-width. Rows ride `table-row-height` (44px — the
91
+ brand's touch-comfortable button height, an airier operator rhythm). Density is governed globally by
92
+ `density-tier` and stepped per archetype by the surface catalog.
93
+
94
+ ## 6 Depth
95
+
96
+ Flat, color-blocked. Hierarchy comes from the warm surface ladder and hairlines, not shadow:
97
+
98
+ - **0 — canvas** `background` cream, no border.
99
+ - **1 — panel / card** `card` white on a 1px `border`; a surface swap to `muted` bone marks an inset group.
100
+ - **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns a soft `md` shadow.
101
+
102
+ No level stacks a heavier shadow to signal rank; rank is surface color, border, and position. Focus is a 2px
103
+ `ring` outline (never a glow), deliberately cool blue so it never collides with the orange CTA. Three
104
+ z-levels: content, sticky chrome, overlay.
105
+
106
+ ## 7 Do's & Don'ts
107
+
108
+ - **Do** keep the cream `background` as the page canvas; white is for cards, inputs, and overlays only.
109
+ - **Do** reserve `primary` orange for the single most important action, active nav, and inline links —
110
+ three roles, treated as a stamp: at most one orange element per view.
111
+ - **Do** apply `tabular-nums` to every numeric column and `font-mono` to IDs, codes, slugs, and timestamps.
112
+ - **Don't** replace cream with pure white at the page level — the brand temperature lives in the canvas.
113
+ - **Don't** promote a second chromatic accent. The hot orange is the only accent; success green, warning
114
+ gold, and focus blue are functional, not decorative.
115
+ - **Don't** pill the primary CTA — the full-pill treatment is a marketing signature; operator CTAs keep the
116
+ soft `radius`, and pills stay on badges. Don't reach for the hero display grotesque or heavy drop shadows.
117
+
118
+ ## 8 Responsive
119
+
120
+ The operator sweep is 375 / 768 / 1024 / 1440.
121
+
122
+ | Breakpoint | What changes |
123
+ | --- | --- |
124
+ | 375 | sidebar → off-canvas drawer; two-pane list+detail stacks; side panel → full sheet; density holds |
125
+ | 768 | sidebar collapses to the icon rail (`sidebar-width-collapsed`); tables scroll their overflow |
126
+ | 1024 | sidebar expands; two-pane queue+detail holds side by side |
127
+ | 1440 | forms cap at `form-max-width`; tables and dashboards use the full width |
128
+
129
+ ## 9 Agent Prompt Guide
130
+
131
+ Directives the emitting agent follows verbatim:
132
+
133
+ - Lead every list surface with its table; lead every entity with its primary read, not its chrome.
134
+ - Set the page on the cream `background`; float white `card` surfaces on it — never pure white at page level.
135
+ Accent only the primary action with orange `primary`; if two things want the orange, one is not primary.
136
+ - Every numeric column is `tabular-nums`; every ID, slug, code, and timestamp is `font-mono`.
137
+ - Every workflow completes from the keyboard; the cool-blue `ring` focus outline is always visible. Stay
138
+ flat — warm surface swaps and hairlines before shadow; reach past a hairline only for a real overlay.
139
+ - Leave the marketing furniture behind: no hero grotesque, no full-bleed orange bands, no gradient mesh, no
140
+ contributor mosaics, no pill CTAs. Palette, temperature, soft corners, and font lanes carry; the rest does not.
141
+
142
+ ```yaml design-primitives
143
+ radius: 10px # derived: brand's soft "no sharp corners" character — the 10px card radius becomes the operator base; the full-pill 9999 marketing treatment stays behind (kept in scale for badges)
144
+ shadow-intensity: 0.3 # derived: elevation is color-blocking, not shadow; a soft drop only lifts a floating thumbnail — keep shadow faint
145
+ border-weight: 1px
146
+ density-gap: 1
147
+ density-inset: 1
148
+ font-sans: basier-square, Geist, Inter, system-ui, sans-serif # rationale: brand UI/body family with the corpus-named substitutes; the hero display grotesque rb-freigeist-neue is hero-scale and stays behind
149
+ font-mono: JetBrains Mono, ui-monospace, SFMono-Regular, monospace # brand code family
150
+ font-weight-normal: 400
151
+ font-weight-strong: 600
152
+ heading-tracking: -0.015em # derived: brand tightens type with negative tracking scaling with size; basier-square headings track -0.35px at 24px ≈ -0.015em
153
+ duration-unit: 50ms # derived: corpus documents no motion; operator functional base
154
+ duration-fast: 100ms # derived: functional operator motion
155
+ duration-normal: 150ms # derived
156
+ duration-slow: 250ms # derived
157
+ ease-default: cubic-bezier(0.4,0,0.2,1) # derived: standard functional easing
158
+ contrast-boost: 1 # derived: ink #202020 on cream is high-contrast; the solid hairline already carries the grid
159
+ icon-stroke: 1.75 # derived: corpus uses illustration, not an icon set; 1.75 suits the friendly-precision character
160
+ icon-size-base: 16px # derived
161
+ sidebar-width-expanded: 248px # derived: operator shell (corpus documents the marketing nav only)
162
+ sidebar-width-collapsed: 56px # derived
163
+ topbar-height: 60px # brand nav-bar height, carried
164
+ side-panel-width: 420px # derived
165
+ side-panel-width-rich: 640px # derived
166
+ modal-width-max: 560px # derived
167
+ form-max-width: 640px # derived
168
+ table-row-height: 44px # brand's 44px button/touch rhythm carried to rows for an airier operator read
169
+ verbosity: default
170
+ feedback: subtle
171
+ density-tier: standard # derived: editorial warmth wants air, operator restraint keeps it from spacious
172
+ product-traits: [dev-tools, ml-platform, dashboard, api-console]
173
+ ```
174
+
175
+ ```yaml lever-manifest
176
+ version: 1
177
+ fonts: { sans: "basier-square, Geist, Inter, system-ui, sans-serif", mono: "JetBrains Mono, ui-monospace, SFMono-Regular, monospace" }
178
+ color-tokens:
179
+ light:
180
+ background: "#f9f7f3"
181
+ foreground: "#202020"
182
+ card: "#ffffff"
183
+ card-foreground: "#202020"
184
+ muted: "#f3f0e8"
185
+ muted-foreground: "#575757"
186
+ border: "#dfddda" # derived: solid equivalent of brand hairline rgba(32,32,32,0.12) blended over the cream canvas
187
+ input: "#dfddda" # derived: same hairline, field edges
188
+ ring: "#3b82f6" # brand focus-blue rgba(59,130,246,0.5) flattened to its base hue — functional, not the accent
189
+ primary: "#ea2804"
190
+ primary-foreground: "#ffffff"
191
+ accent: "#fbe9e3" # derived: pale wash of the orange primary for selected/hover rows and nav
192
+ accent-foreground: "#c01f00" # brand pressed-orange, legible on the pale peach
193
+ destructive: "#b3261e" # derived: a deeper crimson-leaning red, kept distinct from the red-orange primary so delete never reads as the CTA
194
+ destructive-foreground: "#ffffff"
195
+ success: "#2b9a66"
196
+ warning: "#b7791f" # derived: a muted gold amber, pulled yellower than the primary so warning reads apart from the orange accent
197
+ popover: "#ffffff"
198
+ popover-foreground: "#202020"
199
+ secondary: "#f3f0e8"
200
+ secondary-foreground: "#202020"
201
+ chart-1: "#ea2804"
202
+ chart-2: "#2b9a66"
203
+ chart-3: "#b7791f" # derived: gold, third categorical hue in the warm ramp
204
+ chart-4: "#3b82f6" # derived: focus-blue reused as a cool categorical for contrast
205
+ chart-5: "#575757" # derived: charcoal neutral series
206
+ sidebar: "#f3f0e8" # brand bone — the deeper cream, distinguishing the rail from the canvas
207
+ sidebar-foreground: "#202020"
208
+ sidebar-primary: "#ea2804"
209
+ sidebar-primary-foreground: "#ffffff"
210
+ sidebar-accent: "#fbe9e3"
211
+ sidebar-accent-foreground: "#c01f00"
212
+ sidebar-border: "#dfddda"
213
+ sidebar-ring: "#3b82f6"
214
+ spacing-scale: [2, 4, 8, 12, 16, 24, 32, 48, 64, 96]
215
+ radius-scale: [0, 4, 6, 10, 16, 9999]
216
+ shadow-levels: [none, sm, md]
217
+ motion: { durations: [100, 150, 250], easings: ["cubic-bezier(0.4,0,0.2,1)"] }
218
+ icons: { family: lucide, stroke: 1.75 }
219
+ accent-count: 1
220
+ ```