@nurix/etna 0.18.18 → 0.18.20

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

@@ -0,0 +1,236 @@
+---
+schema: design-md/v1
+product: Framer
+provenance: library
+sourced: 2026-07-04
+---
+
+# Framer — operator surfaces on a black artboard
+
+Framer's brand is a near-pure-black marketing artboard: white display type set poster-tight, one
+confident blue used only as a signal, and vibrant gradient atmosphere tiles that show what the tool
+builds. This library entry translates that identity to operator work — a CRM, a queue, a dashboard in
+Framer's language. What carries: the dark charcoal surface ladder, white ink, the single blue signal,
+the tight-tracked Inter voice, the softly-rounded geometry. What stays behind: the hero-scale GT
+Walsheim display, the gradient spotlight cards as chrome, the pill CTA, the 5px/96px editorial rhythm.
+Both machine blocks are fully valued; every judgment away from the marketing brand is annotated.
+
+Framer is categorically dark. Where the operator doctrine defaults light and treats dark as opt-in,
+this brand legitimately inverts it: the base theme *is* dark, and `color-tokens.light` carries the
+dark charcoal palette (the brand ships no light mode — forcing one would discard the palette). This is
+the recorded override, not a mistake.
+
+## 1 Visual Theme
+
+Dark by default and dark only. The anchor surface is a near-black `background` canvas beside charcoal
+`card` panels; hierarchy rises through a three-step surface ladder (canvas → surface-1 → surface-2),
+not through heavy shadow. Flat: separation is carried by hairline `border`, surface lift, and white
+ink against gray. A single chromatic accent — Framer blue — lives in `ring`, links, and selected/active
+indicators, and is never a fill. The one primary action reads as a high-contrast white button on the
+dark shell, not a colored one. Density is `standard`: the brand breathes like a poster, and the
+operator read keeps that composure rather than crowding to terminal density.
+
+## 2 Color Roles
+
+Dark values (the brand's only mode). One accent — Framer blue is the sole chromatic hue that signals;
+status hues speak only status; the gradient family lives in charts, never in chrome.
+
+| Role | Value | Allowed where |
+| --- | --- | --- |
+| `background` | near-black `#090909` | the page canvas — the dominant surface, warm-tinted black |
+| `card` / `popover` | charcoal `#141414` (surface-1) | raised panels, cards, overlays, mockup tiles |
+| `muted` / `accent` | `#1c1c1c` (surface-2) | hover rows, subtle fills, selected-row lift (selection is lift, not color) |
+| `foreground` | pure white `#ffffff` (ink) | all primary ink and headlines |
+| `muted-foreground` | gray `#999999` (ink-muted) | labels, meta, captions — the entire secondary tier |
+| `border` / `input` | hairline `#262626` | every separator, grid line, and field edge |
+| `primary` | white `#ffffff` on `#000000` | the one primary action per surface; a light button on dark |
+| `ring` | Framer blue `#0099ff` | focus outlines, links, active/selected indicators — the single signal |
+| `destructive` | red `#ef4444` | destructive actions and error state only |
+| `success` / `warning` | green `#22c55e` / amber `#f59e0b` | status signalling only, never chrome |
+
+Hierarchy is binary: ink or ink-muted, no mid-tone grays between. The gradient hues (violet, magenta,
+orange, coral) are brand graces — they carry no chrome role, only chart series (see §7).
+
+## 3 Typography
+
+One sans, one mono. `font-sans` is Inter — the operator body, UI, and headings all ride it, with Inter's
+character variants (`cv01`, `cv05`, `cv09`, `cv11`, `ss03`, `ss07`) enabled; those variants are the
+brand's body voice and the emitting agent keeps them on. `font-mono` is Geist Mono for IDs, codes,
+timestamps, and log lines. Numeric columns render `tabular-nums` (Inter carries `tnum`) so figures align
+down a column. Framer's hero-scale GT Walsheim display stays behind — operator headings top out where
+Inter already serves.
+
+| Step | Role | Size · line | Weight · tracking |
+| --- | --- | --- | --- |
+| h1 | page title | 24px / 1.2 | `font-weight-strong` · `heading-tracking` |
+| h2 | section head | 20px / 1.25 | `font-weight-strong` · `heading-tracking` |
+| h3 | card / group head | 16px / 1.3 | `font-weight-strong` · `heading-tracking` |
+| body | UI + prose | 15px / 1.4 | `font-weight-normal` |
+| small | labels, meta, dense table | 14px / 1.4 | `font-weight-normal` |
+| caption | eyebrow / footnote | 13px / 1.2 | `font-weight-normal`, `+0.01em` |
+
+Framer's signature is aggressive negative tracking; at operator sizes it carries as a tighter-than-neutral
+`heading-tracking`, not the hero display's -5% extreme. Bump weight one narrow step for emphasis; never
+change size to emphasize.
+
+## 4 Component Stylings
+
+Every recurring operator component composes from the primitives — no literal values.
+
+- **Button** — `primary`: filled white `primary` on `primary-foreground`, `radius`, no pill. Secondary:
+  `secondary` (surface-1) fill, `border`, `foreground`. Ghost: transparent, `muted` on hover.
+- **Input** — `card` (surface-1) fill, 1px `border` (`border-weight`), `radius`; focus draws the blue
+  `ring` at 2px, no glow — the one chromatic moment in the field.
+- **Card** — `card` surface, 1px `border`, `radius`; a soft light-edge + `shadow-intensity` drop only
+  when it floats off the canvas; inset by `density-inset`.
+- **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
+  numeric columns; row selection lifts to `accent` (surface-2), never a colored fill.
+- **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; status badges take `success` / `warning` /
+  `destructive`, never `primary` and never the blue.
+
+## 5 Layout
+
+Base spacing unit 4px (Tailwind `--spacing` 0.25rem); the on-scale ramp is `2 · 4 · 8 · 12 · 16 · 24 ·
+32 · 48 · 64`. Framer's marketing 5px rhythm (15 / 20 / 30) and 96px section breaks stay behind — the
+operator surface normalizes to the 4px ramp the density remap expects. Shell dimensions map one-to-one
+to the layout primitives: sidebar `sidebar-width-expanded` / `sidebar-width-collapsed`, topbar
+`topbar-height` (56px, the brand's nav 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` and stepped per archetype by the surface catalog — never by absolute overrides.
+
+## 6 Depth
+
+Flat. Rank comes from the surface ladder and hairlines, not stacked shadow:
+
+- **0 — canvas** `background`, no border — the black artboard.
+- **1 — panel / card** `card` (surface-1) on a 1px `border`; the working raised surface.
+- **2 — overlay** `popover` / side panel / modal — a `rgba(255,255,255,0.08)` light top-edge plus a
+  soft `shadow-intensity` drop against the near-black. No level stacks a heavier shadow to signal rank;
+  rank is surface lift and position.
+
+Focus is a 2px blue `ring` outline (never a glow), visible on every interactive element — the only
+chromatic depth signal in the system. Three z-levels: content, sticky chrome, overlay.
+
+## 7 Do's & Don'ts
+
+- **Do** keep the base dark. Framer ships no light mode; the near-black canvas is the identity.
+- **Do** reserve Framer blue for `ring`, links, and selected/active indicators — a signal color, never a
+  surface or button fill.
+- **Do** make the primary action a high-contrast white button; there is one per surface.
+- **Do** mark selection and "active" by surface lift (surface-1 → surface-2), not by a colored tint.
+- **Do** carry hierarchy as a binary ink / ink-muted split — no mid-tone grays crept in between.
+- **Do** apply `tabular-nums` to every numeric column and `font-mono` to IDs, codes, and timestamps.
+- **Don't** promote a second chromatic accent. The gradient hues are chart series only, never chrome.
+- **Don't** pill operator buttons or reach for a radius outside `radius-scale` — the marketing pill CTA
+  stays behind; operator buttons take the `radius` default.
+- **Don't** wash a section in a gradient. Gradients were marketing atmosphere; they do not enter the shell.
+- **Don't** open detail or edit in a modal when the side panel fits — modals are for confirmations only.
+
+## 8 Responsive
+
+The operator sweep is 375 / 768 / 1024 / 1440; the single dark theme holds at every width.
+
+| 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:
+
+- Build dark. The base theme is the charcoal ladder — canvas `background`, surface-1 `card`, surface-2
+  `accent`/`muted` — with white ink and gray `muted-foreground`. There is no light interlude.
+- Accent only with the blue, and only as a signal: focus `ring`, links, active nav, selected indicators.
+  If the blue becomes a fill, the brand is drifting.
+- Make the one primary action a white button; everything else is neutral surface or status.
+- Mark selection and active state by lifting a surface step, not by tinting — "selected is lift, not color".
+- Keep hierarchy binary: ink `foreground` or gray `muted-foreground`, nothing between.
+- Set Inter as `font-sans` with its `cv`/`ss` character variants on; `font-mono` Geist Mono for IDs,
+  codes, timestamps; `tabular-nums` on every numeric column.
+- Track headings tight; keep buttons and cards on the `radius` default. Leave behind the GT Walsheim
+  hero display, the gradient spotlight cards, the pill CTA, and the 96px editorial section rhythm.
+
+```yaml design-primitives
+radius: 10px                                       # derived: brand default 15-20px card radius is marketing-soft; operator settles on the 10px form/list step, softer than a terminal but not a marketing panel
+shadow-intensity: 0.5                              # derived: brand elevates by surface lift + a light top-edge; shadow only lifts true overlays against near-black
+border-weight: 1px
+density-gap: 1
+density-inset: 1
+font-sans: Inter, system-ui, sans-serif           # rationale: brand's body face; the single sans slot serves body/table chrome and operator headings (GT Walsheim is hero-display only, stays behind)
+font-mono: Geist Mono, ui-monospace, SFMono-Regular, monospace   # derived: corpus specs no mono; Geist is named as a substitute family, its mono sibling pairs cleanly with Inter for IDs/codes/logs
+font-weight-normal: 400
+font-weight-strong: 600                            # derived: brand keeps a narrow weight band (display 500, Inter headline 700); operator strong lands at 600 so hierarchy rides size + tracking, not a heavy ramp
+heading-tracking: -0.02em                          # derived: brand's aggressive negative tracking carries as a tighter-than-default operator heading tracking; the hero -5.5px extreme stays behind
+duration-unit: 50ms                                # derived: corpus silent on motion; operator-standard base
+duration-fast: 100ms
+duration-normal: 150ms
+duration-slow: 250ms
+ease-default: cubic-bezier(0.4,0,0.2,1)            # derived: corpus silent on easing; functional operator standard
+contrast-boost: 1
+icon-stroke: 1.75                                  # derived: corpus silent on icons; refined operator stroke, one step under lucide's 2
+icon-size-base: 16px
+sidebar-width-expanded: 248px                      # derived: no sidebar in the marketing corpus; operator-standard shell
+sidebar-width-collapsed: 56px                      # derived: operator-standard icon rail
+topbar-height: 56px                                # rationale: the brand's top-nav height (56px) carried directly
+side-panel-width: 420px                            # derived: operator-standard shell (no side panel in the marketing corpus)
+side-panel-width-rich: 640px                       # derived: operator-standard content-heavy panel
+modal-width-max: 560px                             # derived: operator-standard modal cap
+form-max-width: 640px                              # derived: operator-standard form column
+table-row-height: 40px                             # derived: comfortable at standard density; dense archetypes step down via the surface catalog
+verbosity: default
+feedback: subtle
+density-tier: standard                             # derived: brand reads spacious/editorial, not terminal-dense; operator holds at standard for legibility, steps denser per archetype
+product-traits: [design-tool, builder, dashboard, saas, dev-tools]
+```
+
+```yaml lever-manifest
+version: 1
+fonts: { sans: "Inter, system-ui, sans-serif", mono: "Geist Mono, ui-monospace, SFMono-Regular, monospace" }
+color-tokens:
+  light:                                           # note: brand is categorically dark — the base map carries dark values (no light mode ships); this is the recorded doctrine-inversion override
+    background: "#090909"
+    foreground: "#ffffff"
+    card: "#141414"
+    card-foreground: "#ffffff"
+    muted: "#1c1c1c"
+    muted-foreground: "#999999"
+    border: "#262626"
+    input: "#262626"
+    ring: "#0099ff"
+    primary: "#ffffff"
+    primary-foreground: "#000000"
+    accent: "#1c1c1c"
+    accent-foreground: "#ffffff"
+    destructive: "#ef4444"                          # derived: corpus has no destructive red (only success green); operator-standard red legible on near-black
+    destructive-foreground: "#ffffff"
+    success: "#22c55e"
+    warning: "#f59e0b"                              # derived: corpus has no warning hue; operator-standard amber legible on near-black
+    popover: "#141414"
+    popover-foreground: "#ffffff"
+    secondary: "#141414"
+    secondary-foreground: "#ffffff"
+    chart-1: "#0099ff"                              # accent-blue as the primary data series
+    chart-2: "#6a4cf5"                              # gradient-violet, repurposed from marketing atmosphere to chart series
+    chart-3: "#d44df0"                              # gradient-magenta
+    chart-4: "#ff7a3d"                              # gradient-orange
+    chart-5: "#ff5577"                              # gradient-coral
+    sidebar: "#090909"                              # note: brand chrome sits on canvas; sidebar matches background, separated by sidebar-border
+    sidebar-foreground: "#ffffff"
+    sidebar-primary: "#0099ff"                      # derived: active-nav takes the blue signal (the brand marks selection/active with blue), not the white primary fill
+    sidebar-primary-foreground: "#ffffff"
+    sidebar-accent: "#141414"                       # hover/selected nav row lifts to surface-1
+    sidebar-accent-foreground: "#ffffff"
+    sidebar-border: "#1a1a1a"                        # hairline-soft, the brand's chrome divider
+    sidebar-ring: "#0099ff"
+spacing-scale: [2, 4, 8, 12, 16, 24, 32, 48, 64]
+radius-scale: [0, 4, 6, 10, 15, 9999]
+shadow-levels: [none, sm, md]
+motion: { durations: [100, 150, 250], easings: ["cubic-bezier(0.4,0,0.2,1)"] }
+icons: { family: lucide, stroke: 1.75 }
+accent-count: 1
+```

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

@@ -0,0 +1,220 @@
+---
+schema: design-md/v1
+product: HashiCorp
+provenance: library
+sourced: 2026-07-04
+---
+
+# HashiCorp — an operator reading of the pure-black, multi-product infrastructure system
+
+HashiCorp's web system is a confident, technical enterprise canvas: a pure-black ground, white engineered sans,
+charcoal cards on felt-thin hairlines, and per-product accent colors marking which tool a section is about. This
+entry is the *operator* reading — an internal tool (dashboard, run queue, policy console, log stream) in HashiCorp's
+language. Carried over: the pure-black canvas, charcoal surface ladder, white-on-dark ink, flat shadowless depth, the
+8px-not-pill radius, hashicorpSans's engineered voice (Inter the substitute). Left behind: the 80/56/40px hero
+display, the per-product chromatic identity cards, full-bleed CTA banners, and the 96px section rhythm.
+
+**Categorically dark, literally pure black, one accent not seven.** Two floors yield: the light-default floor (the
+categorically-dark exception — the default theme is dark and fills the required `light` slot) and the doctrine's ban
+on pure `#000000` surfaces (the brand's canvas *is* `#000000`, so the brand token wins); both are recorded plainly.
+The signature per-product palette is a *multi-product* marketing device — an internal tool is one product, so the
+operator reading spends the one product-neutral hue the brand uses on every page: accent-blue `#2b89ff`, repurposed
+as the chart categorical ramp, the one place multiple hues are legitimate (see §2, §7).
+
+## 1 Visual Theme
+
+Dark by default — pure black `background` (`#000000`) is the floor of every surface, no light counterpart.
+Emphatically flat: hierarchy comes from the charcoal surface ladder (canvas → surface-1 → surface-2), 1px hairline
+`border`, type weight, and white-on-black contrast — never shadow. A single accent, blue `primary` (`#2b89ff`), is
+held scarce: the one primary action, the focus `ring`, and the active-nav indicator, nothing else. The neutral ramp
+is a cool near-achromatic charcoal (white ink through `#b2b6bd` to `#656a76`), so the UI reads engineered and
+monochrome. Density is `standard` — the brand breathes more than a terminal, but the operator reading earns density.
+
+## 2 Color Roles
+
+Dark values (the manifest carries the exact hex in the required default slot). One accent — blue `primary` is the
+only chromatic hue that carries UI meaning; status hues speak only status; the product palette lives only in charts.
+
+| Role | Value | Allowed where |
+| --- | --- | --- |
+| `background` | pure-black canvas `#000000` | page floor and content area — the dominant surface |
+| `foreground` | white ink `#ffffff` | headlines and primary text |
+| `card` / `popover` | charcoal `#15181e` (surface-1) | cards, tiles, overlays — the first lift off black |
+| `secondary` / `accent` | charcoal-2 `#1f232b` (surface-2) | secondary-button fills; hover and selected rows and nav |
+| `muted` | faint well `#0c0e12` | inset tracks, disabled fills, quiet band tints |
+| `muted-foreground` | cool gray `#b2b6bd` | labels, captions, secondary text |
+| `border` / `input` | hairline `#3b3d45` (surface-3) | every separator, grid line, and field edge |
+| `primary` | accent-blue `#2b89ff` | the one primary action; active-nav indicator; the text-link |
+| `primary-foreground` | white `#ffffff` | text on the blue action |
+| `ring` | blue `#2b89ff` | the focus outline — unmistakable, because keyboard-first |
+| `destructive` | Consul red `#e62b1e` | destructive actions and error state only |
+| `success` / `warning` | Nomad green `#00ca8e` / Vault yellow `#ffcf25` | status signalling only, never chrome |
+
+The per-product palette — Terraform `#7b42bc`, Vault `#ffcf25`, Waypoint `#14c6cb`, Nomad `#00ca8e`,
+Boundary `#f24c53` — carries no UI role; it draws the chart categorical ramp (see §7).
+
+## 3 Typography
+
+One sans, one mono. `font-sans` is hashicorpSans, the brand's geometric-humanist face — body, UI, and headings all
+ride it; weight and tight tracking, not a second family, carry the display voice (Inter is the corpus's own open
+substitute). `font-mono` is the operator's reclaim — the marketing brand reserves mono for in-product, but the
+operator surface needs it for IDs, codes, timestamps, and log lines (JetBrains Mono). Numeric columns render
+`tabular-nums`. The display scale (80/56/40px) stays behind — an operator surface tops out at a 24px page title.
+
+| 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.35 | `font-weight-strong` |
+| body | UI + prose | 14px / 1.5 | `font-weight-normal` |
+| small | labels, meta, dense table | 13px / 1.4 | `font-weight-normal` |
+| caption | uppercase eyebrow | 12px / 1.4 | `font-weight-strong`, `+0.05em`, uppercase |
+
+The brand's weight hierarchy is deliberately small — 500 body / 600 emphasis / 700 display, no extremes, so the
+system reads engineered. Operator headings run the strong weight (600, the brand's headline weight) with tight
+negative tracking; the 700 display weights stay behind. Build hierarchy on size and weight, never a second family;
+keep the uppercase eyebrow above sections.
+
+## 4 Component Stylings
+
+Every recurring operator component composes from the primitives — no literal values.
+
+- **Button** — primary: filled blue `primary` on white `primary-foreground`, `radius` (8px), never a pill. Secondary: `secondary` charcoal-2 fill, `border`, `foreground`. Ghost: transparent, `accent` on hover. The brand's white-on-black CTA is a legitimate monochrome variant for a lone hero action, but the operator default spends the accent-blue so primary, focus, and active-nav read as one system.
+- **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus draws the blue `ring` at 2px, no glow (the brand's focus is a 1px accent-blue outline, firmed to 2px for keyboard-first work).
+- **Card** — `card` charcoal surface, 1px `border`, `radius` (cards step to 12px via the scale); depth is the surface lift off black, not shadow; inset by `density-inset`.
+- **Table row** — height `table-row-height`; `border` grid lines carry the grid; `accent` on hover; `tabular-nums` on numeric columns; selection tints `accent` with a blue `primary` left-indicator.
+- **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** — hairline `border`, `muted`/status fill, uppercase caption; status badges take `success` / `warning` / `destructive`, never `primary`. Pill radius is badges-only (the brand's product pills).
+
+## 5 Layout
+
+Base spacing unit 8px; the on-scale ramp is `2 · 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64` — the marketing 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` (64px, the brand's nav 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) and stepped denser per archetype by the surface catalog.
+
+## 6 Depth
+
+Flat and shadowless. Depth comes from the charcoal surface ladder and hairlines, not drop shadows:
+
+- **0 — canvas** `background` (`#000000`), no border.
+- **1 — panel / card** `card` (`#15181e`, surface-1) on a 1px `border`; the charcoal lift off pure black carries rank. Hover and selected rows step one further to `accent` (`#1f232b`, surface-2); chips and sub-nav ride the `border` charcoal-3 (`#3b3d45`).
+- **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns the faintest lift, enough to separate an overlay from the black canvas above a scrim. Rank is surface, border, and position — never a heavier shadow.
+
+The per-product chromatic card is a marketing *identity* device at a feature card's z-plane, not a depth level — it
+stays behind. Focus is a 2px blue `ring` outline (never a glow), visible on every interactive element. Three
+z-levels: content, chrome, overlay.
+
+## 7 Do's & Don'ts
+
+- **Do** anchor every surface on the pure-black canvas and carry hierarchy with the black-plus-charcoal ladder, hairlines, weight, and size; the black `#000000` is deliberate — not a near-black to be softened.
+- **Do** reserve blue `primary` for the primary action, the focus `ring`, and the active-nav indicator — nothing else. It is the one product-neutral chromatic hue the brand spends on every page.
+- **Do** run headings the brand sans (hashicorpSans; Inter the substitute) at 600 with tight negative tracking, one family across the whole hierarchy.
+- **Do** apply `tabular-nums` to numeric columns and `font-mono` to IDs, codes, timestamps, and log lines — the operator surface reclaims the mono the marketing brand withholds.
+- **Do** draw chart series from the product palette (Terraform purple, Vault yellow, Nomad green, Boundary coral) — the one place multiple hues are legitimate.
+- **Don't** rebuild the per-product accent system as UI chrome, fill large surfaces with a product hue, or set body text in one — that palette is a multi-product marketing device; an internal tool is one product with one accent.
+- **Don't** pill controls or reach for a radius outside `radius-scale` — the button/input radius is 8px.
+- **Don't** signal elevation with drop shadows, or adapt the shell to a light canvas — this brand has no light surface.
+- **Don't** pair a display-only sans with a different body family — HashiCorp is one family across the full hierarchy.
+
+## 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 |
+
+## 9 Agent Prompt Guide
+
+Directives the emitting agent follows verbatim:
+
+- Wear the pure-black `#000000` canvas by default; this brand is categorically dark — no light surface to fall back to. Cards and panels are the charcoal surface-1 lift, not white; depth is that ladder plus hairlines, never shadow.
+- Spend blue once per surface: the primary action, the focus `ring`, the active-nav indicator. If two things want the blue, one is not primary. The per-product palette (Terraform purple, Vault yellow, Waypoint cyan, …) stays behind as a marketing identity device — reuse it only as the chart categorical ramp, never as UI accents.
+- Headings ride the brand sans (hashicorpSans; Inter the open substitute) at 600 with tight negative tracking; the 80/56/40px display scale stays behind — operator headings top out at 24px. Keep the uppercase eyebrow above meaningful sections.
+- Every numeric column is `tabular-nums`; every ID / code / timestamp / log line is `font-mono` (JetBrains Mono) — the operator surface reclaims the mono the marketing brand reserves for in-product. Detail and edit go in the side panel beside the work; the blue `ring` focus outline is always visible for keyboard work.
+- Leave behind: the 80px hero display, the per-product chromatic identity cards, full-bleed CTA banners, and the 96px section rhythm — marketing scale, not operator chrome.
+
+```yaml design-primitives
+radius: 8px                                        # corpus: brand button/input/list radius (rounded.md 8px); cards step to 12px via the scale; pill is badges-only
+shadow-intensity: 0.2                              # derived: brand is shadowless on dark — depth is surface lift; only true overlays earn the faintest lift on the black canvas
+border-weight: 1px
+density-gap: 1                                     # derived: standard tier — brand breathes more than a terminal (relaxed body, 96px sections); archetypes step denser
+density-inset: 1                                   # derived: matches the standard density-gap for coherent component insets
+font-sans: Inter, system-ui, sans-serif           # derived: hashicorpSans is proprietary; Inter is the corpus's own first-choice open substitute (closest geometric proportions)
+font-mono: JetBrains Mono, ui-monospace, monospace # derived: marketing brand withholds mono (in-product only); operator IDs/logs need one — JetBrains Mono
+font-weight-normal: 400                            # derived: brand marketing body is 500; dense operator tables read cleaner at 400, heading weight carries the engineered voice
+font-weight-strong: 600                            # corpus: headline / card-title / subhead / eyebrow all 600; the 700 display weights top out above operator scale and stay behind
+heading-tracking: -0.02em                          # corpus: signature tight negative display tracking (-0.4 to -0.6px at operator heading sizes ≈ -0.02em)
+duration-unit: 50ms                                # derived: corpus documents no motion (known gap); functional operator base
+duration-fast: 100ms                               # derived: corpus silent; functional tempo
+duration-normal: 150ms                             # derived: corpus silent; standard functional tempo
+duration-slow: 250ms                               # derived: corpus silent; overlay / panel transition
+ease-default: cubic-bezier(0.4,0,0.2,1)            # derived: corpus silent; standard functional ease
+contrast-boost: 1                                  # derived: the solid #3b3d45 hairline reads clearly on pure black; borders carry the grid, no boost
+icon-stroke: 1.75                                  # derived: corpus silent on icons; refined operator stroke one step under lucide's 2, matching the engineered voice
+icon-size-base: 16px                               # derived: corpus silent on icon size; operator default
+sidebar-width-expanded: 248px                      # derived: brand has no app sidebar (marketing top nav); standard operator rail
+sidebar-width-collapsed: 56px                      # derived: standard operator icon rail
+topbar-height: 64px                                # corpus top-nav height (64px)
+side-panel-width: 420px                            # derived: corpus silent; standard operator detail panel
+side-panel-width-rich: 640px                       # derived: content-heavy detail panel
+modal-width-max: 560px                             # derived: corpus's CTA banners are full-bleed marketing; operator confirmation cap
+form-max-width: 640px                              # derived: brand max content ~1280px is marketing; operator form cap
+table-row-height: 40px                             # derived: standard operator row; dense archetypes step down via the surface catalog
+verbosity: default
+feedback: subtle                                   # derived: brand is confident and quiet; functional feedback only
+density-tier: standard                             # derived: brand's relaxed body and 96px sections read more spacious than a terminal; the infra-operator reading is standard, archetypes step denser
+product-traits: [dev-tools, infrastructure, dashboard, admin]
+```
+
+```yaml lever-manifest
+version: 1
+fonts: { sans: "Inter, system-ui, sans-serif", mono: "JetBrains Mono, ui-monospace, monospace" }
+color-tokens:
+  light:                                # categorically-dark brand: the default-worn theme is dark and fills this required default slot; there is no light surface, and the canvas is pure #000000 (brand token wins over the doctrine ban)
+    background: "#000000"
+    foreground: "#ffffff"
+    card: "#15181e"
+    card-foreground: "#ffffff"
+    muted: "#0c0e12"                    # derived: a faint well between the black canvas and the charcoal card, for inset tracks and quiet band tints
+    muted-foreground: "#b2b6bd"
+    border: "#3b3d45"
+    input: "#3b3d45"
+    ring: "#2b89ff"
+    primary: "#2b89ff"
+    primary-foreground: "#ffffff"
+    accent: "#1f232b"
+    accent-foreground: "#ffffff"
+    destructive: "#e62b1e"
+    destructive-foreground: "#ffffff"
+    success: "#00ca8e"
+    warning: "#ffcf25"
+    popover: "#15181e"
+    popover-foreground: "#ffffff"
+    secondary: "#1f232b"
+    secondary-foreground: "#ffffff"
+    chart-1: "#2b89ff"                  # accent blue — primary data series
+    chart-2: "#7b42bc"                  # Terraform purple — per-product palette repurposed as the chart categorical ramp
+    chart-3: "#00ca8e"                  # Nomad green
+    chart-4: "#ffcf25"                  # Vault yellow
+    chart-5: "#f24c53"                  # Boundary coral
+    sidebar: "#000000"                  # derived: brand nav rides the canvas; the hairline sidebar-border carries the seam
+    sidebar-foreground: "#b2b6bd"       # derived: resting nav labels dim to brand secondary ink, brightening on active
+    sidebar-primary: "#2b89ff"          # derived: blue active-nav indicator
+    sidebar-primary-foreground: "#ffffff"
+    sidebar-accent: "#1f232b"           # derived: hover / selected nav lift (surface-2)
+    sidebar-accent-foreground: "#ffffff"
+    sidebar-border: "#3b3d45"
+    sidebar-ring: "#2b89ff"
+spacing-scale: [2, 4, 8, 12, 16, 24, 32, 48, 64]
+radius-scale: [0, 4, 6, 8, 12, 16, 9999]
+shadow-levels: [none, sm, md]
+motion: { durations: [100, 150, 250], easings: ["cubic-bezier(0.4,0,0.2,1)"] }
+icons: { family: lucide, stroke: 1.75 }
+accent-count: 1
+```