wand-kit 0.3.3 → 0.5.0

package/PROMPT.md

@@ -1,13 +1,14 @@
 # Wand Power Prompt — Studio (v0.1)
 
 One design surface for every material a sales or marketing team needs, on
-either Wand brand. The page is HTML; it is composed from a component library on
+any of the three Wand brands. The page is HTML; it is composed from a component library on
 brand tokens; Chromium renders it; every gate measures that render; and every
 export (PDF, PNG, PowerPoint, a one-file HTML) is read from it, so nothing can
 drift from what was reviewed on screen.
 
 This document is the design system and the pipeline, and the source of truth
-on every design question. `brand/BRAND.md` and `brand-next/BRAND.md` win on
+on every design question. `brand/BRAND.md`, `brand-next/BRAND.md` and
+`brand-interim/BRAND.md` win on
 values (a hex, a face, an asset); `STATUS.md` is state; `SKILL.md` is procedure.
 
 **Why this exists.** The outputs that reviewed best in October 2026 (the
@@ -22,24 +23,27 @@ components, gates, exports.
 
 ## 0. Ground truth
 
-Two brands, one component set.
+Three brands, one component set.
 
 | Brand | Directory | Faces | Guideline |
 |---|---|---|---|
 | `current` | `brand/` | Geist | the Kearney leadership deck; `brand/BRAND.md` |
-| `next` | `brand-next/` | FK Roman Standard Light, Overused Grotesk | the website, read 2026-10-05; `brand-next/BRAND.md` |
+| `next` | `brand-next/` | FK Roman Standard Light, Overused Grotesk | the staging website, read 2026-10-05; `brand-next/BRAND.md` |
+| `interim` | `brand-interim/` | Geist, Newsreader | the live wand.ai, read 2026-10-21, and the social design approved on it 2026-10-22, which wins where they differ; `brand-interim/BRAND.md` |
 
 Each directory's `tokens.json` carries the brand as values a kit can draw with:
 `swatch` (the measured hexes), `roles` (what each value is for, once per
 ground), `faces` (the files and their PowerPoint names), `shape` (radius,
-strokes) and `art` (which file plays which role). A component asks for a role
+strokes, and `artShade`, the shade the kit lays over a dark page's art, 0.3
+unless a brand says otherwise) and `art` (which file plays which role). A component asks for a role
 (`--ink`, `--accent`, `--emph`) and never for a hex. Where a hex in
 `tokens.json` and `BRAND.md` differ, `BRAND.md` is right and `tokens.json` has
 drifted.
 
-`current` is the default while the two overlap; a job is on `next` when the
-user asks for the new brand. The default is one constant, `DEFAULT_BRAND` in
-`kit/lib/brand.js`, and `doctor` prints the rule from it. The FK Roman
+`current` is the default while the brands overlap; a job is on `next` when the
+user asks for the new brand and on `interim` when they ask for the interim
+brand or the live site's look. The default is one constant, `DEFAULT_BRAND`
+in `kit/lib/brand.js`, and `doctor` prints the rule from it. The FK Roman
 Standard licence for documents is still to be confirmed
 (`brand-next/fonts/LICENSE-FONTS.md`).
 
@@ -88,6 +92,15 @@ violets as grounds, beige as paper); see `brand-next/tokens.json`. Its
 `second` is a quiet tone, not gold (7B7B79 on light, 9D99A8 on dark, large
 type only; `secondSm`, the text grey, below that size).
 
+The interim brand fills them from the live site and the social design
+approved on it (2026-10-22), which wins where they differ: the approved
+ground (`14101C`) is the dark ground, with ink `F7F5F9` and lavender
+(`D4BCE8`) the accent for what is drawn; stone (`F5F3EF`) the light ground
+with strong violet (`6D41B3`) the accent; a title's phrase is `violet`
+(`C2A1EF`) on dark, on every page including the art pages (`accentText`), and
+`765098` on light, the site's own `h1 em` colours; the spark takes the
+phrase's colour. See `brand-interim/BRAND.md`.
+
 **Rules.**
 - One accent. The accent phrase in a title is the single most recognisable
   device in the system: one per title, never two, the sentence period in ink.
@@ -98,6 +111,20 @@ type only; `secondSm`, the text grey, below that size).
   wand.ai rebuild (October 2026) read as a template while every heading's
   second line was gold: when gold is everywhere it means nothing. On the
   current brand `second` is the accent, so nothing changes there.
+- **On the interim brand a title's phrase changes face, not weight.** `<em>`
+  sets in Newsreader at the display's weight, the site's own `h1 em`; on the
+  pages that carry the art (the cover, a statement, the close) it is the
+  italic, as the hero's and the approved lockup's are. Its colour is one
+  violet on dark, the art pages too, as the approved banners set it; the
+  lavender accent stays for what is drawn, the figures and nothing else.
+- **On the interim brand the cover is the approved composition.** The planet's
+  rim, four trails sweeping under the title to their dots and up through the
+  hero's oval, drawn unshaded (`shape.artShade` 0) with the title untracked
+  (`faces.display.coverTracking` 0). The composition itself
+  (`brand-interim/assets/social/composition.json`, drawn by
+  `brand-interim/lib/composition.mjs`) is what a link preview or a social
+  banner on this brand is cut from: a window of it at one scale, never its
+  parts re-proportioned.
 - One emphasis card per row, at most one or two per page.
 - Light pages carry no art. Dark pages carry art on the cover, the closing and
   a statement; a dark content page is flat.
@@ -112,11 +139,16 @@ Three face roles per brand: `display` (titles, figures, the lockup), `body`
 Tracking and leading travel with the face in `tokens.json`; the CSS sets them
 from the same values.
 
-| Role | current | next |
-|---|---|---|
-| display | Geist SemiBold, −0.02em | FK Roman Standard Light, −0.07em, 1.06 |
-| body | Geist Regular | Overused Grotesk, −0.02em |
-| label | Geist SemiBold, +0.18em, caps | FK Roman Standard Light, caps |
+| Role | current | next | interim |
+|---|---|---|---|
+| display | Geist SemiBold, −0.02em | FK Roman Standard Light, −0.07em, 1.06 | Geist Medium (500), untracked, 1.025 |
+| body | Geist Regular | Overused Grotesk, −0.02em | Geist Regular |
+| label | Geist SemiBold, +0.18em, caps | FK Roman Standard Light, caps | Geist Medium, +0.11em, caps |
+| phrase | the display face | the display face | Newsreader Medium (500, optical size 72), untracked; italic on the art pages |
+
+A brand that sets a title's phrase in another face declares `faces.phrase`;
+the CSS reads it as `--face-phrase` and friends, and a brand without it leaves
+the phrase in the title's face, unchanged.
 
 **Weight carries no hierarchy on the next brand** (the serif ships one weight);
 the face does. Components therefore never rely on bold to separate levels, and
@@ -131,7 +163,8 @@ Figures are tabular (`font-variant-numeric: tabular-nums` on the page).
 ## 4. Chrome
 
 Drawn by `c.page()` on every page: eyebrow (`job.tag | eyebrow`), mark, footer
-(`job.footer`, page number). The cover and closing pages are `c.cover()` and
+(`job.footer`, page number; a page's own `footer` replaces the line, for a
+source note such as "Illustrative operating sequence"). The cover and closing pages are `c.cover()` and
 `c.closing()`, which place the brand art and the lockup; a job gives them
 words, never styling. Every piece of chrome is `.deco` or chrome-classed, so
 the gates know what is content and what is frame.
@@ -175,6 +208,14 @@ decide, and that make or break a page:
   ground.
 - **Short lines in cards.** One sentence and an outcome. The card's body is
   never the place for the argument.
+- **Two lines a paragraph on a slide, at most** (Carlos, 2026-10-27: past two
+  "it breaks a lot", in PowerPoint and Google Slides above all). Keep the
+  words and give them room: two by two instead of four across, a ruled row
+  (the title left, the line right) instead of a narrow column, a band for a
+  unit, a lead under its title. The `lines` gate counts each block's lines
+  from the browser's own line boxes; it warns on every deck and fails a job
+  that sets `maxLines`. Titles balance and paragraphs wrap pretty
+  (`text-wrap`), so no word sits alone on a line.
 - **Equal heights in a row** (`stretch`), titles at one height, and the empty
   space at the foot of a page shared by its sections, never left under one.
 - **One arc.** Night, then day, then first light: the dark cover with its
@@ -246,13 +287,17 @@ new ─▶ argue ─▶ content ─▶ compose ─▶ build ─▶ review ─▶
 | pdf text | the PDF's text misses a line, or carries an em dash | |
 | contrast (warn) | text under WCAG AA against its background, chrome excepted | |
 | measure (warn) | a paragraph over the surface's characters-per-line | |
-| images | an image did not load | an image that loaded and is the wrong one |
+| lines (warn; hard with `maxLines`) | a block of text on a slide that sets in more than two lines (or the job's `maxLines`), counted from its line boxes; autosizing never steps a slide up past it | a two-line paragraph that reads badly |
+| crop (warn, og) | a share image's words leave the centre square, which Slack and WhatsApp cut as their thumbnail | the chrome, and how the image reads at 128pt |
+| images | an image did not load, or is drawn at another shape than its own (stretched or squeezed past 2%; only `object-fit` cover, contain or none may change a box's shape) | an image that loaded and is the wrong one |
 | media | a demo, a clip or its poster is missing | a demo that loads and misbehaves |
 | console | a page error | |
 | runtime (ship, decks) | a slide or step the keyboard cannot reach, the overview or notes not opening, the presenter view out of step, a demo that never loads | how the motion feels |
 | timing (warn, boards) | the board is more than 10% off its `target` | the real voiceover's pace |
 | frames (warn, boards) | a frame is still to draw | a frame that is drawn and wrong |
 | player (ship, boards) | the player does not run, scrub, or caption | |
+| social (each image) | the lockup leaves its place or the centre square, the ring is cut, type under the floor, a share image over 300 KB | how it reads at 128pt: the review questions |
+| library (`--check`) | a library file is not the one approved, or the kit no longer draws it within its tolerance | a file that was approved and is wrong |
 
 The gates read the DOM Chromium laid out for the PDF; nothing is inferred from
 the spec. What no gate sees: the argument, the pacing, and whether the right
@@ -306,7 +351,9 @@ component was chosen. That is the review.
 4. **A scratch voice.** The Wand OS film timed its board against a voice from
    macOS `say`; the chat sandbox has none, so timing here is words at `wpm`.
    A recorded voiceover passed as `audio` leads the player.
-4. **Email and banner surfaces**: declared in §1's spirit, not yet in the table.
+5. **Email surfaces**: declared in §1's spirit, not yet in the table. Banners
+   exist on the interim brand, drawn from its composition (§14); on the other
+   brands they are still to come.
 
 ## 12. Talks: motion and the presenter
 
@@ -378,3 +425,122 @@ direction (the line, camera, motion, on screen, sound, into next).
 - **Both brands:** the board is one job; `--brand next` builds it on the
   website's brand beside the first. Frames drawn as sketches or on brand roles
   follow; an image frame is per brand when it shows the brand.
+
+## 14. Social images
+
+A brand that carries an approved composition draws its social images from it
+(`node wand.js social <social.json>`, `kit/lib/social.js`), not from a page.
+The interim brand does: its X header, LinkedIn banner, LinkedIn company
+banner and avatar (approved 2026-10-22) measured into one artwork in master
+units (`brand-interim/assets/social/composition.json`: the planet and its
+glow, four trails with their tint and fade, eight dots, the hero's oval, the
+lockup, the marks), drawn by `brand-interim/lib/composition.js`. Every format
+is a window onto it at one scale (`formats`), so a part never changes its
+proportion to the others. Redrawn from it, the three approved banners match
+their exports within 2.5 to 3.8 levels in 255.
+
+| Kind | Size (export) | How it sits on the composition |
+|---|---|---|
+| `linkedin-banner` | 1584 × 396 (2x) | the approved banner's window |
+| `x-header` | 1500 × 500 (2x) | the approved header's: lockup 28 higher, ring 38 left |
+| `linkedin-company` | 1128 × 191 (2x) | the approved company banner's |
+| `share` | 1200 × 630 | the art from the planet's rim to past the ring; the lockup set on its own in the centre square |
+| `square` | 1080 × 1080 | the art's right half on its diagonal; the lockup in the corner it leaves |
+| `avatar` | 800 × 800 | `avatar.svg` full bleed; every platform cuts its own circle |
+| `profile-photo` | 800 × 800 | the banner's art behind the profile photo's circle, continued below the banner's edge, a cut-out of the person over it in the brand's photo grade |
+| `icons` | 16, 32, 48, 180, 192, 512 | `avatar.svg` set at each size: the favicons as the disc on transparent, the apple-touch and manifest icons full bleed (iOS and Android cut their own shape); `favicon.ico` (16, 32, 48), `favicon.svg`, `site.webmanifest` |
+
+**Start from what is live.** Before redrawing a page's preview, read it as
+the feeds do: `node wand.js social --audit <url> [more urls]` reads each
+page's og: and twitter: tags and its image, and shows that image in
+LinkedIn's compact card, Slack's square, X's 2:1 and WhatsApp's thumbnail,
+with the centre square outlined (`audit/audit.png`). Its rows name what the
+2026-10-23 fix found by hand: no image, missing tags, an em dash, an
+og:title that repeats the image, one image for every page, a file over 300
+KB or off 1.91:1. A chat without web access is told so and passes a saved
+page and its image instead (`--image`). A share card's `before` (the image
+live now) puts the old image above the new one in the preview.
+
+**A share image (og:image) is seen small and cut** (Hope Frank's feedback,
+2026-10-23, on Rotem Alaluf's post and a Slack unfurl; `runs/2026-10-23-wand-og-fix`):
+
+- Slack and WhatsApp show a square cut from the image's centre, so the
+  wordmark and the words sit inside the centre square (x 285 to 915 of 1200),
+  24px clear of it; the composition's gate and, on a page, the crop row hold
+  it. The banners' wide, stepped lockup does not survive that cut: the share
+  image sets it left-aligned without the step.
+- LinkedIn shows a link in a post with text as a compact card, the whole
+  image about 128pt wide: the words as large as the square allows (64px for
+  the site's line), the wordmark at 1.5x the lockup's ratio, and no small
+  print at all.
+- One image per page. An article carries its own headline, verbatim (X now
+  shows a link card's image with only the domain over it). The site's own
+  image carries its line.
+- The `og:title` does not repeat the image's words (the site's became
+  `Wand AI`), and nothing in the tags carries an em dash. `head-tags.html`
+  holds each page's block: the image's absolute https URL, type, size and alt,
+  and one `twitter:card` with the X tags.
+- Every upload goes to a new file name or folder, since every platform caches
+  an image by its URL; then LinkedIn Post Inspector, and Slack after its
+  cache (about 30 minutes). A post made before keeps its old preview.
+
+**The hand-over carries its own instructions.** Every `social` job writes
+`INSTALL.md` beside the images: where each file goes (the banner's pencil,
+the company page's header, the upload folder), the Post Inspector and Sharing
+Debugger links for each page, the cache to wait out, and that nothing is
+verified until it is live. With the PNGs, `head-tags.html` and `preview.png`,
+it goes into one zip (`<name>-<date>.zip`), which is what a web developer or
+a social lead receives. The build prints review questions under the preview,
+the ones that settled the 2026-10-23 cards: does the lockup read at 128pt,
+does Slack's square keep it whole, does the phrase end where the dots meet
+it, is the ring whole and clear, is the banner's lockup clear of the photo.
+
+**A profile photo that continues the banner** needs a cut-out of the person
+(a PNG with a transparent ground): Photos or Preview on a Mac lift a subject
+in one step. The kit does not cut a person out itself; from a plain photo it
+asks for the cut-out rather than guess an edge. Its circle is placed where
+LinkedIn's desktop profile puts it; on mobile the photo sits elsewhere and the
+art lines up only roughly, which the dark ground hides.
+
+On a brand without a composition, social cards are pages on the `square` and
+`og` surfaces; the crop row warns when a share image's words leave the
+centre square.
+
+
+## 15. The library: approved files, handed out as they are
+
+Most asks for a Wand file are not design jobs: "send me the LinkedIn
+banner", "the logo on dark", "the favicon set for the site". The answer is
+the file a person approved, not a new drawing of it. The kit carries those
+files in `library/` (`kit/library/index.json`): on the interim brand the
+LinkedIn banner, the X header, the company banner, the avatar, the share
+images for wand.ai and the NandaIndex article with their tags, and the
+site's icons; on both live brands the wordmark, the mark and the slide art,
+which it names inside the brand folders rather than copying.
+
+- **List, then hand over.** `node wand.js library [words]` lists what there
+  is; `node wand.js library get <id> --to <folder>` copies it and prints where
+  each file goes and who approved it. It needs no browser. A bare name
+  (`wordmark`) resolves on the brand the rule gives; a vague one lists the
+  candidates.
+- **Never redraw an approved file** to hand it over, never re-export or
+  recompress it, never retouch it. If the file asked for is not in the
+  library, say so and offer to make it (`social`, or a page): what the kit
+  makes is a candidate until a person approves it.
+- **One file, one record.** Each carries its size, use, approval and
+  sha256; `get` refuses a copy that does not match.
+- **The library and the kit cannot drift.** `node wand.js library --check`
+  proves every file is the one approved (its sha256), then draws again every
+  file the kit can draw, from the recipes in the index, and compares: within
+  its tolerance it passes; a visible difference warns (a 2px move of the
+  share image's lockup does); past 4 levels in 255 or 2% of pixels visibly
+  off it fails (a 6px move does). The share images are the files delivered
+  on 2026-10-23, drawn at 2x and reduced, which the kit's 1x redraw matches
+  within 0.75 levels; every other file is the kit's own, matched exactly.
+- **A file enters only once approved**, through `tools/library.mjs` in the
+  repo (`add` for a file, `build` to draw the recipes and rewrite each
+  record). A changed sha256 is a changed approved file: the CHANGELOG says so.
+
+What is deliberately not in it: the square card and the light-ground
+versions (never approved), profile photos (one person's), and the next
+brand (no approved social design, and its face's licence is open).

package/SKILL.md

@@ -1,10 +1,10 @@
 ---
 name: wand-design
-description: Rebrand or create Wand material on the current or new brand - decks and talks, documents, case studies, storyboards from a script, social cards. Use when a file is attached or branded work is wanted.
+description: Rebrand or create Wand decks, documents, storyboards and social images on any Wand brand, or hand out approved Wand files (logos, banners, link previews, icons). Use for branded work or a Wand asset.
 compatibility: Requires Node.js 18+, code execution enabled in claude.ai (Settings > Features), and a Chromium the kit can find (Playwright's cache or the system). No network needed once installed. Python 3 embeds fonts in the .pptx; without it the deck ships with the faces named, not embedded.
 license: Proprietary - Wand AI
 metadata:
-  version: "0.3.3"
+  version: "0.5.0"
 ---
 
 
@@ -25,7 +25,9 @@ node wand.js doctor
 
 Every row must be clear, and `chromium` must name a binary. If it does not,
 **stop and say so**: nothing renders without a browser, and never report checks
-you did not run. Every path below is relative to the kit folder.
+you did not run. The one exception is handing over an approved file
+(`library`, below), which needs no browser. Every path below is relative to
+the kit folder.
 
 ## Whichever Wand skill brought you here
 
@@ -57,31 +59,56 @@ page. `node wand.js components` lists the vocabulary.
 
 ## Which brand
 
-Two brands, one kit: `current` (Geist) and `next` (the website's). `doctor`
-ends with the brand rule: which one is the default, and the words that ask
-for the other. Follow it as printed. When the user names no brand, build on
-the default without asking; when their words ask for the other, pass
+Three brands, one kit: `current` (Geist), `next` (the staging website's) and
+`interim` (the live wand.ai's as its approved social design sets it: Geist
+and Newsreader on a near-black ground, the metallic oval and its trails). `doctor` ends
+with the brand rule: which one is the default, and the words that ask for
+each of the others. Follow it as printed. When the user names no brand, build
+on the default without asking; when their words ask for another, pass
 `--brand` to `new`. One brand per piece, never a mix, and the review note
 says which. The rule lives in the kit, not here, so it can change without
 anyone reinstalling the skill.
 
-**The same piece on the other brand:** `node wand.js ship <job> --brand next`
-(or `current`) builds the job again on that brand, into `out-<brand>/`
-beside the first. Nothing in the job changes.
+**The same piece on another brand:** `node wand.js ship <job> --brand next`
+(or `interim`, or `current`) builds the job again on that brand, into
+`out-<brand>/` beside the first. Nothing in the job changes.
 
 ## Read only what the job needs
 
 | Job | Read |
 |---|---|
+| An existing Wand file: a logo, a banner, a link preview, the icons, slide art | nothing: `node wand.js library` (PROMPT.md §15 if in doubt) |
 | A document, a two-pager, a case study | `PROMPT.md` §5 and `templates/page.mjs`; `examples/overview/job.mjs` for a finished one |
 | A deck | §5 and `templates/slide.mjs` |
 | An animated deck, a talk, a live demo | §12 and `templates/slide.mjs`; `examples/talk/job.mjs` for a finished one |
 | A storyboard from a script | §13 and `templates/storyboard.mjs`; `examples/storyboard/job.mjs` |
-| Social cards, a banner | `templates/card.mjs` |
+| Social images on the interim brand: banners, link previews, icons, a profile photo | PROMPT.md §14 and `examples/social/social.json` |
+| Social cards on another brand | `templates/card.mjs` |
 | Edit a job this kit built | the job's `job.mjs` only, then `build` |
 
 ## The jobs
 
+### Ask for an existing file (the cheapest job: start here when it fits)
+
+"The LinkedIn banner", "our logo on dark", "the favicon for the site", "the
+image wand.ai shares as": these are approved files, and the library hands
+them over as they are (PROMPT.md §15).
+
+1. `node wand.js library <words>` (for example `library banner`, `library
+   logo`) lists what matches; `node wand.js library` lists everything.
+2. `node wand.js library get <id> --to <folder>`: the folder the chat
+   delivers files from (in claude.ai, `/mnt/user-data/outputs`). A bare
+   `wordmark`, `mark` or `slide-art` takes the brand the rule gives; if it
+   names several, pick by the brand rule or ask which.
+3. Deliver the files with the `use` line it prints (where each goes) and its
+   size. For a share image, its tags file goes with it and the install steps
+   of PROMPT.md §14 apply.
+
+Never redraw, re-export, resize or recompress a library file to hand it over.
+If what they ask for is not there, say so and offer to make it (the social
+job below, or a page); what you make is a draft until someone approves it,
+and the note says so.
+
 ### Rebuild from a source they attached (a .pptx, .docx, .pdf, .html)
 
 1. Dump the source's strings verbatim, one per line, into `content.txt`:
@@ -97,6 +124,11 @@ beside the first. Nothing in the job changes.
    at `out/sheet.png`. Open a page only where something looks off. Then answer
    the review questions the build prints under the gates, as a creative
    director would; if the variety row names a run of pages, recompose it.
+   On a deck, no paragraph sets in more than two lines: the lines row names
+   any that do. Re-lay, never reword: two by two instead of four across, a
+   ruled row (title left, line right) instead of a narrow column. Set
+   `maxLines: 2` in the job to make it a hard gate. A source note under one
+   slide goes in that page's `footer`.
 5. `node wand.js ship work/<name>/job.mjs --pptx` for a deck; without `--pptx`
    for a document. Deliver the PDF (and the .pptx, and the .html) with the
    review note.
@@ -109,7 +141,9 @@ review reads the argument instead. Three sections a page, not four.
 
 On the next brand, a title's phrase is its quiet second tone and gold is kept
 for the cover, a statement, the close and the figures; photographs go through
-`c.photo("walk")` (the brand's set, graded), large or not at all.
+`c.photo("walk")` (the brand's set, graded), large or not at all. On the
+interim brand the phrase changes face instead: `<em>` sets in Newsreader, the
+italic only on the pages that carry the art.
 
 ### Make it generic (an industry version of a client piece)
 
@@ -151,10 +185,45 @@ talk adds:
    HTML with its player. Say in the note that timing is scratch timing at the
    `wpm` given until a real read exists, and which frames are still to draw.
 
-### Social cards
-
-`--surface square` or `og`; one `c.page()` per card; `out/pages/pNN.png` are
-the deliverables.
+### Social images
+
+**First, is it already approved?** `node wand.js library <words>`: if the
+file exists, hand it over (the job above) instead of drawing it again.
+
+**On the interim brand** the banners, link previews, square, avatar and site
+icons are the approved design itself, drawn from the brand's composition
+(PROMPT.md §14):
+
+1. For a link preview that is live and wrong (someone sent a screenshot of a
+   bad unfurl), read it first: `node wand.js social --audit <url> [more]`.
+   Its rows and `audit/audit.png` show what the feeds do to it; say what is
+   wrong in the note. Without web access it says so: ask for the saved page
+   and its image and pass them (`--audit page.html --image og.png`).
+2. Copy `examples/social/social.json` beside the work and set `line` (the
+   words), the `cards` wanted, and for each share image its page's `url`,
+   `title`, `description` and `alt`, plus `upload` (where the images will
+   live: a new folder each time) and `before` (the image live now, if any).
+   An article's share image takes its headline verbatim as `lead` and
+   `phrase`. `{ "kind": "icons", "upload": "/assets/<date>/" }` adds the
+   favicons, app icons and manifest.
+3. `node wand.js social work/<name>/social.json`. Every image has a row; a
+   share image fails if its words leave the centre square or its type falls
+   under the floor. Look at `out/preview.png`: each image as the profile, the
+   LinkedIn compact card, Slack, X and WhatsApp show it, the live image above
+   the new one. Then answer the review questions printed under it.
+4. Deliver the zip (`out/<name>-<date>.zip`: the images, `head-tags.html`,
+   `INSTALL.md`, the preview). `INSTALL.md` already says where each file goes
+   and how to check it; the note adds that nothing is verified until it is
+   live, and that what you drew is a draft until approved.
+
+A profile photo that continues the LinkedIn banner is a `profile-photo` card
+with `photo`, a cut-out of the person (transparent ground). If they gave a
+plain photo, ask for the cut-out (Photos or Preview: lift the subject) rather
+than cutting it yourself.
+
+**On another brand**: `--surface square` or `og`; one `c.page()` per card;
+`out/pages/pNN.png` are the deliverables. The crop row warns when a share
+image's words leave the centre square: keep them there.
 
 ### Older Wand work
 
@@ -172,11 +241,15 @@ two kits, or `edit --set`; none of it applies to anything else.
 Which brand it is on; what was changed from the source and why (every edit,
 every cut); the gate table as printed; what a human still has to decide (a figure to confirm, a
 quote to clear, a claim legal should see). A file delivered without the gate
-table has been checked by nobody.
+table has been checked by nobody. A library file is the exception: it was
+checked when it was approved, so its note is the `use` and `approved` lines
+`get` prints.
 
 ## Available scripts
 
-- **`wand.js`** — doctor, new, build, check, ship, watch, poster, gallery, components, brands
+- **`wand.js`** — doctor, new, build, check, ship, watch, poster, social, library, gallery, components, brands
+- **`lib/library.js`**, **`library/`** — the approved files, their records and the check
+- **`lib/social.js`** — the social set from a brand's approved composition; **`lib/audit.js`** — a live page's link preview, read
 - **`lib/engine.js`** — the render and the gates
 - **`lib/components.js`** — the vocabulary and its CSS
 - **`lib/pptx.js`**, **`tools/embed_fonts.py`** — the PowerPoint export

package/START-HERE.md

@@ -6,9 +6,20 @@ node wand.js new work/acme --surface letter            # the default brand; doct
 #   write work/acme/job.mjs (pages(c)) and, for a rebuild, work/acme/content.txt
 node wand.js build work/acme/job.mjs                  # gates, PDF, a PNG per page, out/sheet.png
 node wand.js ship  work/acme/job.mjs --pptx           # + one-file HTML, PowerPoint
-node wand.js ship  work/acme/job.mjs --brand next     # the same job on the other brand, in out-next/
+node wand.js ship  work/acme/job.mjs --brand next     # the same job on another brand (next, interim), in out-<brand>/
 ```
 
+Asked for a file that already exists (the logo, a banner, a link preview, the
+icons), hand over the approved one: `node wand.js library banner`, then
+`node wand.js library get linkedin-banner --to <folder>`. PROMPT.md §15.
+
+On the interim brand, `node wand.js social examples/social/social.json` draws
+the approved social set (banners, link previews with their tags, square,
+avatar, a profile photo that continues the banner, the site's icons) from the
+brand's own composition, with `INSTALL.md` and a zip of the hand-over;
+`node wand.js social --audit <url>` reads a live page's preview first.
+PROMPT.md §14 has the rules.
+
 A deck's HTML is a talk: entrances, steps, a presenter view (P). A demo needs
 a poster: `node wand.js poster demo.html --play 3`. A storyboard starts from
 `node wand.js new work/film --surface storyboard`; its HTML plays the board.

package/brands/interim/assets/avatar.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 800" role="img" aria-label="Wand"><circle cx="400" cy="400" r="400" fill="#261d3d"/><g transform="translate(180.48 300.24) scale(0.187233) translate(0 -512)"><path d="M0 530A18 18 0 0 1 18 512L352.5 512A18 18 0 0 1 370.5 530L370.5 1347A278 278 0 0 0 926.5 1347L926.5 530A18 18 0 0 1 944.5 512L1279 512A18 18 0 0 1 1297 530L1297 1347A278 278 0 0 0 1853 1347L1853 734A18 18 0 0 1 1871 716L1873 716Q1882 716 1888.13 722.59L1940.35 778.75A134.03 134.03 0 0 0 2136.65 778.75L2188.87 722.59Q2195 716 2204 716L2205.5 716A18 18 0 0 1 2223.5 734L2223.5 1347A648.5 648.5 0 0 1 1125.96 1814.89Q1111.75 1800.82 1097.54 1814.89A648.5 648.5 0 0 1 0 1347Z" fill="#ffffff"/><path d="M2021.58 -300.31A16.61 16.61 0 0 1 2055.42 -300.31A426.81 426.81 0 0 0 2465.31 109.58A16.61 16.61 0 0 1 2465.31 143.42A426.81 426.81 0 0 0 2055.42 553.31A16.61 16.61 0 0 1 2021.58 553.31A426.81 426.81 0 0 0 1611.69 143.42A16.61 16.61 0 0 1 1611.69 109.58A426.81 426.81 0 0 0 2021.58 -300.31Z" fill="#c2a1ef"/></g></svg>

package/brands/interim/assets/glyphs/README.md

@@ -0,0 +1,29 @@
+# Glyphs — Lucide
+
+75 icons from [Lucide](https://lucide.dev) v0.469.0, **ISC licensed** (permissive:
+use, modify and redistribute, keep the notice). They replace the numbered PNGs
+that were reverse-extracted from a reference deck.
+
+Two problems they fix, both of which were standing known gaps:
+
+**Polarity.** The old glyphs were baked white or baked accent, so a white one on
+a light-theme `surface` tile was invisible. These are single-colour stroke SVGs
+with `stroke="currentColor"`, and the kit substitutes the theme's ink colour at
+build time. There is no variant to pick and nothing to get wrong.
+
+**Meaning.** They have names. A spec says `icon: "shield-check"`, not
+`icon: "icon-17.png"`. `index.json` groups them by what a deck actually needs —
+governance, workforce, platform, process, outcome, signal.
+
+## How they reach the deck
+
+As vector. pptxgenjs writes the OOXML `asvg:svgBlip` extension with a raster
+fallback, so PowerPoint 2016+ renders the SVG and anything older gets the PNG.
+Nothing is rasterised at build time, so the kit still needs no native
+dependency.
+
+## The old set
+
+`../icons/*.png` is still there and still works — every existing spec references
+those filenames. New specs should use glyph names. The two sets can coexist
+indefinitely; `iconTile` resolves a name first and falls back to a filename.

package/brands/interim/assets/glyphs/activity.svg

@@ -0,0 +1,15 @@
+<!-- @license lucide-static v0.469.0 - ISC -->
+<svg
+  class="lucide lucide-activity"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2" />
+</svg>

package/brands/interim/assets/glyphs/atom.svg

@@ -0,0 +1,17 @@
+<!-- @license lucide-static v0.469.0 - ISC -->
+<svg
+  class="lucide lucide-atom"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <circle cx="12" cy="12" r="1" />
+  <path d="M20.2 20.2c2.04-2.03.02-7.36-4.5-11.9-4.54-4.52-9.87-6.54-11.9-4.5-2.04 2.03-.02 7.36 4.5 11.9 4.54 4.52 9.87 6.54 11.9 4.5Z" />
+  <path d="M15.7 15.7c4.52-4.54 6.54-9.87 4.5-11.9-2.03-2.04-7.36-.02-11.9 4.5-4.52 4.54-6.54 9.87-4.5 11.9 2.03 2.04 7.36.02 11.9-4.5Z" />
+</svg>

package/brands/interim/assets/glyphs/badge-check.svg

@@ -0,0 +1,16 @@
+<!-- @license lucide-static v0.469.0 - ISC -->
+<svg
+  class="lucide lucide-badge-check"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" />
+  <path d="m9 12 2 2 4-4" />
+</svg>

package/brands/interim/assets/glyphs/bell.svg

@@ -0,0 +1,16 @@
+<!-- @license lucide-static v0.469.0 - ISC -->
+<svg
+  class="lucide lucide-bell"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M10.268 21a2 2 0 0 0 3.464 0" />
+  <path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326" />
+</svg>

package/brands/interim/assets/glyphs/blocks.svg

@@ -0,0 +1,16 @@
+<!-- @license lucide-static v0.469.0 - ISC -->
+<svg
+  class="lucide lucide-blocks"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <rect width="7" height="7" x="14" y="3" rx="1" />
+  <path d="M10 21V8a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-5a1 1 0 0 0-1-1H3" />
+</svg>

package/brands/interim/assets/glyphs/book-open.svg

@@ -0,0 +1,16 @@
+<!-- @license lucide-static v0.469.0 - ISC -->
+<svg
+  class="lucide lucide-book-open"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M12 7v14" />
+  <path d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z" />
+</svg>