@koda-sl/baker-cli 0.396.0-dev.88120240 → 0.397.0-dev.afb6a264b

package/README.md

@@ -5621,13 +5621,20 @@ Turn a source/inspiration image into a **runnable, self-validated static-ad canv
 2. **element selection** (`~google/gemini-flash-latest`) — picks the **main, identity-critical** elements (the brand logo, a showcased product, a trust badge) **plus any foreground/hero person or animal** — the emotional focal point — even a generic one, because a free-generated face/muzzle reads as AI and grows artifacts; the emotional hero always gets a real-reference slot. When the advertiser's logo appears in **more than one lockup** (a square/icon **mark** and a horizontal **wordmark**), each is emitted as its **own** element (e.g. `LOGO_MARK`, `LOGO_WORDMARK`) so you drop the right file in each slot instead of stretching one logo to cover both. The describe pass also records the ad's **typography** under a `fonts` block (each typeface's classification, a best-guess family, and its weight/case) so you know exactly what to drop at the brand-font slot. Background extras are dropped. Each element is stamped back onto its blueprint entry as a `reference_image` label so the JSON self-documents which slot grounds which subject.
 3. **global layout** (`~google/gemini-flash-latest`) — produces a structured `layout` block in `prompt.json`: the column/row grid, each region's `x_pct`/`y_pct` bounds, panel splits, background/shape, and every text block's relative size/weight/case/alignment. This is what gives the generator a precise composition to rebuild.
 
-It then scaffolds a canvas that renders the ad in two layers. The image model (`openai/gpt-image-2.5-sunburst`, quality `xhigh`) paints **three candidate plates** (the picture with no text and no logo, keeping calm the areas the copy will occupy), an `image_select` judge scores them on a fixed rubric (mechanism kept, space for the offer, brand, artifacts, Stories safe zones, text) and picks one, and every delivered format is drawn by an HTML composition (`layout-4x5/`, `layout-9x16/`, one per format, snapshotted by `hyperframe_snapshot`): the copy from `prompt.json` in the brand's heading and body fonts from `src/brand/fonts/` (via `src/brand/tokens.json` when present), the call to action as a button in the brand CTA colour, and the real logo file from `src/brand/logos/`. The plates read `prompt.plate.json` (the scene, the reserved areas and the visual mechanisms; no copy, no brand names) and the compositions read `prompt.compose.json`; both are re-derived from `prompt.json` by `validate` and `run`, so a copy edit re-draws the formats from the cached plates without paying for a picture again. A format within 10% of the plate's shape is a free crop; a farther one extends the chosen plate once on the same model. With no font file in `src/brand/fonts/` (or `--skip-font`) the copy is baked into the plates instead, and every other shape is re-framed by `image_aspect_adapt` on `google/gemini-3-pro-image`, never cropped. Detected elements get **one `[TODO]` ingest slot** each (the logo slot is pre-filled with the brand logo and feeds the composition, never the picture model), and the original image is wired in for composition only — left out of the render when it shows a person, because the generator copies that face whatever the prompt says (the blueprint's layout carries the composition instead). Each **animal hero** is additionally fused into a generated **multi-view reference sheet** (`image_reference_sheet`, a turnaround built from the one dropped photo) that the render grounds on instead of the lone flat snapshot — the same identity lock the video scaffold uses, so the muzzle stays consistent and artifact-free from a single reference. Pass `--skip-actor-sheets` to ground straight on the dropped photo. A **person hero** is cast from a company Avatar with `--avatar <handle>`: the slot ingests its identity sheet and `prompt.json` describes that person in the Avatar's own words. The render keeps the face it is given, so it is never a found photo of a real person. The canvas is validated before it's written. stdout returns `{ ok, canvas_path, prompt_path, models, aspect_ratio, placements, output_formats, layout_regions, stats, checklist }` — the **checklist** lists every real asset to drop in (and which heroes get a sheet).
+It then scaffolds a canvas that draws **only what `prompt.json` holds**; no element is mandatory. The report's `mode` names which of four the ad is:
+
+- **`composed`**: the image model (`openai/gpt-image-2.5-sunburst`, quality `xhigh`) paints up to **three candidate plates** (`--takes`, default 3; the picture with no overlay text and no logo, keeping calm the areas the copy will occupy), an `image_select` judge scores them on one dominant idea, thumbnail legibility, mechanism kept, space for what is drawn, brand with the logo covered, artifacts, Stories safe zones and text, and every delivered format is drawn by an HTML composition (`layout-4x5/`, `layout-9x16/`, one per format, snapshotted by `hyperframe_snapshot`). Each line sits at its layout region, carried through the format's crop or extension into its safe area (a band only when the layout gives it no position), and is set the way the reference set it: plain, underlined, followed by an arrow, a button (in the brand CTA colour), a sticker or a highlight. A call to action is never forced into a pill.
+- **`picture_only`**: the concept has no copy, so the plate is the ad and nothing is drawn on it.
+- **`text_only`**: no picture is generated. The copy is drawn on the brand's lead colour in its fonts, for near-zero credits. On by default when the reference pictures nothing but copy (no subjects, no people); `--text-only` forces it, `--no-text-only` refuses it.
+- **`baked`**: the copy is painted into the plates, only with `--skip-font` or when no font can load; every other shape is re-framed by `image_aspect_adapt` on `google/gemini-3-pro-image`, never cropped.
+
+**Fonts** come from the first source that has one: a file in `src/brand/fonts/` (via `src/brand/tokens.json` when present), else the heading and body families `tokens.json` or `BRAND.md`'s typography section name, fetched as web font files from Google Fonts or Fontsource and ingested by URL, else Inter (800 and 400). **The logo is optional**: it is drawn from `src/brand/logos/` only when `prompt.json` keeps a logo (a `logo` layout region, or an `advertiser_brand` entry in `brands_logos`) and a real file exists. Meta shows the page name and picture on every ad, so no logo is never an error, never a slot to fill and never a stand-in; a canvas scaffolded with an unfilled logo slot runs without it. Text that belongs to something in the scene (a phone note, a screenshot, a sign, packaging: `surface: "in_scene"` in `text_content`) is painted by the plate, not overlaid, and listed in the report's `in_scene_text`. The plates read `prompt.plate.json` (the scene, the reserved areas, the visual mechanisms and the in-scene text; no overlay copy, no brand names) and the compositions read `prompt.compose.json`; both are re-derived from `prompt.json` by `validate` and `run`, so a copy edit re-draws the formats from the cached plates without paying for a picture again. A format within 10% of the plate's shape is a free crop; a farther one extends the chosen plate once on the same model. Detected elements get **one `[TODO]` ingest slot** each (never the logo), and the original image is wired in for composition only, left out of the render when it shows a person, because the generator copies that face whatever the prompt says (the blueprint's layout carries the composition instead). Each **animal hero** is additionally fused into a generated **multi-view reference sheet** (`image_reference_sheet`, a turnaround built from the one dropped photo) that the render grounds on instead of the lone flat snapshot. Pass `--skip-actor-sheets` to ground straight on the dropped photo. A **person hero** is cast from a company Avatar with `--avatar <handle>`: the slot ingests its identity sheet and `prompt.json` describes that person in the Avatar's own words. The render keeps the face it is given, so it is never a found photo of a real person. The canvas is validated before it's written. stdout returns `{ ok, canvas_path, prompt_path, models, aspect_ratio, placements, output_formats, layout_regions, stats, checklist }`; the **checklist** carries `mode`, `summary` (what a run does: pictures, judge, fonts, logo), `fonts`, `logo`, `in_scene_text` and every real asset to drop in.
 
 **Placement formats.** The canvas delivers the platform's full placement set, each format at its exact size, collected under `final` with the format as its label. The set is derived from `--platform` (`meta` → 4:5 + 9:16, `google` → 1:1 + 4:5 + 16:9, `linkedin` → 1:1, `tiktok` → 9:16, `youtube` → 16:9); override it with `--placements <preset>` or `--placements none` for a single format. The report's `aspect_ratio` is the ratio the plates really render at (the model's nearest to the lead format), and `format_plan` says how each format is made.
 
-**After a run** the CLI reads the finished ad back: every delivered image's pixel shape against its format, and one vision pass that reads each word against the copy and checks the logo, clipping, legibility and artifacts. stdout carries `verdict` (`ready` | `ready_with_notes` | `needs_fixes` | `not_reviewed`) and `judge` (the per-plate scores); the findings are stored on the run as its `review`. `needs_fixes` means the ad is not done even though every node completed.
+**After a run** the CLI reads the finished ad back on what makes a static win, not a checklist of elements: every delivered image's pixel shape against its format, and one vision pass that reads each word against the copy `prompt.json` holds and checks one dominant idea, clipping, artifacts, the brand with the logo covered and the concept's mechanisms, with every format shown a second time at phone-feed thumbnail size (240px wide, same call): a lead message unreadable at that size is blocking. A missing logo, CTA or copy is never a finding; a logo that is drawn and broken is. stdout carries `verdict` (`ready` | `ready_with_notes` | `needs_fixes` | `not_reviewed`), `judge` (the per-plate scores) and hints that end with what the run made; the findings are stored on the run as its `review`. `needs_fixes` means the ad is not done even though every node completed.
 
-The checklist `note` reminds you to fill **logo** slots from the company's committed brand logo in `src/brand/logos/` (per `BRAND.md`) — **not** from `baker images logo <domain>`, whose Brandfetch CDN often serves an outdated mark (a common cause of an old logo shipping on a live ad).
+The logo is never a slot to fill: use the company's committed logo in `src/brand/logos/` (per `BRAND.md`), never `baker images logo <domain>`, whose Brandfetch CDN often serves an outdated mark.
 
 The plate prompt is **model-aware**: for **gpt-image** the exclusions (no invented badges/watermark) are hoisted to the very *end* of the prompt where the model reads them as pure exclusions rather than composition. In the baked-copy fallback it quotes every line of `prompt.json`'s copy (never the logo's text) with an instruction to render each **once, verbatim**; that block is re-read from `prompt.json` on every `validate` and `run`, which also upgrades canvases scaffolded before this change. Run `baker canvas critique` on the scaffolded canvas for an advisory read before you spend.
 
@@ -5648,11 +5655,12 @@ baker canvas run ./static-ad.canvas.json
 | `--select-model <id>` | registry default (`~google/gemini-flash-latest`) | Override the element-selection `text_generate` model. |
 | `--layout-model <id>` | registry default (`~google/gemini-flash-latest`) | Override the global-layout `text_generate` model. |
 | `--gen-model <id>` | `openai/gpt-image-2.5-sunburst` | Override the plate model. |
-| `--takes <n>` | `3` | Plates rendered and judged (1-3); `1` skips the judge. |
+| `--takes <n>` | `3` | Plates rendered and judged (1-3); `1` skips the judge. A text-only ad renders none. |
+| `--text-only` | on when the reference pictures nothing but copy | Draw a typographic ad: no picture generated, the copy on the brand colours in its fonts. `--no-text-only` renders a picture anyway. |
 | `--platform <channel>` | `meta` | `_definition.md` channel **and** the default placement set the hero fans out to (`meta`\|`google`\|`linkedin`\|`tiktok`\|`youtube`\|`x`\|`other`; `x`/`other` fan out to nothing). |
 | `--placements <preset\|none>` | derived from `--platform` | Override the fan-out set: `meta_feed`\|`meta_feed_stories`\|`meta_all`\|`linkedin`\|`google_demandgen`\|`tiktok`\|`youtube`, or `none` for a single base ad. |
 | `--aspect <ratio>` | inferred from the image, else `9:16` | Force the lead format (it leads the placement set when the set has it). |
-| `--skip-font` | off | Bake the copy into the plates even though a brand font exists. |
+| `--skip-font` | off | Bake the copy into the plates instead of drawing it in a real font (a font file, else the typeface the brand names, else Inter). |
 | `--skip-actor-sheets` | off | Ground each animal hero on its lone dropped photo instead of a generated multi-view reference sheet. |
 | `--avatar <handles>` | — | Cast company avatars as the image's people, comma-separated in the order they were detected (`marta` or `marta,joan`). Each person slot grounds on that avatar's identity sheet and takes its subject description. Checked before any billed pass; an unknown, not-ready or sheetless avatar fails with code `avatar`. A handle with no person to play is reported in `hints` as `NOT CAST`. |
 
@@ -6184,7 +6192,7 @@ baker creatives performance --days 14 --full     # + ids, last-7-day figures, on
 | `--days <n>` | Window ending today, 1-90 (default 30). |
 | `--full` | Adds creative and image ids, result type, days live, last-7-day CTR and cost per result, and one row per ad. |
 
-Each creative reports `spend`, `impressions`, `ctr` (percent), `cpc`, `results`, `costPerResult`, `frequency`, a `fatigue` verdict (`fresh`, `fading`, `fatigued`, `dead`, `too_early`, `no_delivery`) with its reason, and `definition`: the angle, hook, persona, awareness, hypothesis and reference fields read from the local `src/creatives/<slug>/_definition.md`. `hints` name worn-out creatives, the angle with the lowest cost per result, and unreadable ad accounts.
+Each creative reports `spend`, `impressions`, `ctr` (percent), `cpc`, `results`, `costPerResult`, `frequency`, a `fatigue` verdict (`fresh`, `fading`, `fatigued`, `dead`, `too_early`, `no_delivery`) with its reason, and `definition`: the angle, hook, mechanism, dominantSlot, persona, awareness, hypothesis and reference fields read from the local `src/creatives/<slug>/_definition.md`. `hints` name worn-out creatives, the angle, mechanism and dominant slot with the lowest cost per result (each ranked once two or more values have results), and unreadable ad accounts.
 
 ### `baker creatives feedback [--slug <slug>] [--full]`
 

package/canvas/static-ad-composition/index.html

@@ -5,8 +5,10 @@
     <meta name="viewport" content="width=__WIDTH__, height=__HEIGHT__" />
     <script src="./gsap.min.js"></script>
     <style>
-      /* The brand's own faces, staged beside this file by the render. One range per face,
-         so a single-weight file is used as it is instead of being faked bolder. */
+      /* The ad's own faces, staged beside this file by the render (a brand file or a web font
+         file). One range per face, so a single-weight file is used as it is instead of being
+         faked bolder. The browser fetches a face only when text uses it, and text uses it
+         only when a face was staged (see FRAME.fonts below). */
       @font-face { font-family: 'AdHeadline'; src: url('./headline.font'); font-weight: 100 900; font-display: block; }
       @font-face { font-family: 'AdBody'; src: url('./body.font'); font-weight: 100 900; font-display: block; }
       * { margin: 0; padding: 0; box-sizing: border-box; }
@@ -14,22 +16,20 @@
       #root { position: absolute; inset: 0; overflow: hidden; }
       .plate { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
       .scrim { position: absolute; left: 0; right: 0; pointer-events: none; display: none; }
-      .band { position: absolute; display: flex; flex-direction: column; gap: 0; }
+      .group { position: absolute; display: flex; flex-direction: column; gap: 0; }
       .block { font-family: 'AdBody', 'Helvetica Neue', Arial, sans-serif; overflow-wrap: break-word; text-wrap: pretty; }
       .block.headline, .block.subheadline, .block.cta { font-family: 'AdHeadline', 'AdBody', 'Helvetica Neue', Arial, sans-serif; }
       .block.headline { text-wrap: balance; letter-spacing: -0.01em; }
-      .cta-pill { display: inline-block; border-radius: 999px; font-weight: 700; line-height: 1.1; }
+      .fill { display: inline-block; line-height: 1.1; padding: 0.5em 1.2em; }
+      .fill.highlight { padding: 0.12em 0.4em; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
+      .fill.sticker { transform: rotate(-3deg); }
       .logo { display: block; width: auto; object-fit: contain; }
     </style>
   </head>
   <body>
     <div id="root" data-composition-id="main" data-start="0" data-duration="1" data-width="__WIDTH__" data-height="__HEIGHT__">
-      <img class="plate" id="plate" src="./plate.png" alt="" />
       <div class="scrim" id="scrim-top"></div>
       <div class="scrim" id="scrim-bottom"></div>
-      <div class="band" id="band-top" data-role="copy-top"></div>
-      <div class="band" id="band-middle" data-role="copy-middle"></div>
-      <div class="band" id="band-bottom" data-role="copy-bottom"></div>
     </div>
 
     <script>
@@ -43,11 +43,31 @@
         var box = { x: safe.left * W, y: safe.top * H, w: W * (1 - safe.left - safe.right), h: H * (1 - safe.top - safe.bottom) };
         // One unit per percent of the shorter side, so type reads the same size on every format.
         var U = Math.min(W, H) / 100;
+        // A text-only ad has no picture (`plate: null`): the copy sits on the brand's ground.
+        var hasPlate = FRAME.plate !== null;
+        var ground = AD.background || { color: "#111111", ink: "#ffffff" };
 
         var SIZE = { x_large: 8.6, large: 6.6, medium: 4.4, small: 3.0 };
         var WEIGHT = { bold: 800, semibold: 600, regular: 400 };
         var CASE = { upper: "uppercase", title: "capitalize", sentence: "none" };
         var MAX_SHARE = { top: 0.44, middle: 0.3, bottom: 0.36 };
+        var RADIUS = { pill: "999px", rounded: "0.35em", square: "0" };
+
+        // With no face staged, the text never names the ad's faces, so the browser never asks
+        // for a file that is not there (a 404 the pre-render check refuses).
+        var FALLBACK_FACE = "'Helvetica Neue', Arial, sans-serif";
+        var facesStaged = FRAME.fonts !== false;
+
+        if (hasPlate) {
+          var plate = document.createElement("img");
+          plate.className = "plate";
+          plate.id = "plate";
+          plate.src = "./plate.png";
+          plate.alt = "";
+          root.insertBefore(plate, root.firstChild);
+        } else {
+          root.style.background = ground.color;
+        }
 
         function luma(hex) {
           var m = /^#?([0-9a-f]{6})$/i.exec(hex || "");
@@ -56,18 +76,23 @@
           return 0.2126 * ((v >> 16) & 255) + 0.7152 * ((v >> 8) & 255) + 0.0722 * (v & 255);
         }
 
-        var bands = { top: [], middle: [], bottom: [] };
-        var drawCopy = FRAME.draw_copy !== false;
-        (drawCopy ? AD.copy || [] : []).forEach(function (b) {
-          (bands[b.band] || bands.top).push(b);
+        function alignSelf(align) {
+          return align === "left" ? "flex-start" : align === "right" ? "flex-end" : "center";
+        }
+
+        // Every line is drawn in its group: the layout region the reference put it in (placed
+        // at that region's box on this format), or a band when the layout gave no position.
+        var groups = {};
+        var bands = { top: null, middle: null, bottom: null };
+        (AD.groups || []).forEach(function (g) {
+          groups[g.id] = g;
         });
 
         function bandEl(name) {
-          return document.getElementById("band-" + name);
-        }
-
-        function place(name) {
-          var el = bandEl(name);
+          if (bands[name]) return bands[name];
+          var el = document.createElement("div");
+          el.className = "group band";
+          el.dataset.band = name;
           el.style.left = box.x + "px";
           el.style.width = box.w + "px";
           el.style.gap = 1.6 * U + "px";
@@ -77,80 +102,110 @@
             el.style.top = box.y + box.h / 2 + "px";
             el.style.transform = "translateY(-50%)";
           }
+          el.dataset.max = String(box.h * MAX_SHARE[name]);
+          root.appendChild(el);
+          bands[name] = el;
+          return el;
         }
 
-        function alignSelf(align) {
-          return align === "left" ? "flex-start" : align === "right" ? "flex-end" : "center";
+        var placed = {};
+        function containerFor(groupId, band) {
+          var g = groups[groupId];
+          var at = g && g.at && g.at[FRAME.format];
+          if (!at) return bandEl((g && g.band) || band || "top");
+          if (placed[groupId]) return placed[groupId];
+          var el = document.createElement("div");
+          el.className = "group placed";
+          el.style.left = (at.x[0] / 100) * W + "px";
+          el.style.width = ((at.x[1] - at.x[0]) / 100) * W + "px";
+          el.style.top = (at.y[0] / 100) * H + "px";
+          el.style.minHeight = ((at.y[1] - at.y[0]) / 100) * H + "px";
+          el.style.justifyContent = "center";
+          el.style.gap = 1.2 * U + "px";
+          // Copy rewritten for our brand runs longer than the source's: allow some growth
+          // past the region before the type shrinks.
+          el.dataset.max = String(((at.y[1] - at.y[0]) / 100) * H * 1.35);
+          root.appendChild(el);
+          placed[groupId] = el;
+          return el;
         }
 
-        function addLogo(name, align) {
+        function addLogo(logo) {
           var img = document.createElement("img");
           img.className = "logo";
           img.src = "./logo.png";
           img.alt = "";
           img.style.height = 5.4 * U + "px";
           img.style.maxWidth = box.w * 0.42 + "px";
-          img.style.alignSelf = alignSelf(align);
+          img.style.alignSelf = alignSelf(logo.align);
           img.onerror = function () {
             img.remove();
           };
-          var el = bandEl(name);
-          if (name === "bottom") el.appendChild(img);
+          var el = containerFor(logo.group, logo.band);
+          if (el.dataset.band === "bottom") el.appendChild(img);
           else el.insertBefore(img, el.firstChild);
         }
 
-        function addBlock(name, b) {
+        function addBlock(b) {
           var el = document.createElement("div");
           el.className = "block " + b.role;
-          el.dataset.size = String(SIZE[b.size] || SIZE.medium);
-          var size = b.role === "fine_print" ? 2.4 : b.role === "cta" ? 4.2 : SIZE[b.size] || SIZE.medium;
+          if (!facesStaged) el.style.fontFamily = FALLBACK_FACE;
+          var size = b.role === "fine_print" ? 2.4 : SIZE[b.size] || SIZE.medium;
           el.dataset.base = String(size);
           el.style.fontSize = size * U + "px";
-          el.style.fontWeight = String(b.role === "cta" ? 700 : WEIGHT[b.weight] || 400);
+          el.style.fontWeight = String(WEIGHT[b.weight] || (b.role === "cta" ? 700 : 400));
           el.style.lineHeight = b.role === "headline" ? "1.04" : "1.22";
           el.style.textTransform = CASE[b.case] || "none";
           el.style.textAlign = b.align || "center";
           el.style.alignSelf = alignSelf(b.align);
-          if (b.role === "cta") {
-            var pill = document.createElement("span");
-            pill.className = "cta-pill";
-            pill.textContent = b.text;
-            pill.style.background = AD.cta.background;
-            pill.style.color = AD.cta.color;
-            pill.style.padding = "0.55em 1.4em";
-            el.appendChild(pill);
+          var t = b.treatment || { kind: b.role === "cta" && !AD.groups ? "button" : "plain" };
+          var ink = b.color || (hasPlate ? "#ffffff" : ground.ink);
+          var text = b.text;
+          if (t.kind === "arrow" && !/[→›»]\s*$/.test(text)) text = text + " →";
+          if (t.kind === "button" || t.kind === "sticker" || t.kind === "highlight") {
+            var fill = document.createElement("span");
+            fill.className = "fill " + t.kind;
+            fill.textContent = text;
+            fill.style.background = t.background || (AD.cta && AD.cta.background) || "#111111";
+            fill.style.color = t.color || (AD.cta && AD.cta.color) || "#ffffff";
+            fill.style.borderRadius = RADIUS[t.shape] || RADIUS.rounded;
+            el.appendChild(fill);
           } else {
-            el.textContent = b.text;
-            var ink = b.color || "#ffffff";
+            el.textContent = text;
             el.style.color = ink;
+            if (t.kind === "underline") {
+              el.style.textDecoration = "underline";
+              el.style.textDecorationThickness = "0.08em";
+              el.style.textUnderlineOffset = "0.18em";
+            }
             var dark = (luma(ink) || 255) < 110;
-            el.style.textShadow = dark ? "0 1px 10px rgba(255,255,255,0.35)" : "0 2px 14px rgba(0,0,0,0.45)";
             el.dataset.dark = dark ? "1" : "0";
+            if (hasPlate) el.style.textShadow = dark ? "0 1px 10px rgba(255,255,255,0.35)" : "0 2px 14px rgba(0,0,0,0.45)";
           }
-          bandEl(name).appendChild(el);
+          containerFor(b.group, b.band).appendChild(el);
         }
 
-        ["top", "middle", "bottom"].forEach(function (name) {
-          place(name);
-          bands[name].forEach(function (b) {
-            addBlock(name, b);
-          });
-        });
-        if (AD.logo) addLogo(AD.logo.band, AD.logo.align);
-
-        // Shrink a band's type until it fits its share of the safe area and no line runs
-        // past the edge. The copy is whatever prompt.json says today, so its length is
-        // not known when the layout is written.
-        function fit(name) {
-          var el = bandEl(name);
-          var max = box.h * MAX_SHARE[name];
+        var drawCopy = FRAME.draw_copy !== false;
+        (drawCopy ? AD.copy || [] : []).forEach(addBlock);
+        if (AD.logo) addLogo(AD.logo);
+
+        function containers() {
+          return Array.prototype.slice.call(root.querySelectorAll(".group"));
+        }
+
+        // Shrink a group's type until it fits its room and no line runs past its edge. The
+        // copy is whatever prompt.json says today, so its length is not known when the
+        // layout is written.
+        function fit(el) {
+          var max = Number(el.dataset.max);
+          var width = el.getBoundingClientRect().width;
           var scale = 1;
           for (var i = 0; i < 40; i++) {
             var tooTall = el.scrollHeight > max;
             var tooWide = Array.prototype.some.call(el.children, function (c) {
-              return c.scrollWidth > box.w + 1;
+              return c.scrollWidth > width + 1;
             });
-            if (!tooTall && !tooWide) break;
+            if ((!tooTall && !tooWide) || scale < 0.45) break;
             scale *= 0.94;
             Array.prototype.forEach.call(el.querySelectorAll(".block"), function (c) {
               c.style.fontSize = Number(c.dataset.base) * U * scale + "px";
@@ -158,15 +213,16 @@
           }
         }
 
-        // A soft scrim behind a band of light type (or a light one behind dark type), so the
-        // copy reads on any plate without boxing it in.
+        // A soft scrim behind a band of light type over the picture (or a light one behind
+        // dark type), so copy with no position of its own reads on any plate. Copy placed
+        // by the layout sits on the calm area the plate kept for it.
         function scrim(name) {
-          if (name === "middle" || bands[name].length === 0) return;
-          var el = bandEl(name);
+          var el = bands[name];
+          if (!hasPlate || !el) return;
           var s = document.getElementById("scrim-" + name);
-          var firstText = el.querySelector(".block:not(.cta)");
-          var dark = firstText && firstText.dataset.dark === "1";
-          var tint = dark ? "255,255,255" : "0,0,0";
+          var firstText = el.querySelector(".block[data-dark]");
+          if (!firstText) return;
+          var tint = firstText.dataset.dark === "1" ? "255,255,255" : "0,0,0";
           var rect = el.getBoundingClientRect();
           var reach = name === "top" ? rect.bottom + 6 * U : H - rect.top + 6 * U;
           s.style.display = "block";
@@ -187,7 +243,7 @@
 
         var ready = document.fonts && document.fonts.ready ? document.fonts.ready : Promise.resolve();
         ready.then(function () {
-          ["top", "middle", "bottom"].forEach(fit);
+          containers().forEach(fit);
           ["top", "bottom"].forEach(scrim);
           root.setAttribute("data-ready", "1");
         });

package/canvas/static-ad-composition/meta.json

@@ -1,7 +1,7 @@
 {
   "id": "static-ad",
-  "title": "Static ad: a rendered plate with the copy, the call to action and the logo drawn on top",
-  "description": "Written by `baker canvas scaffold-static-ad`, one copy per delivered format. The plate is the image model's clean picture; the copy, the CTA and the logo are drawn here from prompt.compose.json (derived from prompt.json) in the brand's own fonts and logo file. Width and height are this format's delivered size.",
+  "title": "Static ad: the picture (or the brand colours) with what the concept holds drawn on top",
+  "description": "Written by `baker canvas scaffold-static-ad`, one copy per delivered format. Draws only what prompt.compose.json (derived from prompt.json) holds: each line of copy where the source layout placed it, set the way the reference set it (plain, underlined, with an arrow, as a button or sticker), in the staged fonts, and the logo file only when the concept shows one. The plate is the image model's clean picture; a text-only ad has none and sits on the brand colour. Width and height are this format's delivered size.",
   "width": 1080,
   "height": 1350,
   "fps": 1,
@@ -9,15 +9,15 @@
   "inputs": {
     "plate": {
       "kind": "image",
-      "required": true,
+      "required": false,
       "staged_as": "plate.png",
-      "description": "The picture, with no text and no logo."
+      "description": "The picture, with no overlay text and no logo. Absent for a text-only ad."
     },
     "logo": {
       "kind": "image",
       "required": false,
       "staged_as": "logo.png",
-      "description": "The brand's logo file."
+      "description": "The brand logo file, wired only when the concept shows a logo."
     },
     "font_headline": {
       "kind": "font",
@@ -47,7 +47,7 @@
     "frame": {
       "kind": "json",
       "required": true,
-      "description": "This format's safe area and whether the copy is drawn here."
+      "description": "This format: its safe area, whether copy is drawn, the picture it is cut from (plate: null for none), and whether fonts are staged."
     }
   }
 }