@nurix/etna 0.19.10 → 0.19.12

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

@@ -1,160 +0,0 @@
----
-schema: design-md/v1
-product: Stripe
-provenance: library
-sourced: 2026-07-04
----
-
-# Stripe — operator reading
-
-The operator translation of Stripe's financial-infrastructure brand — a marketing system built on a
-gradient-mesh hero, thin Sohne display type at negative tracking, single-indigo pill CTAs, and
-tabular money figures. This entry keeps the operator-durable core — the indigo accent, the deep-navy
-ink, the cool temperature, the soft blue-tinted lift, the thin editorial type voice, the
-tabular-figure money signal — and leaves the marketing scaffolding behind; §9 lists exactly what
-carries and what stays.
-
-## 1 Visual Theme
-
-Light by default; dark is opt-in. The working canvas is white `background`, banded with a cool-tinted
-off-white `canvas-soft` for grouped panels. Stripe's one departure from pure-flat carries: cards lift on
-a **soft blue-tinted shadow** (`shadow-blue`, `rgba(0,55,112,0.08)`), not gray — depth reads cool and
-engineered, never heavy. A single accent, indigo `primary` (`#533afd`), is reserved for the one action
-that matters; ink is deep navy `foreground` (`#0d253d`), never pure black. The temperature runs cool
-throughout — hairlines lean blue, inputs cooler still. The type voice is thin and editorial (Sohne, Inter
-substitute) with negative heading tracking and the `ss01` stylistic set. Density is `standard` — the
-dashboard reads clean and moderate, neither terminal-dense nor consumer-spacious.
-
-## 2 Color Roles
-
-Light values. One chromatic accent — indigo is the only brand hue that carries meaning; status hues
-speak only status; the gradient palette lives in charts, never chrome.
-
-| Role | Value | Allowed where |
-| --- | --- | --- |
-| `background` / `card` / `popover` | white `#ffffff` (canvas) | page, cards, and overlays — the dominant surface |
-| `foreground` | deep navy `#0d253d` (ink) | all primary ink; never pure black |
-| `muted` / `secondary` | cool off-white `#f6f9fc` (canvas-soft) | hover rows, subtle fills, grouped panel bands |
-| `muted-foreground` | mid slate `#64748d` (ink-mute) | labels, captions, table meta |
-| `border` | hairline `#e3e8ee` | every separator, grid line, and card edge |
-| `input` | cooler hairline `#a8c3de` (hairline-input) | form-field edges only — the brand's cool input border |
-| `primary` | indigo `#533afd` | the one primary action; active nav; inline link emphasis |
-| `accent` | pale indigo `#edecfe` | selected/hovered rows and nav on the light canvas |
-| `accent-foreground` | indigo deep `#4434d4` (primary-deep) | ink on the accent tint |
-| `ring` | `primary` `#533afd` | the focus outline — always visible, keyboard-first |
-| `destructive` | ruby `#ea2261` | destructive actions and error state only |
-| `success` / `warning` | green `#1a8754` / amber `#bb5504` | status signalling only, never chrome |
-
-The gradient stops (cream, sherbet, lavender, magenta, ruby) carry no UI role — they appear only as
-chart series (see §7). Deep-navy `brand-dark-900` (`#1c1e54`) is not a page surface here.
-
-## 3 Typography
-
-One voice, thin and precise. `font-sans` is **Inter** — the documented open substitute for Stripe's
-proprietary Sohne — carrying the brand rhythm with `ss01` enabled and negative tracking on headings;
-it serves body, UI, table, and label. The 56px display tier and its weight-300 air stay behind, but the
-thin editorial voice and tight tracking carry at operator heading scale. `font-mono` renders IDs, codes,
-timestamps, and log lines; numeric columns and every money cell render `tabular-nums` — the brand's quiet
-financial-data signal, which carries strongly.
-
-| Step | Role | Size · line | Weight · tracking |
-| --- | --- | --- | --- |
-| h1 | page title | 24px / 1.25 | `font-weight-strong` · `heading-tracking` |
-| h2 | section head | 18px / 1.3 | `font-weight-strong` · `heading-tracking` |
-| h3 | card / group head | 15px / 1.4 | `font-weight-strong` · -0.01em |
-| body | UI + prose | 14px / 1.45 | `font-weight-normal` |
-| small | labels, meta, dense table | 13px / 1.4 | `font-weight-normal` |
-| caption | uppercase eyebrow | 12px / 1.4 | `font-weight-strong`, +0.02em, uppercase |
-| tabular | money / counts | 14px / 1.4 | `font-weight-normal`, `tabular-nums` |
-
-Bump weight one step for emphasis — a thin brand, so emphasis lifts to medium 500, never a heavy 600.
-Apply `ss01` on the body element so the stylistic-set substitution rides every text role.
-
-## 4 Component Stylings
-
-Every recurring operator component composes from the primitives — no literal values.
-
-- **Button** — `primary`: filled indigo `primary` on `primary-foreground`, `radius` (rounded, not pilled
-  — the marketing pill stays behind). Secondary: `secondary` fill, 1px `border`, `primary` text. Ghost:
-  transparent, `accent` on hover.
-- **Input** — `background` fill, 1px `input` border (`border-weight`) — the cool input hairline; `radius`;
-  focus swaps the border to the `ring` at full 2px, no glow.
-- **Card** — `card` surface, 1px `border`, `radius`; lifts on the soft blue-tinted `md` shadow
-  (`shadow-intensity`) — the brand's one elevation cue; inset by `density-inset`.
-- **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
-  numeric columns; row selection tints `accent`.
-- **Side panel** — detail and edit open in the side panel (`side-panel-width`, `side-panel-width-rich`
-  for content-heavy), beside the work, not over it.
-- **Badge** — status pill (`radius-scale` max, the one controlled brand pill nod), hairline `border` or
-  status fill, uppercase caption; status badges take `success` / `warning` / `destructive`, never `primary`.
-
-## 5 Layout
-
-Base spacing rhythm 8px on a 4px grid; the on-scale ramp is `2 · 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64`
-(48 added on the 8px grid; the corpus jumps 32→64 for marketing bands, which stay behind). Shell
-dimensions map one-to-one to the layout primitives: sidebar `sidebar-width-expanded` /
-`sidebar-width-collapsed`, topbar `topbar-height`, side panel `side-panel-width` / `side-panel-width-rich`,
-modal `modal-width-max`, forms `form-max-width`, tables full-width. The marketing section padding
-(64–96px) and the 1200px centered container stay behind. Density is governed globally by `density-tier`
-and stepped per archetype by the surface catalog — never by absolute overrides.
-
-## 6 Depth
-
-Subtly lifted, cool. Unlike a pure-flat operator brand, Stripe carries one soft elevation cue — a
-blue-tinted shadow — and otherwise leans on hairlines and the surface ladder:
-
-- **0 — canvas** `background` white, no border.
-- **1 — panel / card** `card` on a 1px `border`; lifts on a soft blue-tinted shadow
-  (`rgba(0,55,112,0.08) 0 1px 3px`) — the brand's signature cool lift, kept restrained.
-- **2 — overlay** `popover` / side panel / modal — a deeper blue-tinted `md`
-  (`rgba(0,55,112,0.08) 0 8px 24px`) for floating chrome. No level stacks a heavier shadow to signal
-  rank; rank is border, position, and the one soft lift.
-
-The gradient-mesh backdrop — the corpus's primary marketing depth medium — stays behind entirely. Focus
-is a 2px indigo `ring` outline (never a glow), visible on every interactive element. Three z-levels:
-content, sticky chrome, overlay.
-
-## 7 Do's & Don'ts
-
-- **Do** reserve indigo `primary` for the single most important action and inline link emphasis — one
-  filled control per view. If two things want it, one is not primary.
-- **Do** keep ink deep navy `#0d253d`, never pure black; keep the temperature cool, hairlines blue-leaning.
-- **Do** lift cards on the soft blue-tinted shadow (`shadow-blue`), never a neutral gray drop shadow.
-- **Do** apply `tabular-nums` to every money and numeric column and `font-mono` to IDs, codes, timestamps;
-  keep `ss01` on the body.
-- **Don't** promote a second chromatic accent — the gradient stops (cream, sherbet, lavender, magenta,
-  ruby) are chart series only, never chrome, and indigo is never a body-text color.
-- **Don't** pill the primary CTA — the marketing pill stays behind; buttons take `radius`, only status
-  badges pill.
-- **Don't** carry the gradient mesh, the cream feature band, or the dark-navy featured-tier inversion into
-  an operator surface.
-- **Don't** open detail or edit in a modal when the side panel fits — modals are confirmations only.
-
-## 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 over:** indigo `primary` (`#533afd`) as the single reserved accent · deep-navy ink `#0d253d`
-(never pure black) · the cool temperature with a cooler input hairline · the soft blue-tinted card
-shadow (`rgba(0,55,112,0.08)`) · the thin Sohne/Inter type voice with negative heading tracking and
-`ss01` · `tabular-nums` money as the financial-data signal.
-
-**Stays behind:** the gradient-mesh backdrop · hero-scale display (56px, weight 300) · the pill CTA
-(`8px 16px` pill) · the cream feature band · the dark-navy featured-tier inversion · the composited
-product-UI mockups · the dark-app dashboard shell as the working surface.
-
-- Lead every list surface with its table; accent only the primary action in indigo.
-- Detail and edit go in the side panel; a modal is a confirmation, not a workspace.
-- Every money and numeric column is `tabular-nums`; every ID / code / timestamp is `font-mono`, and every
-  workflow completes from the keyboard with the indigo `ring` outline always visible.
-- Lift a card on the soft blue-tinted shadow, not a gray one; reach past a hairline only for a real
-  overlay. Leave the gradient mesh, the hero display, and the cream bands behind.

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

@@ -1,173 +0,0 @@
----
-schema: design-md/v1
-product: Supabase
-provenance: library
-sourced: 2026-07-04
----
-
-# Supabase — an operator reading of the white-canvas, emerald-green system
-
-Supabase's web system is the quietly-technical brand in the database category: a committed white
-canvas, near-black ink that is never pure black, one emerald-green voltage held for the CTA, and real
-product UI (dashboard tables, SQL editors, log streams) doing the decorative work. This entry is the
-*operator* reading — an internal tool (query console, project dashboard, job queue, log stream) in
-Supabase's language. What carries: the white canvas, the single emerald accent held scarce, the
-near-black ink, the idiosyncratic near-black-on-green button, flat hairline-first depth, the 6px
-not-pill radius, the near-black `#1c1c1c` inlay for code and logs (the developer DNA), and Circular's
-mid-weight-500 humanist voice with tight negative tracking. What stays behind: the 64/48px hero
-display, the composited product-mockup float shadows, the dark inverted featured pricing tier, and the
-64–96px marketing section rhythm.
-
-## 1 Visual Theme
-
-Light by default; dark is opt-in — the white `background` (`#ffffff`) is the committed floor, and the
-white-canvas commitment is the brand (no atmospheric gradient, no dark marketing track). Flat:
-hierarchy comes from a fine greyscale hairline ladder, type weight, and near-black-on-white contrast —
-never heavy shadow. A single accent, emerald `primary` (`#3ecf8e`), is the only chromatic event on a
-surface: it wears the one primary action, the focus `ring`, and the active-nav indicator, nothing else.
-Ink is near-black `foreground` (`#171717`) — never pure `#000000`. The neutral ramp is a calibrated
-achromatic grey (white through `#fafafa`, `#ededed`, `#dfdfdf` down to `#171717`). Density is
-`standard` and steps denser per archetype — the product's tables and log streams read technical.
-
-## 2 Color Roles
-
-Light values first. One accent — emerald `primary` is the only chromatic hue that carries meaning;
-status hues speak only status.
-
-| Role | Value | Allowed where |
-| --- | --- | --- |
-| `background` / `card` / `popover` | white `#ffffff` (canvas) | page, cards, and overlays — the dominant surface, differentiated by hairline not brightness |
-| `foreground` | near-black `#171717` (ink) | all primary ink and headlines — never pure black |
-| `muted` | barely-tinted `#fafafa` (canvas-soft) | hover rows, subtle fills, quiet band tints |
-| `secondary` | light grey `#f2f2f2` | secondary-button and segmented fills, one step below canvas |
-| `muted-foreground` | mid grey `#707070` (ink-mute) | labels, captions, secondary text |
-| `border` / `input` | hairline `#dfdfdf` | every separator, grid line, and field edge |
-| `primary` | emerald `#3ecf8e` | the one primary action; active-nav indicator; the signature CTA and dot |
-| `primary-foreground` | near-black `#171717` (on-primary) | text on the green action — the button reads "lit" with dark type, not a colored chip |
-| `accent` | grey lift `#ededed` (hairline-cool) | selected/hovered rows and nav — a neutral lift, never coloured green |
-| `ring` | emerald `#3ecf8e` | the focus outline — unmistakable, because keyboard-first |
-| `destructive` | clean red `#dc2626` | destructive actions and error state only |
-| `success` / `warning` | deep-emerald `#24b47e` / status-yellow `#ffdb13` | status signalling only, never chrome |
-
-The emerald's power is its scarcity at element level; the rich accent set (purple, violet, pink,
-indigo, tomato, crimson) is chart-and-logo voltage and carries no operator role beyond charts (see §7).
-
-## 3 Typography
-
-One sans, one mono. `font-mono` is the brand's **system mono** stack (`ui-monospace`, Menlo / Monaco
-/ Consolas — the corpus ships no proprietary mono webfont) for IDs, codes, timestamps, log lines,
-and SQL; numeric columns render `tabular-nums`. The marketing display scale (64/48px) stays behind —
-an operator surface tops out at a 28px page title.
-
-| Step | Role | Size · line | Weight · tracking |
-| --- | --- | --- | --- |
-| h1 | page title | 28px / 1.2 | `font-weight-strong` · `heading-tracking` |
-| h2 | section head | 22px / 1.2 | `font-weight-strong` · -0.01em |
-| h3 | card / group head | 18px / 1.4 | `font-weight-strong` |
-| body | UI + prose | 16px / 1.5 | `font-weight-normal` |
-| small | labels, meta, dense table | 13px / 1.45 | `font-weight-normal` |
-| caption | uppercase eyebrow | 12px / 1.45 | `font-weight-strong`, +0.02em, uppercase |
-| code | IDs, logs, SQL | 14px / 1.5 | `font-weight-normal` |
-
-Display weight caps at 500 — the brand's calibrated mid-weight reads engineered, and breaks at 600+.
-Negative tracking on headings is the signature; build hierarchy on size and tight tracking, never a
-second family or a heavier-than-500 weight.
-
-## 4 Component Stylings
-
-Every recurring operator component composes from the primitives — no literal values.
-
-- **Button** — primary: filled emerald `primary` with near-black `primary-foreground`, `radius` (6px),
-  never a pill; pressed lifts to deep-emerald. Secondary: `secondary` fill, 1px `border`, `foreground`.
-  Ghost: transparent, `accent` on hover.
-- **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus draws the emerald
-  `ring` at full 2px, no glow.
-- **Card** — `card` surface on a 1px `border`, `radius`; depth is the hairline, not shadow — shadow
-  only when it must lift off the canvas; inset by `density-inset`.
-- **Table row** — height `table-row-height`; `border` grid lines carry the grid; `muted` on hover;
-  `tabular-nums` on numeric columns; selection tints `accent` (neutral, never green).
-- **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, `muted`/status fill, uppercase caption; status badges take `success` /
-  `warning` / `destructive`, never `primary`. Pill radius is badges-only.
-
-## 5 Layout
-
-Base spacing unit 4px; the on-scale ramp is `2 · 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64` — the marketing
-64–96px section rhythm stays behind. Shell dimensions map one-to-one to the layout primitives: sidebar
-`sidebar-width-expanded` / `sidebar-width-collapsed`, topbar `topbar-height`, side panel
-`side-panel-width` / `side-panel-width-rich`, modal cap `modal-width-max`, forms `form-max-width`,
-tables full-width. Density is governed globally by `density-tier` (standard, rewriting the spacing scale
-through `density-gap`) and stepped per archetype by the surface catalog — the data-heavy console and
-log stream step denser, never the whole app.
-
-## 6 Depth
-
-Flat, hairline-first. Hierarchy comes from the greyscale ladder and 1px hairlines, not drop shadows:
-
-- **0 — canvas** `background` (`#ffffff`), no border.
-- **1 — panel / card** `card` on a 1px `border`; the hairline carries rank — shadow only when a card
-  must genuinely lift off the canvas (the faintest `sm`).
-- **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns a soft `md`
-  shadow, enough to separate an overlay from the canvas above a scrim. Rank is border and position,
-  never a heavier shadow.
-- **inlay — code / log / SQL** near-black `#1c1c1c` (canvas-night, `#202020` for nested chrome) with
-  white text and `font-mono` — the developer DNA carried even in a light UI (the SQL editor and log
-  stream wear it).
-
-Focus is a 2px emerald `ring` outline (never a glow), visible on every interactive element. Three
-z-levels: content, sticky chrome, overlay.
-
-## 7 Do's & Don'ts
-
-- **Do** anchor every surface on the white canvas; the white-canvas commitment is the brand — no
-  atmospheric gradient, no dark marketing track.
-- **Do** reserve emerald `primary` for the primary action, the focus `ring`, and the active-nav
-  indicator — nothing else. Its scarcity is what reads as the one chromatic event.
-- **Do** set near-black `primary-foreground` on the green button — the brand's idiosyncratic "lit"
-  read, dark type on green, never white.
-- **Do** carry hierarchy with the greyscale ladder, hairlines, weight, and tight tracking — the brand
-  is flat.
-- **Do** dress code, log, and SQL panels in the near-black inlay (`#1c1c1c`, `font-mono`) — show the
-  real query, not an illustration of one.
-- **Do** apply `tabular-nums` to numeric columns and `font-mono` to IDs, codes, timestamps, and SQL.
-- **Don't** promote a second chromatic accent — purple, yellow, pink, and indigo belong in charts and
-  logos only, never as system or UI colours.
-- **Don't** bump display weight above 500, or set white text on the green button — both break the brand.
-- **Don't** pill controls or reach for a radius outside `radius-scale` — the button/input radius is 6px.
-- **Don't** signal elevation with heavy drop shadows, or open detail in a modal when the 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 | content caps at `form-max-width` for forms; tables and dashboards use the full width |
-
-Code, log, and SQL inlays keep mono legibility at every breakpoint by scrolling horizontally, not
-wrapping.
-
-## 9 Agent Prompt Guide
-
-Directives the emitting agent follows verbatim:
-
-- Wear the white canvas by default; the white-canvas commitment is Supabase — no gradient, no dark
-  marketing band. Panels read by their hairline, not by brightness.
-- Spend emerald once per surface: the primary action, the focus ring, the active-nav indicator. If two
-  things want the green, one is not primary. Colour otherwise belongs to charts and status.
-- Set near-black type on the green button (`primary-foreground` `#171717`), never white — the "lit"
-  green with dark type is the brand's signature.
-- Headings ride Inter at weight 500 with tight negative tracking; the display scale (64/48px) stays
-  behind — operator headings top out at 28px, hierarchy is size and tracking. Never exceed weight 500.
-- Dress code, log, and SQL panels in the near-black `#1c1c1c` inlay with `font-mono`; show the real
-  query, not a mockup of one.
-- Every numeric column is `tabular-nums`; every ID / code / timestamp / log line and SQL block is
-  `font-mono` (system mono, no webfont).
-- Detail and edit go in the side panel beside the work; a modal is a confirmation, not a workspace.
-- Keyboard-first: the emerald `ring` focus outline is always visible.
-- Leave behind: the 64/48px hero display, the composited product-mockup float shadows, the dark
-  featured pricing tier, and the 64–96px section rhythm — marketing chrome, not operator chrome.

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

@@ -1,145 +0,0 @@
----
-schema: design-md/v1
-product: Superhuman
-provenance: library
-sourced: 2026-07-04
----
-
-# Superhuman — the warm-editorial operator reading
-
-An operator translation of Superhuman's fast-productivity brand: a warm, quiet, editorial system
-whose content body is white with off-black warm-grey ink, anchored by a single deep indigo-navy
-accent. The marketing surfaces are theatrical — a violet-sky atmospheric hero, hero-scale display
-type, a deep-teal closing band that resolves every page. None of that theatre belongs on a queue or
-a case detail; what carries is the warmth (warm neutrals, sub-default type weights, off-black ink),
-the 8px rounded-rectangle radius character, and the one-accent indigo discipline.
-
-## 1 Visual Theme
-
-Light by default — the brand's content body *is* white; dark is opt-in. Warm and quiet: the neutral
-ramp leans warm-grey, ink is `foreground` warm off-black `#292827` (never pure black), the canvas is
-white, and hairlines are a warm grey `#e8e4dd`. Flat — hierarchy comes from hairline, type weight, and
-whitespace, not shadow. A single accent, `primary` deep indigo-navy `#1b1938` (near-black), is reserved
-for the one action that matters and for active nav; it is the brand's own CTA color. The radius
-character is the signature: 8px rounded rectangles, never a pill on a working surface. Density is
-`standard` and editorial-roomy — it steps denser per archetype, never cramped. The violet-sky hero
-gradient, hero-scale display type, and the teal closing band stay behind as marketing (see §7).
-
-## 2 Color Roles
-
-Light values first. One accent — `primary` is the only chromatic hue that carries meaning; status hues
-speak only status. Violet-soft and teal are marketing surfaces and carry no operator role.
-
-| Role | Value | Allowed where |
-| --- | --- | --- |
-| `background` / `card` / `popover` | white `#ffffff` | page, cards, and overlays — the dominant surface |
-| `foreground` | warm off-black `#292827` | all primary ink — never pure black |
-| `muted` / `secondary` | warm off-white `#f4f2ed` | hover rows, subtle fills, secondary buttons |
-| `muted-foreground` | warm grey `#73706d` | labels, captions, secondary text |
-| `border` / `input` | warm hairline `#e8e4dd` | every separator, grid line, and field edge |
-| `primary` | indigo-navy `#1b1938` | the one primary action; active nav; key interactive detail |
-| `accent` | pale indigo tint `#edecf2` | selected / hovered rows and nav, on-accent surfaces only |
-| `ring` | `primary` indigo | the focus outline — unmistakable, because keyboard-first |
-| `destructive` | warm red `#c0362b` | destructive actions and error state only |
-| `success` / `warning` | green `#157a52` / amber `#b5791f` | status signalling only, never chrome |
-
-## 3 Typography
-
-One sans, one mono. `font-sans` is Super Sans VF — the proprietary variable display sans; Inter
-Variable is the documented open substitute, run at the same sub-default weights. The brand's warmth
-signature is the *in-between* weight: body sits at `font-weight-normal` 460 (not 400), headings at
-`font-weight-strong` 600. Display tracking is negative and tight; operator headings inherit a
-proportioned `heading-tracking` of `-0.02em`. `font-mono` is derived (the marketing brand ships none)
-for IDs, codes, timestamps, and log lines. Numeric columns render `tabular-nums` so figures align.
-
-| Step | Role | Size · line | Weight · tracking |
-| --- | --- | --- | --- |
-| h1 | page title | 24px / 1.2 | `font-weight-strong` · `heading-tracking` |
-| h2 | section head | 19px / 1.25 | `font-weight-strong` · `heading-tracking` |
-| h3 | card / group head | 15px / 1.35 | `font-weight-strong` · `heading-tracking` |
-| body | UI + prose | 14px / 1.5 | `font-weight-normal` (460) |
-| small | labels, meta, dense table | 13px / 1.4 | `font-weight-normal` |
-| caption | uppercase eyebrow | 12px / 1.3 | `font-weight-strong`, `+0.02em`, uppercase |
-
-Keep the sub-default weight — the quiet warmth is the type voice. Bump weight for emphasis, never size.
-
-## 4 Component Stylings
-
-Every recurring operator component composes from the primitives — no literal values.
-
-- **Button** — `primary`: filled `primary` indigo on `primary-foreground` white, `radius` 8px, never a
-  pill. Secondary: `secondary` fill, 1px `border`, `foreground`. Ghost: transparent, `accent` on hover.
-- **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus draws the `ring` at a
-  full 2px, no glow.
-- **Card** — `card` surface, 1px `border`, `radius`; shadow only when it must lift (`shadow-intensity`);
-  inset by `density-inset`.
-- **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
-  numeric columns; row selection tints `accent`.
-- **Side panel** — detail and edit open in the side panel (`side-panel-width`, `side-panel-width-rich`
-  for content-heavy) beside the work, not over it.
-- **Badge** — hairline `border`, `muted` / status fill, uppercase caption; status badges take
-  `success` / `warning` / `destructive`, never `primary`.
-
-## 5 Layout
-
-Base spacing unit 8px (the brand's base, with 2 / 4 / 12 sub-tokens for fine work); the on-scale ramp
-is `2 · 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64`. Shell dimensions map one-to-one to the layout primitives:
-sidebar `sidebar-width-expanded` 256 / `sidebar-width-collapsed` 56, topbar `topbar-height` 56, side
-panel `side-panel-width` 440 / `side-panel-width-rich` 640, modal cap `modal-width-max` 560, forms
-`form-max-width` 640, tables full-width. Density is governed globally by `density-tier` and stepped per
-archetype by the surface catalog — never by absolute overrides. The editorial roominess is carried by
-the 8px base, the taller `table-row-height`, and the larger radius, not by inflating the global tier.
-
-## 6 Depth
-
-Flat. Hierarchy comes from the surface ladder and hairlines, not shadow:
-
-- **0 — canvas** `background`, no border.
-- **1 — panel / card** `card` on a 1px `border`; shadow only when it must lift off the canvas —
-  `0 1px 3px rgba(0,0,0,0.08)` (riding `shadow-intensity`).
-- **2 — overlay** `popover` / side panel / modal — the one place shadow earns its keep,
-  `0 8px 24px rgba(0,0,0,0.12)`.
-
-The hero's violet-sky atmospheric backdrop (the marketing depth medium) stays behind. Focus is a 2px
-`ring` outline in indigo, never a glow, visible on every interactive element. Three z-levels: content,
-sticky chrome, overlay.
-
-## 7 Do's & Don'ts
-
-- **Do** reserve `primary` indigo for the single most important action on a surface; everything else is
-  neutral or status.
-- **Do** carry hierarchy with warm hairlines, sub-default weight steps, and whitespace — the brand is flat.
-- **Do** hold ink at warm off-black `foreground` `#292827`; pure black breaks the brand's quiet warmth.
-- **Do** apply `tabular-nums` to every numeric column and `font-mono` to IDs, codes, and timestamps.
-- **Don't** wear the marketing theatre: no violet-sky hero gradient, no deep-teal closing band, no
-  hero-scale display type on a working surface — those are brochure devices, not operator chrome.
-- **Don't** promote a second chromatic accent. Teal and violet-soft stay marketing-decorative; status
-  uses `success` / `warning` / `destructive`.
-- **Don't** pill the primary CTA — 8px rounded rectangle is the button shape; the pill is hero-only.
-- **Don't** signal elevation with heavy drop shadows, 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
-
-Directives the emitting agent follows verbatim:
-
-- What carries from Superhuman: the warm neutral palette and warm off-black ink, the single indigo
-  accent, the 8px rounded-rectangle radius, and the sub-default type weights (460 body / 600 strong).
-- What stays behind: the violet-sky hero gradient, the deep-teal closing band, hero-scale display type,
-  and the pill CTA — every one is a marketing device with no operator role.
-- Lead every list surface with its table; lead every entity with its primary read, not its chrome.
-- Accent only the primary action with indigo. If two things want the accent, one is not primary.
-- Detail and edit go in the side panel; a modal is a confirmation, not a workspace.
-- Every numeric column is `tabular-nums`; every ID / code / timestamp is `font-mono`.
-- Every workflow completes from the keyboard; the indigo `ring` focus outline is always visible.
-- Stay flat and warm — hairline and weight before shadow; never pure black, never a pill on a CTA.

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

@@ -1,153 +0,0 @@
----
-schema: design-md/v1
-product: Tesla
-provenance: library
-sourced: 2026-07-04
----
-
-# Tesla — radical-subtraction minimalism, translated for operators
-
-Tesla's web design is radical subtraction: a white canvas, a single Electric Blue accent, a rich
-grayscale ink ramp, near-zero decoration, and a categorical geometry — **barely-rounded 4px
-corners**. This operator reading keeps the white-dominant palette, the one blue accent, the 4px
-radius character, the flat/shadowless depth, the two-weight (400 / 500) type discipline, the
-signature **zero letter-spacing**, and the color-only interaction feel. Left behind: full-viewport
-hero photography, 40px display type, whitespace-as-luxury rhythm, the frosted-glass nav, the
-carousel, the chatbot bar.
-
-## 1 Visual Theme
-
-Light by default; dark is opt-in. White-dominant and categorically shadowless: hierarchy rides a
-grayscale surface ladder (`background` white → `muted` Light Ash → hairline `border`) and type weight,
-never shadow. The single accent — Electric Blue `primary` (`#3e6ae1`) — is the only chromatic hue,
-reserved for the one action that matters. Ink is Carbon Dark `foreground` (`#171a20`), a warm
-blue-undertoned near-black, stepping down a documented ramp (Carbon → Graphite → Pewter → Silver Fog).
-The geometry is the identity: `radius` 4, barely rounded. The anchor surface is a white canvas beside a
-Light Ash `sidebar`; density is `standard` — engineered-uniform, the marketing whitespace left behind.
-
-## 2 Color Roles
-
-Light values (hex — the corpus's native format). One accent — `primary` Electric Blue is the only
-chromatic hue that carries meaning; status hues speak only status. The rich grayscale ramp is Tesla's
-signature alongside the single blue.
-
-| Role | Value | Allowed where |
-| --- | --- | --- |
-| `background` / `card` / `popover` | Pure White `#ffffff` | page, cards, and overlays — the dominant canvas that lets content breathe |
-| `foreground` | Carbon Dark `#171a20` | primary ink, headings, nav — the darkest text, a warm blue-undertoned near-black |
-| `muted` / `secondary` | Light Ash `#f4f4f4` | hover rows, subtle fills, secondary-button surfaces, section differentiation |
-| `muted-foreground` | Pewter `#5c5e62` | labels, captions, tertiary links, placeholders' firmer sibling |
-| `border` | Cloud Gray `#eeeeee` | separators and divider lines — the light hairline |
-| `input` | Pale Silver `#d0d1d2` | field edges — the firmer border tone Tesla uses for delineation |
-| `primary` | Electric Blue `#3e6ae1` | the one primary action; active nav; promotional emphasis text |
-| `accent` | faint blue wash `#edf1fc` | selected / hovered rows and nav, on-accent surfaces only |
-| `ring` | `primary` | the focus outline — an unmistakable blue border, because keyboard-first |
-| `destructive` | red `#dc2626` | destructive actions and error state only |
-| `success` / `warning` | green `#16a34a` / amber `#d97706` | status signalling only, never chrome |
-
-Graphite `#393c41` is the `secondary-foreground` (body / secondary-CTA text); Silver Fog `#8e8e8e` is the
-placeholder / disabled tone. Tesla avoids semantic status color (browser defaults); the derived
-`destructive` / `success` / `warning` give the operator tool a status vocabulary, kept off the chrome (§7).
-
-## 3 Typography
-
-One sans, one mono. `font-sans` leads with Universal Sans Text — Tesla's custom geometric family with
-humanist terminals, unifying web, app, and in-car software — falling back to Inter, the open-source
-stand-in. The hero-scale Universal Sans Display (40px / 500) stays behind; the operator ramp keeps the
-voice at working sizes. `font-mono` is derived (Tesla ships none) — JetBrains Mono for IDs, codes,
-timestamps; numeric columns render `tabular-nums`.
-
-| Step | Role | Size · line | Weight · tracking |
-| --- | --- | --- | --- |
-| h1 | page title | 24px / 1.25 | `font-weight-strong` (500) · `heading-tracking` (0) |
-| h2 | section head | 18px / 1.3 | `font-weight-strong` · 0 |
-| h3 | card / group head | 16px / 1.35 | `font-weight-strong` · 0 |
-| body | UI + prose | 14px / 1.45 | `font-weight-normal` (400) |
-| small | labels, meta, dense table | 13px / 1.4 | `font-weight-normal` |
-| caption | eyebrow / meta | 12px / 1.3 | `font-weight-strong` · 0 · sentence case |
-
-Two weights only — 500 for heads and UI, 400 for body; **no bold, no light**. **Zero letter-spacing at
-every level** is the Tesla signature (unlike most tech brands it takes no negative tracking); **no
-uppercase transforms** — captions and labels stay sentence-case. Emphasize by weight, never size.
-
-## 4 Component Stylings
-
-Every recurring operator component composes from the primitives — no literal values, `radius` 4 on
-controls throughout.
-
-- **Button** — `primary`: filled Electric Blue on `primary-foreground`, `radius` (4px), no pill; the
-  border reserves space for the focus animation. Hover is color-only — a subtle darkening, never a
-  transform. Secondary: `secondary` Light Ash fill, 1px `border`, `secondary-foreground` Graphite.
-- **Input** — `background` fill, 1px `input` (Pale Silver) edge, `radius`; placeholder in Silver Fog
-  (`muted-foreground`); focus draws the blue `ring` at 2px, no glow.
-- **Card** — white `card`, optional 1px `border`, `radius` (4px controls; the scale offers 12px for a
-  large image-forward tile); no shadow at rest, inset by `density-inset`.
-- **Table row** — `table-row-height`; Cloud Gray `border` grid lines; Light Ash `muted` on hover;
-  `tabular-nums` on numeric columns; row selection tints `accent`.
-- **Side panel** — detail and edit open beside the work (`side-panel-width` / `side-panel-width-rich`),
-  never over it.
-- **Badge / chip** — `radius`, hairline `border`, `muted` / status fill, sentence-case caption (no
-  uppercase); status badges take `success` / `warning` / `destructive`, never `primary`.
-
-## 5 Layout
-
-Base spacing unit 8px (Tesla's grid); the on-scale ramp is `4 · 8 · 12 · 16 · 24 · 32 · 48 · 64` (the
-4px step is the button padding). Shell dimensions map one-to-one to the layout primitives — sidebar
-`sidebar-width-expanded` / `sidebar-width-collapsed`, topbar `topbar-height`, side panel
-`side-panel-width` / `side-panel-width-rich`, modal cap `modal-width-max`, forms `form-max-width`, tables
-full-width capped at ~1383px (Tesla's container). Density is governed globally by `density-tier` and
-stepped per archetype; the viewport-height rhythm and whitespace-as-luxury stay behind.
-
-## 6 Depth
-
-Flat, and essentially shadowless — Tesla's elevation approach is "none." Hierarchy comes from the surface
-ladder, hairlines, and z-position, never a drop shadow:
-
-- **0 — flat** `background` white, no shadow, no border — the default at rest for cards, panels, controls.
-- **1 — frost** sticky chrome floats over content by a frosted-glass backdrop (`rgba(255,255,255,0.75)`)
-  and z-position, not shadow.
-- **2 — overlay** `popover` / side panel / modal — a region-scrim (`rgba(128,128,128,0.65)`) dims the
-  canvas beneath; `shadow-intensity` earns only a whisper `sm` shadow, a hairline still carrying the edge.
-
-Focus is a 2px `ring` outline in Electric Blue (never a glow), visible everywhere. Three z-levels:
-content, sticky chrome, overlay.
-
-## 7 Do's & Don'ts
-
-- **Do** reserve Electric Blue (`primary`) for the single most important action — never decoration;
-  carry hierarchy with the grayscale surface ladder, hairlines, and weight.
-- **Do** keep every corner barely rounded — `radius` 4 on buttons, inputs, and chips is the signature.
-- **Do** hold typography at 400 / 500 only, zero letter-spacing, and sentence case — no bold, no light,
-  no negative tracking, no uppercase; apply `tabular-nums` to numbers, `font-mono` to IDs / codes / times.
-- **Don't** promote a second chromatic accent — the palette is monochrome-plus-one; status uses
-  `success` / `warning` / `destructive`, never the blue.
-- **Don't** pill or over-round a control (radius stays inside `radius-scale`), or signal elevation with a
-  drop shadow — the aesthetic is flat.
-- **Don't** animate with scale or translate — Tesla's interactions are color-only (background and border
-  transitions).
-
-## 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 | content caps at ~1383px; forms hold `form-max-width`; tables and dashboards use the full width |
-
-## 9 Agent Prompt Guide
-
-Directives the emitting agent follows verbatim:
-
-- Carries over: the white-dominant palette (Carbon → Graphite → Pewter → Silver Fog ink ramp, Electric
-  Blue `#3e6ae1`), the single-accent discipline, the 4px technical radius, the flat/shadowless depth, the
-  two-weight 500 / 400 type voice with zero tracking and no uppercase.
-- Stays behind: full-viewport hero photography, 40px display type, whitespace-as-luxury rhythm, the
-  frosted-glass nav, the carousel, the chatbot bar — none belong in operator chrome.
-- Accent only the primary action in Electric Blue — if two things want it, one is not primary.
-- Keep motion color-only — background and border transitions, never a scale or translate; the hot path
-  tempers Tesla's languid 0.33s to a still-smooth normal, parking 330ms for large surface changes.
-- Numeric columns `tabular-nums`, IDs / codes / timestamps `font-mono`; every workflow keyboard-complete
-  with the blue `ring` focus outline always visible; stay flat, a whisper `sm` shadow only for a true overlay.