@design-intelligence/ghost 0.20.0 → 0.22.0

package/dist/init-payloads/vessel-light/checks/median-tells.md

@@ -0,0 +1,103 @@
+---
+name: Median tells
+description: Flags the measured defaults of unsteered generation and current model-signature tells — hover-lift, default accents, unprompted dark theme, gradient text, frequency tells, and per-model signatures.
+severity: high
+references:
+  - anti-goal.median > Hover-lift
+  - anti-goal.median > Indigo accent
+  - anti-goal.median > Dark theme
+  - anti-goal.median > Gradients
+  - anti-goal.median > Glassmorphism
+  - anti-goal.median > Side-stripe
+  - anti-goal.median > Cream surface
+  - anti-goal.median > Chat bubbles
+  - anti-goal.median > Stock copy
+  - anti-goal.median > Celebration
+  - anti-goal.median > Hero metric
+  - anti-goal.median > Eyebrow kicker
+---
+
+This is Vessel's adaptation of the shared median check; the fidelity carve-outs
+below are the body's own. These flags target the measured convergence patterns
+of unsteered model generation, plus tells specific to individual models. Each
+is mechanically detectable in a diff. Pruning a rule from `anti-goal.median`
+orphans its paired reference here — `ghost validate` warns; delete the flag and
+its reference together.
+
+Flag `transform` with `translateY` inside a `:hover` rule on cards, buttons,
+or list items, especially paired with a shadow increase. Hover confirmation
+in Vessel is color and background change, not lift.
+(`anti-goal.median > Hover-lift`)
+
+Flag accent values in the indigo/blue/purple default family (`#4f46e5`,
+`#6366f1`, `#2563eb`, `#3b82f6`, `#8b5cf6`, and close neighbors) unless the
+diff shows the user asked for them. They are model defaults, not palette
+members. (`anti-goal.median > Indigo accent`)
+
+Flag whole-page dark backgrounds when the ask did not request dark mode.
+Dark surfaces in Vessel are the editorial dark band or an explicit `.dark`
+theme, never an unprompted default. (`anti-goal.median > Dark theme`)
+
+Flag `linear-gradient` or `radial-gradient` as page or section backgrounds,
+and gradient-filled buttons. (`anti-goal.median > Gradients`)
+
+Flag `backdrop-filter: blur` used for glassmorphism cards.
+(`anti-goal.median > Glassmorphism`)
+
+Flag `background-clip: text` (with or without the `-webkit-` prefix) paired
+with a gradient. Emphasis comes from weight or size in a single solid color.
+
+Flag a thick colored border on one side of an element (`border-left` or a
+`border-l-*` utility at 2px or more in a non-neutral color) while the other
+sides stay thin. (`anti-goal.median > Side-stripe`)
+
+Flag warm off-white page backgrounds in the cream/sand/beige band, and token
+names like `--cream`, `--sand`, `--parchment`, `--linen` introduced by the
+diff. (`anti-goal.median > Cream surface`)
+
+Flag assistant messages rendered as bubbles with initials-circle avatars.
+(`anti-goal.median > Chat bubbles`)
+
+Flag emoji used as icons or imagery in interface chrome. Text labels carry
+meaning.
+
+Flag stock template copy in headings: "Simple, transparent pricing",
+"Welcome back", and interchangeable-with-a-competitor phrasing. Recommend
+copy that states what this product specifically does.
+(`anti-goal.median > Stock copy`)
+
+Flag exclamation-marked success copy, confetti language, and celebratory UI
+("You did it!", "Awesome!"). Confirmation is quiet and factual.
+(`anti-goal.median > Celebration`)
+
+Flag the hero-metric template — a big number, small label, and supporting
+stats as default proof — unless the metric shows real user data. Recommend
+evidence specific to the product, or nothing.
+(`anti-goal.median > Hero metric`)
+
+Frequency tells — the crime is repetition, not the move (advisory):
+
+Flag three or more uppercase, tracked eyebrow kickers above section headings
+in one page. One named kicker is voice; a kicker on every section is model
+grammar. (`anti-goal.median > Eyebrow kicker`)
+
+Flag five or more em-dashes in body copy in one view.
+
+Flag three or more instances of the aphoristic rebuttal cadence ("Not X. Y."
+/ "Sentence. No qualifiers.") in one page's copy.
+
+Model-signature tells — skip any block whose model did not produce the diff
+(advisory):
+
+Codex: flag a 1px border paired with a box-shadow of 16px blur or more on
+the same element — pick a solid border or a tight shadow, not both. Flag
+border-radius of 32px or more on cards, sections, or inputs. Flag 1px
+linear-gradient grid or repeating-stripe backgrounds used as decoration.
+
+Gemini: flag `transform` (scale, rotate, translate) on `img` inside a
+`:hover` rule, including group-hover utilities targeting a child image.
+Animate the card's background, border, or shadow instead.
+
+Do not flag pill-shaped controls or fluid clamp display headings — those
+median patterns are deliberately shared by Vessel and their presence is
+fidelity.

package/dist/init-payloads/vessel-light/checks/motion-restraint.md

@@ -0,0 +1,20 @@
+---
+name: Motion restraint
+description: Flags non-token motion, looping decoration, and keyframes that do not explain state change.
+severity: medium
+references:
+  - grammar.motion
+  - signature.temperature
+---
+
+Review changed transitions and animations for vocabulary first.
+
+Flag durations that do not use `--duration-fast`, `--duration-normal`, or `--duration-slow`. A hard-coded millisecond value is a drift even when it matches the token today.
+
+Flag custom easing unless it uses the fingerprint's one ease or a browser default already required by the primitive.
+
+Flag looping animations outside explicit loading states. Loading must be tied to ongoing work, not ambient motion.
+
+Flag decorative keyframes: glow, float, shimmer, bounce, pulse, parallax, or any motion that can be removed without making a state change harder to understand.
+
+Recommend the smallest opacity or transform transition that explains the state change.

package/dist/init-payloads/vessel-light/checks/relationships.md

@@ -0,0 +1,33 @@
+---
+name: Relationship discipline
+description: Flags structural violations of the grammar — emphasis-ladder breaks, sibling margins, decorative borders, nested cards. These rules survive any adaptation.
+severity: high
+references:
+  - grammar.hierarchy
+  - grammar.rhythm
+  - grammar.surfaces
+  - anti-goal.median > Nested cards
+---
+
+These assertions test relationships between token roles, not the values behind
+them. They hold for any brand built on this grammar; an adapted package keeps this check
+unchanged.
+
+Flag more than one primary-variant button per view. Secondary actions step
+down the emphasis ladder: secondary, outline, ghost, or link.
+
+Flag `margin` set on siblings inside a stack in changed CSS or inline styles.
+Rhythm comes from the gap scale; recommend changing the stack gap or splitting
+the stack.
+
+Flag borders, fills, gradients, glass effects, or colored accents used to make
+ordinary structure feel designed. Recommend semantic surfaces, stack spacing,
+text tone, or the existing elevation tier instead.
+
+Flag card-like surfaces nested inside card-like surfaces. One surface level
+per region; interior hierarchy comes from spacing and type, not another
+container.
+
+Flag `box-shadow` values that belong to no declared elevation tier and no
+component-owned shadow. Do not accept a custom shadow because it is visually
+close to a tier — elevation is a closed set, whatever the values are.

package/dist/init-payloads/vessel-light/checks/shape-matches-job.md

@@ -0,0 +1,43 @@
+---
+name: Shape matches the job
+description: Flags views composed for the wrong reader job — a form styled as a table, an announcement headline over a reviewable artifact, a live state presented as settled fact, a second primary, or a skeleton loader standing in for content.
+severity: high
+references:
+  - grammar.job
+  - grammar.deletion
+  - grammar.hierarchy
+---
+
+Apply this check to diffs that add or restructure a view. Classify the
+reader's job first — what they do next with the view — then judge the
+composition against the ref that job routes to. These flags catch the
+template-convergence failure: a plausible layout applied to a job it does
+not fit.
+
+Flag a view whose job routes to one ref but whose composition imitates
+another — a submit-and-done task laid out as a dashboard of cards, a
+records-scanning task rendered as prose sections, a stop-and-decide moment
+inlined into the page instead of interrupting it. (`grammar.job`)
+
+Flag an announcement headline in display or headline type above an artifact
+the reader will review — "Here's your draft", "Your plan is ready", "All
+set". The artifact opens the view; status lives in quiet metadata or
+nowhere. (`grammar.job`)
+
+Flag a live or ongoing value presented without its freshness — no timestamp
+or "updated" line in muted metadata near the figure. A moving value styled
+as a settled fact misleads. (`grammar.job`)
+
+Flag recommendation or verdict framing where the decision belongs to the
+reader and the system cannot honestly rank the options. Present the
+material; withhold the verdict. (`grammar.job`)
+
+Flag a second primary-variant action in a view, and flag a promoted primary
+on a view that honestly earns none — a steady status view, an open
+comparison. Zero is a valid spend of `--primary-budget`.
+(`grammar.hierarchy`)
+
+Flag skeleton loaders, placeholder shimmer, or staged construction where
+content will land — and any element that cannot name what breaks if it is
+removed. The fix is demotion or deletion, never more emphasis.
+(`grammar.deletion`)

package/dist/init-payloads/vessel-light/checks/values.md

@@ -0,0 +1,51 @@
+---
+name: Value discipline
+description: Flags off-signature values — non-pill controls, off-palette hues, raw color literals, expression over budget. Adapting the dials rewrites this check alongside the signature nodes.
+severity: high
+references:
+  - signature.shape
+  - signature.palette
+  - grammar.color-roles
+  - register.data-density
+  - register.editorial
+  - register.email
+---
+
+These assertions test Vessel's current answers to the signature dials. A
+adaptation that changes the dials rewrites this check with them; the paired
+relationship check stays.
+
+Review changed HTML and CSS by view, not just by file. Classify the register
+of each changed view first: table layout, `bgcolor`, or a 600px wrapper means
+email; display-scale headings, `--section-padding-vertical`, or
+`--surface-dark-*` means editorial; compressed smallest-gap-step layouts with
+mono numerals means data-density; otherwise product.
+
+Flag buttons or text inputs that are not pill-radius (`--radius-control`).
+A rectangular control is a token violation, not a style choice.
+
+Flag surfaces that carry a radius other than `--radius-surface`, and radius
+roles swapped across the boundary: control radius on a surface, surface
+radius on a control.
+
+Count distinct non-gray colors visible in each view, then judge against that
+register's expression budget: product views get one functional accent, with
+expression hues permitted only inside chart or visualization markup; data
+consoles get one status hue family with the same chart carve-out; email gets
+one expressive moment in one hue; editorial pages get at most two expression
+hues. Flag anything over budget, and flag expression hues used
+atmospherically outside their register. Status colors count toward the total
+unless the view compares two or more distinct statuses side by side.
+
+Flag any color that is neither a gray, a status token, nor one of the five
+expression hues (`--expression-1` through `--expression-5`, or their hex
+values in email). Invented hues are drift in every register.
+
+Flag expression hues on buttons, inputs, or links in every register. Controls
+stay monochrome; no budget covers them.
+
+Flag raw hex, rgb, hsl, or named color values in changed CSS or inline styles
+when a Vessel token could express the same role. The authoring vocabulary is
+semantic tokens, not literal color. Exception: email files — hardcoded values
+transcribed from tokens are the contract there; flag only values that
+correspond to no token and no expression hue.

package/dist/init-payloads/vessel-light/glossary.md

@@ -0,0 +1,44 @@
+---
+kinds:
+  - name: grammar
+  - name: signature
+  - name: register
+  - name: anti-goal
+---
+
+# grammar
+
+The brand's decision logic: closed sets, role vocabularies, and assembly
+rules, stated in token roles and never in literal values. Grammar survives an
+adaptation unchanged — adapt the package, swap every value, and these nodes still
+hold. Gather grammar before inventing structure.
+
+# signature
+
+The dials: the choices that make this brand this brand, each stated as a
+current answer that stands until you replace it. Signature nodes name real
+values because they are the values — on adaptation, edit the token roles in
+`materials/tokens.css` and restate the node. Gather signature before setting
+any value a dial governs.
+
+# register
+
+A condition-scoped contract: a situation — data-dense consoles, editorial
+pages, transactional email — where parts of the default rules invert. Each
+register names its condition first. Truths from the wrong register are
+poison, not context; gather a register only when its condition matches the
+task.
+
+# anti-goal
+
+What this package refuses, each reject paired with its replacement.
+`anti-goal.median` is the model's floor, not the brand's taste;
+`anti-goal.tells` is the near-miss map of this brand's own signature. Gather
+anti-goals before styling anything greenfield.
+
+---
+
+To adapt this package to another brand, follow the `adapting-a-starter`
+recipe in the ghost skill bundle. In short: new manifest id, prune the
+median rules your brand legitimately violates, answer each signature node,
+edit `materials/tokens.css`, regenerate the refs, rewrite the tells.

package/dist/init-payloads/vessel-light/grammar.color-roles.md

@@ -0,0 +1,30 @@
+---
+description: "Semantic color roles and the rules that govern them — gather before choosing any color; roles not raw values, status is meaning, expression is register-gated and never on controls."
+materials:
+  - materials/tokens.css
+  - "**/*.css"
+  - "**/*.html"
+---
+
+The token file is the source of truth. An agent may combine tokens, but it
+may not author around them. Raw color values are implementation detail, never
+product language.
+
+Author with semantic roles: `background`, `foreground`, `card`, `popover`,
+`primary`, `secondary`, `muted`, `border`, `input`, `ring`, and the status
+roles. If a container needs a color, it first needs a role.
+
+The status roles — destructive, success, warning, info — exist only when
+meaning demands them. Destructive means destructive or error. Success means
+success. Warning means warning. Info means information. None of them are
+brand accents, and they never moonlight as atmosphere, in any register.
+
+One view should not perform a color palette. If a status color is present,
+let the rest of the view stay on the base roles. Richness beyond this is
+register-gated: a closed expression set (`--expression-*`) exists, but its
+size, members, and volume ladder are a brand answer — see the palette
+signature — and each register caps how loud they may be.
+
+The constant that holds across every register: expression never touches what
+you click. Buttons, inputs, and links stay on the base roles everywhere. A
+colored control is a different design system.

package/dist/init-payloads/vessel-light/grammar.conversation.md

@@ -0,0 +1,30 @@
+---
+description: "Conversation grammar — plain assistant text, compact user surfaces, collapsed tool calls, one structured prompt input; gather for any AI thread, agent console, review assistant, or prompt composer."
+materials:
+  - materials/ref/composition.conversation.html
+  - "**/*.html"
+---
+
+Conversation UI is not chat cosplay. The assistant speaks on the page surface
+as plain text: no bubble, no border, no fill.
+
+User turns are compact muted surfaces aligned right. They mark authorship
+without turning the thread into alternating balloons.
+
+Assistant hierarchy comes from prose, spacing, and type. Wrapping assistant
+messages in cards makes the system look defensive and wastes density.
+
+Tool calls are operational evidence. Collapse them to a labeled one-line
+summary with status. Expand only when the user asks for detail, then show
+mono content inside the disclosed area.
+
+The prompt input is one bordered surface. The textarea region stays empty of
+controls so writing remains the focus. Attachments, model choices, secondary
+tools, and send live in a single row below it.
+
+There is one primary send action. Stop and send are mutually exclusive states
+of the same action area, not two competing primary buttons.
+
+Use the conversation reference when building any AI thread, agent console,
+review assistant, or prompt composer. It carries the grammar that agents most
+often get wrong.

package/dist/init-payloads/vessel-light/grammar.deletion.md

@@ -0,0 +1,35 @@
+---
+description: "The deletion pass — every element must name what breaks if it goes; the fix for a crowded view is always demotion or deletion, never more emphasis; surfaces arrive settled, with no skeleton theater. Gather as the final pass over any composition, and whenever a view feels crowded, busy, or dressed up."
+---
+
+Restraint is not a mood; it is a test every element has to pass. Before a
+view ships, run the pass: each label, divider, icon, caption, and helper
+line must name what breaks if it is removed. If nothing breaks, delete it.
+Convention is not a reason — "forms usually have this" keeps nothing.
+
+The test has a direction. When a view is crowded, or two elements compete
+for attention, the fix is always demotion or deletion — never adding
+emphasis to the loser. Raising the volume of one element to beat another
+starts an arms race the composition always loses; removing the weaker claim
+ends it.
+
+Some deletions we have already made, permanently: no decorative dividers
+where a gap step states the relationship; no icons that restate their
+adjacent label; no tooltips explaining obvious controls; no onboarding
+chrome on routine views; no credibility costume — a small factual source or
+timestamp line beats a dashboard of gauges.
+
+A view also arrives settled. No skeleton loaders, no placeholder shimmer
+promising content that is not there — a fake page is hedging rendered as UI.
+While work is genuinely pending, show the smallest true statement (a quiet
+loading state, per the motion doctrine's loop exception) and nothing else.
+When content lands, it lands in its final position: no reflow, no staggered
+construction, no element arriving late to shift its neighbors.
+
+Do: a settings page whose every row survives the what-breaks question, with
+one primary action and gaps doing the dividing. Never: the same page with
+icon-per-row decoration, a divider under every group, a progress shimmer on
+load, and a bolded second CTA competing for the eye.
+
+After everything deletable is gone, whatever remains is unmistakably the
+point.

package/dist/init-payloads/vessel-light/grammar.hierarchy.md

@@ -0,0 +1,58 @@
+---
+description: "The closed hierarchy vocabulary — six text variants, seven tones, a five-rung control emphasis ladder, one primary per view — gather for any view that contains text or actions."
+materials:
+  - materials/primitives.css
+  - materials/ref/composition.form.html
+  - "**/*.html"
+  - "**/*.css"
+---
+
+Hierarchy is a closed vocabulary, not a size slider. Every piece of text and
+every control picks from a named set; anything outside the set is a broken
+primitive, not a variant.
+
+The text variants are exactly six: display, headline, title, body, label,
+mono. Variant names are jobs, not decoration. Display leads a rare editorial
+moment. Headline names a section. Title anchors a card, dialog, or compact
+region. Body carries reading. Label names structure — category tags, field
+labels, bylines, metadata, compact status. Mono carries code and machine
+detail. Do not fake hierarchy with arbitrary font sizes; choose the tier that
+matches the job, then use tone, weight, and spacing for the rest.
+
+The tones are exactly seven: default, muted, inverse, success, warning, info,
+destructive. Tone is part of the message. Default is the main reading plane.
+Muted carries secondary information. Inverse is for dark or primary surfaces.
+The four status tones appear only when the words have that state meaning.
+Hierarchy starts with tone and weight before size — a secondary note usually
+wants muted body or label, not a smaller custom font. If the prose needs
+emphasis, improve the sentence before adding a style.
+
+The control emphasis ladder is exactly five rungs: primary, secondary,
+outline, ghost, link. At most one primary action per view is the rule
+(`--primary-budget: 1`); everything else steps down the ladder. Primary is
+for the action the screen exists to complete — if two buttons both look
+primary, the hierarchy failed. And some views honestly earn none: a steady
+status view or an open comparison has no action the screen exists to
+complete, and promoting one anyway puts the system's thumb on the scale.
+Zero is a valid spend.
+Destructive is a meaning, not a rung: it is rare, it names the destructive
+act directly, and it is never borrowed for urgency, emphasis, or brand heat.
+
+Fields are quiet until they are active: hairline border, muted placeholder,
+clear label, and a focused ring when the user engages. The focus ring is
+guidance, not decoration. Errors state facts next to the field that caused
+them — do not hide field errors in modals, toasts, or generic banners when
+the user needs to fix one input.
+
+Figures that will be compared or scanned — amounts, counts, dates in
+columns, any metric — set in tabular numerals (`--numeric-tabular`), with
+the unit tight to the number. Proportional figures in a data column wobble,
+and a wobbling column reads as sloppy arithmetic. Mono already carries this
+for machine detail; the rule extends to any numeric data in product UI.
+
+Balanced text is for headings and compact statements. Do not balance long
+body copy into jagged reading.
+
+The form reference shows the intended decision order: stacked labels and
+fields, compact helper text, one submit, secondary escape. Copy the decision
+order before adjusting surface detail.

package/dist/init-payloads/vessel-light/grammar.job.md

@@ -0,0 +1,54 @@
+---
+description: "The routing rule — name the reader's job before composing anything; the job picks the ref to imitate and the register that applies, never the topic. Gather first for any new view, before structure exists."
+materials:
+  - materials/ref/composition.form.html
+  - materials/ref/composition.table.html
+  - materials/ref/composition.editorial.html
+  - materials/ref/composition.overlay.html
+  - materials/ref/composition.conversation.html
+  - materials/ref/email.html
+---
+
+Before any structure exists, name what the reader does next with the view.
+The topic never picks the shape; the reader's job does. A billing question
+is not "a billing page" — it is a form to fill, a table to scan, a decision
+to confirm, or a thread to continue, and each of those is a different
+composition. A view built for the wrong job does not merely look off; it
+misleads.
+
+The jobs and where they route:
+
+- **Fill something in** — settings, signup, any submit-and-done task → the
+  form ref. Stacked labels and fields, one submit, secondary escape.
+- **Scan and compare records** — lists, audits, anything with rows and
+  figures → the table ref, in the data-density register.
+- **Read a narrative** — a landing page, an announcement, a story → the
+  editorial ref, in the editorial register.
+- **Stop and decide** — a confirmation, a destructive act, a choice that
+  interrupts the task → the overlay ref. The decision is the view.
+- **Converse with the system** — an AI thread, an agent console, a prompt
+  composer → the conversation ref.
+- **Be notified elsewhere** — receipts, alerts, anything that lands in an
+  inbox → the email ref, in the email register.
+
+Read the request's verbs, not its nouns: "edit / set up / submit" routes to
+form; "compare / list / review the records" to table; "announce / tell the
+story" to editorial; "confirm / are you sure" to overlay; "ask / draft with
+me" to conversation. When two jobs fold into one request, build for the job
+the reader performs on this view, now — the other job is the next view. When
+a job fits none of these, compose from the grammar and say so; do not force
+the nearest ref.
+
+Three shapes lie about the job, and we refuse them everywhere:
+
+- A view whose content is an artifact the reader will review — a draft, a
+  filled form, a generated plan — leads with the artifact, never with an
+  announcement headline. "Here's your draft" in display type demotes the
+  actual deliverable; the artifact sitting there with its actions is the
+  statement that it is ready.
+- A view reporting a live or ongoing state carries its freshness — "updated
+  2 min ago" — in quiet metadata. Presenting a moving value as a settled
+  fact is a small lie the reader eventually catches.
+- A view where the decision belongs to the reader presents the material and
+  withholds the verdict. Recommendation framing on a choice the system
+  cannot honestly make is manufactured confidence, and it reads that way.

package/dist/init-payloads/vessel-light/grammar.motion.md

@@ -0,0 +1,27 @@
+---
+description: "Motion doctrine — motion is evidence of state change, never decoration; a closed vocabulary of three duration roles and one ease; gather for any transition, animation, or hover treatment."
+materials:
+  - materials/tokens.css
+  - "**/*.css"
+  - "**/*.html"
+---
+
+Motion is evidence of a state change. It confirms hover, press, reveal,
+collapse, entrance, exit, and spatial movement. It does not entertain.
+
+The entire vocabulary is three duration roles and one ease. Fast is for hover
+and press. Normal is for reveals, fades, and small state changes. Slow is
+reserved for spatial transitions where the user needs to understand movement.
+Do not introduce novelty easings because a surface feels static; the ease's
+character is a brand answer — see the temperature signature.
+
+Nothing loops except explicit loading states. A spinner may continue because
+work continues. Decorative pulsing, floating, glowing, and attention-seeking
+keyframes are off-language.
+
+Prefer opacity and small transform changes. If removing an animation does not
+reduce comprehension, the animation was decoration.
+
+Condition: marketing and editorial surfaces may stage entrances — scroll reveals and
+section transitions are part of editorial rhythm, still built from the three
+durations and the one ease. In product UI the same staging is decoration.

package/dist/init-payloads/vessel-light/grammar.rhythm.md

@@ -0,0 +1,27 @@
+---
+description: "Layout rhythm — all layout is stacks with a closed gap step set; gather before laying anything out; never ad-hoc sibling margins."
+materials:
+  - materials/primitives.css
+  - "**/*.html"
+  - "**/*.css"
+---
+
+All layout is stacks. Rhythm comes from relationships between siblings, not
+from isolated margins pasted onto whichever element was last touched.
+
+The gap steps are exactly five: `--gap-xs`, `--gap-sm`, `--gap-md`,
+`--gap-lg`, `--gap-xl`. Choose the gap that states the relationship. Do not
+tune by single pixels to make a screenshot pass.
+
+The default is column, medium gap, stretch alignment, start justification.
+That is the ordinary reading rhythm.
+
+Columns are for almost everything: forms, cards, message lists, modal bodies,
+settings, empty states, and page sections. A column lets the user scan.
+
+Rows are conditional. Use them for controls, metadata lines, compact status,
+and paired label/value moments. If a row starts wrapping awkwardly, it
+probably wanted to be a column.
+
+Ad-hoc margins between siblings are forbidden because they hide the rhythm.
+When spacing feels wrong, change the stack gap or split the stack.

package/dist/init-payloads/vessel-light/grammar.surfaces.md

@@ -0,0 +1,35 @@
+---
+description: "Surface roles and the closed elevation set — gather for any card, popover, modal, dialog, scrim, or bordered container; flat is the default, borders are structural, exactly three elevation tiers."
+materials:
+  - materials/primitives.css
+  - materials/ref/composition.overlay.html
+  - "**/*.html"
+  - "**/*.css"
+---
+
+Surface is the only way an element gets a background, border, radius, or
+shadow. If a container needs visual treatment, it first needs a surface role.
+
+The vocabulary is closed: role, padding, radius, border, and elevation. These
+axes create enough range for page flow, cards, popovers, muted blocks,
+accents, and dark moments without inventing one-off boxes.
+
+The default surface is flat: no border, no shadow. We do not outline
+everything to prove layout exists.
+
+The elevation tiers are exactly three: card, popover, modal. Elevation
+implies hierarchy — a card sits in the document flow, a popover floats above
+the flow, a modal interrupts the task. Pick the tier that matches the
+interaction; never write a custom shadow because the composition feels flat,
+and never pair a low tier with an interrupting role or give a routine card
+modal gravity. Component shadows belong to the primitives that own them;
+never borrow them for layout.
+
+Borders are structural, especially for inputs and overlays. They are not
+decorative frames around ordinary text — reject borders as decoration,
+especially around assistant text, and use space, tone, and type hierarchy
+instead.
+
+The overlay reference shows the interrupting end of the system: background
+scrim, modal radius, modal shadow, compact header, clear footer. Copy its
+hierarchy when a user must stop and decide.

package/dist/init-payloads/vessel-light/index.md

@@ -0,0 +1,33 @@
+---
+description: "Always read first: Vessel's design language as a raw HTML/CSS steering packet for agents."
+materials:
+  - materials/tokens.css
+---
+
+vessel-light is Vessel without the React package: the design language as a
+steering packet for agents writing raw HTML and CSS.
+
+The contract is narrow. Style only with the tokens. Compose only with the
+closed sets the grammar enumerates. Imitate the refs when the task matches —
+worked examples to copy from, not a framework to import.
+
+Grammar and the median floor are safe verbatim, unchanged by any adaptation.
+Signature nodes state Vessel's current answer and stand until you replace
+them. Registers — editorial, email, and data-density — name the situations
+where parts of the default contract invert; pull only the nodes whose
+conditions match the task, because truths from the wrong register are
+poison, not context.
+
+Monochrome comes first. Status color is functional language — danger,
+success, warning, information — never atmosphere. Atmosphere is catered: a
+five-hue expression palette whose volume rises with the register, from
+charts-only in product to two hues in editorial, and never on controls.
+
+It protects the taste that disappears when an agent freehands: quiet
+surfaces, deliberate spacing, one obvious action, restrained motion.
+
+Name the reader's job before composing anything — the job picks the ref and
+the register, never the topic. When a requested UI is not covered by a ref,
+compose from the grammar; do not invent a new styling system. Before
+anything ships, run the deletion pass: every element names what breaks if
+it goes, and the view arrives settled.

package/dist/init-payloads/vessel-light/manifest.yml

@@ -0,0 +1,3 @@
+schema: ghost.fingerprint-package/v1
+id: vessel-light
+cover: index