@r1z4x/tezgah 1.9.2 → 1.13.0

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

@@ -0,0 +1,99 @@
+---
+name: Darkroom
+slug: darkroom
+genre: atmospheric
+paper: dark 12.5 55
+display: display-condensed Sofia Sans Extra Condensed
+accent: chromatic-amber 58
+posture: restrained
+keywords: photographer, photography, film, analogue, darkroom, prints, portfolio, exhibition, gallery, edition, commission, cinematographer, negative, archive, monochrome, lab, moody, black and white, night, print shop, travel, places, landscape, portrait, photo studio
+material: warm print-black ground, a fine light grain, fibre-white ink, hairline Sofia Sans Extra Condensed capitals over Barlow, zero radius, black-and-white photographs printed deeper than the ground, one amber safelight
+photo: mono high=-20 shad=-12
+pictured: Photographic, Poster hero
+---
+
+# Darkroom
+
+A print room with the lights off: a warm black ground a step lighter than a print's own black, so a photograph sits on it as an object; fibre-white ink; hairline extra-condensed capitals over Barlow; one amber safelight. Photographs are black and white, printed deep and large, and the type carries the rest. It is not a film-strip costume, a moody gradient, flat screen black or a white-matted gallery.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(12.5% 0.008 55); --color-paper-2: oklch(16% 0.009 55); --color-paper-3: oklch(20.5% 0.01 55);
+  --color-ink: oklch(92% 0.012 78); --color-ink-2: oklch(80% 0.012 75); --color-muted: oklch(64% 0.012 65);
+  --color-rule: oklch(29% 0.01 55);
+  --color-accent: oklch(73% 0.15 58); --color-accent-deep: oklch(50% 0.11 52); --color-accent-ink: oklch(12.5% 0.008 55); --color-focus: oklch(73% 0.15 58);
+  --font-display: "Sofia Sans Extra Condensed", ui-sans-serif, sans-serif; --font-body: "Barlow", ui-sans-serif, sans-serif;
+  --font-outlier: var(--font-body);
+  --radius-card: 0; --radius-pill: 0; --rule-hair: 1px; --shadow-card: none;
+  --tracking-display: -0.005em; --display-weight: 200; --grain: 0.07;
+}
+```
+
+Three colourways, stated in the stamp (`darkroom: amber`).
+
+| Colourway | Ground, ink, signal |
+| --- | --- |
+| **amber** (default) | the tokens above |
+| **red** | signal `oklch(62% 0.19 32)`, deep `oklch(44% 0.16 32)` |
+| **fibre paper** | ground `oklch(95% 0.01 80)`, ink `oklch(14% 0.006 40)`, muted `oklch(46% 0.01 50)`, signal `oklch(50% 0.2 30)`, rule `oklch(80% 0.014 70)`; dark specks at 0.12 |
+
+## Type
+
+- **Display:** Sofia Sans Extra Condensed in capitals, 200 on the hero, section heads and figures, 400 on an item title and a control, line-height 1.0, `--tracking-display`, roman. The hairline at scale is the look: being extra-condensed, every display step may set one step above the shared scale, and the hero head runs to poster size across eight columns.
+- **Body:** Barlow 400 for prose at 17px and 1.6, so the reading text holds on the dark; Barlow 300 only at lead size and above.
+- **Labels, captions, table heads:** Barlow 400 a step smaller, sentence case, untracked, in `--color-muted`; a plate number and a month are this voice. Figures are tabular. No mono.
+
+## Surfaces
+
+- Depth is lightness, never light: ground 12.5, well 16, surface 20.5. No vignette, no bloom, no shadow; a print's blacks sit below the ground, which is what makes it read as a print.
+- Rules: 1px `--color-rule`, run full width between rows of a sheet and as vertical hairlines between figures; radius 0 everywhere.
+- Bands: a `--color-paper-2` well, grained, for the sections that carry no picture; two a page at most, never an amber field.
+- Photographs: the work. Black and white, printed deep (open highlights, full blacks, the film's grain); a subject at a distance with room around it, or close and flat. Radius 0, no frame, no mat; full-bleed or held to the columns, never thumbnail size, a caption beneath with the plate number. Type crosses a photograph only over its darkest third, on a scrim of the ground at 40 to 70%.
+- Texture: the speck grain of `texture.md` § 1 at `--grain`, on a well; never over a photograph.
+
+## Range
+
+- **Figures as an edition:** the prompt's real numbers (plates, prints of each, the run) in the 200 hairline at 12rem and over on a grained well, vertical hairlines between them, each with a muted Barlow line beneath; the size is the drama, the colour stays ink.
+- **A collector's sheet:** Rows under full-width hairlines, the label in muted Barlow on the left and the value in display capitals at title size on the right: series, subject, negative, paper, edition, sizes.
+- **A process as a contact strip:** Steps across the twelve columns, each stage a hairline numeral at section size over a short line (exposed, developed, printed, editioned), parted by verticals; nothing drawn.
+- **A choice set as numerals:** a working picker of plates or sizes in 1px rule cells, each a display numeral at title size, the chosen one lit by the safelight, beside a plain form on the ground.
+
+## Controls
+
+- The pair: a 1px ink-outlined secondary beside an amber-filled primary in `--color-accent-ink`, both display capitals at 400, untracked, radius 0, 48px tall.
+- Links are ink, underlined in `--color-rule`; the underline turns amber on hover. Inputs: radius 0, a 1px `--color-muted` border on the ground, a steady outline on focus.
+- The safelight is scarce: the one filled control, a selected plate, a caption on hover; `--color-accent-deep` is the quieter fill under ink text.
+
+## Motion
+
+Still as a print. A photograph may rise once from the ground over `--dur-long`, as in the tray, from a visible default; hover on a linked plate turns its number amber. Nothing else moves.
+
+## Voice
+
+Lab notes and a collector's sheet: series, plate, place, month, edition, paper. Exact numbers, short lines, no adjectives about light or soul.
+
+## Do-nots
+
+- Never an amber wash, band, glow or amber head; the safelight lights a control or a number, never a section.
+- Never a sprocket hole, a film strip, a grease-pencil ring or a drawn frame.
+- Never Sofia Sans Extra Condensed above 400 for a head, and never a figure in anything but the 200.
+- Never sepia, duotone or a tint on a picture, and never flat screen black under the prints.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Sofia+Sans+Extra+Condensed:wght@200;400&family=Barlow:wght@300;400&display=swap" rel="stylesheet">
+```
+
+```css
+h1, h2, .figure { font-family: var(--font-display); font-weight: 200; text-transform: uppercase; line-height: 1; letter-spacing: var(--tracking-display); }
+h3 { font-family: var(--font-display); font-weight: 400; text-transform: uppercase; line-height: 1; }
+.btn { min-height: 48px; padding: 0 var(--space-lg); border: var(--rule-hair) solid var(--color-ink); border-radius: 0; background: transparent; color: var(--color-ink); font: 400 var(--text-lg)/1 var(--font-display); text-transform: uppercase; }
+.btn--primary { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-accent-ink); }
+.well { background: var(--color-paper-2); }
+.grained { position: relative; isolation: isolate; }
+.grained::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: var(--grain); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 9 -4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E") 0 0 / 200px 200px; }
+::selection { background: color-mix(in oklab, var(--color-accent) 35%, transparent); }
+```

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

@@ -0,0 +1,98 @@
+---
+name: Dose
+slug: dose
+genre: modern-minimal
+paper: light 97.6 88
+display: grotesk-sans Schibsted Grotesk
+accent: chromatic-green 160
+posture: committed
+keywords: health, medication, pharmacy, care, carer, family, reminders, schedule, app, mobile, medicine, patients, clinic, prescription, tracking, calm, trust, routine, elderly, parents
+material: warm morning paper with a fibre grain and window light, translucent tinted plastic, green-black ink, Schibsted Grotesk over Instrument Sans with DM Mono pharmacy labels, moulded controls, one pharmacy green
+photo: natural sat=-15 con=-6
+pictured: Care Register, Organiser hero
+---
+
+# Dose
+
+Translucent plastic and daylight: warm morning paper with a fine fibre grain, window light falling across it, bands of soft tinted plastic like a pill organiser, green-black ink, Schibsted Grotesk heads over Instrument Sans, and DM Mono for the time and the dose, set like a pharmacy label. One pharmacy green does every signal. It is trustworthy because it is exact and unhurried, and it lives in a kitchen, not a clinic. It is not a clinical blue portal, not a wellness pastel and not an alarm.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(97.6% 0.011 88); --color-paper-2: oklch(96.5% 0.02 160); --color-paper-3: oklch(93% 0.036 160);
+  --color-ink: oklch(21% 0.025 170); --color-ink-2: oklch(31% 0.02 170); --color-muted: oklch(49% 0.024 165);
+  --color-rule: oklch(86.5% 0.022 140);
+  --color-accent: oklch(50% 0.13 160); --color-accent-deep: oklch(42% 0.11 162); --color-accent-soft: oklch(88% 0.08 160); --color-accent-ink: oklch(99% 0.006 160);
+  --color-focus: oklch(45% 0.14 160);
+  --p-mon: oklch(85% 0.052 22); --p-tue: oklch(87.5% 0.058 64); --p-wed: oklch(91.5% 0.064 98); --p-thu: oklch(86.5% 0.075 160);
+  --p-fri: oklch(87% 0.048 210); --p-sat: oklch(84% 0.045 270); --p-sun: oklch(84% 0.048 322);
+  --light: oklch(99.4% 0.016 84); --glint: oklch(100% 0 0);
+  --font-display: "Schibsted Grotesk", ui-sans-serif, sans-serif; --font-body: "Instrument Sans", ui-sans-serif, sans-serif;
+  --font-outlier: "DM Mono", ui-monospace, monospace;
+  --radius-card: 14px; --radius-input: 10px; --radius-pill: 999px; --rule-hair: 1px;
+  --shadow-card: 0 1px 2px oklch(30% 0.03 165 / 0.08), 0 24px 48px -24px oklch(40% 0.08 165 / 0.35);
+  --shadow-lift: 0 1px 1px oklch(30% 0.03 165 / 0.10), 8px 18px 28px -14px oklch(36% 0.06 165 / 0.32), 18px 40px 60px -30px oklch(40% 0.08 165 / 0.30);
+  --tracking-display: -0.03em; --display-weight: 700;
+}
+```
+
+Committed: the paper is warm, the green tints and the plastic carry the colour, mint (`--color-accent-soft`) marks what is checked, and the accent proper stays on controls, focus, a stamp and one figure. Grounds, stated in the stamp (`dose: white`): **white** (default, the tokens above), **green** (drenched `oklch(46% 0.12 160)` under white ink, surfaces white inside, mint on the ground), **night** (`oklch(13% 0.01 170)` under `oklch(96% 0.01 160)`, plastic at 40% light, mint with dark ink).
+
+## Type
+
+- **Display:** Schibsted Grotesk 700, `--tracking-display`, line-height 1.02, sentence case, lining tabular figures.
+- **Body:** Instrument Sans 400 and 500, 16 to 18px, line-height 1.5.
+- **Labels, captions, table heads:** Instrument Sans 500 a step smaller, sentence case.
+- **Times, doses, pharmacy labels:** DM Mono 400 and 500 (`08:00`, `500 mg`), at text size inside a sentence, at title size where a timetable's first column is the time, and as the whole voice of a pharmacy label; never a tab, a table head or a display figure. Three weights a page: 400, 500, 700.
+
+## Surfaces
+
+- The ground is generated, never a picture: the paper takes a fractal-noise fibre grain (an `feTurbulence` data URI under the paper colour), and the hero takes window light, four blurred panes of `--light` skewed across the paper, drifting over 90 seconds.
+- Plastic is the surface: a tint (`--p-*`, never a state) at about 62% alpha, a `--glint` line along the top edge, a deeper inner shade at the foot, and the coloured light it lets through pooled and blurred on the paper below. It makes bands, trays and compartments; CSS 3D may turn a set of them three-quarter on the paper.
+- A label is paper on plastic: grained white, 10px radius, a tear-off stub on a dashed rule, DM Mono throughout, a confirmation as a double-ringed green stamp rotated 2 degrees naming the time and who; missed or due is the same in grey.
+- Radii read as an app: 10px controls, 14px surfaces, 999 on tags, a phone screen at about 28px. White surfaces lift on `--shadow-lift`; one green-black ink band may carry a statement.
+- Photographs: the home where a dose is given, hands and rooms in soft daylight, never a face to camera or a clinic; 14px radius, captions beneath.
+
+## Range
+
+- **A sequence as plastic bands:** each stage a full-width band in its own tint, the number in Schibsted at display size, two phone screens of the product on it, the minute each happened in DM Mono beside its line.
+- **A record as labels:** the photograph beside two pharmacy labels, one stamped given in green, one missed in grey, each stating the dose, time and person.
+- **Statement on the ink band:** one plain sentence in Schibsted 700 at `--text-display`, one line in mint beneath it.
+- **A first step in a tray:** the form on a sunken plastic tray, choices as plastic keys, the product's screen beside it answering live.
+
+## Controls
+
+- Moulded plastic: a 52px control at 10px with a 1px rim, a 3px rim below, a bevel of `--glint` on top and a soft cast shadow; it sinks 3px on press. The primary is green plastic, the secondary clear.
+- Choices are plastic keys, mint when checked. Links underline in green on hover. Inputs: 52px at 10px with a 1px `--color-muted` border.
+
+## Motion
+
+Light drifts over 90 seconds and pauses off screen. Once in view: a lid lifts, a label rises, its stamp lands and a tick ripples to whoever else sees it. Reduced motion or no script: the end state, light still.
+
+## Voice
+
+A pharmacist's plainness, spoken by a family: the name, the dose, the time, who gave it, in the words a son or daughter uses (Mum, your brother). Never a journey, never a warning in red.
+
+## Do-nots
+
+- Never red or amber for a missed or late state; it is grey.
+- Never a plastic tint as a signal or a second brand colour; the green does every signal.
+- Never clinical stock: spilled pills, blister packs in close-up, white coats.
+- Never glossy toy plastic: tints stay pale, light is daylight, no gradients beyond the glint and the shade.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:wght@700&family=Instrument+Sans:wght@400;500&family=DM+Mono:wght@400;500&display=swap" rel="stylesheet">
+```
+
+```css
+h1, h2, h3 { font-family: var(--font-display); font-weight: 700; letter-spacing: var(--tracking-display); line-height: 1.02; }
+.btn { height: 52px; padding: 0 var(--space-lg); border: 0; border-radius: var(--radius-input); font: 500 var(--text-md) var(--font-body); box-shadow: inset 0 1px 0 var(--glint), 0 0 0 1px var(--color-rule), 0 3px 0 var(--color-rule); transition: transform var(--dur-micro) var(--ease-out); }
+.btn--primary { background: linear-gradient(var(--color-accent), var(--color-accent-deep)); color: var(--color-accent-ink); box-shadow: 0 0 0 1px var(--color-accent-deep), 0 3px 0 var(--color-accent-deep); }
+.btn:active { transform: translateY(3px); }
+.plastic { --t: var(--p-thu); position: relative; border-radius: var(--radius-card); background: linear-gradient(color-mix(in oklab, var(--glint) 32%, transparent), transparent 18%), color-mix(in oklab, var(--t) 62%, transparent); box-shadow: inset 0 1.5px 0 var(--glint), inset 0 -24px 36px -28px color-mix(in oklab, var(--t) 45%, var(--color-ink)); }
+.dose, .label { font-family: var(--font-outlier); font-variant-numeric: tabular-nums; }
+.band--ink { background: var(--color-ink); color: var(--color-paper); }
+```

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

@@ -0,0 +1,105 @@
+---
+name: Dusk
+slug: dusk
+genre: modern-minimal
+paper: dark 17.5 268
+display: grotesk-sans Wix Madefor Display
+accent: cool 274
+posture: committed
+keywords: treasury, banking, fintech, payments, reconciliation, ledger, accounting, close, month end, audit, balance, cash management, payouts, settlement, compliance, controller, bookkeeping, finance team, invoicing, payroll, overnight, automation
+material: a real landscape at the turn of the light behind the hero, slate below it, the product in smoked glass with a lit top edge, Wix Madefor Display at a quiet weight over Wix Madefor Text, bone wells for light surfaces, one periwinkle signal and one apricot
+photo: natural con=4 vib=6
+pictured: Narrative Workflow, Stage hero
+---
+
+# Dusk
+
+Money software at the calm end of the day: a real photograph of land at dusk behind the hero, the head set dark on its palest part, the product beside it in smoked glass. Below, the page turns to slate and light surfaces are bone wells. It reads as expensive and unhurried, never a neon trading screen or a dashboard of tiles.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(17.5% 0.014 268); --color-paper-2: oklch(21% 0.016 268); --color-paper-3: oklch(25% 0.017 268);
+  --color-ink: oklch(96% 0.006 75); --color-ink-2: oklch(85% 0.010 262); --color-muted: oklch(70% 0.016 262);
+  --color-rule: oklch(30% 0.016 266); --color-light: oklch(100% 0 0); --color-shade: oklch(10% 0.022 268);
+  --color-accent: oklch(77% 0.10 274); --color-accent-ink: oklch(19% 0.035 274); --color-accent-hi: oklch(84% 0.085 274);
+  --color-accent-deep: oklch(44% 0.13 274); --color-accent-soft: oklch(91% 0.038 274); --color-focus: oklch(80% 0.10 274);
+  --color-accent-2: oklch(83% 0.095 62); --color-dusk: oklch(70% 0.12 330);
+  --color-day-ink: oklch(22% 0.022 268); --color-day-muted: oklch(38% 0.022 266); --color-fog: oklch(94% 0.012 70);
+  --color-well: oklch(95.5% 0.008 75); --color-well-2: oklch(92% 0.010 75); --color-well-ink: oklch(21% 0.016 268); --color-well-muted: oklch(47% 0.016 265); --color-well-rule: oklch(87.5% 0.009 75); --color-card: oklch(99.5% 0.003 75);
+  --glass: oklch(22% 0.018 268 / 0.58); --glass-blur: 22px;
+  --glass-hi: inset 0 1px 0 oklch(100% 0 0 / 0.10), inset 0 0 0 1px oklch(100% 0 0 / 0.06);
+  --shadow-card: 0 1px 0 oklch(100% 0 0 / 0.06) inset, 0 40px 80px -32px oklch(8% 0.02 268 / 0.7);
+  --font-display: "Wix Madefor Display", ui-sans-serif, system-ui, sans-serif; --font-body: "Wix Madefor Text", ui-sans-serif, system-ui, sans-serif;
+  --radius-card: 18px; --radius-inner: 10px; --radius-pill: 999px; --rule-hair: 1px;
+  --tracking-display: -0.022em; --display-weight: 500;
+}
+```
+
+Three dials, each stated in the stamp (`dusk: fog/periwinkle-apricot/glass`); two Dusk pages in one run differ on two.
+
+| Dial | Options |
+| --- | --- |
+| **Hour** (the hero photograph) | `fog` (default): a valley of fog under an apricot sky. `shore`: water at dusk, boats or a quay. `ridge`: mountain ridges in haze at first light |
+| **Signals** (matched, then open) | `periwinkle-apricot` (default). `sage-apricot`: `oklch(80% 0.07 160)` as the first signal |
+| **Product surface** | `glass` (default): smoked glass on slate. `well`: bone wells carry the hero product too, glass only over photographs |
+
+## Type
+
+- **Display:** Wix Madefor Display 500, `--tracking-display`, line-height 1.02 to 1.1, sentence case. Heads stay modest; the photograph and the product are the loud parts.
+- **Body:** Wix Madefor Text 400 and 500 at 17px, line-height 1.55; leads in `--color-ink-2` or `--color-muted`.
+- **Figures:** the same faces, `tabular-nums`; cents in `--color-muted` at the same size, never raised. A figure set as a statement goes to Display 500 at 34 to 44px with its cents at 0.6em.
+- **Labels, column heads, status:** Text 500 a step smaller, sentence case, `--color-muted`. Never mono, never tracked capitals.
+
+## Surfaces
+
+- **The hour:** a library photograph of land at the turn of the light fills the hero, the head in `--color-day-ink` on its palest part over a fog scrim (`--color-fog` at 40 to 78%, radial, behind the text only), the product in glass on its darker side, the foot fading to `--color-paper`. A second photograph of the same hour may close the page behind the form; two at most.
+- **Glass:** the product's surface, `--glass` blurred, `--glass-hi` for the lit edge, `--shadow-card`. Rows inside split on `--color-light` at 7%; inner parts sit on it at 4 to 6% with `--radius-inner`.
+- **Wells:** a light surface is a bone well at 5:4 holding one white `--color-card`; the caption sits under it, a title and one muted line.
+- **Slate:** every band below the hero is `--color-paper`; the nav turns to slate glass once it leaves the photograph.
+
+## Range
+
+- **A run as an account list:** accounts with a round initial, line counts in muted, a status word with its icon, balances right-aligned with muted cents; the open item closes the list as an apricot strip with its action.
+- **A tour as a list beside one pane:** four jobs in a ruled list, the chosen one marked by a periwinkle dot and opened to one line, one glass pane beside it that changes with it.
+- **A month as a strip of nights:** one slim rounded bar a day in periwinkle, its height the work done, a flagged day marked by an apricot dot above its bar, the open day in apricot, days still to come hatched; a ruled tally of four figures under it.
+- **A hand-off in a well:** the note or message the product sends, set as the real card on bone.
+
+## Controls
+
+- One periwinkle pill (`--color-accent` under `--color-accent-ink`, a light inset top edge); hover lifts to `--color-accent-hi` with a soft periwinkle ring. A ghost pill beside it in `--color-light` at 4%.
+- An email field and its button share one pill: frosted fog over a photograph, smoked glass on slate.
+- Tabs are a ruled list with a dot, never boxed segments. Switches are periwinkle when on.
+- Two signals, two jobs: periwinkle is done, matched, on and focused; apricot is open, waiting or owed. Neither is ever a large fill.
+
+## Motion
+
+The hero photograph drifts 6% over 48 seconds; the product's rows rise in once, staggered; the open dot breathes; panes cross-fade; bars grow from their feet when seen. Reduced motion: all still.
+
+## Voice
+
+Calm and exact: what ran, when, what is left.
+
+## Do-nots
+
+- Never a drawn or generated sky, and never text on the busy part of a photograph.
+- Never a gradient button, a third signal colour or a red debit.
+- Never a grid of stat tiles; figures live in rows, lists and one ruled tally.
+- Never glass on glass, never a glow behind glass, never glass without its lit edge.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Wix+Madefor+Display:wght@400;500;600&family=Wix+Madefor+Text:wght@400;500;600&display=swap" rel="stylesheet">
+```
+
+```css
+h1, h2, h3 { font-family: var(--font-display); font-weight: var(--display-weight); letter-spacing: var(--tracking-display); }
+.num { font-variant-numeric: tabular-nums; } .num .c { color: var(--color-muted); }
+.glass { background: var(--glass); border-radius: var(--radius-card); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.35); backdrop-filter: blur(var(--glass-blur)) saturate(1.35); box-shadow: var(--glass-hi), var(--shadow-card); }
+.btn { min-height: 48px; padding: 0 var(--space-lg); border: 0; border-radius: var(--radius-pill); background: var(--color-accent); color: var(--color-accent-ink); font: 600 0.9375rem/1 var(--font-body); box-shadow: inset 0 1px 0 color-mix(in oklab, var(--color-light) 35%, transparent); }
+.btn:hover { background: var(--color-accent-hi); }
+.hero__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
+.hero__scrim { position: absolute; inset: 0; background: radial-gradient(ellipse 50% 58% at 20% 56%, color-mix(in oklab, var(--color-fog) 78%, transparent), transparent 78%), linear-gradient(to bottom, transparent 72%, var(--color-paper)); }
+```

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

@@ -0,0 +1,97 @@
+---
+name: Editorial
+slug: editorial
+genre: editorial
+paper: light 97 86
+display: display-condensed Bricolage Grotesque
+accent: chromatic-green 152
+posture: restrained
+keywords: magazine, editorial, feature, culture, fashion, design annual, interview, longform, publication, issue, contemporary, art direction, profile, lookbook, brand story, journal, considered, travel, city guide, guide
+material: warm white uncoated stock, printed black ink with a cool tilt, Bricolage Grotesque condensed at 800 over Source Serif 4, square corners, a heavy ink rule over 1px hairlines, one printer's green
+photo: natural sat=-10 con=4
+pictured: Marquee Hero, Stage hero
+---
+
+# Editorial
+
+A contemporary magazine voice: warm white uncoated stock, a printed black with a faint cool tilt that runs through the reading text too, Bricolage Grotesque at 800 squeezed to width 75 for every head, Source Serif 4 for reading and the standfirst, square corners, a heavy ink rule over 1px hairlines, one printer's green. The condensed head, the serif standfirst and the rule carry it, not ornament. It is not a serif literary journal, not cream with terracotta, and not a gallery of captioned photographs.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(97% 0.007 86); --color-paper-2: oklch(94% 0.010 86); --color-paper-3: oklch(91% 0.012 84);
+  --color-ink: oklch(16% 0.012 280); --color-ink-2: oklch(29% 0.011 280); --color-muted: oklch(48% 0.010 75);
+  --color-rule: oklch(85% 0.009 85); --color-rule-2: oklch(64% 0.010 80);
+  --color-accent: oklch(49% 0.130 152); --color-accent-ink: oklch(98% 0.005 88); --color-focus: oklch(52% 0.135 152);
+  --font-display: "Bricolage Grotesque", ui-sans-serif, sans-serif; --font-body: "Source Serif 4", ui-serif, Georgia, serif;
+  --radius-card: 0; --radius-pill: 0; --rule-hair: 1px; --rule-heavy: 4px; --shadow-card: none;
+  --tracking-display: -0.012em; --display-weight: 800;
+}
+```
+
+## Type
+
+- **Display:** Bricolage Grotesque 800 with `"wdth" 75, "opsz" 96`, `--tracking-display`, sentence case, roman. Line-height 0.92 at hero size, 1.0 for heads. Condensed, it takes one step up: a section head may run at `--text-display-s`, a lone hero word at twice `--text-display`. One weight and one colour per head.
+- **Body:** Source Serif 4 400 and its italic at 18px, optical size automatic, line-height 1.55, oldstyle figures in running text, in `--color-ink-2`. The standfirst (the line under a head, or a statement) is the same face at `--text-lead` up to `--text-display-s`, ink, line-height 1.2 at the large end. A quotation takes the italic; italic never enters a head.
+- **Labels, captions, nav links, controls, table heads, bylines:** Bricolage Grotesque 500 at `"opsz" 12`, full width, a step smaller, sentence case, untracked; captions in `--color-muted`. Figures set in the display face take lining tabular numerals. No mono on the page.
+
+## Surfaces
+
+- Two rule weights: a `--rule-heavy` ink rule opens a section or a table, the head flush under it; 1px `--color-rule` hairlines part rows, columns and figures, `--color-rule-2` under a table head. Nothing is boxed, nothing casts a shadow.
+- Radius 0 on everything: controls, tags, inputs, wells and photographs are sharp rectangles.
+- Depth is a paper step: a well is `--color-paper-2` under a `--color-rule-2` hairline, never a raised card.
+- Bands: a `--color-paper-2` well and one `--color-ink` band with `--color-paper` type, two a page at most; never a green band.
+- Photographs: seen close: hands at work, an object on a bench, a room in daylight, printed pages. Soft window light, people from behind, never a face to the lens; a little quieter than life, square, an inset ink outline at 8%, full-bleed or cut to a column edge. A head crosses a photograph only as a cover line, once a page, over an ink scrim. Two or three big pictures below the first screen; the material carries the rest.
+- No texture, no grain, no mesh.
+
+## Range
+
+- **Contents as rows:** under the heavy rule, three to six hairline rows, a title in the condensed head at about 40px on the left, its standfirst in the serif on the right, a page or date in the display face at the far edge.
+- **The standfirst as a statement:** one or two sentences in Source Serif at `--text-display-s`, ink across ten columns under the heavy rule; the serif at size is as much this theme as the head.
+- **Figures reversed out:** on the ink band, three or four of the prompt's numbers in the condensed head at `--text-display`, parted by hairlines, labels beneath.
+- **The order as a spec sheet:** a form on the paper-2 well, its facts in a ruled table beside the fields, the total in the display face, updated as the quantity changes.
+
+## Controls
+
+- An ink-filled square block (`--color-paper` on `--color-ink`) beside a 1px ink-outlined block, both in the label face, 48px tall; a tag may be the one filled green rectangle.
+- Links carry a hairline underline that turns green on hover; inputs and selects are square, 52px tall, with a 1px `--color-rule-2` border that turns ink on focus.
+- Green stays under 5% of a screen: a hover, one tag, the focus ring.
+
+## Motion
+
+State only: a green underline grows under a link over `--dur-short` on `--ease-out`, a block darkens one step, a total changes in place. No reveal, nothing on scroll.
+
+## Voice
+
+Contemporary, lightly literary, exact. Name the issue, the page count, the date; a head reads like a cover line, a standfirst says the argument in one breath.
+
+## Do-nots
+
+- Never a serif head; Source Serif 4 sets reading text, standfirsts and quotations, never an `h1` to `h3`.
+- Never Bricolage at its default width; without `"wdth" 75` the head loses the magazine proportion.
+- Never a rounded corner, a pill, a shadow, or a rule in green.
+- Never two picture sections in a row; follow each with rows, a standfirst or the figures.
+- Never an all-caps shout; sentence case, tight, magazine-modern.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wdth,wght@12..96,75..100,500..800&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;1,8..60,400&display=swap" rel="stylesheet">
+```
+
+```css
+body { color: var(--color-ink-2); font-optical-sizing: auto; font-variant-numeric: oldstyle-nums; }
+h1, h2, h3 { font-weight: var(--display-weight); font-variation-settings: "wdth" 75, "opsz" 96; color: var(--color-ink); font-variant-numeric: lining-nums tabular-nums; }
+small, figcaption, th, nav, label, .btn, .tag { font-family: var(--font-display); font-weight: 500; font-variation-settings: "opsz" 12; }
+.standfirst { font: 400 var(--text-display-s)/1.2 var(--font-body); color: var(--color-ink); }
+.opens { border-top: var(--rule-heavy) solid var(--color-ink); padding-top: var(--space-lg); }
+.btn { border: var(--rule-hair) solid var(--color-ink); border-radius: 0; min-height: 48px; padding: 0 var(--space-lg); }
+.btn--primary { background: var(--color-ink); color: var(--color-paper); }
+.btn--secondary { background: none; color: var(--color-ink); }
+.tag { background: var(--color-accent); color: var(--color-accent-ink); padding: var(--space-3xs) var(--space-xs); }
+.well { background: var(--color-paper-2); border-top: var(--rule-hair) solid var(--color-rule-2); }
+.photo > img { outline: 1px solid color-mix(in oklab, var(--color-ink) 8%, transparent); outline-offset: -1px; }
+a { text-decoration-color: var(--color-rule-2); text-underline-offset: 0.2em; } a:hover { text-decoration-color: var(--color-accent); }
+::selection { background: color-mix(in oklab, var(--color-accent) 22%, transparent); }
+```

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

@@ -0,0 +1,107 @@
+---
+name: Formwork
+slug: formwork
+genre: editorial
+paper: mid 74 80
+display: display-condensed Oswald
+accent: warm 38
+posture: restrained
+keywords: construction, concrete, skatepark, contractor, civil, landscape, foundry, industrial, fabrication, workshop, engineering, cast, welded, builders, hardware, tools, site, heavy
+material: warm grey concrete paper with a speck grain, near-black ink, Oswald capitals over Archivo, square cast edges and hard shadows, hard black-and-white photographs of poured concrete, one safety orange signal
+photo: natural sat=-100 con=35 exp=8
+pictured: Site Board, Poster hero
+---
+
+# Formwork
+
+A site-office voice: warm grey concrete for paper, near-black ink, Oswald 700 capitals over Archivo, square cast edges, hard shadows and one safety orange. It feels heavy and exact because the surface is poured, every edge is straight and the photographs show the concrete itself in black and white, so the orange is the only colour on the page. It is not a black-and-yellow hazard page and not a glossy architecture portfolio.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(74% 0.008 80); --color-paper-2: oklch(69% 0.009 80); --color-paper-3: oklch(64% 0.01 80);
+  --color-plate: oklch(82% 0.007 80); --color-plate-ink: oklch(95% 0.006 80);
+  --color-ink: oklch(18% 0.005 270); --color-ink-2: oklch(28% 0.006 80); --color-muted: oklch(31.5% 0.008 80);
+  --color-rule: oklch(64% 0.01 80);
+  --color-accent: oklch(66% 0.21 38); --color-accent-ink: oklch(18% 0.005 270); --color-focus: oklch(42% 0.15 38);
+  --color-accent-deep: oklch(48% 0.17 38);
+  --texture-opacity: 0.05;
+  --font-display: "Oswald", ui-sans-serif, sans-serif; --font-body: "Archivo", ui-sans-serif, sans-serif;
+  --font-outlier: "Archivo Narrow", ui-sans-serif, sans-serif;
+  --radius-card: 0; --radius-pill: 0; --rule-hair: 1px; --rule-bar: 3px;
+  --shadow-card: 6px 6px 0 var(--color-ink);
+  --tracking-display: -0.005em; --display-weight: 700;
+}
+```
+
+Three pours, stated in the stamp (`formwork: cast`). Muted sits on paper and paper-2 only; on anything darker the text is ink.
+
+| Pour | Wall and ink | Orange |
+| --- | --- | --- |
+| **Cast** (default) | concrete `oklch(74% 0.008 80)` under near-black, grain multiplied across it | `oklch(66% 0.21 38)` |
+| **Night pour** | `oklch(27% 0.006 270)` under `oklch(95% 0.006 80)`, grain screened | `oklch(70% 0.21 40)` |
+| **Drawing** | tracing paper `oklch(95% 0.012 85)` under blue-black ink `oklch(22% 0.02 260)`, no grain | a red `oklch(58% 0.21 30)` |
+
+## Type
+
+- **Display:** Oswald 700, uppercase, `--tracking-display`, roman; line-height 1.0 to 1.05 (55a), 0.9 only on a line that cannot wrap. One colour per head. Condensed, a section head takes one step up (`--text-display-s` and up), and a lone figure may run to 20rem.
+- **Body:** Archivo 400 and 500, 16 to 17px, line-height 1.5, in `--color-ink-2`.
+- **Figures (the outlier):** Archivo Narrow 500, tabular, sentence case, for measurements and counts: a radius in millimetres, a depth, a week, a park's number.
+- **Labels, captions, table heads, meta:** Archivo 500 a step smaller, sentence case, untracked. No mono on the page.
+
+## Surfaces
+
+- Rules: `--rule-bar` in ink across the top of a section or a table, `--rule-hair` in `--color-paper-3` between rows.
+- Radius 0 on everything; concrete is cast against straight boards.
+- Depth is cast, never soft: a plate is `--color-plate` with a `--rule-bar` ink border and the hard `--shadow-card` in ink, one or two a page; nothing is blurred.
+- Bands: `--color-paper-2` (a darker pour) or one `--color-ink` band with `--color-paper` text; never an orange field. Two a page at most.
+- Photographs: concrete close and at work in hard daylight: a bowl's transition from the deck, board-marked walls, coping and edges, the pour and the float, a skater from behind or far off. Hard black and white, the whites clean and the blacks deep (the `photo:` line), so a picture stands off the grey paper and the orange stays the only colour. Square in a 2px ink frame, no shadow; a caption beneath in the label style; type on a photograph only over an ink scrim from its edge.
+- Texture, the grain: `texture.md` § 1 across the whole paper at `--texture-opacity` (0.05, so it may sit under running text), multiplied, screened on the night pour; it is what makes the paper read as cast.
+
+## Range
+
+- **A figure cast as a plate:** the prompt's one real count in Oswald at 14 to 20rem on a plate with the hard shadow, its unit and what it counts in Archivo beside it.
+- **Steps as a pour sequence:** three or four stages across the twelve columns under a `--rule-bar`, each an Oswald numeral at `--text-display-s`, a one-word stage and one plain line, verticals in `--color-paper-3` between.
+- **Comparison as two plates:** two audiences or two jobs side by side, each a plate with its rows on hairlines; orange only on the one action.
+- **Statement on the ink band:** one line of Oswald capitals at display size in `--color-plate-ink` on `--color-ink`, grain screened.
+
+## Controls
+
+- The pair: an orange primary raised on a hard `0 3px 0` shadow in `--color-accent-deep` that presses down 3px on `:active`, beside a pressed-in secondary (`inset 0 2px 3px`, a 2px ink border). Both in Oswald 700 capitals, untracked, following the display; radio labels are labels, Archivo sentence case.
+- Links are ink, underlined, orange on hover; inputs are pressed in like the secondary.
+- Orange stays under 5% of a screen: the primary, one figure, the focus ring.
+
+## Motion
+
+Concrete does not move. A control presses in over `--dur-micro` on `--ease-out`; state lands at once. Nothing on scroll, nothing ambient.
+
+## Voice
+
+A foreman's plain talk: what was poured, where, for whom and when it opens. Short lines, every figure with its unit.
+
+## Do-nots
+
+- Never a rounded corner, a blurred shadow or a second accent; the hard shadow and the orange are the material.
+- Never draw the concrete (board seams, tie holes, cracks, a hazard stripe); photograph it.
+- Never a colour photograph beside the orange; pictures print in black and white.
+- Never Oswald in lowercase or at a light weight; it is 700 capitals.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Oswald:wght@700&family=Archivo:wght@400;500&family=Archivo+Narrow:wght@500&display=swap" rel="stylesheet">
+```
+
+```css
+h1, h2, h3 { font-weight: 700; text-transform: uppercase; }
+.btn { border-radius: 0; padding: var(--space-sm) var(--space-xl); font: 700 var(--text-sm)/1.6 var(--font-display); text-transform: uppercase; }
+.btn--primary { background: var(--color-accent); color: var(--color-accent-ink); box-shadow: 0 3px 0 var(--color-accent-deep);
+  transition: translate var(--dur-micro) var(--ease-out), box-shadow var(--dur-micro) var(--ease-out); }
+.btn--primary:active { translate: 0 3px; box-shadow: 0 0 0 var(--color-accent-deep); }
+.btn--secondary { background: var(--color-paper-2); color: var(--color-ink); border: 2px solid var(--color-ink); box-shadow: inset 0 2px 3px color-mix(in oklab, var(--color-ink) 30%, transparent); }
+.card { background: var(--color-plate); border: var(--rule-bar) solid var(--color-ink); box-shadow: var(--shadow-card); }
+.photo img { outline: 2px solid var(--color-ink); outline-offset: -2px; }
+.band--cast { position: relative; isolation: isolate; background: var(--color-paper-2); }
+::selection { background: color-mix(in oklab, var(--color-accent) 35%, transparent); }
+```

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

@@ -0,0 +1,98 @@
+---
+name: Furrow
+slug: furrow
+genre: modern-minimal
+paper: light 96 85
+display: grotesk-sans Red Hat Display
+accent: warm 40
+posture: committed
+keywords: farm, agriculture, land, field, livestock, sheep, cattle, crop, records, compliance, inspection, fleet, field service, rural, contractor, hectares, yard, outdoors, seasonal, working, units
+material: warm manila paper, near-black ink in rules, a generated survey map in sienna contours and slate water, Red Hat Display 600 over Red Hat Text with Red Hat Mono figures, moulded 6px keys, a waterproof notebook card, one tangerine signal and a grass green for what is in date
+photo: natural con=8 sat=-6
+pictured: Field Record, Map hero
+---
+
+# Furrow
+
+A working records voice drawn on the land itself: warm manila paper, near-black ink, and the place the work happens generated as a survey map (contours, hedges, walls, water, the holding edged in tangerine like a title plan) with the records pinned where they happened. Entries open as waterproof notebook pages; the rest is ruled lists, figures with their units and moulded keys. Tangerine is ear tag and baler twine; green is what is in date. It is not a pastoral lifestyle page, not a glossy dashboard and not a sat-nav.
+
+## Tokens
+
+```css
+:root {
+  --color-paper: oklch(96% 0.011 85); --color-paper-2: oklch(99.5% 0.005 85); --color-paper-3: oklch(92% 0.016 85);
+  --color-ink: oklch(18% 0.006 60); --color-ink-2: oklch(28% 0.008 60); --color-muted: oklch(44% 0.012 60); --color-rule: oklch(88% 0.013 85);
+  --color-accent: oklch(70% 0.19 40); --color-accent-ink: oklch(18% 0.006 60); --color-accent-soft: oklch(91% 0.05 50); --color-focus: oklch(60% 0.19 40);
+  --color-green: oklch(48% 0.11 150); --color-green-soft: oklch(92% 0.04 150);
+  --color-contour: oklch(62% 0.07 58); --color-water: oklch(60% 0.05 232); --color-hedge: oklch(50% 0.1 150);
+  --color-grid: oklch(90% 0.014 85); --color-grid-strong: oklch(85% 0.018 85); --color-sheet: oklch(99.3% 0.004 85);
+  --font-display: "Red Hat Display", "Red Hat Text", ui-sans-serif, sans-serif; --font-body: "Red Hat Text", ui-sans-serif, system-ui, sans-serif;
+  --font-outlier: "Red Hat Mono", ui-monospace, monospace;
+  --radius-card: 10px; --radius-entry: 14px; --radius-pill: 6px; --rule-hair: 1px;
+  --shadow-card: 0 1px 2px oklch(18% 0.006 60 / 0.08), 0 14px 28px -16px oklch(18% 0.006 60 / 0.28);
+  --shadow-lift: 0 1px 1px oklch(18% 0.006 60 / 0.1), 0 2px 4px -1px oklch(18% 0.006 60 / 0.1), 0 24px 44px -20px oklch(18% 0.006 60 / 0.42);
+  --tracking-display: -0.035em; --display-weight: 600;
+}
+```
+
+## Type
+
+- **Display:** Red Hat Display 600, `--tracking-display`, line-height 1.0, sentence case; a price that is the offer sets in it at display size; an entry's time in it at 44px, tabular.
+- **Body:** Red Hat Text 400, line-height 1.55, `--color-muted`; 500 for a row's title.
+- **Labels, chips, tabs:** Red Hat Text 500 a step smaller, sentence case, untracked. Never mono, never uppercase.
+- **Figures (mono as material):** Red Hat Mono 400 and 500, tabular, a step smaller than the text beside them, only for what gets copied onto a form: dates, times, tag numbers, doses, batches, hectares. Place names on the map in Red Hat Text 500, sentence case, set along their field as a surveyor would.
+
+## Surfaces
+
+- The survey map, generated on a canvas on load and resize, never a picture: contours traced from noise by marching squares in `--color-contour`, every fifth heavier and labelled; hedges dotted in `--color-hedge`, walls solid ink, water in `--color-water`, buildings hatched, a lane and a gate; the holding edged in tangerine. Paper grain, fibre and two fold creases are drawn into the map only. A still frame of it is the no-script fallback.
+- On the map: pins in three shapes (disc, diamond, triangle) for the kinds of record, an ink tag beside each with its time; the open one turns tangerine; a movement draws as a dashed route. A map loupe (1.9x, fine ring, reticle) rests on one landmark and glides to the pointer.
+- The notebook card: `--color-paper-2` at `--radius-entry`, a 1px ink ring and `--shadow-lift`, an ink head with the kind and the time, then cells on an 8px `--color-grid` notebook grid parted by 1px ink lines, and 56px step keys at the foot.
+- An exported record is a letter-folded sheet opened flat: `--color-sheet`, 3px corners, two creases lit from above.
+- Rules: a 1px ink rule over a list, `--color-rule` hairlines between rows, a 2px ink rule over a total. Only the card and the white sheet lift.
+- Photographs: the holding in ordinary weather at mid distance; natural, never golden hour; 10px radius, or full-bleed under an ink scrim.
+
+## Range
+
+- **The day on the map:** entries pinned where they happened, one open as a notebook card.
+- **The book as an index:** a ruled table on the white sheet, a segmented filter of the logs above, chips for in date and in withdrawal.
+- **One day by the hour:** logs as rows against the hours, each entry a pin with its tag.
+- **The bill over the land:** the price as ruled lines on the tangerine field, a contour fragment with a hedge, a gate and one pin behind it.
+
+## Controls
+
+- Moulded keys at 6px, 48px tall: the primary tangerine with ink text, a lit inset top edge and a shaded inset bottom; the secondary white with a 1px `--color-rule` border and the same lit edge. Active sinks 1px.
+- Fields hold their label inside the box, small and muted at the top left, the value beneath; white, 52px, a 1px `--color-muted` border; a figure field sets in mono.
+- Tangerine is a fill with ink on it: the primary, the selected tab, the open pin, the holding's edge, the field band, the focus ring.
+
+## Motion
+
+Once, in view: pins land in time order, the route draws, the card opens, the loupe settles. Transforms and opacity, `--ease-out`, paused off screen. Reduced motion or no script: the pins down, one entry open.
+
+## Voice
+
+Plain and unit-bearing: 3.6 ha, 10 ml, 28 days, a pound sign on a price. Never a number without its unit, never a pastoral adjective.
+
+## Do-nots
+
+- Never tangerine as type; it is a fill with ink on it.
+- Never a map tile, a satellite photograph or a pin-drop icon; the land is a generated survey.
+- Never grain or creases outside the map.
+- Never mono on a label, a chip or a head.
+
+## Build hint
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Red+Hat+Display:wght@600&family=Red+Hat+Text:wght@400;500&family=Red+Hat+Mono:wght@400;500&display=swap" rel="stylesheet">
+```
+
+```css
+h1, h2, h3 { font-weight: var(--display-weight); line-height: 1; }
+.btn { min-height: 48px; border: var(--rule-hair) solid var(--color-rule); border-radius: var(--radius-pill); padding: 0 var(--space-lg); font-weight: 500; background: var(--color-paper-2); color: var(--color-ink); box-shadow: inset 0 1px 0 var(--color-sheet), 0 1px 1px var(--color-rule); }
+.btn--primary { background: var(--color-accent); color: var(--color-accent-ink); border-color: color-mix(in oklab, var(--color-accent) 78%, var(--color-ink)); box-shadow: inset 0 1px 0 color-mix(in oklab, var(--color-sheet) 32%, transparent), inset 0 -1px 0 color-mix(in oklab, var(--color-ink) 10%, transparent); }
+.btn:active { transform: translateY(1px); }
+.ruled { border-top: var(--rule-hair) solid var(--color-ink); } .ruled > * { border-bottom: var(--rule-hair) solid var(--color-rule); }
+.entry { border-radius: var(--radius-entry); background: var(--color-paper-2); box-shadow: 0 0 0 1px var(--color-ink), var(--shadow-lift); overflow: hidden; }
+.notebook { background: linear-gradient(var(--color-grid) 1px, transparent 1px) 0 0 / 8px 8px, linear-gradient(90deg, var(--color-grid) 1px, transparent 1px) 0 0 / 8px 8px, var(--color-paper-2); }
+.field label { position: absolute; left: var(--space-md); top: var(--space-xs); font-size: 0.75rem; font-weight: 500; color: var(--color-muted); }
+.num { font-family: var(--font-outlier); font-variant-numeric: tabular-nums; }
+```