@nurix/etna 0.19.49 → 0.19.51

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

@@ -1,218 +0,0 @@
----
-schema: design-md/v2
-id: posthog
-tier: brand
-segments: [analytics, dev-tools, product]
-keywords: [warm, cream, yellow, olive, friendly, flat]
-sourced: 2026-07-12
-sources: "design-md/v1 posthog entry (2026-07-04) + token twin; 2026-07-12 re-audit of posthog.com; IBM Plex Sans and Source Code Pro are the brand's own open faces"
-license: open
----
-
-# posthog — an engineering sketchbook with one yellow highlighter
-
-## 1 Visual Theme
-An engineer's sketchbook open on a warm cream desk pad: pencil grid lines, an
-olive-ink fountain pen, white index cards taped flat to the page, and one yellow
-highlighter that marks exactly one thing per spread. Light default — the warm cream
-`background` is the signature, never plain white, with true-white-reading cards
-floating on it. Flat: hierarchy is hairline olive `border`, weight, and color,
-never shadow. One loud accent — PostHog yellow `primary` — carries the one action
-that matters, always wearing dark olive ink, never white. The whole neutral ramp is
-warm olive-gray: a friendly engineering blog, not cold gray tooling. Dark is an
-authored olive-charcoal ladder grown from the brand's dark code island.
-
-## 2 Color Roles
-Deep olive-charcoal `foreground` on the cream `background`; `card` is the white
-step that floats on it. `primary` yellow is the only saturated hue that carries a
-call to action — dark ink on the fill, one element per surface. `accent` is the
-pale-yellow selection wash. The focus `ring` is the quiet functional blue — the
-brand focuses in blue, not yellow — and blue otherwise stays a link-and-focus
-signal, never chrome. Status hues speak only status: `destructive` red, `success`
-green, `warning` a gold-amber deliberately deeper than the CTA yellow so caution
-never impersonates the accent. The pastel callout family and the hedgehogs are
-marketing decoration with no role here.
-
-## 3 Typography
-IBM Plex Sans (UI, body, headings) / Source Code Pro (data) — the brand's own open
-pair. The signature is hierarchy built from weight (400/600), never a second
-family and never size jumps; the 36px/800 hero tier stays behind. Register scope:
-the display step touches page titles and empty states only; mono owns IDs, codes,
-timestamps, and log lines, with `tabular-nums` on every numeric column. The caption
-step is the uppercase eyebrow with +0.02em tracking.
-
-## 4 Component Stylings
-Buttons `radius-md`, `primary` yellow fill with dark ink, no pill — the pill is the
-marketing nav CTA only. Secondary: greige `secondary` fill, hairline `border`.
-Inputs `card` fill, hairline `border`; focus draws the blue `ring` at 2px, no glow.
-Cards white `card` on hairline, flat — flat cards on cream is the brand. Table rows
-`muted` hover, `accent` selection, mono IDs. Detail opens in the side panel. Badges
-hairline border, uppercase caption, status fills never `primary`. Code and log
-surfaces invert to the dark olive-charcoal fill with mono text — the one dark
-moment on the light UI.
-
-## 5 Layout
-4px base with the brand's rhythm centered on the 8px step (the 80px marketing
-rhythm stays behind); sidebar 248/56px; topbar 56px; side panel 420/640px; content
-max 1320px. Density is standard — dense-capable, warm, never cramped; the cream
-sidebar sits a shade deeper than the canvas.
-
-## 6 Depth
-Flat — the brand and operator restraint agree completely. Light: cream canvas,
-white cards on hairlines, no shadow; only true overlays earn a soft olive-tinted
-lift, and the dark code surface "elevates" with color, not shadow. Dark: the
-authored ladder does depth — `background` 0.19 L, `surface-raised` +0.04,
-`surface-overlay` +0.09, hue held at 119. Focus is the 2px blue `ring`; three
-z-levels.
-
-## 7 Motion
-Friendly but working: motion warms transitions without ever delaying data. Named
-moments: `highlight-press` (primary-action press, 120ms), `card-fade` (page
-content arrival, 160ms), `panel-slide` (side panel, 220ms, interruptible).
-Physicality is granted to auth and the first-run empty state — the one place the
-brand's playfulness may surface. Tables, charts, and keyboard actions never
-animate.
-
-## 8 Iconography & Charts
-Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default; no mascots, no
-hand-drawn ornament. Charts: hairline axes on the cream, no gridline fills;
-categorical ramp leads blue then yellow, green, red, purple (`chart-1..5`) — the
-insight palette, kept off chrome; tooltips on `surface-overlay` with mono numerals;
-`warning` gold stays deeper than the CTA yellow even in charts.
-
-## 9 Voice
-A helpful engineer who writes docs for fun: plain verbs, concrete numbers, dry
-warmth without exclamation. "Create insight" · "No events yet — install the
-snippet and refresh" · "Query timed out at 30s; narrow the date range or sample
-the events."
-
-## 10 Do's & Don'ts
-Do keep the cream canvas — never flatten it to plain white; the warmth is the
-identity once the mascots are gone. Do reserve yellow for the single most
-important action, always with dark ink. Do render code and log surfaces on the
-dark olive fill. Don't pill operator buttons. Don't promote blue past links and
-focus. Don't bring the 800-weight hero tier or pastel callout bands into chrome.
-Don't shadow cards.
-
-## 11 Responsive
-375: sidebar → off-canvas drawer; two-pane stacks; side panel → full sheet;
-density holds. 768: sidebar collapses to the icon rail; tables scroll their
-overflow. 1024: two-pane queue+detail holds. 1440: forms cap; tables and
-dashboards use the full width under the 1320px cap.
-
-## 12 Agent Prompt Guide
-The cream is the app canvas; white cards float on it. Spend the yellow once per
-surface, always with dark ink — if two things want it, one is not primary. Build
-hierarchy from weight 400/600 on Plex Sans; every numeric column is tabular mono.
-Blue is links and focus only; one loud color. Stay flat — the dark code surface is
-the only "elevated" thing and it lifts with color. Dark is authored — consult the
-block, never derive.
-
-```yaml design-values
-color:
-  light:
-    background: oklch(0.95 0.008 114)
-    foreground: oklch(0.26 0.015 119)
-    card: oklch(0.99 0.005 114)
-    card-foreground: oklch(0.26 0.015 119)
-    popover: oklch(0.995 0.005 114)
-    popover-foreground: oklch(0.26 0.015 119)
-    primary: oklch(0.783 0.166 73.5)
-    primary-foreground: oklch(0.26 0.015 119)
-    secondary: oklch(0.924 0.010 119)
-    secondary-foreground: oklch(0.30 0.015 119)
-    muted: oklch(0.924 0.010 119)
-    muted-foreground: oklch(0.45 0.015 115)
-    accent: oklch(0.944 0.040 90)
-    accent-foreground: oklch(0.28 0.015 119)
-    destructive: oklch(0.55 0.180 28)
-    destructive-foreground: oklch(0.98 0.010 28)
-    success: oklch(0.574 0.107 163)
-    warning: oklch(0.617 0.124 74)
-    border: oklch(0.806 0.014 116)
-    input: oklch(0.806 0.014 116)
-    ring: oklch(0.609 0.162 253)
-    surface-raised: oklch(0.99 0.005 114)
-    surface-overlay: oklch(0.995 0.005 114)
-    chart-1: oklch(0.609 0.162 253)
-    chart-2: oklch(0.783 0.166 73.5)
-    chart-3: oklch(0.574 0.107 163)
-    chart-4: oklch(0.55 0.180 28)
-    chart-5: oklch(0.55 0.180 300)
-    sidebar: oklch(0.93 0.010 114)
-    sidebar-foreground: oklch(0.28 0.015 119)
-    sidebar-primary: oklch(0.783 0.166 73.5)
-    sidebar-primary-foreground: oklch(0.26 0.015 119)
-    sidebar-accent: oklch(0.885 0.012 114)
-    sidebar-accent-foreground: oklch(0.26 0.015 119)
-    sidebar-border: oklch(0.83 0.012 114)
-    sidebar-ring: oklch(0.609 0.162 253)
-  dark:
-    background: oklch(0.19 0.010 119)
-    foreground: oklch(0.93 0.010 105)
-    card: oklch(0.23 0.012 119)
-    card-foreground: oklch(0.93 0.010 105)
-    popover: oklch(0.28 0.012 119)
-    popover-foreground: oklch(0.93 0.010 105)
-    primary: oklch(0.783 0.166 73.5)
-    primary-foreground: oklch(0.22 0.020 119)
-    secondary: oklch(0.26 0.012 119)
-    secondary-foreground: oklch(0.90 0.010 105)
-    muted: oklch(0.25 0.012 119)
-    muted-foreground: oklch(0.72 0.012 115)
-    accent: oklch(0.32 0.045 95)
-    accent-foreground: oklch(0.95 0.020 95)
-    destructive: oklch(0.64 0.170 28)
-    destructive-foreground: oklch(0.13 0.020 28)
-    success: oklch(0.68 0.120 163)
-    warning: oklch(0.72 0.130 74)
-    border: oklch(0.30 0.012 119)
-    input: oklch(0.30 0.012 119)
-    ring: oklch(0.68 0.150 253)
-    surface-raised: oklch(0.23 0.012 119)
-    surface-overlay: oklch(0.28 0.012 119)
-    chart-1: oklch(0.68 0.150 253)
-    chart-2: oklch(0.80 0.160 78)
-    chart-3: oklch(0.68 0.120 163)
-    chart-4: oklch(0.64 0.170 28)
-    chart-5: oklch(0.65 0.170 300)
-    sidebar: oklch(0.17 0.010 119)
-    sidebar-foreground: oklch(0.90 0.010 105)
-    sidebar-primary: oklch(0.783 0.166 73.5)
-    sidebar-primary-foreground: oklch(0.22 0.020 119)
-    sidebar-accent: oklch(0.24 0.012 119)
-    sidebar-accent-foreground: oklch(0.93 0.010 105)
-    sidebar-border: oklch(0.27 0.012 119)
-    sidebar-ring: oklch(0.68 0.150 253)
-typography:
-  display: { family: "IBM Plex Sans Variable", fallback: "system-ui, sans-serif", weights: [600] }
-  sans: { family: "IBM Plex Sans Variable", fallback: "system-ui, sans-serif", weights: [400, 600] }
-  mono: { family: "Source Code Pro Variable", fallback: "ui-monospace, monospace", weights: [400] }
-  ramp:
-    display: { size: 28px, line: 36px, weight: 600, family: display, tracking: -0.01em }
-    h1: { size: 24px, line: 31px, weight: 600, family: sans }
-    h2: { size: 20px, line: 28px, weight: 600, family: sans }
-    body: { size: 14px, line: 20px, weight: 400, family: sans }
-    small: { size: 13px, line: 18px, weight: 400, family: sans }
-    caption: { size: 12px, line: 16px, weight: 600, family: sans, tracking: 0.02em, transform: uppercase }
-    data: { size: 13px, line: 20px, weight: 400, family: mono, features: [tnum] }
-  register-scope: { display: [page-title, empty-state], sans: [chrome, controls, body, headings], mono: [data, ids, timestamps, code, logs] }
-elevation:
-  radius: { sm: 4px, md: 6px, lg: 8px }
-  hairline: border
-  shadow:
-    overlay: "0 8px 24px oklch(0.26 0.020 119 / 0.12)"
-    popover: "0 4px 12px oklch(0.26 0.020 119 / 0.09)"
-  dark-ladder: { background: 0.19, raised: 0.23, overlay: 0.28, hue-held: 119 }
-motion:
-  duration: { press: 120ms, fade: 160ms, panel: 220ms }
-  easing: { standard: "cubic-bezier(0.2, 0, 0, 1)", exit: "cubic-bezier(0.4, 0, 1, 1)" }
-  entrance-never: ease-in
-  identity-moments: [auth, first-run-empty]
-iconography: { set: lucide, stroke: 1.5px, grid: [16px, 20px] }
-charts:
-  categorical: [chart-1, chart-2, chart-3, chart-4, chart-5]
-  sequential: { from: background, to: chart-1 }
-  diverging: { negative: destructive, mid: muted, positive: success }
-layout: { base: 4px, sidebar: [248px, 56px], topbar: 56px, side-panel: [420px, 640px], content-max: 1320px }
-```

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

@@ -1,214 +0,0 @@
----
-schema: design-md/v2
-id: raycast
-tier: brand
-segments: [dev-tools, productivity]
-keywords: [dark, monochrome, command-palette, dense, keyboard, shadowless]
-sourced: 2026-07-12
-sources: "design-md/v1 raycast entry (2026-07-04) + token twin; 2026-07-12 re-audit of raycast.com; Inter with ss03 is the brand's own face — the light theme is an authored daytime floor (the source ships none)"
-license: open
----
-
-# raycast — a backlit keyboard in a dark studio
-
-## 1 Visual Theme
-A darkened studio at 2 a.m.: black glass desk, a single backlit keyboard, and one
-key glowing white — press it and the palette opens. Dark by default and dark by
-conviction; the light theme is an authored daytime floor, not the brand. Flat and
-shadowless: hierarchy is a four-step surface ladder (`background` → `card` →
-`muted` → overlay), never a drop shadow — the brand has none at all. Chrome is
-monochrome: white is the single action color; every primary is a white rounded
-rect on near-black. The four saturated hues speak status and category only, never
-chrome. Dense — command-palette chrome runs tight, and operator surfaces inherit
-it.
-
-## 2 Color Roles
-Off-white `foreground` on the near-black `background`; `card` one notch up,
-`muted`/`secondary` the elevated notch for inputs and active chips, `accent` the
-surface lift for selection — a lift, not a hue. `primary` is white — the one
-action, the brightest pixel, black text on it — and the `ring` is the same white,
-unmistakable and keyboard-first. The four saturated hues hold strict lanes:
-`destructive` red, `success` green, `warning` yellow, and blue leading the chart
-ramp; none of them ever becomes a button. Neutrals hold a whisper of cool tint at
-the perceptual floor. In the daytime floor the action inverts to near-black on
-porcelain — the same highest-contrast invariant.
-
-## 3 Typography
-Inter with `ss03` (plus `calt`/`kern`/`liga`) enabled globally — the alternate `g`
-is the brand's signature; without it the type reads as plain Inter and loses the
-voice. JetBrains Mono for IDs, codes, timestamps, and logs. Letter spacing is
-*positive* — Raycast opens type rather than tightening it; headings track +0.01em,
-the rare operator system that does. Register scope: display touches page titles
-and empty states; mono owns data with `tabular-nums`. Emphasis bumps weight one
-step, never size; hero display stays behind.
-
-## 4 Component Stylings
-Buttons `radius-md`, white `primary` fill with black text, a rounded rect — never
-a 9999 pill. Secondary: transparent with `foreground`; tertiary: elevated
-`secondary` fill. Inputs elevated `secondary` fill on hairline `border`; focus
-*brightens the border* to the white `ring`, never a glow. Cards `card` on
-hairline; the ladder carries lift. Table rows `muted` hover, `accent` selection
-lift. Keycap — the signature primitive: keyboard-shortcut hints render as small
-keycap glyphs (surface fill, tight radius); carry them onto every shortcut
-affordance. Badges status fills only; info renders blue on a translucent tint.
-
-## 5 Layout
-8px base with 2/4/12px tight steps (the 96px marketing rhythm stays behind);
-sidebar 248/56px; topbar 56px (the brand's own nav height); side panel 420/640px;
-content max 1280px. Density is dense globally; cards pad 16–24px, never 32+.
-
-## 6 Depth
-Shadowless — the defining trait. Depth is the authored ladder in both themes: dark
-`background` 0.14 L, `card`/`surface-raised` +0.04, `muted` elevated +0.07,
-`surface-overlay` +0.09, hue held at 260; overlays separate by the lift plus a
-hairline, and the "shadow" tokens are hairline rings, not blurs. Focus is the
-white `ring` outline, always visible. Three z-levels: content, chrome, overlay.
-
-## 7 Motion
-The fastest package in the library — a launcher must feel pre-rendered. Named
-moments: `palette-pop` (overlay arrival, 120ms, scale 0.98→1), `key-press`
-(action press, 80ms), `panel-slide` (side panel, 180ms, interruptible).
-Physicality is granted to auth only. Every keyboard-initiated action lands the
-next frame; lists never stagger; hover is instant.
-
-## 8 Iconography & Charts
-Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default; keycap glyphs
-accompany shortcuts everywhere. Charts: hairline axes, no gridline fills;
-categorical ramp runs the four category hues then a neutral (`chart-1..5` — blue,
-green, yellow, red, gray); tooltips on `surface-overlay` with mono numerals; no
-hue ever leaves the chart for chrome.
-
-## 9 Voice
-Launcher-brief: verbs first, objects second, everything skimmable at palette
-speed. "Run command" · "No results — press ⌘K to search all extensions" ·
-"Extension failed to load: manifest version 2 required."
-
-## 10 Do's & Don'ts
-Do keep the canvas near-black and build every elevation from the ladder. Do keep
-chrome monochrome — white is the one action; if two things want white, one is not
-primary. Do enable ss03 globally. Do render shortcut hints as keycaps. Don't add
-a drop shadow — ever. Don't promote a category hue to a button. Don't full-round
-the CTA. Don't pad cards past 24px. Don't reach for the marketing gradient or
-hero display.
-
-## 11 Responsive
-375: sidebar → off-canvas drawer; two-pane stacks; side panel → full sheet; the
-near-black canvas holds. 768: sidebar collapses to the icon rail; tables scroll
-their overflow. 1024: two-pane list+detail holds. 1440: forms cap; tables and
-dashboards use the full width under the 1280px cap.
-
-## 12 Agent Prompt Guide
-Default the shell to dark — the brand is categorically dark; the light block is
-the daytime floor, authored, not derived. Depth is the surface ladder; never
-shadow. White is the action — spend it once. Enable Inter ss03 with calt/kern/
-liga; track headings positive. Keycaps on every shortcut affordance; tabular mono
-on every numeric column. The four saturated hues are status and charts only.
-
-```yaml design-values
-color:
-  light:
-    background: oklch(0.975 0.005 260)
-    foreground: oklch(0.16 0.008 260)
-    card: oklch(0.99 0.005 260)
-    card-foreground: oklch(0.16 0.008 260)
-    popover: oklch(0.995 0.005 260)
-    popover-foreground: oklch(0.16 0.008 260)
-    primary: oklch(0.16 0.008 260)
-    primary-foreground: oklch(0.975 0.005 260)
-    secondary: oklch(0.945 0.006 260)
-    secondary-foreground: oklch(0.22 0.008 260)
-    muted: oklch(0.945 0.006 260)
-    muted-foreground: oklch(0.45 0.008 260)
-    accent: oklch(0.925 0.007 260)
-    accent-foreground: oklch(0.16 0.008 260)
-    destructive: oklch(0.55 0.200 23.5)
-    destructive-foreground: oklch(0.98 0.010 23.5)
-    success: oklch(0.55 0.130 160)
-    warning: oklch(0.62 0.140 85)
-    border: oklch(0.895 0.006 260)
-    input: oklch(0.895 0.006 260)
-    ring: oklch(0.16 0.008 260)
-    surface-raised: oklch(0.99 0.005 260)
-    surface-overlay: oklch(0.995 0.005 260)
-    chart-1: oklch(0.55 0.140 238)
-    chart-2: oklch(0.55 0.130 160)
-    chart-3: oklch(0.62 0.140 85)
-    chart-4: oklch(0.55 0.200 23.5)
-    chart-5: oklch(0.50 0.008 260)
-    sidebar: oklch(0.955 0.006 260)
-    sidebar-foreground: oklch(0.22 0.008 260)
-    sidebar-primary: oklch(0.16 0.008 260)
-    sidebar-primary-foreground: oklch(0.975 0.005 260)
-    sidebar-accent: oklch(0.91 0.007 260)
-    sidebar-accent-foreground: oklch(0.16 0.008 260)
-    sidebar-border: oklch(0.88 0.006 260)
-    sidebar-ring: oklch(0.16 0.008 260)
-  dark:
-    background: oklch(0.14 0.006 260)
-    foreground: oklch(0.96 0.005 260)
-    card: oklch(0.18 0.006 260)
-    card-foreground: oklch(0.96 0.005 260)
-    popover: oklch(0.23 0.007 260)
-    popover-foreground: oklch(0.96 0.005 260)
-    primary: oklch(0.985 0.005 260)
-    primary-foreground: oklch(0.13 0.006 260)
-    secondary: oklch(0.21 0.007 260)
-    secondary-foreground: oklch(0.90 0.005 260)
-    muted: oklch(0.21 0.007 260)
-    muted-foreground: oklch(0.72 0.005 260)
-    accent: oklch(0.23 0.007 260)
-    accent-foreground: oklch(0.96 0.005 260)
-    destructive: oklch(0.698 0.193 23.5)
-    destructive-foreground: oklch(0.13 0.030 23.5)
-    success: oklch(0.785 0.140 160)
-    warning: oklch(0.853 0.162 85)
-    border: oklch(0.27 0.007 260)
-    input: oklch(0.27 0.007 260)
-    ring: oklch(0.985 0.005 260)
-    surface-raised: oklch(0.18 0.006 260)
-    surface-overlay: oklch(0.23 0.007 260)
-    chart-1: oklch(0.774 0.132 238)
-    chart-2: oklch(0.785 0.140 160)
-    chart-3: oklch(0.853 0.162 85)
-    chart-4: oklch(0.698 0.193 23.5)
-    chart-5: oklch(0.70 0.005 260)
-    sidebar: oklch(0.12 0.006 260)
-    sidebar-foreground: oklch(0.90 0.005 260)
-    sidebar-primary: oklch(0.985 0.005 260)
-    sidebar-primary-foreground: oklch(0.13 0.006 260)
-    sidebar-accent: oklch(0.19 0.007 260)
-    sidebar-accent-foreground: oklch(0.95 0.005 260)
-    sidebar-border: oklch(0.24 0.007 260)
-    sidebar-ring: oklch(0.985 0.005 260)
-typography:
-  display: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [600], features: [ss03, calt, liga] }
-  sans: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [400, 600], features: [ss03, calt, liga] }
-  mono: { family: "JetBrains Mono Variable", fallback: "ui-monospace, monospace", weights: [400] }
-  ramp:
-    display: { size: 28px, line: 34px, weight: 600, family: display, tracking: 0.01em }
-    h1: { size: 24px, line: 31px, weight: 600, family: sans, tracking: 0.01em }
-    h2: { size: 20px, line: 28px, weight: 600, family: sans, tracking: 0.01em }
-    body: { size: 14px, line: 21px, weight: 400, family: sans }
-    small: { size: 13px, line: 18px, weight: 400, family: sans }
-    caption: { size: 12px, line: 18px, weight: 600, family: sans, tracking: 0.03em, transform: uppercase }
-    data: { size: 13px, line: 20px, weight: 400, family: mono, features: [tnum] }
-  register-scope: { display: [page-title, empty-state], sans: [chrome, controls, body, headings], mono: [data, ids, timestamps, logs] }
-elevation:
-  radius: { sm: 6px, md: 8px, lg: 10px }
-  hairline: border
-  shadow:
-    overlay: "0 0 0 1px oklch(0.27 0.007 260 / 0.90)"
-    popover: "0 0 0 1px oklch(0.27 0.007 260 / 0.70)"
-  dark-ladder: { background: 0.14, raised: 0.18, overlay: 0.23, hue-held: 260 }
-motion:
-  duration: { press: 80ms, fade: 120ms, panel: 180ms }
-  easing: { standard: "cubic-bezier(0.2, 0, 0, 1)", exit: "cubic-bezier(0.4, 0, 1, 1)" }
-  entrance-never: ease-in
-  identity-moments: [auth]
-iconography: { set: lucide, stroke: 1.5px, grid: [16px, 20px] }
-charts:
-  categorical: [chart-1, chart-2, chart-3, chart-4, chart-5]
-  sequential: { from: background, to: chart-1 }
-  diverging: { negative: destructive, mid: muted, positive: success }
-layout: { base: 8px, sidebar: [248px, 56px], topbar: 56px, side-panel: [420px, 640px], content-max: 1280px }
-```

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

@@ -1,202 +0,0 @@
----
-schema: design-md/v2
-id: replicate
-tier: brand
-segments: [ai, dev-tools, ml-platform]
-keywords: [warm, cream, orange, stamp, cool-focus, zine]
-sourced: 2026-07-12
-sources: "design-md/v1 replicate entry (2026-07-04); 2026-07-12 re-audit of Replicate public brand; Geist substitutes the square sans, JetBrains Mono for code; the hot orange primary is deepened one step so its white label clears body contrast at operator scale; the focus ring is a deliberate cool blue, distinct from the orange CTA"
-license: open
----
-
-# replicate — an ML lab notebook on cream, one orange stamp, cool-blue focus
-
-## 1 Visual Theme
-An ML lab notebook crossed with a print zine: a warm cream working canvas — never pure
-white — warm ink, white data cards floating on it, and one hot orange used like a
-stamp, at most one orange element per view. Light by default; elevation is a surface
-swap (bone → cream → white), never a heavy drop. The focus outline is a deliberate cool
-blue so keyboard focus never reads as the orange CTA. The dark theme is the same warmth
-after dark, a cream-toned ladder. The hero grotesque and full-bleed orange bands stay
-behind.
-
-## 2 Color Roles
-Warm ink `foreground` on a cream `background`; white appears only in `card`, `popover`,
-and overlays. `primary` orange is the one chromatic accent — the primary action, active
-nav, and inline links, treated as a stamp. The focus `ring` is a cool blue, held
-distinct from the orange on purpose. `accent` is a pale-peach selection lift; the hero
-glow and orange bands survive nowhere here; status hues speak only status.
-
-## 3 Typography
-Geist (the open substitute for the square marketing sans) over JetBrains Mono for
-IDs, model slugs, codes, and log lines. UI, body, and heads all ride the sans; weight
-and tight tracking, not a second family, carry emphasis — body holds at 400, emphasis
-is weight-to-600 or a switch to mono. Register scope: the display register speaks in
-page titles, section heads, empty states, and auth; mono owns data, slugs, codes, IDs,
-and timestamps. Numerals are always `tabular-nums`.
-
-## 4 Component Stylings
-Buttons `radius-md` (10px, soft-cornered, never pill), orange `primary` fill with a
-white label; secondary is bone `secondary` on a hairline. Inputs sit on white `card`
-with a hairline; focus draws the cool-blue `ring` at 2px, no glow. Cards are white
-`card` on the cream canvas at `radius-lg`, hairline-edged, shadowed only under a true
-overlay. Table rows carry `border` grid lines, `muted` hover, peach `accent` selection.
-Detail opens in the side panel; badges alone pill. Code and log wells invert to an
-ink-dark fill in mono — the one place dark blocking appears in chrome.
-
-## 5 Layout
-4px base; sidebar 256/56px; topbar 60px (the brand's nav rhythm); side panel 440/640px;
-content max 1320px. Rows ride a touch-comfortable 44px — editorial warmth wants a little
-air, operator restraint keeps it from sprawling.
-
-## 6 Depth
-Light: the warm surface ladder (bone → cream → white) and hairlines carry all rank; a
-soft warm-tinted lift appears only under a true overlay. Dark: the surface ladder does
-depth — `background` 0.19 L, `surface-raised` +0.05, `surface-overlay` +0.10, hue held
-at 80. Focus is always the 2px cool-blue `ring`, kept apart from the orange, keyboard-
-first.
-
-## 7 Motion
-Reserved and brief. Named moments: `panel-slide` (side panel, 240ms, interruptible),
-`fade-arrive` (page content, 160ms), `stamp-press` (primary-action press, 120ms).
-Physicality is granted only to auth and first-run empty states; nothing animates in
-tables, log streams, or keyboard-initiated actions.
-
-## 8 Iconography & Charts
-Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default. Charts: hairline axes,
-no gridline fills; the categorical ramp runs orange, teal, blue, gold, green
-(`chart-1..5`); tooltips on `surface-overlay` with mono numerals.
-
-## 9 Voice
-Plain and technical, a lab-notebook register: short declaratives, numbers flat, no
-cheer. "New prediction" · "No runs yet — push a model or pick one from the catalog" ·
-"This model cold-started; the first prediction may take 30 seconds."
-
-## 10 Do's & Don'ts
-Do keep the cream `background` as the page canvas — white is for cards, inputs, and
-overlays only. Do reserve orange for the primary action, active nav, and inline links,
-one stamp per view. Do keep the focus ring cool blue, apart from the orange. Don't
-replace cream with pure white at the page level. Don't pill the CTA — pills stay on
-badges. Don't promote a second chromatic accent or reach for the hero grotesque.
-
-## 11 Responsive
-375: sidebar → off-canvas drawer; side panel → full sheet; tables → card rows with
-mono figures. 768: sidebar collapses to the icon rail; tables scroll their overflow.
-1024: two-pane queue+detail holds. 1440: forms cap; tables and dashboards use the full
-width. Code and log wells scroll horizontally, never wrap.
-
-## 12 Agent Prompt Guide
-Set every page on the cream `background`; float white `card` surfaces on it — never
-pure white at page level. Spend orange once per surface across its three roles; if two
-things want it, one is not primary. Keep focus a cool blue, apart from the CTA. Every
-numeric column is `tabular-nums`; every ID, slug, code, and timestamp is mono. Dark is
-authored — consult the block, never derive.
-
-```yaml design-values
-color:
-  light:
-    background: oklch(0.977 0.006 85)
-    foreground: oklch(0.25 0.008 80)
-    card: oklch(0.998 0.002 85)
-    card-foreground: oklch(0.25 0.008 80)
-    popover: oklch(0.998 0.002 85)
-    popover-foreground: oklch(0.25 0.008 80)
-    primary: oklch(0.56 0.225 32)
-    primary-foreground: oklch(0.99 0.006 40)
-    secondary: oklch(0.955 0.011 88)
-    secondary-foreground: oklch(0.3 0.008 80)
-    muted: oklch(0.955 0.011 88)
-    muted-foreground: oklch(0.46 0.008 80)
-    accent: oklch(0.947 0.021 39)
-    accent-foreground: oklch(0.25 0.008 80)
-    destructive: oklch(0.501 0.178 29)
-    destructive-foreground: oklch(0.98 0.01 29)
-    success: oklch(0.611 0.127 158)
-    warning: oklch(0.626 0.125 70)
-    border: oklch(0.898 0.005 78)
-    input: oklch(0.898 0.005 78)
-    ring: oklch(0.623 0.188 260)
-    surface-raised: oklch(0.99 0.003 85)
-    surface-overlay: oklch(0.998 0.002 85)
-    chart-1: oklch(0.6 0.2 32)
-    chart-2: oklch(0.62 0.11 190)
-    chart-3: oklch(0.6 0.14 250)
-    chart-4: oklch(0.7 0.13 75)
-    chart-5: oklch(0.6 0.12 155)
-    sidebar: oklch(0.955 0.012 88)
-    sidebar-foreground: oklch(0.3 0.008 80)
-    sidebar-primary: oklch(0.56 0.225 32)
-    sidebar-primary-foreground: oklch(0.99 0.006 40)
-    sidebar-accent: oklch(0.92 0.025 39)
-    sidebar-accent-foreground: oklch(0.3 0.008 80)
-    sidebar-border: oklch(0.9 0.008 85)
-    sidebar-ring: oklch(0.623 0.188 260)
-  dark:
-    background: oklch(0.19 0.006 80)
-    foreground: oklch(0.93 0.006 85)
-    card: oklch(0.23 0.007 80)
-    card-foreground: oklch(0.93 0.006 85)
-    popover: oklch(0.27 0.008 80)
-    popover-foreground: oklch(0.93 0.006 85)
-    primary: oklch(0.56 0.225 33)
-    primary-foreground: oklch(0.99 0.006 40)
-    secondary: oklch(0.25 0.008 80)
-    secondary-foreground: oklch(0.9 0.006 85)
-    muted: oklch(0.24 0.008 80)
-    muted-foreground: oklch(0.71 0.01 82)
-    accent: oklch(0.3 0.03 40)
-    accent-foreground: oklch(0.93 0.01 60)
-    destructive: oklch(0.62 0.18 29)
-    destructive-foreground: oklch(0.15 0.02 29)
-    success: oklch(0.68 0.13 158)
-    warning: oklch(0.72 0.13 75)
-    border: oklch(0.28 0.008 80)
-    input: oklch(0.28 0.008 80)
-    ring: oklch(0.65 0.18 260)
-    surface-raised: oklch(0.24 0.007 80)
-    surface-overlay: oklch(0.29 0.008 80)
-    chart-1: oklch(0.65 0.2 32)
-    chart-2: oklch(0.7 0.11 190)
-    chart-3: oklch(0.68 0.14 250)
-    chart-4: oklch(0.78 0.13 75)
-    chart-5: oklch(0.68 0.12 155)
-    sidebar: oklch(0.17 0.006 80)
-    sidebar-foreground: oklch(0.9 0.006 85)
-    sidebar-primary: oklch(0.56 0.225 33)
-    sidebar-primary-foreground: oklch(0.99 0.006 40)
-    sidebar-accent: oklch(0.25 0.012 50)
-    sidebar-accent-foreground: oklch(0.92 0.006 85)
-    sidebar-border: oklch(0.23 0.008 80)
-    sidebar-ring: oklch(0.65 0.18 260)
-typography:
-  display: { family: "Geist Variable", fallback: "system-ui, sans-serif", weights: [500, 600] }
-  sans: { family: "Geist Variable", fallback: "system-ui, sans-serif", weights: [400, 500, 600] }
-  mono: { family: "JetBrains Mono Variable", fallback: "ui-monospace, monospace", weights: [400] }
-  ramp:
-    display: { size: 30px, line: 38px, weight: 600, family: display, tracking: -0.02em }
-    h1: { size: 24px, line: 31px, weight: 600, family: display, tracking: -0.015em }
-    h2: { size: 20px, line: 28px, weight: 600, family: display, tracking: -0.01em }
-    body: { size: 14px, line: 21px, weight: 400, family: sans }
-    small: { size: 13px, line: 18px, weight: 400, family: sans }
-    caption: { size: 12px, line: 16px, weight: 600, family: sans, tracking: 0.06em, transform: uppercase }
-    data: { size: 13px, line: 20px, weight: 400, family: mono, features: [tnum] }
-  register-scope: { display: [page-title, section-head, empty-state, auth], sans: [chrome, controls, body], mono: [data, slugs, codes, ids, timestamps] }
-elevation:
-  radius: { sm: 8px, md: 10px, lg: 14px }
-  hairline: border
-  shadow:
-    overlay: "0 8px 30px oklch(0.25 0.02 60 / 0.14)"
-    popover: "0 4px 16px oklch(0.25 0.02 60 / 0.1)"
-  dark-ladder: { background: 0.19, raised: 0.24, overlay: 0.29, hue-held: 80 }
-motion:
-  duration: { press: 120ms, fade: 160ms, panel: 240ms }
-  easing: { standard: "cubic-bezier(0.2, 0, 0, 1)", exit: "cubic-bezier(0.4, 0, 1, 1)" }
-  entrance-never: ease-in
-  identity-moments: [auth, first-run-empty]
-iconography: { set: lucide, stroke: 1.5px, grid: [16px, 20px] }
-charts:
-  categorical: [chart-1, chart-2, chart-3, chart-4, chart-5]
-  sequential: { from: background, to: chart-1 }
-  diverging: { negative: destructive, mid: muted, positive: chart-5 }
-layout: { base: 4px, sidebar: [256px, 56px], topbar: 60px, side-panel: [440px, 640px], content-max: 1320px }
-```