@r1z4x/tezgah 1.9.2 → 1.11.0

package/skills/hallmark/references/themes/ink.md

@@ -0,0 +1,106 @@
+---
+name: Ink
+slug: ink
+genre: editorial
+paper: light 99.5 100
+display: grotesk-sans Epilogue
+accent: chromatic-teal 190
+posture: restrained
+keywords: library, lending, community, civic, notice board, catalogue, rota, volunteer, non-profit, neighbourhood, borrow, tools, repair, membership, events, local, competent, monochrome
+material: white paper, a black with no hue, Epilogue 700 over Epilogue 400, hairline rules and state pills, one teal that means in
+photo: muted
+pictured: Catalogue, Settled hero
+---
+
+# Ink
+
+A notice printed in plain black: white paper, a black with no hue, Epilogue at 700 for the head and 400 for everything you read, hairline rules, and one teal that means in or open. Its photographs show the things on the shelves, in daylight with the colour turned down. It feels competent, local and kind, the way a well-run community desk does. It is not a cold corporate monochrome and not a warm cream editorial page.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(99.5% 0.003 100); --color-paper-2: oklch(97% 0.004 100); --color-paper-3: oklch(94% 0.006 100);
+  --color-ink: oklch(16% 0 0); --color-ink-2: oklch(28% 0 0); --color-muted: oklch(44% 0 0);
+  --color-rule: oklch(89% 0.004 100); --color-rule-2: oklch(93.5% 0.003 100);
+  --color-accent: oklch(50% 0.095 188); --color-accent-ink: oklch(99.5% 0.003 100); --color-accent-soft: oklch(93% 0.05 190); --color-accent-soft-ink: oklch(27% 0.045 190);
+  --color-focus: oklch(50% 0.095 188);
+  --font-display: "Epilogue", ui-sans-serif, system-ui, sans-serif; --font-body: var(--font-display);
+  --font-outlier: "IBM Plex Mono", ui-monospace, monospace;
+  --radius-card: 12px; --radius-pill: 999px; --rule-hair: 1px;
+  --shadow-card: 0 20px 40px oklch(20% 0 0 / 0.16);
+  --tracking-display: -0.04em; --display-weight: 700;
+}
+```
+
+Two colourways, both light, stated in the stamp (`ink: paper` or `ink: board`).
+
+| Colourway | Ground and teal |
+| --- | --- |
+| `paper` (default) | the block above: white, hueless black, teal at 50% |
+| `board` | notice-board yellow `oklch(93% 0.10 95)` with rules at `oklch(84% 0.10 92)`, ink `oklch(20% 0.02 80)`, teal deepened to `oklch(46% 0.078 190)`; wells and tags turn white |
+
+## Type
+
+- **Display:** Epilogue 700, `--tracking-display`, line-height 1.0 at hero size and 1.05 below, sentence case, roman; a figure (a count, a price, an hour) takes the same setting, a step larger than the head beside it.
+- **Body:** Epilogue 400 at 16 to 17px, line-height 1.55, in `--color-ink-2` (muted greys tire on white); the name in a row, links and tags at 600.
+- **Labels, captions, table heads, meta:** Epilogue 400 a step smaller, sentence case, untracked; never mono.
+- **Outlier:** IBM Plex Mono only inside code and on figures that compare in a column (loan counts, a card number, times on a rota). Large figures and prices are Epilogue 700 in ink; the teal marks only what is in or open.
+
+## Surfaces
+
+- Rules: a list or a table opens on a 1px `--color-ink` rule and continues on `--color-rule` hairlines between its rows; `--color-rule-2` parts quieter rows.
+- Radius 12px on wells and photographs, 10px on controls and inputs, pills on tags.
+- Flat paper: a well is `--color-paper-2` with a 1px `--color-rule` edge; `--shadow-card` sits only under something that floats over the page (a menu, a dialog), never under a surface at rest.
+- Bands: a `--color-paper-2` band or an ink band with paper text. Two a page at most; never a teal field.
+- Photographs: the things and the street that shares them, in plain daylight at arm's length: a pegboard of tools, a ladder against a wall, a neighbour carrying something home, seen from behind; no face to the lens, no brand mark to the camera. The colour is turned down (the `photo:` muted) so the teal stays the one colour that means anything; 12px radius, a 1px `--color-rule` hairline, no shadow. A thing's name and its state tag sit under its picture, never on it.
+- No texture.
+
+## Range
+
+- **The shelf as a ruled list:** every thing a row under the ink rule, its name at 600, one line on what it is, its state pill at the row's end, a filter field that narrows the rows as you type.
+- **Steps as a notice:** how it works as three or four numbered stages across the columns, each numeral in Epilogue 700 at display size over a hairline, the stage that means in carrying the pale teal pill.
+- **A timetable of opening days:** the next dates as rows, the hours in each, the next one inked; the dates come from the clock, never typed in.
+- **Figures in plain black:** a count, a fee and the hours set large in Epilogue 700 on a `--color-paper-2` well, the one that means open in teal.
+
+## Controls
+
+- The pair: an ink-filled button with paper text beside a 1px `--color-rule` bordered button on `--color-paper-2`, both at 10px radius in Epilogue 600.
+- Tags carry state and nothing else: in is pale teal (`--color-accent-soft`) with `--color-accent-soft-ink`, out is outlined in the rule colour, on is ink-filled.
+- Teal means in or open: a tag, a large figure, a link's hover, the focus ring. Links are ink at 600, underlined, teal on hover.
+
+## Motion
+
+Nothing moves but state: a filter applies as you type, a tag changes state on click, an underline turns teal over `--dur-micro`. No marquee, no reveal, no counter.
+
+## Voice
+
+The desk volunteer's: what is in, when it is back, who is on Saturday. Short, kind, exact, never institutional.
+
+## Do-nots
+
+- Never a second colour: teal means in, and out is an outline, never red.
+- Never a warm black. The ink has no hue, and the page says so: `waive 22 · ink and greys at zero chroma · a notice board is printed in plain black`.
+- Never a teal field or teal running text; teal is a state, not a surface.
+- Never a resting shadow; the paper stays flat.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Epilogue:wght@400;600;700&family=IBM+Plex+Mono:wght@400&display=swap" rel="stylesheet">
+```
+
+```css
+h1, h2, h3 { font-weight: var(--display-weight); line-height: 1.02; }
+.btn { border: var(--rule-hair) solid var(--color-rule); border-radius: 10px; padding: var(--space-sm) var(--space-md); font-weight: 600; background: var(--color-paper-2); color: var(--color-ink); }
+.btn--primary { background: var(--color-ink); border-color: var(--color-ink); color: var(--color-paper); }
+.tag { display: inline-flex; padding: var(--space-2xs) var(--space-sm); border-radius: var(--radius-pill); font-size: var(--text-xs); font-weight: 600; background: var(--color-paper-3); }
+.tag--in { background: var(--color-accent-soft); color: var(--color-accent-soft-ink); }
+.tag--out { background: transparent; box-shadow: inset 0 0 0 var(--rule-hair) var(--color-rule); color: var(--color-muted); }
+.tag--on { background: var(--color-ink); color: var(--color-paper); }
+.ruled { border-top: var(--rule-hair) solid var(--color-ink); } .ruled > * { border-bottom: var(--rule-hair) solid var(--color-rule); }
+.well { background: var(--color-paper-2); border: var(--rule-hair) solid var(--color-rule); border-radius: var(--radius-card); }
+.photo { border-radius: var(--radius-card); outline: var(--rule-hair) solid var(--color-rule); outline-offset: -1px; }
+a { font-weight: 600; } a:hover { text-decoration-color: var(--color-accent); }
+::selection { background: var(--color-accent-soft); color: var(--color-accent-soft-ink); }
+```

package/skills/hallmark/references/themes/kiln.md

@@ -0,0 +1,108 @@
+---
+name: Kiln
+slug: kiln
+genre: atmospheric
+paper: dark 13 40
+display: high-contrast-serif Boska
+accent: warm 45
+posture: full-palette
+keywords: kiln, ceramics, pottery, firing, glaze, heat, temperature, ceramics studio, craft, sensor, monitor, hardware, iot, warmth, dark, glow, schedule, workshop
+material: near-black ground, cream ink, Boska over Geist, smoked wells, photographs lit by the work, a heat ramp that marks temperature, one ember signal
+photo: warm sepia=50 sat=-12 con=8 exp=-6
+pictured: Workbench, Stage hero
+---
+
+# Kiln
+
+A dark workshop with the kiln door open a crack: a near-black ground, cream ink, Boska's cut high-contrast serif over a plain Geist, and heat only where something is hot. The photographs carry the fire; a ramp from ash through oxblood, ember and amber to white heat colours a temperature as it climbs. Warm in one place, cold everywhere else. It is not a dark luxury page with an orange button, and not a glowing gradient poster.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(13% 0.012 40); --color-paper-2: oklch(17.5% 0.016 40); --color-paper-3: oklch(22% 0.018 40);
+  --color-ink: oklch(94% 0.02 80); --color-ink-2: oklch(84% 0.025 70); --color-muted: oklch(72% 0.03 60);
+  --color-rule: oklch(96% 0.01 80 / 0.12);
+  --color-accent: oklch(70% 0.2 45); --color-accent-ink: oklch(14% 0.02 40); --color-focus: oklch(76% 0.19 56);
+  --heat-0: oklch(12% 0.012 40); --heat-1: oklch(22% 0.07 22); --heat-2: oklch(40% 0.16 27); --heat-3: oklch(60% 0.21 36);
+  --heat-4: oklch(76% 0.19 56); --heat-5: oklch(89% 0.14 78); --heat-6: oklch(98% 0.04 95);
+  --font-display: "Boska", "Iowan Old Style", Georgia, serif; --font-body: "Geist", ui-sans-serif, system-ui, sans-serif;
+  --font-outlier: "Geist Mono", ui-monospace, monospace;
+  --radius-card: 28px; --radius-well: 16px; --radius-pill: 999px; --rule-hair: 1px;
+  --shadow-card: 0 50px 90px -30px oklch(8% 0.01 40 / 0.5);
+  --tracking-display: -0.02em; --display-weight: 500;
+}
+```
+
+Three colourways, stated in the stamp (`kiln: ember`).
+
+| Colourway | Ground, ink, accent |
+| --- | --- |
+| `ember` (default) | the block above |
+| `bisque` | ground `oklch(96.5% 0.014 80)`, ink `oklch(20% 0.02 40)`, accent `oklch(54% 0.17 62)` with the ground as its text; the ramp starts at `oklch(90% 0.035 75)`; wells turn bone |
+| `reduction` | ground `oklch(21% 0.06 22)`, ink `oklch(95% 0.02 85)`, accent `oklch(84% 0.12 62)`; the ramp begins at the ground |
+
+## Type
+
+- **Display:** Boska 500, `--tracking-display`, line-height 1.04, sentence case, roman, one colour per head; a statement set in it may run to `--text-display` at line-height 1.0.
+- **Figures:** a temperature, a firing time or the price that carries the story is Boska 500, lining and tabular, at -0.03em, its unit (°C, h, £) in the same face; a lone figure may run twice the hero head.
+- **Body:** Geist 400 and 500 at 16 to 18px, line-height 1.55.
+- **Labels, captions, axis ticks, table heads:** Geist 500 a step smaller, sentence case, untracked, in `--color-muted`. Geist Mono only inside code.
+
+## Surfaces
+
+- 1px `--color-rule` between rows, on a well's edge and on a chart's grid; no rule brighter than that.
+- Radius 28px on photographs and built screens, scaled down with the viewport; `--radius-well` on wells and inputs; pills on controls.
+- Wells are smoked: `--color-paper-2` a clear step above the ground, a 1px rule edge, no shadow, never blurred, never nested. `--shadow-card`, a deep low drop, only under a built screen standing on the ground or a photograph, never with a ring.
+- Heat marks temperature and nothing else: the ramp colours a firing curve in steps, each band of degrees its own colour, oxblood low to white heat at the peak, and a range track (three stops). It never fills a box, a band, a slot or the ground, and no text sits on it.
+- Bands: a `--color-paper-2` band, two a page at most.
+- Photographs: the work, close and in low light: a kiln at temperature, a loaded kiln, glaze, pots on a shelf, hands in clay, lit by the kiln, a bench lamp or a window, shadows falling into the ground. A 28px frame with a 1px inset ring of cream at 8%; type on one sits only on its dark side, over a paper scrim at 40 to 65%.
+
+## Range
+
+- A firing schedule as rows: each segment's rate and target in Boska figures, keyed by a short bar of the ramp step its target reaches.
+- A reading or a warning set as a statement: Boska at `--text-display` across ten columns, cream on the ground, the hour and the kiln beside it in Geist; nothing else on the screen.
+- A log as a full-width table: date, firing and cone in Geist, the peak in Boska keyed to its ramp step, a sparkline of the whole curve per row in `--color-ink-2`.
+- A price or a temperature as one figure on a smoked band, the action beside it.
+
+## Controls
+
+- The pair: an ember pill (`--color-accent` with `--color-accent-ink` text, Geist 500), 50px tall, beside a ghost pill with a 1px inset `--color-rule` ring and cream text.
+- Inputs are smoked wells at 16px radius; a range input runs a 2px track filled along the ramp under a 28px ember thumb.
+- Ember is only ever a fill: the primary, a thumb, the live point on a curve, the focus ring in `--color-focus`. Every letter stays cream.
+
+## Motion
+
+Slow and thermal: colour changes run `--dur-long` on `--ease-out`, controls answer over `--dur-short`. Nothing pulses, flickers or glows on hover.
+
+## Voice
+
+Calm and physical, in a potter's words: the cone, the degrees, the hour, the load. Name the firing, never the feeling.
+
+## Do-nots
+
+- Never the ramp as a fill: no heat gradient behind text, on the ground, in a slot or across a band.
+- Never orange type; the ember is a fill, and every letter stays cream.
+- Never a brown or warm-lit ground; it stays near-black so the heat has somewhere to rise from.
+- Never a bright, flat-lit photograph or a pot on white seamless.
+- Never a third hue beside the ramp.
+- Never a photograph on every screen: the fire lives in the curve and the figures too.
+
+## Build hint
+
+```html
+<link href="https://api.fontshare.com/v2/css?f[]=boska@500&display=swap" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Geist:wght@400;500&display=swap" rel="stylesheet">
+```
+
+```css
+h1, h2, h3 { font-weight: var(--display-weight); line-height: 1.04; }
+.btn { display: inline-flex; align-items: center; min-height: 50px; padding: 0 var(--space-lg); border-radius: var(--radius-pill); font-weight: 500; transition: background-color var(--dur-short) var(--ease-out); }
+.btn--primary { background: var(--color-accent); color: var(--color-accent-ink); }
+.btn--ghost { background: transparent; color: var(--color-ink); box-shadow: inset 0 0 0 var(--rule-hair) var(--color-rule); }
+.well { background: var(--color-paper-2); border: var(--rule-hair) solid var(--color-rule); border-radius: var(--radius-well); }
+.figure { font-family: var(--font-display); font-weight: var(--display-weight); letter-spacing: -0.03em; font-variant-numeric: lining-nums tabular-nums; }
+.photo { border-radius: min(2vw, var(--radius-card)); outline: var(--rule-hair) solid color-mix(in oklab, var(--color-ink) 8%, transparent); outline-offset: -1px; }
+.scrim { background: linear-gradient(to top, color-mix(in oklab, var(--color-paper) 65%, transparent), transparent 55%); }
+.range-track { background: linear-gradient(to right, var(--heat-2), var(--heat-4), var(--heat-6)); }
+::selection { background: color-mix(in oklab, var(--color-accent) 35%, transparent); }
+```

package/skills/hallmark/references/themes/loom.md

@@ -0,0 +1,106 @@
+---
+name: Loom
+slug: loom
+genre: editorial
+paper: light 95 85
+display: roman-serif Libre Caslon Display
+accent: cool 266
+posture: committed
+keywords: weaving, textile, linen, wool, weaving studio, cloth, craft, atelier, handmade, natural, indigo, fabric, by the metre, workshop, maker, slow, commission, interiors, samples
+material: ecru paper with sand steps, warm near-black ink, Libre Caslon Display heads and prices over Hanken Grotesk, thin rules and one ink rule, cloth photographed close in window light, one deep indigo
+photo: natural sat=-12 con=-4
+pictured: Narrative Workflow, Poster hero
+---
+
+# Loom
+
+A weaving studio speaking quietly: ecru paper, Caslon cut for display with a book's calm over a plain Hanken Grotesk, thin rules, and one deep indigo, the colour of dyed yarn, that arrives as a band or a button and never as a wash. The cloth is photographed close in window light; nothing is drawn to stand in for it. It reads crafted because the page is ruled like a pattern book. It is not a cream-and-terracotta craft page and not a linen photograph behind everything.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(95.5% 0.014 85); --color-paper-2: oklch(92% 0.022 84); --color-paper-3: oklch(85% 0.032 80);
+  --color-ink: oklch(21% 0.012 60); --color-ink-2: oklch(31% 0.012 60); --color-muted: oklch(46% 0.014 62);
+  --color-rule: oklch(83% 0.022 84); --color-rule-ink: oklch(21% 0.012 60);
+  --color-accent: oklch(34% 0.115 267); --color-accent-2: oklch(43% 0.125 267); --color-accent-ink: oklch(95.5% 0.014 85); --color-focus: oklch(43% 0.15 267);
+  --font-display: "Libre Caslon Display", "Libre Caslon Text", ui-serif, Georgia, serif; --font-body: "Hanken Grotesk", ui-sans-serif, system-ui, sans-serif;
+  --font-outlier: "DM Mono", ui-monospace, monospace;
+  --radius-card: 0; --radius-pill: 0; --rule-hair: 1px; --rule-ink: 2px;
+  --shadow-card: none;
+  --tracking-display: -0.01em; --display-weight: 400;
+}
+```
+
+Three colourways, stated in the stamp (`loom: ecru`).
+
+| Colourway | Paper, ink, indigo |
+| --- | --- |
+| `ecru` (default) | the block above |
+| `indigo` | paper `oklch(34% 0.10 266)`, ink ecru `oklch(95% 0.015 85)`, rule `oklch(50% 0.09 266)`; the button turns ecru with indigo text |
+| `oat` | paper `oklch(88% 0.04 80)`, ink `oklch(15% 0.01 60)`, rules in the ink at 1px, indigo `oklch(38% 0.10 266)` kept to a rule and a button |
+
+## Type
+
+- **Display:** Libre Caslon Display 400 for the h1, every h2 and any price or figure at 40px or more, `--tracking-display`, line-height 1.04 (1.0 on a hero head of two lines), sentence case, roman. The face has one weight and no italic; never synthesise either, and never set it under 32px, where its hairlines break up.
+- **Item titles (h3):** Hanken Grotesk 500 at `--text-title`, line-height 1.25, the ink.
+- **Body:** Hanken Grotesk 400 and 500 at 16 to 18px, line-height 1.5; the lead in `--color-muted`.
+- **Labels, captions, tags, table heads:** Hanken Grotesk 500 a step smaller, sentence case, untracked, in `--color-muted`. DM Mono only for figures that compare in a row (widths in centimetres, grams per metre, metres on the beam) and for code.
+
+## Surfaces
+
+- 1px rules: `--color-rule` between rows; a `--rule-ink` line in the ink above a list's first row, under a table's head and under the nav; no borders on wells.
+- Square everywhere: radius 0 on wells, photographs, inputs and controls.
+- Flat: depth is a paper step, `--color-paper-2` as a band or well and sand (`--color-paper-3`) as a deeper well; nothing casts a shadow.
+- Bands: a `--color-paper-2` band, or one indigo band (`--color-accent` ground, `--color-accent-ink` text). Two a page at most.
+- Photographs: the cloth and the loom, close and in side light from a window: the weave filling the frame, warp on the beam, a folded length, yarn on cones; the studio wide once. Colour kept true and softened a little (the `photo:` line). Square, an inset outline of ink at 8%, no shadow; captions beneath in the label style carry a fact (the fibre, the price a metre); type sits on a photograph only over an ink scrim at its calmest edge.
+- No texture: the photographs carry the weave.
+
+## Range
+
+- **The specification as ruled rows:** fibre, width, weight, lead time and price as a pattern-book sheet, the label on the left in Hanken, the value in Caslon at title size and up, the price row set largest; an ink rule above the first row.
+- **The price as a figure:** the price a metre in Caslon at display size beside the sum worked out in rows (metres, rate, total), on a sand well or on the indigo band where the order is placed.
+- **Time as a ruled scale:** a lead time drawn as weeks on a hairline scale in DM Mono, the span the cloth is on the loom as a sand bar and the window it lands in as an indigo line; a chart of the prompt's own weeks, never a drawn thread.
+- **A comparison in two columns:** linen beside wool, parted by one ink rule, rows aligned.
+
+## Controls
+
+- The pair: an indigo-filled square button in Hanken Grotesk 500 with ecru text beside a text link with a 2px bottom border in the text colour. On indigo the button turns ecru with indigo text.
+- Links lift their 2px underline into `--color-accent` on hover; inputs are square with a 1px `--color-rule` border and the indigo focus ring, ecru on the indigo band.
+- Indigo is a fill or a line: the primary, one band, an underline on hover, the focus ring.
+
+## Motion
+
+Nothing moves except state: an underline turns indigo and the primary lightens to `--color-accent-2`, over `--dur-short` on `--ease-out`, once.
+
+## Voice
+
+The weaver speaking plainly at the loom: the fibre, the metre, the weeks, the room the cloth is for. Prices and times said once, nothing sold hard.
+
+## Do-nots
+
+- Never indigo as a page wash or a tint on the ecru colourway; it is a band, a line or a fill.
+- Never a mono label voice; widths and weights earn the mono, the captions do not.
+- Never a ruler, a warp or a thread pattern drawn on the page; the cloth is photographed and the metre priced in type.
+- Never a warm accent (rust, clay, terracotta) next to the ecru; sand is a paper, not an accent.
+- Never a radius, a shadow or a soft card; Loom is rules, squares and paper steps.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Libre+Caslon+Display&family=Hanken+Grotesk:wght@400;500&family=DM+Mono:wght@400;500&display=swap" rel="stylesheet">
+```
+
+```css
+h1, h2, h3 { font-weight: 400; line-height: 1.04; font-synthesis: none; }
+.num { font-family: var(--font-outlier); font-variant-numeric: tabular-nums; }
+.btn { display: inline-flex; align-items: center; padding: var(--space-md) var(--space-lg); font: 500 var(--text-sm)/1 var(--font-body); background: var(--color-accent); color: var(--color-accent-ink); transition: background-color var(--dur-short) var(--ease-out); }
+.btn:hover { background: var(--color-accent-2); }
+.link { font-weight: 500; padding-block: var(--space-2xs); border-bottom: 2px solid currentColor; text-decoration: none; transition: border-color var(--dur-short) var(--ease-out); }
+.link:hover { border-color: var(--color-accent); }
+.photo img { outline: 1px solid color-mix(in oklab, var(--color-ink) 8%, transparent); outline-offset: -1px; }
+.photo figcaption { margin-top: var(--space-sm); font: 500 var(--text-sm)/1.4 var(--font-body); color: var(--color-muted); }
+.band--indigo { background: var(--color-accent); color: var(--color-accent-ink); }
+.band--indigo .btn { background: var(--color-paper); color: var(--color-accent); }
+.band--indigo :focus-visible { outline-color: var(--color-accent-ink); }
+```

package/skills/hallmark/references/themes/lumen.md

@@ -0,0 +1,103 @@
+---
+name: Lumen
+slug: lumen
+genre: atmospheric
+paper: dark 12.5 290
+display: roman-serif Instrument Serif
+accent: warm 62
+posture: restrained
+keywords: inference, model, llm, ai tool, agent, voice, synthesis, api, gpu, serverless, runtime, tokens, latency, open models, developer, research lab, ml platform, dev tools, premium
+material: violet-black ground, near-white ink, lowercase Instrument Serif heads a step large over Geist and Geist Mono, hairline wells, a faint blueprint grid, one molten brass signal and one rose verb
+photo: duotone paper ink-2
+pictured: Map / Diagram, Settled hero
+---
+
+# Lumen
+
+A night console with a literary voice: a violet-black ground, near-white ink, Instrument Serif set all in lowercase and a step large over Geist, hairline wells and one molten brass signal. Cool dark, warm light: the warmth is rationed to the brass and one rose verb, so the page reads engineered and quietly lit at once. The product is the picture. It is not a neon dark mode, an orb on black, a glowing object, a purple poster or a serif magazine.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(12.5% 0.027 290); --color-paper-2: oklch(16% 0.03 290); --color-paper-3: oklch(20% 0.032 290);
+  --color-ink: oklch(96% 0.01 300); --color-ink-2: oklch(85% 0.017 298); --color-muted: oklch(69% 0.026 295);
+  --color-rule: oklch(27% 0.034 290); --color-rule-2: oklch(36% 0.04 292); --rule-blueprint: oklch(96% 0.01 300 / 0.05);
+  --color-accent: oklch(80% 0.15 62); --color-accent-2: oklch(72% 0.15 12); --color-accent-ink: oklch(14% 0.028 290);
+  --color-live: oklch(80% 0.13 155); --color-focus: oklch(80% 0.15 62);
+  --font-display: "Instrument Serif", ui-serif, Georgia, serif; --font-body: "Geist", ui-sans-serif, system-ui, sans-serif;
+  --font-outlier: "Geist Mono", ui-monospace, monospace;
+  --radius-card: 10px; --radius-pill: 999px; --rule-hair: 1px;
+  --shadow-card: 0 28px 64px -30px oklch(4% 0.02 290 / 0.8);
+  --tracking-display: -0.015em; --display-weight: 400;
+}
+```
+
+A second drop, `day`: bone `oklch(97% 0.008 290)` under `oklch(18% 0.02 290)`, an indigo `oklch(46% 0.24 268)` signal with bone text, the verb in `oklch(56% 0.16 18)`. The stamp states the drop (`lumen: night`).
+
+## Type
+
+- **Display:** Instrument Serif 400, roman, all lowercase, `--tracking-display`, line-height 0.95 to 1.02. The face is narrow and light, so it sets one step large: section heads at `--text-display-s`, the hero head at its cap and beyond. Lowercase is the register for heads, nav, controls and labels; prose keeps sentence case so a model name survives.
+- **Body:** Geist 400 and 500, `tabular-nums` wherever a figure appears.
+- **Labels, captions, table heads:** Geist 400 a step smaller, lowercase, untracked, `--color-muted`.
+- **Readouts and code:** Geist Mono 400 at 13px, lowercase, untracked: a measured value with its unit, a status, a model id, code. The mono is the machine speaking, never a label voice.
+- **The verb:** the one accented word on the page, in the hero head only, always a verb, in `--color-accent-2` with a 1px underline that draws in (stamp `waive 38iii`).
+
+## Surfaces
+
+- Hairlines contain: 1px `--color-rule` on wells, rows and inputs, `--color-rule-2` on a control's edge; 10px radius on surfaces, pills on controls and tags.
+- Depth is a lightness step from paper to paper-3; a surface that must lift trades its hairline for `--shadow-card` in the ground's own dark. Never a glow, a halo or a coloured shadow.
+- Bands: `--color-paper-2`, two a page at most; no accent field, and a night page never takes a bone band.
+- Photographs: one at most, a 21:9 band of the machines the work runs on (an aisle of racks, cabling, a lit rack face), printed in the ground's violet, 10px radius and a 1px rule, a caption naming the hardware beneath; no head on it.
+- Texture: the blueprint grid, 1px `--rule-blueprint` lines on a 48px pitch, inside one well or band and never under running text (stamp `waive 47c`). No glass, no blur, no generated object standing in for the product.
+
+## Range
+
+- **A path as a diagram:** a real system drawn in hairline nodes and connectors: the slow path in muted mono, the product's path ruled in brass, each node a step the request really takes.
+- **The product's own surface:** a request beside its response in one well split by a hairline, lowercase tabs, the status beneath as Geist Mono readouts; or a console screen at full size with its live state in `--color-live`.
+- **A chart in a well:** over the blueprint grid, the variable in `--color-ink-2` at half strength, the one thing the product holds fixed as a brass line, the axis in mono.
+- **A figure or a rate card:** one measured value in Instrument Serif at display size with its unit in mono, or rates as hairline rows of tabular figures under a lowercase head.
+
+## Controls
+
+- The control pair: a solid brass pill with `--color-accent-ink` text beside a hairline pill in `--color-rule-2`, both lowercase, 44 to 48px.
+- Links take a brass underline on hover; inputs sit on `--color-paper` inside a band, 1px `--color-rule-2`, 10px radius, the brass focus ring.
+- The brass stays under 5% of a screen: the primary fill, the focus ring, a link's hover, one line or readout. The rose belongs to the verb; `--color-live` to a live state only.
+
+## Motion
+
+One reveal: the verb's underline draws in once over `--dur-long`. Otherwise state only: a hairline pill takes `--color-paper-2` on hover, a streamed answer types once. No ambient loop, no breathing light, no stagger.
+
+## Voice
+
+Engineered, plain, specific: the model, the state, the unit, the price. Lowercase heads read like a note in a lab book, never cute. No exclamation marks.
+
+## Do-nots
+
+- Never a drawn or generated light: no orb, lamp, ring, halo or glowing object behind or beside a head.
+- Never let the violet climb: a violet field or a violet-to-blue gradient is the generated look.
+- Never colour a noun, never a second accented word; one verb, in the hero.
+- Never sentence-case heads, and never a head at the plain section size; this face reads thin there.
+- Never a warm ground or a third warm colour; the brass and the rose verb carry all the warmth.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Instrument+Serif&family=Geist:wght@400;500&family=Geist+Mono:wght@400&display=swap" rel="stylesheet">
+```
+
+```css
+body { font-variant-numeric: tabular-nums; }
+h1, h2, h3, nav, label, th, figcaption, .btn { text-transform: lowercase; }
+h1, h2, h3 { font-weight: 400; } h2 { font-size: var(--text-display-s); line-height: 0.98; }
+.verb { display: inline-block; color: var(--color-accent-2); }
+.verb::after { content: ""; display: block; height: var(--rule-hair); background: currentColor; transform-origin: left; animation: draw var(--dur-long) var(--ease-out) both; }
+@keyframes draw { from { transform: scaleX(0); } }
+.btn { border-radius: var(--radius-pill); padding: var(--space-sm) var(--space-lg); font-weight: 500; }
+.btn--primary { background: var(--color-accent); color: var(--color-accent-ink); }
+.btn--secondary { box-shadow: inset 0 0 0 var(--rule-hair) var(--color-rule-2); color: var(--color-ink); }
+.btn--secondary:hover { background: var(--color-paper-2); }
+.well { background: var(--color-paper-2); border: var(--rule-hair) solid var(--color-rule); border-radius: var(--radius-card); }
+.blueprint { background-image: linear-gradient(var(--rule-blueprint) 1px, transparent 1px), linear-gradient(90deg, var(--rule-blueprint) 1px, transparent 1px); background-size: 48px 48px; }
+.readout { font: 400 0.8125rem/1.5 var(--font-outlier); color: var(--color-ink-2); }
+```

package/skills/hallmark/references/themes/manifesto.md

@@ -0,0 +1,101 @@
+---
+name: Manifesto
+slug: manifesto
+genre: editorial
+paper: dark 13 60
+display: display-condensed Anton
+accent: warm 28
+posture: committed
+keywords: manifesto, statement, declaration, principles, beliefs, mission, movement, protest, cause, campaign, petition, activism, advocacy, rights, values, take a stand, bold launch, defiant, punk, record label
+material: warm near-black ground, warm off-white ink, Anton capitals at poster size leaded tight over a quiet Public Sans body, hairlines, a heavy ink bar and square edges, one fighting red
+photo: duotone paper ink con=24
+pictured: Manifesto, Ledge hero
+---
+
+# Manifesto
+
+A declaration printed on a dark sheet: a warm near-black ground, warm off-white ink, Anton capitals set as big as the width allows and leaded tight, a small plain Public Sans body, hairlines, one heavy ink bar, square edges and one fighting red. The force is the contrast between poster-size caps and quiet body text, and red spent sparingly; photographs print in the off-white ink, hard and close, like a pasted-up flyer. Nothing is decorated. It is not a protest-poster pastiche of stickers and torn paper, and not a dark product page with a red button.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(13% 0.01 60); --color-paper-2: oklch(17% 0.011 60); --color-paper-3: oklch(22% 0.012 60);
+  --color-ink: oklch(95% 0.014 85); --color-ink-2: oklch(84% 0.012 80); --color-muted: oklch(64% 0.016 65);
+  --color-rule: oklch(31% 0.014 60);
+  --color-accent: oklch(56% 0.228 28); --color-accent-deep: oklch(49% 0.2 28); --color-accent-text: oklch(64% 0.22 28); --color-accent-ink: oklch(98.5% 0.004 90);
+  --color-focus: oklch(64% 0.22 28);
+  --font-display: "Anton", "Impact", sans-serif; --font-body: "Public Sans", ui-sans-serif, system-ui, sans-serif;
+  --font-outlier: var(--font-body);
+  --radius-card: 0; --radius-pill: 0; --rule-hair: 1px; --rule-bar: 4px; --shadow-card: none;
+  --tracking-display: 0.004em; --display-weight: 400; --lh-tight: 0.9; --text-display: clamp(4.5rem, 12vw, 13rem);
+}
+```
+
+## Type
+
+- **Display:** Anton 400, one weight, uppercase only, `--tracking-display`. Condensed caps take a step up: a Ledge or Corridor hero head sets at the theme's own `--text-display` (to 13rem), a statement as large as its longest line allows across the twelve columns, other heads one step over the shared scale. A head whose lines each sit in their own element and never wrap (`white-space: nowrap`, sized in `cqi`, stamp `waive 55b`) leads at `--lh-tight`; any head that can wrap leads at 1.02 (55a).
+- **The red word:** one word on the whole page, inside the hero head, in `--color-accent-text` (stamp `waive 38iii`). Every other head is one colour.
+- **Body:** Public Sans 400 and 600, plain, in `--color-ink-2`; a lead at 21px is the loudest it gets.
+- **Labels, captions, table heads, meta, dates:** Public Sans 500 a step smaller, sentence case, untracked, `--color-muted`. No mono.
+
+## Surfaces
+
+- Hairlines divide: `--rule-hair` in `--color-rule` between rows and under heads like a broadsheet; one `--rule-bar` in ink under the nav or over a record; a red rule once a page at most.
+- Radius 0 and no shadow anywhere: no boxed cards, no lift. A well is a `--color-paper-2` field under a hairline.
+- Bands: `--color-paper-2`, or the page's one red-inverted surface, a red field with `--color-accent-ink` type; two a page at most.
+- Photographs: close and hard-lit, the thing the page argues for (a board, a tool, hands at a repair), sharp, no faces, cropped tight so the edges fall to dark. They print in the off-white ink (the `photo:` duotone), square, in a 1px `--color-rule` ring, full-bleed or not at all. A head crosses one only over its darkest third, on a `--color-paper` plate; red never touches a picture.
+- Everything warm-tinted (hue 60 to 90), never neutral grey; no texture, no ornament.
+
+## Range
+
+- **The record:** demands, principles or clauses as full-width rows under hairlines, each numeral in Anton at section size in the muted ink, the clause in Anton at title size, its one plain line beside it.
+- **The poster line:** one date, figure or slogan in Anton across all twelve columns, as big as the line allows, with Steps or a short line beneath; the size is the argument.
+- **A stacked creed:** three short lines of Anton locked at `--lh-tight`, each its own nowrap line, flush left on the sheet with nothing else beside it.
+- **The pledge:** a sentence in Anton with the name blank set inside it, on the one red field, the email and its button beneath.
+
+## Controls
+
+- Square, ruler-drawn controls: a flat red block with `--color-accent-ink` text (`--color-accent-deep` on hover) beside a hairline block in `--color-ink-2` that inverts to red on hover. On the red field the primary turns to the ground with ink text.
+- Links are ink with a 1px underline that turns `--color-accent-text` on hover; inputs are square, hairline-bordered, on `--color-paper-2`.
+- Outside the red field, red stays under 5% of a screen: the red word, the primary control, the focus ring, one red rule.
+
+## Motion
+
+One clip reveal: the hero head wipes upward once (`clip-path: inset()`, never a soft fade) over `--dur-long` on `--ease-out`. Nothing else moves; no bounce, no parallax, no red pulsing.
+
+## Voice
+
+Imperative, short, declarative: fighting words, verbs over adjectives, the demand in the reader's own nouns. No hedging; state it and stand behind it.
+
+## Do-nots
+
+- Never a second accent; red is the only colour.
+- Never a red flood beyond the one inverted surface; red is a signal, not a background.
+- Never a light ground; the sheet stays dark.
+- Never ornament: no fleurons, stickers, torn edges, hard-offset shadows, or a photograph in colour or toned red.
+- Never a serif, lowercase or title-case display, and never a timid head: if Anton sits under 64px at 1440 it has stopped shouting.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Anton&family=Public+Sans:wght@400;500;600&display=swap" rel="stylesheet">
+```
+
+```css
+body { color: var(--color-ink-2); }
+h1, h2, h3 { font-weight: 400; text-transform: uppercase; line-height: 1.02; color: var(--color-ink); }
+.display { line-height: var(--lh-tight); container-type: inline-size; }
+.display > span { display: block; white-space: nowrap; }
+.display .hot { color: var(--color-accent-text); }
+.bar { border-bottom: var(--rule-bar) solid var(--color-ink); }
+.btn { border: var(--rule-hair) solid transparent; background: none; border-radius: 0; padding: var(--space-sm) var(--space-lg); font-weight: 600; }
+.btn--primary { background: var(--color-accent); color: var(--color-accent-ink); }
+.btn--primary:hover { background: var(--color-accent-deep); }
+.btn--secondary { border-color: var(--color-ink-2); color: var(--color-ink); }
+.btn--secondary:hover { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-accent-ink); }
+.band--red { background: var(--color-accent); color: var(--color-accent-ink); }
+.reveal { animation: wipe var(--dur-long) var(--ease-out) both; }
+@keyframes wipe { from { clip-path: inset(100% 0 0 0); } to { clip-path: inset(0); } }
+::selection { background: var(--color-accent); color: var(--color-accent-ink); }
+```

package/skills/hallmark/references/themes/midnight.md

@@ -0,0 +1,97 @@
+---
+name: Midnight
+slug: midnight
+genre: atmospheric
+paper: dark 14 264
+display: grotesk-sans Mona Sans
+accent: cool 230
+posture: committed
+keywords: render, 3d, animation, vfx, film, video, frames, pipeline, generative, ai tool, model playground, dark mode, nocturnal, late-night, after-hours, overnight, moody, cinematic, cerebral, calm, technical, midnight
+material: midnight-blue ground to every edge, cool white ink, Mona Sans expanded at 300 over its normal width, square-cut surfaces in lightness steps, photographs as moonlight, one azure signal
+photo: duotone paper ink-2
+pictured: Narrative Workflow, Settled hero
+---
+
+# Midnight
+
+A cold, calm night instrument whose blue is the ground itself: deep midnight blue to every edge, cool white ink, Mona Sans at an expanded 300 for the heads like titles on a film, the same family at its normal width for reading, surfaces cut square in steps of lighter blue, one azure signal. Photographs arrive as moonlight, shadows in the ground's blue and highlights in the ink. It is not a neon dark mode, not frosted glass, and not a black page with a blue button.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(14% 0.048 264); --color-paper-2: oklch(18.5% 0.052 264); --color-paper-3: oklch(23% 0.055 264);
+  --color-ink: oklch(95% 0.016 250); --color-ink-2: oklch(88% 0.05 245); --color-muted: oklch(73% 0.04 256);
+  --color-rule: oklch(29% 0.058 264); --color-rule-2: oklch(40% 0.06 262);
+  --color-accent: oklch(80% 0.11 230); --color-accent-2: oklch(58% 0.1 236); --color-accent-ink: oklch(16% 0.05 264); --color-focus: oklch(84% 0.12 228);
+  --font-display: "Mona Sans", ui-sans-serif, system-ui, sans-serif; --font-body: var(--font-display); --font-outlier: var(--font-display);
+  --radius-card: 0; --radius-pill: 0; --rule-hair: 1px;
+  --shadow-card: 0 24px 48px -24px oklch(6% 0.04 264 / 0.7);
+  --tracking-display: -0.015em; --display-weight: 300; --display-stretch: 125%;
+}
+```
+
+## Type
+
+- **Display:** Mona Sans 300 at the expanded width on `h1` and `h2`, `--tracking-display`, line-height 1.04, sentence case, roman. The wide light cut is the voice; a long head steps down to `--text-display-s` rather than closing up. Item titles take 500 at the normal width.
+- **Figures that are the point:** the display cut at 300, tabular, from `--text-display` up to twice it, tracking -0.03em, the unit beside it at the normal width 400 in `--color-ink-2`.
+- **Body:** Mona Sans 400 at the normal width, line-height 1.6. One family at two widths: the cold comes from the ground and the ink, never from a second face.
+- **Labels, table heads, meta, status:** 500 a step smaller, sentence case, untracked, `--color-muted`. Tabular figures wherever numbers compare; no mono anywhere.
+
+## Surfaces
+
+- Depth is a step of lightness from paper to paper-2 to paper-3, cut square at radius 0 like a frame; a lifted surface takes `--shadow-card` in the ground's own dark. No outline around a surface; a 1px `--color-rule` parts rows in a table or a list and nothing else.
+- Bands: `--color-paper-2` or `--color-paper-3`, two a page at most; never an azure field and never a light band.
+- Photographs: low-key light after dark, architecture at night, a lit stairwell, a long corridor; one subject held still, cropped wide or tall. The duotone runs from paper to ink-2, so a daylight picture turns to a pale sheet: pick night. Square frames, a 1px inset outline of ink at 8%, a label-style caption giving the hour or the frame.
+- No texture, no glass, no blur, no bloom.
+
+## Range
+
+- **A figure as the statement:** one real number in the display cut at up to twice `--text-display`, alone on the ground with its unit and one line; the wide light cut makes a price read like a title card.
+- **The product from another angle:** a detail of the interface cropped large on a paper-2 well (a job sheet, a meter, a contact sheet), stepped in lightness, never framed in a drawn window.
+- **Steps or a night log:** an `<ol>` of stages or hours, each head in the expanded cut, figures tabular, the current one in ink and the rest in muted; the meter (a 2px `--color-rule-2` track, an `--color-accent-2` or azure fill) is the only line that moves.
+- **Rows and forms on the ground:** hairline rows with expanded titles on the left and the normal width on the right; a calculator on a paper-2 band whose answer is a display-cut figure.
+
+## Controls
+
+- The pair: a solid azure rectangle with `--color-accent-ink` text beside a secondary outlined in `--color-rule-2`, both square, 500. A segmented choice is the same square, filled ink when chosen.
+- Links take an azure underline on hover; inputs sit on the paper with a 1px `--color-muted` edge, square.
+- The azure stays under 5%: the one primary control, a link's hover, one meter value or one figure. Never a field, a gradient or a second light.
+
+## Motion
+
+One settle: the hero's text fades from 0.6 to 1 over `--dur-long` on `--ease-out`, once, from a visible default. Hover steps a surface one lightness up. A value changes when its source does; nothing slides, loops or follows the cursor.
+
+## Voice
+
+Cool and spare, the night shift's register: the hour, the count, the cost. Short declaratives; a number always carries its unit or its time. Never hype.
+
+## Do-nots
+
+- Never a warm accent; the light here is cold.
+- Never a heavy display weight or a head at the normal width; the expanded 300 is the face.
+- Never a lamp: no radial glow, no halo, no lit edge on a card.
+- Never a rounded corner or a light section; dark and square end to end.
+- Never a photograph in its own colours beside the duotone, and never a daylight scene.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Mona+Sans:wdth,wght@100,400;100,500;125,300&display=swap" rel="stylesheet">
+```
+
+```css
+h1, h2 { font-weight: var(--display-weight); font-stretch: var(--display-stretch); line-height: 1.04; }
+h3 { font-weight: 500; }
+.fig { font-weight: var(--display-weight); font-stretch: var(--display-stretch); letter-spacing: -0.03em; line-height: 0.9; font-variant-numeric: tabular-nums; }
+.well { background: var(--color-paper-2); border-radius: var(--radius-card); }
+.well--raised { background: var(--color-paper-3); box-shadow: var(--shadow-card); }
+.btn { border: var(--rule-hair) solid transparent; background: none; border-radius: var(--radius-pill); padding: var(--space-sm) var(--space-lg); font-weight: 500; color: var(--color-ink); transition: background-color var(--dur-short) var(--ease-out); }
+.btn--primary { background: var(--color-accent); color: var(--color-accent-ink); }
+.btn--secondary { border-color: var(--color-rule-2); }
+.btn--secondary:hover { background: var(--color-paper-2); }
+.meter { height: 2px; background: var(--color-rule-2); } .meter > span { display: block; height: 100%; background: var(--color-accent); }
+a:hover { text-decoration-color: var(--color-accent); }
+.settle { animation: settle var(--dur-long) var(--ease-out) both; }
+@keyframes settle { from { opacity: 0.6; } }
+```