howone 0.1.29 → 0.1.31

package/templates/vite/.howone/skills/hallmark/site/_tests/01-tide-podcast/style.css

@@ -1,240 +0,0 @@
-/* Hallmark · macrostructure: Letter · H6 hero knobs: salutation=greeting, body=3 paragraphs, signoff=initials
- * theme: Salon · accent: warm-amber ~2% · enrichment: none (typography only)
- * studied: no · context: skipped, inferred (audio domain) · v0.6.0
- */
-
-:root {
-  --color-paper: oklch(96% 0.010 75);
-  --color-paper-2: oklch(94% 0.012 75);
-  --color-ink: oklch(22% 0.012 60);
-  --color-ink-soft: oklch(38% 0.014 60);
-  --color-rule: oklch(82% 0.014 70);
-  --color-accent: oklch(62% 0.13 55);
-
-  --font-display: "IBM Plex Mono", ui-monospace, SFMono-Regular, monospace;
-  --font-body: "Cormorant Garamond", "Source Serif 4", "Iowan Old Style", Georgia, serif;
-
-  --space-3xs: 0.25rem;
-  --space-2xs: 0.5rem;
-  --space-xs: 0.75rem;
-  --space-sm: 1rem;
-  --space-md: 1.5rem;
-  --space-lg: 2rem;
-  --space-xl: 3rem;
-  --space-2xl: 4.5rem;
-  --space-3xl: 6.5rem;
-  --space-4xl: 9rem;
-
-  --measure-prose: 56ch;
-
-  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
-  --dur-micro: 120ms;
-}
-
-* { box-sizing: border-box; }
-
-html, body { overflow-x: clip; }
-
-body {
-  margin: 0;
-  background: var(--color-paper);
-  color: var(--color-ink);
-  font-family: var(--font-body);
-  font-size: 1.125rem;
-  line-height: 1.55;
-  font-feature-settings: "ss01", "lnum";
-  -webkit-font-smoothing: antialiased;
-}
-
-.page {
-  max-width: 56rem;
-  margin: 0 auto;
-  padding: var(--space-2xl) var(--space-lg) var(--space-3xl);
-}
-
-/* Masthead — small mono row */
-.masthead {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  font-family: var(--font-display);
-  font-size: 0.75rem;
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-  color: var(--color-ink-soft);
-  border-block-end: 1px solid var(--color-rule);
-  padding-block-end: var(--space-sm);
-  margin-block-end: var(--space-2xl);
-}
-
-.masthead__brand { color: var(--color-ink); font-weight: 500; }
-.masthead__meta { font-variant-numeric: tabular-nums; }
-
-/* Salutation — the letter opens here */
-.salutation {
-  font-family: var(--font-display);
-  font-size: clamp(1.5rem, 2.5vw, 2.25rem);
-  font-weight: 400;
-  letter-spacing: -0.01em;
-  margin: 0 0 var(--space-xl);
-  color: var(--color-ink);
-}
-
-.salutation__caret {
-  display: inline-block;
-  width: 0.6ch;
-  height: 1em;
-  background: var(--color-accent);
-  vertical-align: -0.1em;
-  margin-inline-start: 0.1em;
-  animation: caret 1.05s steps(2, jump-none) infinite;
-}
-
-@keyframes caret {
-  0%, 50% { opacity: 1; }
-  50.01%, 100% { opacity: 0; }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .salutation__caret { animation: none; opacity: 0.7; }
-}
-
-/* Letter body — generous prose */
-.letter {
-  max-width: var(--measure-prose);
-  font-family: var(--font-body);
-  font-size: 1.4rem;
-  line-height: 1.55;
-  font-weight: 400;
-  color: var(--color-ink);
-}
-
-.letter p {
-  margin: 0 0 var(--space-lg);
-}
-
-.letter p:first-child::first-letter {
-  font-family: var(--font-body);
-  font-style: italic;
-  font-size: 4rem;
-  line-height: 0.85;
-  float: inline-start;
-  padding-inline-end: 0.18em;
-  padding-block-start: 0.12em;
-  color: var(--color-accent);
-}
-
-.letter em {
-  font-style: italic;
-  color: var(--color-ink);
-}
-
-/* Sign-off */
-.signoff {
-  font-family: var(--font-display);
-  font-size: 0.875rem;
-  text-transform: uppercase;
-  letter-spacing: 0.1em;
-  color: var(--color-ink-soft);
-  margin-block-start: var(--space-xl);
-}
-
-.signoff__name { color: var(--color-ink); }
-
-/* Listen-where row */
-.listen {
-  margin-block-start: var(--space-3xl);
-  padding-block-start: var(--space-lg);
-  border-block-start: 1px solid var(--color-rule);
-}
-
-.listen__heading {
-  font-family: var(--font-display);
-  font-size: 0.75rem;
-  text-transform: uppercase;
-  letter-spacing: 0.1em;
-  color: var(--color-ink-soft);
-  margin: 0 0 var(--space-md);
-}
-
-.listen__list {
-  list-style: none;
-  padding: 0;
-  margin: 0;
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--space-md) var(--space-xl);
-}
-
-.listen__item a {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.5ch;
-  color: var(--color-ink);
-  text-decoration: none;
-  font-family: var(--font-body);
-  font-size: 1.125rem;
-  border-block-end: 1px solid transparent;
-  padding-block-end: 2px;
-  transition: color var(--dur-micro) var(--ease-out),
-              border-color var(--dur-micro) var(--ease-out);
-}
-
-.listen__item a:hover,
-.listen__item a:focus-visible {
-  color: var(--color-accent);
-  border-block-end-color: var(--color-accent);
-}
-
-.listen__item a:focus-visible {
-  outline: 2px solid var(--color-accent);
-  outline-offset: 4px;
-}
-
-.listen__arrow {
-  font-family: var(--font-display);
-  font-size: 0.85em;
-  opacity: 0.7;
-}
-
-/* Colophon */
-.colophon {
-  margin-block-start: var(--space-3xl);
-  padding-block-start: var(--space-md);
-  border-block-start: 1px solid var(--color-rule);
-  display: flex;
-  justify-content: space-between;
-  align-items: baseline;
-  font-family: var(--font-display);
-  font-size: 0.75rem;
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-  color: var(--color-ink-soft);
-}
-
-.colophon a {
-  color: var(--color-ink-soft);
-  text-decoration: none;
-  border-block-end: 1px solid transparent;
-  transition: color var(--dur-micro) var(--ease-out),
-              border-color var(--dur-micro) var(--ease-out);
-}
-
-.colophon a:hover,
-.colophon a:focus-visible {
-  color: var(--color-ink);
-  border-block-end-color: var(--color-rule);
-}
-
-.colophon a:focus-visible {
-  outline: 2px solid var(--color-accent);
-  outline-offset: 4px;
-}
-
-/* Mobile */
-@media (max-width: 40rem) {
-  .page { padding: var(--space-xl) var(--space-md) var(--space-2xl); }
-  .letter { font-size: 1.2rem; }
-  .salutation { font-size: 1.4rem; }
-  .colophon { flex-direction: column; gap: var(--space-2xs); }
-}

package/templates/vite/.howone/skills/hallmark/site/_tests/02-streampipe-cli/brief.md

@@ -1,65 +0,0 @@
-# Test 02 v2 — Streampipe (open-source CLI)
-
-## The prompt (verbatim, same as v1)
-
-> "Make a docs landing for an open-source CLI called Streampipe. It does stream parsing for log/event pipelines. Use the Terminal theme. Audience: backend developers. Use case: install the tool and read the docs. Tone: technical, terse."
-
-## Step 0 · Pre-flight
-
-> *"No pre-flight signals — proceeding with full Hallmark stack."*
-
-## Step 1 · Design-context gate — fully answered
-
-Audience, use, tone, theme all explicit. No inference.
-
-## Step 2.5 · Project memory rotation
-
-> *"Previous run on this brief picked Workbench + Terminal. The user explicitly requested Terminal again, so theme is fixed. Picking from {Long Document, Component Playground, Specimen} for the macro this time — Long Document fits a docs-landing brief because the page asks the user to read, not click through a sticky tour."*
->
-> *"Theme: Terminal as requested. No theme rotation when the user names one."*
-
-## Step 3 · Visual ruleset loaded
-
-`macrostructures.md` (Long Document), `component-cookbook.md`, `typography.md` (single-family monospace specimen — the design IS mono), `color.md` (Terminal phosphor palette), `microinteractions.md` (single primitive: caret blink in code blocks), `anti-patterns.md`.
-
-## Step 4 · Hero enrichment
-
-> *"Enrichment: Tier-A pure-CSS terminal mockup, but inline as a `<pre>` rendered code block — no clipped-edge browser frame. The Long Document macro wants the demo embedded in the prose, not floated next to a sticky tour. Same anti-Lottie call as v1; different placement."*
-
-## Step 5 · Preview
-
-```markdown
-**Hallmark · v0.6.0**
-
-- **Macrostructure** · Long Document
-- **Theme** · Terminal (dark phosphor paper · IBM Plex Mono throughout · phosphor-green accent)
-- **Enrichment** · Tier-A pure-CSS terminal blocks (inline, embedded in prose)
-- **Sections** · Masthead · Lede · Install · How it works (3 numbered notes) · Examples · Flag table · Colophon
-- **Motion** · caret blink in code blocks (1 primitive)
-- **Slop test** · 38 / 38 ✓
-- **Diversification** · differs from v1 (Workbench/Terminal) on macrostructure (Workbench → Long Document); theme fixed by user request
-```
-
-## Step 6 · Macrostructure stamp
-
-```
-/* Hallmark · macrostructure: Long Document · H5 hero knobs: salutation=command, body=2 paragraphs, signoff=mit-license
- * theme: Terminal · accent: phosphor-green ~6% (functional, not decorative)
- * enrichment: Tier-A inline CSS-art terminal blocks (no sticky pin, no Lottie)
- * studied: no · context: explicit · v0.6.0
- */
-```
-
-## What changed vs v1
-
-- **Macro:** Workbench → Long Document. v1's Workbench pinned a code panel on the right and stepped through three actions; v2's Long Document writes the docs as prose with the demo embedded inline. Both honor the brief; the rotation rule pushed v2 toward Long Document.
-- **Theme:** unchanged (Terminal — user-requested, can't rotate).
-- **Enrichment placement:** v1's clipped-edge demo terminal is now an inline `<pre>` block embedded in paragraph 2. Same Tier-A custom-craft, different layout role.
-- **Voice:** v1 opened with `$ streampipe --help`; v2 opens with a single sentence describing what the CLI does. The `$` command moves to the install section.
-
-## What stayed the same
-
-- Theme (Terminal — user-requested).
-- Single-family monospace specimen (typography.md allows this when the single font IS the design).
-- Slop test: 38 / 38 ✓.
-- Enrichment tier (Tier-A pure-CSS).

package/templates/vite/.howone/skills/hallmark/site/_tests/02-streampipe-cli/index.html

@@ -1,105 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1" />
-  <title>Streampipe — a small CLI for parsing log and event streams</title>
-  <meta name="description" content="Streampipe is a small, fast, single-binary CLI for parsing log and event streams from stdin. Filter, transform, route." />
-  <link rel="preconnect" href="https://fonts.googleapis.com" />
-  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&display=swap" />
-  <link rel="stylesheet" href="style.css" />
-</head>
-<body>
-  <main class="page">
-    <header class="masthead">
-      <span class="masthead__brand">streampipe</span>
-      <span class="masthead__meta">v0.4.1 · MIT · 1.2 MB</span>
-    </header>
-
-    <h1 class="lede">
-      <span class="lede__prompt">$</span>streampipe — a small, fast, single-binary CLI for parsing log and event
-      streams from stdin.<span class="lede__caret" aria-hidden="true"></span>
-    </h1>
-
-    <section class="prose" aria-label="What it does">
-      <p>
-        Streampipe reads newline-delimited records (JSON, logfmt, CSV, raw) from stdin, applies a
-        sequence of filters and transforms, and writes the result to stdout. Composes with anything
-        that emits lines — <strong>tail -f</strong>, <strong>kafkacat</strong>, <strong>journalctl</strong>,
-        <strong>kubectl logs</strong>. No daemon, no config file, no telemetry.
-      </p>
-
-      <pre class="term" aria-label="Sample streampipe command and output"><span class="term__line"><span class="term__prompt">$</span> tail -f access.log | streampipe parse <span class="term__flag">--format</span> nginx <span class="term__flag">--filter</span> 'status >= 500' <span class="term__flag">--out</span> json</span><span class="term__line">    </span><span class="term__line term__line--out">{"ts":"2026-04-30T14:01:18Z","ip":"203.0.113.42","method":"POST","path":"/api/v1/checkout","status":502,"ms":4101}</span><span class="term__line term__line--out">{"ts":"2026-04-30T14:01:21Z","ip":"203.0.113.78","method":"GET","path":"/api/v1/orders/9128","status":503,"ms":12}</span><span class="term__line term__line--out">{"ts":"2026-04-30T14:01:21Z","ip":"203.0.113.42","method":"POST","path":"/api/v1/checkout","status":502,"ms":3998}</span></pre>
-
-      <p>
-        Streampipe is written in Rust, ships as a 1.2 MB static binary, and is designed to be the
-        last process in your pipeline before storage. It does not buffer. It does not retain state.
-        It does one thing per invocation, and you can pipe it into another invocation.
-      </p>
-    </section>
-
-    <section class="section" aria-labelledby="install-h">
-      <h2 class="section__head" id="install-h"><span><span class="section__num">01</span> &nbsp; Install</span><span>3 ways</span></h2>
-      <pre class="term"><span class="term__line"><span class="term__comment"># homebrew</span></span><span class="term__line"><span class="term__prompt">$</span> brew install streampipe</span><span class="term__line">    </span><span class="term__line"><span class="term__comment"># cargo</span></span><span class="term__line"><span class="term__prompt">$</span> cargo install streampipe</span><span class="term__line">    </span><span class="term__line"><span class="term__comment"># curl (Linux/macOS, no sudo)</span></span><span class="term__line"><span class="term__prompt">$</span> curl -sSL https://streampipe.dev/install | sh</span></pre>
-    </section>
-
-    <section class="section" aria-labelledby="how-h">
-      <h2 class="section__head" id="how-h"><span><span class="section__num">02</span> &nbsp; How it works</span><span>3 notes</span></h2>
-      <div class="notes">
-        <div class="note">
-          <span class="note__num">1.0</span>
-          <p class="note__body">
-            <strong>Stream in, stream out.</strong> Streampipe reads stdin line by line and writes stdout
-            line by line. Each record is independent. Memory use is bounded by the largest record, not
-            by the size of the stream. You can pipe a 200 GB log file through a 1.2 MB binary.
-          </p>
-        </div>
-        <div class="note">
-          <span class="note__num">2.0</span>
-          <p class="note__body">
-            <strong>Filters are expressions, not config.</strong> The <code>--filter</code> flag takes a
-            CEL-style expression evaluated against each parsed record: <code>status >= 500</code>,
-            <code>ms > 1000 &amp;&amp; path.startsWith('/api')</code>, <code>!has(headers.x-debug)</code>.
-            No filter file. No filter language to learn beyond the expression.
-          </p>
-        </div>
-        <div class="note">
-          <span class="note__num">3.0</span>
-          <p class="note__body">
-            <strong>Transforms are projections, not migrations.</strong> The <code>--map</code> flag
-            rewrites each record into a new shape: <code>--map '{ts: ts, p99: ms, where: path}'</code>.
-            Records are immutable inside Streampipe; transforms produce new records. There is no
-            in-place edit; debugging is therefore a pipe with one extra stage.
-          </p>
-        </div>
-      </div>
-    </section>
-
-    <section class="section" aria-labelledby="flags-h">
-      <h2 class="section__head" id="flags-h"><span><span class="section__num">03</span> &nbsp; Flags</span><span>full reference at <a href="#">streampipe.dev/docs</a></span></h2>
-      <table class="flags">
-        <thead>
-          <tr><th>Flag</th><th>Type</th><th>What it does</th></tr>
-        </thead>
-        <tbody>
-          <tr><td>--format</td><td>nginx | apache | json | logfmt | csv</td><td>Parse stdin as the named format. Default: auto-detect from first 3 lines.</td></tr>
-          <tr><td>--filter</td><td>expression</td><td>Drop records that don't match. CEL-style. Strings, numbers, booleans, arrays.</td></tr>
-          <tr><td>--map</td><td>expression</td><td>Project records into a new shape. Output keys are the keys of the expression.</td></tr>
-          <tr><td>--out</td><td>json | logfmt | csv | raw</td><td>Encode each record. Default: matches input format.</td></tr>
-          <tr><td>--quiet</td><td>flag</td><td>Suppress parse-error lines on stderr. Errors still set exit code on EOF.</td></tr>
-          <tr><td>--help</td><td>flag</td><td>Print usage and exit. Always exit 0.</td></tr>
-        </tbody>
-      </table>
-    </section>
-
-    <footer class="colophon">
-      <span><a href="#">github.com/streampipe-cli</a></span>
-      <span><a href="#">docs</a></span>
-      <span><a href="#">changelog</a></span>
-      <span><a href="#">issues</a></span>
-      <span>MIT · © 2026</span>
-    </footer>
-  </main>
-</body>
-</html>

package/templates/vite/.howone/skills/hallmark/site/_tests/02-streampipe-cli/style.css

@@ -1,250 +0,0 @@
-/* Hallmark · macrostructure: Long Document · H5 hero knobs: salutation=command, body=2 paragraphs, signoff=mit-license
- * theme: Terminal · accent: phosphor-green ~6% (functional, not decorative)
- * enrichment: Tier-A inline CSS-art terminal blocks (no sticky pin, no Lottie)
- * studied: no · context: explicit · v0.6.0
- */
-
-:root {
-  --color-paper: oklch(13% 0.020 150);
-  --color-paper-2: oklch(17% 0.022 150);
-  --color-rule: oklch(28% 0.025 150);
-  --color-ink: oklch(86% 0.040 150);
-  --color-ink-soft: oklch(62% 0.040 150);
-  --color-accent: oklch(82% 0.20 150);
-  --color-accent-dim: oklch(58% 0.16 150);
-  --color-amber: oklch(78% 0.18 80);
-
-  --font-mono: "IBM Plex Mono", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
-
-  --space-3xs: 0.25rem;
-  --space-2xs: 0.5rem;
-  --space-xs: 0.75rem;
-  --space-sm: 1rem;
-  --space-md: 1.5rem;
-  --space-lg: 2rem;
-  --space-xl: 3rem;
-  --space-2xl: 4.5rem;
-  --space-3xl: 6.5rem;
-
-  --measure-prose: 64ch;
-
-  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
-  --dur-micro: 100ms;
-}
-
-* { box-sizing: border-box; }
-
-html, body { overflow-x: clip; }
-
-body {
-  margin: 0;
-  background: var(--color-paper);
-  color: var(--color-ink);
-  font-family: var(--font-mono);
-  font-size: 0.9375rem;
-  line-height: 1.6;
-  -webkit-font-smoothing: antialiased;
-}
-
-.page {
-  max-width: 56rem;
-  margin: 0 auto;
-  padding: var(--space-2xl) var(--space-lg) var(--space-3xl);
-}
-
-/* Masthead */
-.masthead {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  border-block-end: 1px solid var(--color-rule);
-  padding-block-end: var(--space-sm);
-  margin-block-end: var(--space-2xl);
-  font-size: 0.8125rem;
-  text-transform: uppercase;
-  letter-spacing: 0.06em;
-  color: var(--color-ink-soft);
-}
-
-.masthead__brand { color: var(--color-accent); }
-.masthead__meta { font-variant-numeric: tabular-nums; }
-
-/* Lede — the salutation-as-command */
-.lede {
-  font-size: clamp(1.25rem, 2.2vw, 1.75rem);
-  line-height: 1.4;
-  margin: 0 0 var(--space-xl);
-  color: var(--color-ink);
-  max-width: var(--measure-prose);
-}
-
-.lede__prompt {
-  color: var(--color-accent);
-  margin-inline-end: 0.5ch;
-}
-
-.lede__caret {
-  display: inline-block;
-  width: 0.55ch;
-  height: 1.15em;
-  background: var(--color-accent);
-  vertical-align: -0.18em;
-  margin-inline-start: 0.15em;
-  animation: caret 1s steps(2, jump-none) infinite;
-}
-
-@keyframes caret {
-  0%, 50% { opacity: 1; }
-  50.01%, 100% { opacity: 0; }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .lede__caret { animation: none; opacity: 0.7; }
-}
-
-/* Body prose */
-.prose {
-  max-width: var(--measure-prose);
-  font-size: 0.9375rem;
-  line-height: 1.7;
-}
-
-.prose p {
-  margin: 0 0 var(--space-md);
-  color: var(--color-ink);
-}
-
-.prose strong { color: var(--color-accent); font-weight: 500; }
-
-.prose a {
-  color: var(--color-accent);
-  text-decoration: underline;
-  text-decoration-color: var(--color-accent-dim);
-  text-underline-offset: 3px;
-  transition: text-decoration-color var(--dur-micro) var(--ease-out);
-}
-
-.prose a:hover, .prose a:focus-visible {
-  text-decoration-color: var(--color-accent);
-}
-
-.prose a:focus-visible {
-  outline: 2px solid var(--color-accent);
-  outline-offset: 3px;
-}
-
-/* Inline terminal blocks */
-.term {
-  background: var(--color-paper-2);
-  border: 1px solid var(--color-rule);
-  border-radius: 4px;
-  padding: var(--space-md);
-  margin: var(--space-lg) 0;
-  font-size: 0.875rem;
-  line-height: 1.55;
-  overflow-x: auto;
-  position: relative;
-}
-
-.term__line { display: block; white-space: pre; color: var(--color-ink); }
-.term__line .term__prompt { color: var(--color-accent); }
-.term__line .term__flag { color: var(--color-amber); }
-.term__line .term__comment { color: var(--color-ink-soft); }
-.term__line.term__line--out { color: var(--color-ink-soft); }
-
-/* Section headings */
-.section {
-  margin-block-start: var(--space-2xl);
-  padding-block-start: var(--space-md);
-  border-block-start: 1px solid var(--color-rule);
-}
-
-.section__head {
-  display: flex;
-  justify-content: space-between;
-  align-items: baseline;
-  margin: 0 0 var(--space-md);
-  font-size: 0.8125rem;
-  text-transform: uppercase;
-  letter-spacing: 0.08em;
-  color: var(--color-ink-soft);
-}
-
-.section__num {
-  color: var(--color-accent);
-  font-weight: 500;
-}
-
-/* Numbered note rows (How it works) */
-.notes { display: grid; gap: var(--space-md); }
-.note {
-  display: grid;
-  grid-template-columns: 4ch 1fr;
-  gap: var(--space-md);
-  align-items: baseline;
-}
-.note__num {
-  color: var(--color-accent);
-  font-variant-numeric: tabular-nums;
-}
-.note__body {
-  color: var(--color-ink);
-  max-width: var(--measure-prose);
-}
-.note__body strong { color: var(--color-accent); font-weight: 500; }
-
-/* Flag spec table */
-.flags {
-  width: 100%;
-  border-collapse: collapse;
-  font-size: 0.8125rem;
-}
-.flags th, .flags td {
-  text-align: start;
-  padding: var(--space-2xs) var(--space-sm) var(--space-2xs) 0;
-  border-block-end: 1px solid var(--color-rule);
-  vertical-align: baseline;
-}
-.flags th {
-  font-weight: 500;
-  color: var(--color-ink-soft);
-  text-transform: uppercase;
-  letter-spacing: 0.06em;
-}
-.flags td:first-child { color: var(--color-accent); width: 18ch; }
-
-/* Colophon */
-.colophon {
-  margin-block-start: var(--space-3xl);
-  padding-block-start: var(--space-md);
-  border-block-start: 1px solid var(--color-rule);
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--space-md) var(--space-xl);
-  font-size: 0.8125rem;
-  text-transform: uppercase;
-  letter-spacing: 0.06em;
-  color: var(--color-ink-soft);
-}
-
-.colophon a {
-  color: var(--color-ink-soft);
-  text-decoration: none;
-  transition: color var(--dur-micro) var(--ease-out);
-}
-
-.colophon a:hover, .colophon a:focus-visible {
-  color: var(--color-accent);
-}
-
-.colophon a:focus-visible {
-  outline: 2px solid var(--color-accent);
-  outline-offset: 3px;
-}
-
-/* Mobile */
-@media (max-width: 40rem) {
-  .page { padding: var(--space-xl) var(--space-md) var(--space-2xl); }
-  .lede { font-size: 1.125rem; }
-  .note { grid-template-columns: 3ch 1fr; gap: var(--space-sm); }
-}