@vectoriox/iox-ui 5.83.1 → 5.85.0

package/fesm2022/vectoriox-iox-ui-generation-core.mjs

@@ -1,8 +1,8 @@
-import { NEW_NODE_STYLE_DEFAULTS, defaultElementStyleFor, elementStyleById, ownedTraitsOf, applyElementStyle, flavorPackById, parseHexColor, SPEC_AXES, EntranceParam, staggerDelay, LinkType, COLOR_SCHEMES, setColorScheme, resolveDesignChoices, ANIMATE_IDS, auditDesignContrast } from '@vectoriox/iox-ui/design-core';
+import { NEW_NODE_STYLE_DEFAULTS, defaultElementStyleFor, elementStyleById, ownedTraitsOf, applyElementStyle, parseHexColor, rgbToOklab, flavorPackById, SPEC_AXES, EntranceParam, staggerDelay, LinkType, COLOR_SCHEMES, setColorScheme, resolveDesignChoices, ANIMATE_IDS, auditDesignContrast, parseCssColour, compositeOver, wcagContrastRatio, relativeLuminance } from '@vectoriox/iox-ui/design-core';
 import { formPresetById, FORM_ACTIONS_ROLE, channelOpensNewTab, FORM_CHANNEL_ROLE, planFormPresetIds, ControlType, FORM_NODE_TYPE, collectFormSpec, FIELD_NODE_TYPE, isChannelFilled } from '@vectoriox/iox-ui/forms-core';
 import { normalizeFrameSequence, filmScreensFor, FILM_PREPARED_PICTURES, FrameExtension } from '@vectoriox/iox-ui/media-core';
 import { SEO_DESCRIPTION_MAX, SEO_TITLE_MAX } from '@vectoriox/iox-ui/seo-core';
-import { pickTabsAutoBinds, pickAccordionAutoBinds, segmentedOptions, ITEM_OPEN_STATE, CardPart, CardRole, CardLayout, CARD_LAYOUTS, CARD_PARTS, BADGE_TONES, buildCardRecipe, findByRole, buildSegmentedRecipe, AccordionRole, buildAccordionRecipe, ACCORDION_WORDS, accordionItems, accordionQuestionOf, accordionAnswerOf, ACCORDION_BIND_PROP, ACCORDION_CONTENT_LIMIT, buildTabsRecipe, TABS_WORDS, tabsTriggers, tabLabelNodeOf, TABS_LABEL_BIND_PROP, tabsPanels, tabPanelTextOf, TABS_TEXT_BIND_PROP, tabPanelImageOf, tabsListOf, tabsPanelsOf, TABS_CONTENT_LIMIT, TABS_IMAGE_BIND_PROP, buildCarouselRecipe, SLIDE_TYPE, buildLightboxRecipe, LIGHTBOX_LABEL, SLIDE_TO_ROW } from '@vectoriox/iox-ui/composite-core';
+import { pickTabsAutoBinds, pickAccordionAutoBinds, segmentedOptions, ITEM_OPEN_STATE, CardPart, CardRole, CardLayout, CARD_LAYOUTS, CARD_PARTS, BADGE_TONES, buildCardRecipe, findByRole, buildSegmentedRecipe, AccordionRole, buildAccordionRecipe, ACCORDION_WORDS, accordionItems, accordionQuestionOf, accordionAnswerOf, ACCORDION_BIND_PROP, ACCORDION_CONTENT_LIMIT, buildTabsRecipe, TABS_WORDS, tabsTriggers, tabLabelNodeOf, TABS_LABEL_BIND_PROP, tabsPanels, tabPanelTextOf, TABS_TEXT_BIND_PROP, tabPanelImageOf, tabsListOf, tabsPanelsOf, TABS_CONTENT_LIMIT, TABS_IMAGE_BIND_PROP, buildCarouselRecipe, SLIDE_TYPE, buildLightboxRecipe, LIGHTBOX_LABEL, SLIDE_TO_ROW, setHeaderBehaviour } from '@vectoriox/iox-ui/composite-core';
 import { ELEMENT_ACTION_DESCRIPTORS, resolveActionAvailability } from '@vectoriox/iox-ui/actions-core';
 
 // GENERATED from iox-ai-guidance flavor-spec.v1.json — do not edit; re-run scripts/gen-flavor-spec.mjs
@@ -20,11 +20,20 @@ const SPEC_SITE_PLAN_SHAPE = {
         "dataSources": "(cmsDataSource | relativeDataSource)[] — merged by alias into the org library",
         "pages": "page[]",
         "globals": "globals",
-        "film?": "film — the owner's film as pictures (SC6b), set by the build and placed by placeFilm; never a model's"
+        "film?": "film — the owner's film as pictures (SC6b), set by the build and placed by placeFilm; never a model's",
+        "artDirection?": "artDirection — what every picture made for the site shares (M7): set by the generation from the business type and the look (generation-core artDirectionFor); never a model's"
     },
     "film": {
         "sequence": "object — a media-core FrameSequence: where the numbered pictures live, how many, their size"
     },
+    "artDirection": {
+        "world": "string — a site.pictureWorlds id",
+        "medium": "string — the picture's medium and lens",
+        "light": "string — its light",
+        "grade": "string — its colour grade",
+        "texture": "string — its texture",
+        "negative": "string[] — what no picture of the site may show (site.pictureNever, then the world's own)"
+    },
     "sourceTemplate": {
         "kind": "'template'",
         "templateId": "string",
@@ -1137,6 +1146,10 @@ const SPEC_SITE_PATTERNS = {
         "label": "Navigation bar",
         "global": "before",
         "phoneMenu": "drawer",
+        "header": {
+            "behaviour": "hides",
+            "edge": "fade"
+        },
         "intent": "The brand on one side, the pages and one call to action on the other — the default header.",
         "node": {
             "t": "Container",
@@ -1206,6 +1219,10 @@ const SPEC_SITE_PATTERNS = {
         "label": "Navigation — the name centred",
         "global": "before",
         "phoneMenu": "drawer",
+        "header": {
+            "behaviour": "hides",
+            "edge": "fade"
+        },
         "intent": "The name centred above a centred row of pages — when the name is the brand.",
         "node": {
             "t": "Container",
@@ -5778,6 +5795,112 @@ const SPEC_SITE_LIBRARY = [
         "composed": true
     }
 ];
+const SPEC_SITE_PICTURE_WORLDS = {
+    "documentary": {
+        "label": "Documentary",
+        "medium": "an unposed documentary photograph, 35mm lens, natural eye-level framing",
+        "light": "available natural light, soft and directional",
+        "grade": "true-to-life colour with gentle contrast",
+        "texture": "fine natural grain and real, lived-in surfaces",
+        "negative": [
+            "staged poses",
+            "a studio backdrop"
+        ],
+        "dark": "low-key"
+    },
+    "high-key": {
+        "label": "High-key",
+        "medium": "a bright editorial photograph, 50mm lens, a clean composition with generous air",
+        "light": "soft, even daylight from a large window; few, pale shadows",
+        "grade": "a light, airy palette with lifted whites and low contrast",
+        "texture": "smooth surfaces and crisp, gentle detail",
+        "negative": [
+            "harsh shadows",
+            "dark corners"
+        ],
+        "dark": "low-key"
+    },
+    "low-key": {
+        "label": "Low-key",
+        "medium": "a moody photograph, 50mm lens at a wide aperture, shallow depth of field",
+        "light": "one warm, low light source; most of the frame falls into deep shadow",
+        "grade": "rich blacks with warm, glowing highlights",
+        "texture": "a soft haze in the air and a gentle film grain",
+        "negative": [
+            "flat lighting",
+            "a bright background"
+        ],
+        "dark": "low-key"
+    },
+    "hard-light": {
+        "label": "Hard light",
+        "medium": "a graphic photograph, 35mm lens, bold and simple shapes",
+        "light": "hard, direct sunlight with crisp, long cast shadows",
+        "grade": "saturated colour and punchy contrast",
+        "texture": "sharp edges and clean planes",
+        "negative": [
+            "haze",
+            "muddy colour"
+        ],
+        "dark": "low-key"
+    },
+    "macro": {
+        "label": "Macro",
+        "medium": "a close-up macro photograph, 100mm macro lens, a very shallow plane of focus",
+        "light": "soft side light raking across the surface",
+        "grade": "natural colour with rich mid-tones",
+        "texture": "tactile surface detail — grain, fibre, glaze, crumb",
+        "negative": [
+            "a wide view",
+            "clutter in focus"
+        ],
+        "dark": "low-key"
+    },
+    "architectural": {
+        "label": "Architectural",
+        "medium": "an architectural photograph, 24mm tilt-shift lens, straight verticals and a calm composition",
+        "light": "calm, diffuse daylight",
+        "grade": "neutral, precise colour with balanced contrast",
+        "texture": "clean lines and crisp materials — stone, wood, glass, plaster",
+        "negative": [
+            "converging verticals",
+            "wide-angle distortion"
+        ],
+        "dark": "nocturne"
+    },
+    "nocturne": {
+        "label": "Nocturne",
+        "medium": "a night photograph, 35mm lens",
+        "light": "practical lights only — lamps, candles, a warm window — against the dark",
+        "grade": "deep blue-black shadows with warm pools of light",
+        "texture": "soft bokeh and a light haze",
+        "negative": [
+            "daylight",
+            "flash"
+        ],
+        "dark": "nocturne"
+    },
+    "drawing": {
+        "label": "Drawing",
+        "medium": "a hand-made illustration, ink and watercolour wash on paper",
+        "light": "flat and even, never photographic",
+        "grade": "a limited palette of two or three colours",
+        "texture": "visible paper grain and brush strokes",
+        "negative": [
+            "photographic realism",
+            "a 3D rendering"
+        ],
+        "dark": "drawing"
+    }
+};
+const SPEC_SITE_PICTURE_NEVER = [
+    "text, letters or numbers",
+    "logos, brand names or signage",
+    "a watermark",
+    "a recognisable face",
+    "borders or frames",
+    "distorted hands or objects"
+];
 
 const NODE_BASELINES = {
     "Button": {
@@ -6466,7 +6589,9 @@ const NODE_BASELINES = {
             "defaultOn",
             "activateOn",
             "orientation",
-            "ariaLabel"
+            "ariaLabel",
+            "headerBehaviour",
+            "headerEdge"
         ],
         "styleTraits": [
             "position",
@@ -8889,6 +9014,10 @@ const NODE_BASELINES = {
             "slideToClickedSlide": false,
             "effect": "slide",
             "speed": 300,
+            "scrollPlays": false,
+            "controlsPlacement": "under",
+            "enableCaption": false,
+            "enableCount": false,
             "enableNavigation": false,
             "navigationColor": "#ffffff",
             "navigationSize": 44,
@@ -8996,7 +9125,11 @@ const NODE_BASELINES = {
             "__effectsLabel",
             "effect",
             "speed",
+            "scrollPlays",
             "__navLabel",
+            "controlsPlacement",
+            "enableCaption",
+            "enableCount",
             "enableNavigation",
             "navigationColor",
             "navigationSize",
@@ -9101,7 +9234,9 @@ const NODE_BASELINES = {
         "container": true
     },
     "SliderSlide": {
-        "props": {},
+        "props": {
+            "caption": ""
+        },
         "styleProps": {
             "position": "static",
             "top": "auto",
@@ -9180,7 +9315,9 @@ const NODE_BASELINES = {
             "transitionDelay": "0ms",
             "transitionTimingFunction": "ease"
         },
-        "traits": [],
+        "traits": [
+            "caption"
+        ],
         "styleTraits": [
             "position",
             "top",
@@ -11654,6 +11791,98 @@ function jsonSchemaObjects(node, out = []) {
     return out;
 }
 
+/**
+ * A site's ART DIRECTION (premium-components M7, premium sites PS4): what every picture made for the site shares, so its
+ * pictures read as one photographer's and never as a stock pool. A closed WORLD (the contract's `site.pictureWorlds`)
+ * gives the five parts — medium, light, grade, texture and a negative list — and ONE preamble built from them is carried
+ * VERBATIM at the head of every picture prompt of the site (`artDirectionPreamble`).
+ *
+ * Decided here, not by a model: the world is the business type's (harness-core `BusinessType.world`), a dark look moves it
+ * to the world's `dark`, and the brand's hue joins the grade. Zero tokens, the same site always gets the same direction,
+ * and the quality lever — each world's wording — is written once in the contract, as the proof sites' briefs were.
+ */
+var PictureWorld;
+(function (PictureWorld) {
+    PictureWorld["Documentary"] = "documentary";
+    PictureWorld["HighKey"] = "high-key";
+    PictureWorld["LowKey"] = "low-key";
+    PictureWorld["HardLight"] = "hard-light";
+    PictureWorld["Macro"] = "macro";
+    PictureWorld["Architectural"] = "architectural";
+    PictureWorld["Nocturne"] = "nocturne";
+    PictureWorld["Drawing"] = "drawing";
+})(PictureWorld || (PictureWorld = {}));
+const PICTURE_WORLD_IDS = Object.values(PictureWorld);
+const PICTURE_WORLDS = SPEC_SITE_PICTURE_WORLDS;
+/** What no picture of any site shows — every world adds its own after these. */
+const PICTURE_NEVER = SPEC_SITE_PICTURE_NEVER;
+/** The five parts every art direction must carry, in the order the preamble says them. */
+const ART_DIRECTION_PARTS = ['medium', 'light', 'grade', 'texture', 'negative'];
+function isPictureWorld(value) {
+    return typeof value === 'string' && PICTURE_WORLD_IDS.includes(value);
+}
+/** OKLCH hue bands (degrees, upper bound) → the word a grade says; below the chroma floor a brand is neutral. */
+const HUE_WORDS = [
+    [12, 'rose'], [33, 'red'], [55, 'terracotta orange'], [80, 'warm amber'], [110, 'golden yellow'], [135, 'olive green'],
+    [170, 'green'], [215, 'teal'], [255, 'blue'], [285, 'deep blue'], [315, 'violet'], [345, 'plum'], [360, 'rose'],
+];
+const NEUTRAL_CHROMA = 0.04;
+const RADIANS_TO_DEGREES = 180 / Math.PI;
+const FULL_TURN = 360;
+/** The word for a brand colour's hue (`#9A4F2B` → "terracotta orange"), or null for a grey, a near-black or a bad value. */
+function brandHueWord(seed) {
+    const rgb = seed ? parseHexColor(seed) : null;
+    if (!rgb)
+        return null;
+    const { a, b } = rgbToOklab(rgb);
+    if (Math.hypot(a, b) < NEUTRAL_CHROMA)
+        return null;
+    const hue = (Math.atan2(b, a) * RADIANS_TO_DEGREES + FULL_TURN) % FULL_TURN;
+    return HUE_WORDS.find(([upTo]) => hue < upTo)?.[1] ?? null;
+}
+/**
+ * The site's art direction: the business type's world (moved to its `dark` world when the look is dark), its five parts,
+ * the brand's hue in the grade, PICTURE_NEVER before the world's own negatives. An unknown world is documentary.
+ */
+function artDirectionFor(world, design) {
+    const start = isPictureWorld(world) ? world : PictureWorld.Documentary;
+    const moved = design.mode === 'dark' ? PICTURE_WORLDS[start].dark : start;
+    const id = isPictureWorld(moved) ? moved : start;
+    const spec = PICTURE_WORLDS[id];
+    const hue = brandHueWord(design.seed);
+    return {
+        world: id,
+        medium: spec.medium,
+        light: spec.light,
+        grade: hue ? `${spec.grade}, leaning toward ${hue} so the pictures sit with the brand` : spec.grade,
+        texture: spec.texture,
+        negative: [...PICTURE_NEVER, ...spec.negative],
+    };
+}
+/** The ONE preamble a site's every picture prompt opens with — the same words, in the same order, every time. */
+function artDirectionPreamble(direction) {
+    const medium = direction.medium.charAt(0).toUpperCase() + direction.medium.slice(1);
+    return `${medium}. Light: ${direction.light}. Colour: ${direction.grade}. Texture: ${direction.texture}. Never: ${direction.negative.join('; ')}.`;
+}
+/** What is wrong with a value as an art direction — a path and a message each (`validateSitePlan` reports them). */
+function artDirectionIssues(value) {
+    if (!value || typeof value !== 'object' || Array.isArray(value))
+        return [{ path: '', message: 'must be an object' }];
+    const v = value;
+    const issues = [];
+    if (!isPictureWorld(v['world']))
+        issues.push({ path: 'world', message: `must be one of ${PICTURE_WORLD_IDS.join(', ')}` });
+    for (const part of ART_DIRECTION_PARTS.filter(p => p !== 'negative')) {
+        if (typeof v[part] !== 'string' || !v[part].trim())
+            issues.push({ path: part, message: 'must be words' });
+    }
+    const negative = v['negative'];
+    if (!Array.isArray(negative) || !negative.length || negative.some(n => typeof n !== 'string' || !n.trim())) {
+        issues.push({ path: 'negative', message: 'must list what no picture may show' });
+    }
+    return issues;
+}
+
 const LIST_RECIPES = {
     [PatternRecipe.Accordion]: { picks: f => ({ ...pickAccordionAutoBinds(f) }), required: ['question', 'answer'], needs: 'short-text field for the question and long-text field for the answer' },
     [PatternRecipe.Tabs]: { picks: f => ({ ...pickTabsAutoBinds(f) }), required: ['label', 'text'], needs: 'short-text field for the tab and long-text field for its panel' },
@@ -11739,6 +11968,8 @@ var SitePlanIssueCode;
     /** SC6b: the owner's film — pictures that cannot play, too few to play smoothly, or a film's pattern on a plan with
      *  no film (or twice). Set by the build, never by a model. */
     SitePlanIssueCode["Film"] = "film";
+    /** M7: the art direction is not a picture world with its five parts. Set by the generation, never by a model. */
+    SitePlanIssueCode["ArtDirection"] = "art-direction";
 })(SitePlanIssueCode || (SitePlanIssueCode = {}));
 class SitePlanError extends Error {
     constructor(issues) {
@@ -11769,6 +12000,7 @@ const CMS_SOURCE_KEYS = shapeKeys(SHAPE['cmsDataSource']);
 const RELATIVE_SOURCE_KEYS = shapeKeys(SHAPE['relativeDataSource']);
 const PAGE_KEYS = shapeKeys(SHAPE['page']);
 const FILM_KEYS = shapeKeys(SHAPE['film']);
+const ART_DIRECTION_KEYS = shapeKeys(SHAPE['artDirection']);
 const SECTION_KEYS = shapeKeys(SHAPE['section']);
 const GLOBAL_POSITION = {
     [GlobalSlot.Header]: PatternGlobalPosition.Before,
@@ -12253,6 +12485,16 @@ function validateFilm(c, film, pages) {
         });
     });
 }
+/** M7: what every picture made for the site shares — a known world and its five parts (`artDirectionIssues`). */
+function validateArtDirection(c, direction) {
+    if (direction === undefined)
+        return;
+    if (isPlainObject(direction))
+        c.keys(direction, ART_DIRECTION_KEYS, 'artDirection');
+    for (const issue of artDirectionIssues(direction)) {
+        c.add(issue.path ? SitePlanIssueCode.ArtDirection : SitePlanIssueCode.Shape, issue.path ? `artDirection.${issue.path}` : 'artDirection', issue.message);
+    }
+}
 function validatePageSeo(c, seo, path) {
     if (seo === undefined)
         return;
@@ -12307,6 +12549,7 @@ function validateSitePlan(plan) {
     validateGlobals(c, plan['globals']);
     validateScenes(c, c.array(plan, 'pages', ''), typeof design['animate'] === 'string' ? design['animate'] : null);
     validateFilm(c, plan['film'], c.array(plan, 'pages', ''));
+    validateArtDirection(c, plan['artDirection']);
     return { valid: c.issues.length === 0, issues: c.issues };
 }
 /** Throw a `SitePlanError` carrying every issue unless the plan is valid. */
@@ -14190,6 +14433,13 @@ function composeSite(plan, context) {
         if (shape)
             globals = planNavShape(globals, shape, {}, slot).globals;
     }
+    // Premium M4 (T2): a header pattern's behaviour as the page scrolls — the same edit the Header section makes.
+    for (const slot of Object.values(GlobalSlot)) {
+        const header = patternById(plan.globals[slot])?.header;
+        const root = header ? globals.find(g => g.id === slot) : null;
+        if (header && root)
+            setHeaderBehaviour(root, header.behaviour, header.edge ?? null);
+    }
     return {
         source: clone$1(plan.source),
         business: clone$1(plan.business),
@@ -14250,6 +14500,8 @@ function composeNavHeader(input, options) {
     root.globalPosition = pattern.global;
     const shape = pattern.phoneMenu;
     const header = shape ? planNavShape([root], shape, { newId: options.newId }, root.id).globals[0] : root;
+    if (pattern.header)
+        setHeaderBehaviour(header, pattern.header.behaviour, pattern.header.edge ?? null);
     return { header, issues };
 }
 // ── One pattern on its own (CC4b) ───────────────────────────────────────────────────────────────
@@ -14499,6 +14751,9 @@ var BuildNoticeCode;
     /** The stock library was read but holds no photo for this kind of business (never built, or reviewed down to
      *  none): the picture slots keep the empty box, and the run says so (I2.1 — never silently). */
     BuildNoticeCode["StockMissing"] = "stock-missing";
+    /** M7: a picture made for the site was refused by its review twice (or its second try did not fit the cost shown):
+     *  stock or the empty box stands in, and the run says so. */
+    BuildNoticeCode["PictureFallback"] = "picture-fallback";
 })(BuildNoticeCode || (BuildNoticeCode = {}));
 var PreflightRefusalCode;
 (function (PreflightRefusalCode) {
@@ -14827,6 +15082,8 @@ const PLAN_WIRE_DERIVED = {
     design: "the owner's pick (the context)",
     'plan.film': "the owner's film, set by the build (SC6b)",
     film: "the owner's film, set by the build (SC6b)",
+    'plan.artDirection': 'the generation, from the business type and the look (M7 — artDirectionFor)',
+    artDirection: 'the generation, from the business type and the look (M7 — artDirectionFor)',
 };
 const wireText = (spec) => {
     const [entry, planKey] = spec.refs[0].split('.');
@@ -15170,6 +15427,8 @@ var AiStep;
     AiStep["PlanSite"] = "plan";
     AiStep["ChangePlan"] = "planEdit";
     AiStep["MakePictures"] = "image";
+    /** M7: a small vision model looks at each made picture against its slot (one structured answer). */
+    AiStep["CheckPictures"] = "imageReview";
     AiStep["NameStructures"] = "scanNaming";
 })(AiStep || (AiStep = {}));
 const AI_STEPS = Object.values(AiStep);
@@ -15179,6 +15438,7 @@ const AI_STEP_LABELS = {
     [AiStep.PlanSite]: 'Plan the site',
     [AiStep.ChangePlan]: 'Change the plan',
     [AiStep.MakePictures]: 'Make pictures',
+    [AiStep.CheckPictures]: 'Check pictures',
     [AiStep.NameStructures]: 'Name repeated structures',
 };
 /** What a model must be able to do for a step to run on it. */
@@ -15193,6 +15453,7 @@ const AI_STEP_NEEDS = {
     [AiStep.PlanSite]: [AiCapability.StructuredOutput],
     [AiStep.ChangePlan]: [AiCapability.StructuredOutput],
     [AiStep.MakePictures]: [AiCapability.ImageOutput],
+    [AiStep.CheckPictures]: [AiCapability.StructuredOutput, AiCapability.ImageInput],
     [AiStep.NameStructures]: [AiCapability.StructuredOutput],
 };
 /**
@@ -15227,8 +15488,12 @@ const AI_STEP_TYPICAL_TOKENS = {
     [AiStep.ReadMessage]: { input: 8_800, output: 1_500, cacheWrite: 0, cacheRead: 0 },
     [AiStep.PlanSite]: partsTotal(AiStep.PlanSite),
     [AiStep.ChangePlan]: partsTotal(AiStep.ChangePlan),
-    // a 1 K picture is 1,120 image tokens (Google's figure for Nano Banana 2) — I-D4
-    [AiStep.MakePictures]: { input: 0, output: 0, cacheWrite: 0, cacheRead: 0, imageOutput: 1_120 },
+    // a 1 K picture is 1,120 image tokens (Google's figure for Nano Banana 2) — I-D4; the prompt (the art direction's
+    // preamble, the slot's subject, its frame and empty area) about 400 more in (M7)
+    [AiStep.MakePictures]: { input: 400, output: 0, cacheWrite: 0, cacheRead: 0, imageOutput: 1_120 },
+    // M7: one picture downscaled to 512 px (≈ 350 image tokens for Claude, ≈ 260 for Gemini) + the slot's question,
+    // and a short structured answer
+    [AiStep.CheckPictures]: { input: 1_200, output: 150, cacheWrite: 0, cacheRead: 0 },
     [AiStep.NameStructures]: { input: 80_000, output: 10_000, cacheWrite: 0, cacheRead: 0 },
 };
 /** 1 credit = 1 US cent of what the AI actually cost (decision D4). */
@@ -16177,6 +16442,10 @@ var SiteFindingCode;
     SiteFindingCode["CopyPlaceholder"] = "copy-placeholder";
     SiteFindingCode["SampleItems"] = "sample-items";
     SiteFindingCode["StockPhoto"] = "stock-photo";
+    /** M7: a picture made with AI for the site still stands where one of the studio's own could. */
+    SiteFindingCode["MadePicture"] = "made-picture";
+    /** M7: a picture the build could not make (its review said no twice) and nothing stood in for: an empty box. */
+    SiteFindingCode["PictureMissing"] = "picture-missing";
     SiteFindingCode["NoPrivacyPage"] = "no-privacy-page";
     SiteFindingCode["PrivacyPagePlaceholder"] = "privacy-page-placeholder";
     SiteFindingCode["LowContrast"] = "low-contrast";
@@ -16201,6 +16470,8 @@ const FINDING_SEVERITY = {
     [SiteFindingCode.CopyPlaceholder]: CheckSeverity.Ask,
     [SiteFindingCode.SampleItems]: CheckSeverity.Ask,
     [SiteFindingCode.StockPhoto]: CheckSeverity.Ask,
+    [SiteFindingCode.MadePicture]: CheckSeverity.Ask,
+    [SiteFindingCode.PictureMissing]: CheckSeverity.Warn,
     [SiteFindingCode.NoPrivacyPage]: CheckSeverity.Ask,
     [SiteFindingCode.PrivacyPagePlaceholder]: CheckSeverity.Block,
     [SiteFindingCode.LowContrast]: CheckSeverity.Warn,
@@ -16224,6 +16495,8 @@ const CHECK_OF = {
     [SiteFindingCode.CopyPlaceholder]: SiteCheckId.Facts,
     [SiteFindingCode.SampleItems]: SiteCheckId.Facts,
     [SiteFindingCode.StockPhoto]: SiteCheckId.Facts,
+    [SiteFindingCode.MadePicture]: SiteCheckId.Facts,
+    [SiteFindingCode.PictureMissing]: SiteCheckId.Facts,
     [SiteFindingCode.NoPrivacyPage]: SiteCheckId.Facts,
     [SiteFindingCode.PrivacyPagePlaceholder]: SiteCheckId.Facts,
     [SiteFindingCode.LowContrast]: SiteCheckId.Accessibility,
@@ -16346,6 +16619,10 @@ function checkFacts(ctx, snapshot, pages, personal) {
         add(ctx, SiteFindingCode.SampleItems, `"${s.label ?? s.id}" is a sample — replace or remove it.`, { nodeId: s.id });
     for (const s of (snapshot.stock ?? []).filter(inScope))
         add(ctx, SiteFindingCode.StockPhoto, 'A stock photo stands in for one of yours.', { pageId: s.pageId, nodeId: s.nodeId, owner: s.owner });
+    for (const s of (snapshot.made ?? []).filter(inScope))
+        add(ctx, SiteFindingCode.MadePicture, 'A picture made with AI stands in for one of yours.', { pageId: s.pageId, nodeId: s.nodeId, owner: s.owner });
+    for (const s of (snapshot.missing ?? []).filter(inScope))
+        add(ctx, SiteFindingCode.PictureMissing, 'A picture could not be made for this spot — add one of yours.', { pageId: s.pageId, nodeId: s.nodeId, owner: s.owner });
     if (!personal)
         return;
     const privacy = snapshot.pages.find(p => PRIVACY_PAGE.test(p.route) || PRIVACY_PAGE.test(p.name));
@@ -16844,21 +17121,47 @@ function stockItemSlots(plan, composed) {
     }
     return out;
 }
-const intentRank = (intent) => STOCK_INTENT_ORDER.indexOf(intent);
+/** How far below the best score a photo may be and still be the seed's choice (one word of the plan's, about). */
+const STOCK_SEED_MARGIN = 2;
+/** A stable 32-bit hash (FNV-1a) — the seed's order of the library, the same in every runtime. */
+function seededRank(seed, key) {
+    let hash = 0x811c9dc5;
+    for (const ch of `${seed}:${key}`) {
+        hash ^= ch.codePointAt(0);
+        hash = Math.imul(hash, 0x01000193) >>> 0;
+    }
+    return hash;
+}
+/** The best of `pool` for `slot`: the highest score (ties: the library's order), or — with a seed — the seed's pick among
+ *  those within `STOCK_SEED_MARGIN` of it. */
+function bestFor(pool, slot, imagery, seed) {
+    const scored = pool.map(photo => ({ photo, score: scoreStockPhoto(photo, slot, imagery) }));
+    const top = scored.reduce((m, s) => Math.max(m, s.score), -Infinity);
+    if (!seed)
+        return scored.find(s => s.score === top)?.photo;
+    const near = scored.filter(s => s.score >= top - STOCK_SEED_MARGIN);
+    return near.reduce((best, s) => {
+        const rank = seededRank(seed, s.photo.key);
+        return !best || rank < best.rank ? { photo: s.photo, rank } : best;
+    }, undefined)?.photo;
+}
+const intentRank$1 = (intent) => STOCK_INTENT_ORDER.indexOf(intent);
 /**
  * Which photo goes where (I2.1). Slots choose in intent order (the hero first, list items last; page order within),
  * each taking the best-scoring photo that FITS its shape (`stockFits`) and is not already on its page (or among its
  * type's samples) — a photo no slot has taken yet always before one another page shows. Ties go to the library's
- * order. A slot nothing fits keeps its empty box (a sample its abstract picture). None at all when the type says no
- * stock, and never a photo the review rejected or flagged. Returned in the slots' order.
+ * order — or, with a `seed` (M7), the site's own pick among those nearly as good, and another site's photos (`avoid`) only
+ * when nothing fresh fits. A slot nothing fits keeps its empty box (a sample its abstract picture). None at all when the
+ * type says no stock, and never a photo the review rejected or flagged. Returned in the slots' order.
  */
 function planStockPhotos(slots, photos, stockAllowed, opts = {}) {
     if (!stockAllowed)
         return [];
     const usable = photos.filter(stockPhotoUsable);
     const imagery = stockWords(opts.imagery);
-    const order = slots.map((slot, i) => ({ slot, i })).sort((a, b) => intentRank(a.slot.intent) - intentRank(b.slot.intent) || a.i - b.i);
-    const used = new Set();
+    const order = slots.map((slot, i) => ({ slot, i })).sort((a, b) => intentRank$1(a.slot.intent) - intentRank$1(b.slot.intent) || a.i - b.i);
+    // Another site's photos count as already shown: a fresh one that fits always comes first.
+    const used = new Set(opts.avoid ?? []);
     const shownIn = new Map();
     const placed = new Map();
     for (const { slot, i } of order) {
@@ -16866,16 +17169,7 @@ function planStockPhotos(slots, photos, stockAllowed, opts = {}) {
         const here = shownIn.get(group) ?? new Set();
         const candidates = usable.filter(p => !here.has(p.key) && stockFits(p, slot));
         const fresh = candidates.filter(p => !used.has(p.key));
-        const pool = fresh.length ? fresh : candidates;
-        let best;
-        let bestScore = -Infinity;
-        for (const photo of pool) {
-            const score = scoreStockPhoto(photo, slot, imagery);
-            if (score > bestScore) {
-                best = photo;
-                bestScore = score;
-            }
-        }
+        const best = bestFor(fresh.length ? fresh : candidates, slot, imagery, opts.seed);
         if (!best)
             continue;
         used.add(best.key);
@@ -16952,6 +17246,353 @@ function addStockCredits(footer, credits) {
     return added;
 }
 
+/**
+ * Pictures MADE for a site (premium-components M7, AI plan I3, premium sites PS4) — pure and deterministic: which picture
+ * slots of a composed site get a made picture, the prompt each is asked with (the site's ONE art direction first,
+ * verbatim, then what the slot is about, its frame and — where words sit over it — the part of the frame left calm for
+ * them), what the whole set costs before anything is asked, how a vision model's look at each picture is judged, and how
+ * dark the scrim under the words must be for the picture actually made. iox-cms makes, reviews and stores the pictures;
+ * the wizard shows the count and the cost from the same functions.
+ *
+ * The order of who fills a slot never changes: the OWNER's photos first (`planOwnPhotos`), then — only when the owner
+ * opted in — a made picture where one may stand, then stock where the business type allows it, else the empty box.
+ */
+/** Why a slot never gets a made picture — said to the owner, never silently skipped. */
+var PictureRefusal;
+(function (PictureRefusal) {
+    /** The business sells its own work (a photographer, a maker): a made picture would pass as it. */
+    PictureRefusal["OwnWork"] = "own-work";
+    /** A product, a dish, a piece the business offers: a made one would show a thing it does not sell. */
+    PictureRefusal["Product"] = "product";
+    /** Where to find the business: a made picture would fake a real place. */
+    PictureRefusal["RealPlace"] = "real-place";
+    /** More slots than one site makes pictures for (`MAX_SITE_PICTURES`): the rest keep stock or the empty box. */
+    PictureRefusal["Limit"] = "limit";
+})(PictureRefusal || (PictureRefusal = {}));
+/** The section families whose picture is a real place (the contact / visit section). */
+const PICTURE_REAL_PLACE_FAMILIES = new Set(['contact']);
+/** The most pictures one site is made — a ceiling on what one build may spend on pictures. */
+const MAX_SITE_PICTURES = 12;
+/** Which edge of the frame the words sit at. */
+var WordsEdge;
+(function (WordsEdge) {
+    WordsEdge["Top"] = "top";
+    WordsEdge["Bottom"] = "bottom";
+})(WordsEdge || (WordsEdge = {}));
+/** A scrim with no height of its own (it wraps its words) covers about this much of the frame. */
+const WORDS_AREA_DEFAULT_SHARE = 0.45;
+const MEDIA_SCRIM_STYLE = 'media-scrim';
+const ABSOLUTE = 'absolute';
+const ZERO = /^0(px|%)?$/;
+const PERCENT = /^(\d+(?:\.\d+)?)%$/;
+/** The frames an image model is asked for (`image_config.aspect_ratio`), as width / height. */
+const PICTURE_ASPECTS = {
+    '1:1': 1, '2:3': 2 / 3, '3:2': 3 / 2, '3:4': 3 / 4, '4:3': 4 / 3, '4:5': 4 / 5, '5:4': 5 / 4, '9:16': 9 / 16, '16:9': 16 / 9, '21:9': 21 / 9,
+};
+/** A slot that fills its box (a Scene's picture, a full-bleed band) is made wide: a phone crops its middle. */
+const FILL_ASPECT = '16:9';
+/** The ONE list of picture slots a build fills — its composed sections' empty pictures, then its sample items'. */
+function pictureTargets(plan, composed) {
+    return [...stockSlots(plan, composed), ...stockItemSlots(plan, composed)];
+}
+/** A slot's stable key. */
+function pictureSlotKey(target) {
+    return target.kind === StockSlotKind.Section ? `page:${target.owner}:${target.nodeId}` : `item:${target.contentType}:${target.index}:${target.field}`;
+}
+/** The nearest frame a model is asked for (by the ratio of ratios); a slot with no shape fills its box. */
+function pictureAspect(aspect) {
+    if (!aspect || !Number.isFinite(aspect) || aspect <= 0)
+        return FILL_ASPECT;
+    let best = FILL_ASPECT;
+    let distance = Infinity;
+    for (const [ratio, value] of Object.entries(PICTURE_ASPECTS)) {
+        const d = Math.abs(Math.log(value / aspect));
+        if (d < distance) {
+            best = ratio;
+            distance = d;
+        }
+    }
+    return best;
+}
+function indexNodes(composed) {
+    const at = new Map();
+    composed.pages.forEach((page, p) => page.layout.forEach((root, s) => {
+        walkSerialized([root], (node, ancestors) => at.set(node.id, { node, parent: ancestors[ancestors.length - 1], section: s, page: p }));
+    }));
+    return at;
+}
+/**
+ * The words over a picture: a picture laid ABSOLUTE in its box whose sibling wears `media-scrim` (a Scene's stage, a
+ * full-bleed band) carries the words that box holds. The area is the scrim's: its height when it says one, else
+ * `WORDS_AREA_DEFAULT_SHARE`, at the edge it is pinned to.
+ */
+function wordsOverPicture(node, parent) {
+    if (!parent || node.styleProps['position'] !== ABSOLUTE)
+        return null;
+    const scrim = parent.children?.find(c => c !== node && c.elementStyle === MEDIA_SCRIM_STYLE);
+    if (!scrim)
+        return null;
+    const top = String(scrim.styleProps['top'] ?? '');
+    const bottom = String(scrim.styleProps['bottom'] ?? '');
+    const edge = ZERO.test(top) && !ZERO.test(bottom) ? WordsEdge.Top : WordsEdge.Bottom;
+    const height = PERCENT.exec(String(scrim.styleProps['height'] ?? ''));
+    const share = height ? Math.min(1, Number(height[1]) / 100) : WORDS_AREA_DEFAULT_SHARE;
+    return { area: { edge, share }, scrimNodeId: scrim.id };
+}
+const SECTION_TEXT_MAX = 160;
+/** What a section says (its slots, in the plan's words), cut to a prompt's length. */
+function sectionText(plan, page, section) {
+    const slots = plan.pages[page]?.sections[section]?.slots ?? {};
+    const text = Object.values(slots).filter((v) => typeof v === 'string' && !!v.trim()).join(' — ').replace(/<[^>]*>/g, ' ').replace(/\s+/g, ' ').trim();
+    return text.length > SECTION_TEXT_MAX ? `${text.slice(0, SECTION_TEXT_MAX - 1).trimEnd()}…` : text;
+}
+/** Why `target` never gets a made picture, or null. */
+function pictureRefusalOf(target, stockAllowed) {
+    if (!stockAllowed)
+        return PictureRefusal.OwnWork;
+    if (target.kind === StockSlotKind.Item)
+        return PictureRefusal.Product;
+    const family = patternById(target.pattern)?.family ?? '';
+    return PICTURE_REAL_PLACE_FAMILIES.has(family) ? PictureRefusal.RealPlace : null;
+}
+const intentRank = (intent) => STOCK_INTENT_ORDER.indexOf(intent);
+/**
+ * Which slots get a made picture: the owner's photos take theirs first (the same `planOwnPhotos` the build places them
+ * with), then each slot left — the hero first, page order within — gets one unless it is refused (the work, a product,
+ * a real place) or the site already has `max`. Pure: the wizard's count, the generation's run and the build agree.
+ */
+function planPictures(plan, composed, opts) {
+    const { placements: own, rest } = planOwnPhotos(pictureTargets(plan, composed), opts.ownPhotos ?? []);
+    const nodes = indexNodes(composed);
+    const max = opts.max ?? MAX_SITE_PICTURES;
+    const ordered = rest.map((t, i) => ({ t, i })).sort((a, b) => intentRank(a.t.intent) - intentRank(b.t.intent) || a.i - b.i).map(x => x.t);
+    const make = [];
+    const refused = [];
+    for (const target of ordered) {
+        const key = pictureSlotKey(target);
+        const reason = pictureRefusalOf(target, opts.stockAllowed) ?? (make.length >= max ? PictureRefusal.Limit : null);
+        if (reason) {
+            refused.push({ key, reason });
+            continue;
+        }
+        make.push(pictureSlotOf(plan, target, key, nodes));
+    }
+    return { own, make, refused };
+}
+function pictureSlotOf(plan, target, key, nodes) {
+    const base = { key, target, intent: target.intent, ratio: pictureAspect(target.aspect) };
+    if (target.kind !== StockSlotKind.Section)
+        return { ...base, family: '', text: '' };
+    const at = nodes.get(target.nodeId);
+    const over = at ? wordsOverPicture(at.node, at.parent) : null;
+    return {
+        ...base,
+        family: patternById(target.pattern)?.family ?? '',
+        text: at ? sectionText(plan, at.page, at.section) : '',
+        ...(over ? { wordsArea: over.area, scrimNodeId: over.scrimNodeId } : {}),
+    };
+}
+// ── The prompt ──────────────────────────────────────────────────────────────────────────────────────────────────────
+/** What each kind of slot asks to see (`business` = the kind of business, "a café or bakery"). */
+const INTENT_SUBJECT = {
+    [StockIntent.Atmosphere]: b => `A wide, atmospheric picture that sets the mood of ${b}: depth, a sense of the place, nothing staged.`,
+    [StockIntent.Place]: b => `The kind of place ${b} is: the room or the setting at eye level, quiet and inviting.`,
+    [StockIntent.Detail]: b => `A close detail of the work of ${b}: its materials, its tools, a moment of making.`,
+    [StockIntent.Product]: b => `One thing ${b} offers, alone on a plain ground.`,
+};
+const EDGE_WORD = { [WordsEdge.Top]: 'upper', [WordsEdge.Bottom]: 'lower' };
+/** The empty part a slot's words sit over, said to the model: where, how much, and what it must look like. */
+function emptyAreaPhrase(area) {
+    const share = Math.round(area.share * 100);
+    return `Leave the ${EDGE_WORD[area.edge]} ${share}% of the frame calm and uncluttered — soft focus, even tone, nothing important there — because the site's words sit over it.`;
+}
+/** The frame, said plainly. */
+function frameWords(ratio) {
+    const value = PICTURE_ASPECTS[ratio] ?? 1;
+    const shape = value > 1.05 ? 'landscape' : value < 0.95 ? 'portrait' : 'square';
+    return `Frame: ${shape}, ${ratio}.`;
+}
+/**
+ * The prompt a picture is asked with: the site's preamble VERBATIM, what the slot is about (its intent, then the
+ * section's own words), its frame, the empty part the words need — and nothing else. The same slot of the same plan
+ * is always asked the same words.
+ */
+function picturePrompt(slot, direction, context) {
+    return [
+        artDirectionPreamble(direction),
+        INTENT_SUBJECT[slot.intent](context.business),
+        ...(slot.text ? [`It goes beside these words of the site: “${slot.text}”.`] : []),
+        frameWords(slot.ratio),
+        ...(slot.wordsArea ? [emptyAreaPhrase(slot.wordsArea)] : []),
+    ].join('\n');
+}
+// ── The cost, shown before ──────────────────────────────────────────────────────────────────────────────────────────
+/** One picture in this many may be made a second time (a review said no) — paid for in the estimate shown. */
+const PICTURE_REROLL_EVERY = 6;
+/** How many second tries a set of `count` pictures has, shown and paid for up front. */
+function pictureRerolls(count) {
+    return count > 0 ? Math.ceil(count / PICTURE_REROLL_EVERY) : 0;
+}
+/**
+ * The cost shown before the owner says yes (I-D4): each picture and its review at the vetted list's prices, plus one
+ * second try (a picture and its review) for every `PICTURE_REROLL_EVERY` pictures. The run never spends past `total` —
+ * a second try that would cross it is not made — so the shown cost is a ceiling met exactly when every try is used.
+ */
+function estimatePictures(count, prices) {
+    const picture = estimateStepCredits(AiStep.MakePictures, prices.image);
+    const review = estimateStepCredits(AiStep.CheckPictures, prices.review);
+    const rerolls = pictureRerolls(count);
+    return { count, rerolls, picture, review, total: creditsOfUsd(((count + rerolls) * (picture + review)) / 100) };
+}
+// ── The review ──────────────────────────────────────────────────────────────────────────────────────────────────────
+/** The structured answer's name (`output.name`). */
+const PICTURE_REVIEW_FORMAT = 'picture_review';
+/** The review's shape, each key in the words the model reads (every key required: no optional parameter). */
+const PICTURE_REVIEW_SHAPE = {
+    subject: 'boolean — it shows what the slot asked for, in the art direction asked',
+    calmArea: 'boolean — the part of the frame named for words is calm enough to read words over (true when none was named)',
+    clean: 'boolean — no text, letters, numbers, logo, watermark, signage or frame anywhere',
+    anatomy: 'boolean — no distorted hands, faces, bodies or objects; nothing melted or duplicated',
+    alt: 'string — what the picture shows, in at most 12 plain words, in the language asked (the alt text)',
+    note: 'string — why, when any answer is false; else empty',
+};
+const BOOLEAN_KEYS = ['subject', 'calmArea', 'clean', 'anatomy'];
+const TEXT_KEYS = ['alt', 'note'];
+/** The review's strict format: 6 properties, all required, closed — well inside every structured-output limit. */
+function pictureReviewJsonSchema() {
+    const properties = {};
+    for (const key of BOOLEAN_KEYS)
+        properties[key] = { ...jsonBoolean(), description: PICTURE_REVIEW_SHAPE[key] };
+    for (const key of TEXT_KEYS)
+        properties[key] = { ...jsonText(), description: PICTURE_REVIEW_SHAPE[key] };
+    return jsonClosedObject(properties, [...BOOLEAN_KEYS, ...TEXT_KEYS], 'A look at one picture made for a website, against what its slot asked for.');
+}
+/** What is wrong with an answer as a review — the gate the call service holds it to. */
+function pictureReviewIssues(value) {
+    if (!value || typeof value !== 'object' || Array.isArray(value))
+        return [{ code: 'shape', path: '', message: 'must be an object' }];
+    const v = value;
+    const issues = [];
+    for (const key of BOOLEAN_KEYS)
+        if (typeof v[key] !== 'boolean')
+            issues.push({ code: 'shape', path: key, message: 'must be true or false' });
+    for (const key of TEXT_KEYS)
+        if (typeof v[key] !== 'string')
+            issues.push({ code: 'shape', path: key, message: 'must be text' });
+    for (const key of Object.keys(v))
+        if (!(key in PICTURE_REVIEW_SHAPE))
+            issues.push({ code: 'shape', path: key, message: 'is not a key of the review' });
+    return issues;
+}
+/** A picture is used when it shows the subject, is clean and whole — and, where words sit over it, leaves them room. */
+function pictureReviewPasses(review, slot) {
+    return review.subject && review.clean && review.anatomy && (!slot.wordsArea || review.calmArea);
+}
+// ── Words over the picture made ─────────────────────────────────────────────────────────────────────────────────────
+/** How strong the scrim under a picture's words is, weakest first. `Soft` is the element style's own gradient. */
+var ScrimLevel;
+(function (ScrimLevel) {
+    ScrimLevel["Soft"] = "soft";
+    ScrimLevel["Firm"] = "firm";
+    ScrimLevel["Full"] = "full";
+})(ScrimLevel || (ScrimLevel = {}));
+const SCRIM_LEVELS = [ScrimLevel.Soft, ScrimLevel.Firm, ScrimLevel.Full];
+/** What each level writes on the scrim node (`backgroundColor`, token references only) — `null`: the style's own. */
+const SCRIM_BACKGROUND = {
+    [ScrimLevel.Soft]: null,
+    [ScrimLevel.Firm]: 'linear-gradient(180deg, transparent 0%, var(--iox-media-scrim) 18%)',
+    [ScrimLevel.Full]: 'var(--iox-media-scrim)',
+};
+/** The least share of the scrim's own strength under the first line of words, at each level (the gradient's ramp). */
+const SCRIM_COVER = {
+    [ScrimLevel.Soft]: 0.5,
+    [ScrimLevel.Firm]: 0.85,
+    [ScrimLevel.Full]: 1,
+};
+/** WCAG AA for body text — the words over a picture include a lead and a button label, never only a headline. */
+const PICTURE_TEXT_CONTRAST = 4.5;
+/** The share of pixels left out at each end, so a single sparkle does not decide the scrim. */
+const AREA_PERCENTILE = 0.05;
+/** The area is read a little past its edge: a Scene scales its picture in from the middle. */
+const AREA_MARGIN = 0.1;
+/** A phone shows the middle of a wide picture: read that column too. */
+const PHONE_COLUMN = [1 / 3, 2 / 3];
+const srgbToLinear = (v) => (v <= 0.04045 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4);
+const linearToSrgb = (v) => (v <= 0.0031308 ? v * 12.92 : 1.055 * v ** (1 / 2.4) - 0.055);
+const BYTE = 255;
+const RGBA = 4;
+function windowLuminance(rgba, width, height, rows, columns) {
+    const values = [];
+    const [y0, y1] = rows.map(r => Math.round(r * height));
+    const [x0, x1] = columns.map(c => Math.round(c * width));
+    for (let y = Math.max(0, y0); y < Math.min(height, y1); y++) {
+        for (let x = Math.max(0, x0); x < Math.min(width, x1); x++) {
+            const i = (y * width + x) * RGBA;
+            values.push(0.2126 * srgbToLinear(rgba[i] / BYTE) + 0.7152 * srgbToLinear(rgba[i + 1] / BYTE) + 0.0722 * srgbToLinear(rgba[i + 2] / BYTE));
+        }
+    }
+    if (!values.length)
+        return { low: 0, high: 0, mean: 0 };
+    values.sort((a, b) => a - b);
+    const at = (q) => values[Math.min(values.length - 1, Math.max(0, Math.round(q * (values.length - 1))))];
+    return { low: at(AREA_PERCENTILE), high: at(1 - AREA_PERCENTILE), mean: values.reduce((a, b) => a + b, 0) / values.length };
+}
+/**
+ * The light of the part of a picture its words sit over (RGBA bytes, row by row) — read across the whole width (a laptop)
+ * and in the middle third (a phone's crop of a wide picture); the darker low and the lighter high of the two.
+ */
+function areaLuminance(rgba, width, height, area) {
+    const reach = Math.min(1, area.share + AREA_MARGIN);
+    const rows = area.edge === WordsEdge.Top ? [0, reach] : [1 - reach, 1];
+    const laptop = windowLuminance(rgba, width, height, rows, [0, 1]);
+    const phone = windowLuminance(rgba, width, height, rows, PHONE_COLUMN);
+    return { low: Math.min(laptop.low, phone.low), high: Math.max(laptop.high, phone.high), mean: laptop.mean };
+}
+/** A grey of this relative luminance. */
+function greyOf(luminance) {
+    const v = linearToSrgb(Math.min(1, Math.max(0, luminance)));
+    return { r: v, g: v, b: v };
+}
+/**
+ * The weakest scrim under which the words reach AA over the picture made: the scrim's own colour (`--iox-media-scrim`,
+ * as the look writes it) at its least strength under the words, over the area's darkest and lightest, against the ink
+ * (`--iox-media-scrim-ink`). `Full` when nothing weaker does — the contract already holds a full scrim over white to AA.
+ */
+function chooseScrim(area, colours, minContrast = PICTURE_TEXT_CONTRAST) {
+    const scrim = parseCssColour(colours.scrim);
+    const ink = parseCssColour(colours.ink);
+    if (!scrim || !ink)
+        return { level: ScrimLevel.Full, contrast: 0 };
+    const worstAt = (level) => Math.min(...[area.low, area.high].map(y => {
+        const under = compositeOver({ ...scrim, a: scrim.a * SCRIM_COVER[level] }, greyOf(y));
+        return wcagContrastRatio(ink, under);
+    }));
+    for (const level of SCRIM_LEVELS) {
+        const contrast = worstAt(level);
+        if (contrast >= minContrast)
+            return { level, contrast };
+    }
+    return { level: ScrimLevel.Full, contrast: worstAt(ScrimLevel.Full) };
+}
+/** Set each chosen scrim on its node (`Soft` leaves the element style's own). Returns the nodes changed. */
+function applyPictureScrims(trees, chosen) {
+    const byId = new Map(chosen.map(c => [c.nodeId, SCRIM_BACKGROUND[c.level]]));
+    let changed = 0;
+    walkSerialized(trees, node => {
+        const background = byId.get(node.id);
+        if (!background)
+            return;
+        node.styleProps['backgroundColor'] = background;
+        changed++;
+    });
+    return changed;
+}
+/** The relative luminance of a CSS colour (for a review sheet or a log), or null. */
+function luminanceOf(colour) {
+    const c = parseCssColour(colour);
+    return c ? relativeLuminance(c) : null;
+}
+
 /**
  * @vectoriox/iox-ui/generation-core — the shared, FRAMEWORK-FREE site-plan core (design-system plan
  * §6b, W1): the Site Plan shape + its validator, the pattern library, the page types and the three structures (Studio ·
@@ -16968,5 +17609,5 @@ function addStockCredits(footer, credits) {
  * Generated bundle index. Do not edit.
  */
 
-export { ACTIVE_BUILD_STATUSES, AI_REFUSAL_NEXT, AI_REFUSAL_STATUS, AI_STEPS, AI_STEP_LABELS, AI_STEP_NEEDS, AI_STEP_PART_TOKENS, AI_STEP_TYPICAL_TOKENS, AiCallStatus, AiCapability, AiFeature, AiGenerationStage, AiKeyMode, AiLimit, AiNextKind, AiProviderId, AiRefusalCode, AiStep, BAR_ITEMS_MAX, BAR_ITEMS_MIN, BASELINE_ROLES, BUILD_STEPS, BaselineRole, BindScope, BuildNoticeCode, BuildStep, CONTENT_ROLE_MEANINGS, CREDITS_PER_USD, CardBindTarget, CheckSeverity, ComposeError, ComposeIssueCode, ContentFieldControl, ContentFieldType, ContentRole, ContentTypeAction, CreatedKind, DANGLING_LINK_CODES, DEFAULT_PHONE_MENU_BREAKPOINT, DEFAULT_SITE_LOCALE, ENTRANCE_EASING, ENTRANCE_ORIGIN_LOOK, ENTRANCE_TRIGGER, EntrancePart, EntranceSide, FACT_KEYS, FIELD_TYPE_OF_CONTROL, FILM_PATTERN, FINAL_GENERATION_STAGES, FINDING_SEVERITY, FilmUnplaced, GRAMMAR_TOO_LARGE_MESSAGE, GlobalSlot, HEBREW_PREFIXES, JSON_SCHEMA_BANNED_KEYWORDS, JsonSchemaShapeError, KeptReason, NAV_PART_LABELS, NAV_SHAPE_COPY, NEUTRAL_STYLE_PROPS, NODE_BASELINES, NO_TOKENS, NavPagesSource, NavRole, NavShape, NavShapeError, PAGE_ARCHETYPES, PLAN_EDITS_ANSWER_SHAPES, PLAN_EDITS_PART_SCHEMA_NAMES, PLAN_EDIT_OP_PART, PLAN_EDIT_SHAPE, PLAN_EDIT_WIRE_KEYS, PLAN_PARTS, PLAN_PART_KEYS, PLAN_WIRE_DERIVED, PLAN_WIRE_PART_SCHEMA_NAMES, PLAN_WIRE_SHAPE, PRICING_PATTERN, PUBLISH_BLOCKING_PLACEHOLDERS, PageDataKind, PathIssueCollector, PatternDirective, PatternGlobalPosition, PatternOpens, PatternPlaceholder, PatternRecipe, PhoneMenuBreakpoint, PlaceholderKind, PlanChangeAction, PlanChangeKind, PlanDataSourceMode, PlanDataSourceType, PlanEditIssueCode, PlanEditOp, PlanEditsOutcome, PlanPart, PlanWireEntry, PlanWireShapeError, PlanWordIssueCode, PreflightRefusalCode, PublishRefusalCode, REQUIRED_CONTENT_ROLES, RelativeOp, SAMPLE_IMAGE_REF, SCENE_LEVEL, SCENE_OTHER_PAGES, SHOWCASE_FILM, SITE_CHECKS, SITE_FACT_LABELS, SITE_HEADER_PATTERN, SITE_LIBRARY, SITE_LOCALES, SITE_NEED_IDS, SITE_PATTERNS, SITE_PLAN_VERSION, SITE_TEMPLATES, SPEC_SITE_ARCHETYPES, SPEC_SITE_COPY_LENGTHS, SPEC_SITE_DENSITY_COPY, SPEC_SITE_FACTS, SPEC_SITE_LIBRARY, SPEC_SITE_LOCALES, SPEC_SITE_NEED_IDS, SPEC_SITE_PATTERNS, SPEC_SITE_PLAN_SHAPE, SPEC_SITE_REQUIRED_ROLES, SPEC_SITE_ROLES, SPEC_SITE_TEMPLATES, STOCK_FAMILIES, STOCK_FAMILY_INTENTS, STOCK_INTENT_ORDER, STOCK_INTENT_SUBJECTS, STOCK_ITEM_ASPECT, STOCK_MIN_KEPT, STOCK_PROVIDER_TERMS, STOCK_SUBJECT_WORDS, STRICT_SCHEMA_BUDGET, STRICT_SCHEMA_LIMITS, STUDIO_TEMPLATE, SiteBuildKind, SiteBuildStatus, SiteCheckId, SiteFindingCode, SiteLocale, SitePlanError, SitePlanIssueCode, SitePlanSourceKind, SiteTemplateError, SiteTemplateId, StepState, StockIntent, StockOrientation, StockProviderId, StockReviewFlag, StockReviewVerdict, StockSlotKind, StockSubject, addBarItem, addStockCredits, aiStepParts, applyOwnPhotoGalleries, applyPlanEdits, applyStockItemPhotos, applyStockPhotos, archetypeIssues, aspectRatioOf, assertStyleSlots, assertValidSitePlan, auditSite, barIconForRoute, blocksPublish, buildKeys, buildStepFacts, builtHomePageId, composeNavHeader, composeSection, composeSite, contentTypePreviewFields, contentTypeToWire, copyLengthOf, costUsd, createSerializedNode, creditsOfUsd, dataSourceToWire, derivedDataSources, describePlanData, describeShapeKey, entranceAction, entranceInteraction, estimateStepCredits, expandPlanWire, expandWireContentType, expandWireDataSource, expandWireEdit, expandWireField, expandWirePage, expandWireSection, failedBuildStep, fieldToWire, filmOfPlan, filmPlacement, findNavRoot, isActiveBuild, isNonEmptyString, isPlainObject, isRtlLocale, jsonAnyOf, jsonBoolean, jsonClosedObject, jsonInteger, jsonListOf, jsonOneOf, jsonSchemaKeywords, jsonSchemaObjects, jsonShapedObject, jsonText, modelCanDo, moveBarItem, navPages, navShapeBreakpoint, navShapeOf, nextSourceOf, nodeBindPaths, orientationOfRatio, pageToWire, parsePatternPath, parseSampleImageRef, pathAt, patternById, patternHasForm, patternLinkSlots, patternListGap, patternManifest, patternNeedsBinding, patternNodes, patternOptionalParts, patternRoleNeeds, patternScopes, patternSlotBudgets, patternSlots, patternTakesBinding, phoneMenuPages, placeFilm, planEditOps, planEditToWire, planEditWireGaps, planEditWireKeys, planEditWireOps, planEditWireShape, planEditsFromWire, planEditsJsonSchema, planEditsToWire, planEntrances, planFromTemplate, planNavShape, planOwnPhotos, planPartOfPath, planPartToWire, planStockPhotos, planToWire, planWireGaps, planWirePartJsonSchema, planWirePartShape, planWordIssues, publishRefusal, publishVerdict, recipeListBinds, releasedLayoutDefaults, removeBarItem, requiredAcknowledgements, requiredShapeKeys, roleField, routeMatches, routeParams, sampleImageRef, scoreStockPhoto, sectionEntrances, sectionPatternIds, sectionToWire, setStyleProps, shapeKeys, showcaseGlobals, showcasePages, showcasePlans, showcaseScenes, siteNavPages, slotBudget, stockCopyKey, stockCreditLine, stockCreditLines, stockCreditNode, stockCreditNodeId, stockFits, stockGroupOf, stockItemSlots, stockKept, stockPhotoRatio, stockPhotoSubject, stockPhotoUsable, stockPhotoWords, stockSlots, stockWord, stockWords, strictSchemaComplexity, strictSchemaRefusal, typicalStepTokens, validatePlanEdits, validateSitePlan, walkSerialized, wireContentTypeJsonSchema, wireDataSourceJsonSchema, wireFieldJsonSchema, wirePageJsonSchema, wireSectionJsonSchema, withDerivedSources, wordPattern, writtenTexts };
+export { ACTIVE_BUILD_STATUSES, AI_REFUSAL_NEXT, AI_REFUSAL_STATUS, AI_STEPS, AI_STEP_LABELS, AI_STEP_NEEDS, AI_STEP_PART_TOKENS, AI_STEP_TYPICAL_TOKENS, ART_DIRECTION_PARTS, AiCallStatus, AiCapability, AiFeature, AiGenerationStage, AiKeyMode, AiLimit, AiNextKind, AiProviderId, AiRefusalCode, AiStep, BAR_ITEMS_MAX, BAR_ITEMS_MIN, BASELINE_ROLES, BUILD_STEPS, BaselineRole, BindScope, BuildNoticeCode, BuildStep, CONTENT_ROLE_MEANINGS, CREDITS_PER_USD, CardBindTarget, CheckSeverity, ComposeError, ComposeIssueCode, ContentFieldControl, ContentFieldType, ContentRole, ContentTypeAction, CreatedKind, DANGLING_LINK_CODES, DEFAULT_PHONE_MENU_BREAKPOINT, DEFAULT_SITE_LOCALE, ENTRANCE_EASING, ENTRANCE_ORIGIN_LOOK, ENTRANCE_TRIGGER, EntrancePart, EntranceSide, FACT_KEYS, FIELD_TYPE_OF_CONTROL, FILL_ASPECT, FILM_PATTERN, FINAL_GENERATION_STAGES, FINDING_SEVERITY, FilmUnplaced, GRAMMAR_TOO_LARGE_MESSAGE, GlobalSlot, HEBREW_PREFIXES, JSON_SCHEMA_BANNED_KEYWORDS, JsonSchemaShapeError, KeptReason, MAX_SITE_PICTURES, NAV_PART_LABELS, NAV_SHAPE_COPY, NEUTRAL_STYLE_PROPS, NODE_BASELINES, NO_TOKENS, NavPagesSource, NavRole, NavShape, NavShapeError, PAGE_ARCHETYPES, PICTURE_ASPECTS, PICTURE_NEVER, PICTURE_REAL_PLACE_FAMILIES, PICTURE_REROLL_EVERY, PICTURE_REVIEW_FORMAT, PICTURE_REVIEW_SHAPE, PICTURE_TEXT_CONTRAST, PICTURE_WORLDS, PICTURE_WORLD_IDS, PLAN_EDITS_ANSWER_SHAPES, PLAN_EDITS_PART_SCHEMA_NAMES, PLAN_EDIT_OP_PART, PLAN_EDIT_SHAPE, PLAN_EDIT_WIRE_KEYS, PLAN_PARTS, PLAN_PART_KEYS, PLAN_WIRE_DERIVED, PLAN_WIRE_PART_SCHEMA_NAMES, PLAN_WIRE_SHAPE, PRICING_PATTERN, PUBLISH_BLOCKING_PLACEHOLDERS, PageDataKind, PathIssueCollector, PatternDirective, PatternGlobalPosition, PatternOpens, PatternPlaceholder, PatternRecipe, PhoneMenuBreakpoint, PictureRefusal, PictureWorld, PlaceholderKind, PlanChangeAction, PlanChangeKind, PlanDataSourceMode, PlanDataSourceType, PlanEditIssueCode, PlanEditOp, PlanEditsOutcome, PlanPart, PlanWireEntry, PlanWireShapeError, PlanWordIssueCode, PreflightRefusalCode, PublishRefusalCode, REQUIRED_CONTENT_ROLES, RelativeOp, SAMPLE_IMAGE_REF, SCENE_LEVEL, SCENE_OTHER_PAGES, SCRIM_BACKGROUND, SCRIM_COVER, SCRIM_LEVELS, SHOWCASE_FILM, SITE_CHECKS, SITE_FACT_LABELS, SITE_HEADER_PATTERN, SITE_LIBRARY, SITE_LOCALES, SITE_NEED_IDS, SITE_PATTERNS, SITE_PLAN_VERSION, SITE_TEMPLATES, SPEC_SITE_ARCHETYPES, SPEC_SITE_COPY_LENGTHS, SPEC_SITE_DENSITY_COPY, SPEC_SITE_FACTS, SPEC_SITE_LIBRARY, SPEC_SITE_LOCALES, SPEC_SITE_NEED_IDS, SPEC_SITE_PATTERNS, SPEC_SITE_PICTURE_NEVER, SPEC_SITE_PICTURE_WORLDS, SPEC_SITE_PLAN_SHAPE, SPEC_SITE_REQUIRED_ROLES, SPEC_SITE_ROLES, SPEC_SITE_TEMPLATES, STOCK_FAMILIES, STOCK_FAMILY_INTENTS, STOCK_INTENT_ORDER, STOCK_INTENT_SUBJECTS, STOCK_ITEM_ASPECT, STOCK_MIN_KEPT, STOCK_PROVIDER_TERMS, STOCK_SEED_MARGIN, STOCK_SUBJECT_WORDS, STRICT_SCHEMA_BUDGET, STRICT_SCHEMA_LIMITS, STUDIO_TEMPLATE, ScrimLevel, SiteBuildKind, SiteBuildStatus, SiteCheckId, SiteFindingCode, SiteLocale, SitePlanError, SitePlanIssueCode, SitePlanSourceKind, SiteTemplateError, SiteTemplateId, StepState, StockIntent, StockOrientation, StockProviderId, StockReviewFlag, StockReviewVerdict, StockSlotKind, StockSubject, WORDS_AREA_DEFAULT_SHARE, WordsEdge, addBarItem, addStockCredits, aiStepParts, applyOwnPhotoGalleries, applyPictureScrims, applyPlanEdits, applyStockItemPhotos, applyStockPhotos, archetypeIssues, areaLuminance, artDirectionFor, artDirectionIssues, artDirectionPreamble, aspectRatioOf, assertStyleSlots, assertValidSitePlan, auditSite, barIconForRoute, blocksPublish, brandHueWord, buildKeys, buildStepFacts, builtHomePageId, chooseScrim, composeNavHeader, composeSection, composeSite, contentTypePreviewFields, contentTypeToWire, copyLengthOf, costUsd, createSerializedNode, creditsOfUsd, dataSourceToWire, derivedDataSources, describePlanData, describeShapeKey, emptyAreaPhrase, entranceAction, entranceInteraction, estimatePictures, estimateStepCredits, expandPlanWire, expandWireContentType, expandWireDataSource, expandWireEdit, expandWireField, expandWirePage, expandWireSection, failedBuildStep, fieldToWire, filmOfPlan, filmPlacement, findNavRoot, frameWords, isActiveBuild, isNonEmptyString, isPictureWorld, isPlainObject, isRtlLocale, jsonAnyOf, jsonBoolean, jsonClosedObject, jsonInteger, jsonListOf, jsonOneOf, jsonSchemaKeywords, jsonSchemaObjects, jsonShapedObject, jsonText, luminanceOf, modelCanDo, moveBarItem, navPages, navShapeBreakpoint, navShapeOf, nextSourceOf, nodeBindPaths, orientationOfRatio, pageToWire, parsePatternPath, parseSampleImageRef, pathAt, patternById, patternHasForm, patternLinkSlots, patternListGap, patternManifest, patternNeedsBinding, patternNodes, patternOptionalParts, patternRoleNeeds, patternScopes, patternSlotBudgets, patternSlots, patternTakesBinding, phoneMenuPages, pictureAspect, picturePrompt, pictureRefusalOf, pictureRerolls, pictureReviewIssues, pictureReviewJsonSchema, pictureReviewPasses, pictureSlotKey, pictureTargets, placeFilm, planEditOps, planEditToWire, planEditWireGaps, planEditWireKeys, planEditWireOps, planEditWireShape, planEditsFromWire, planEditsJsonSchema, planEditsToWire, planEntrances, planFromTemplate, planNavShape, planOwnPhotos, planPartOfPath, planPartToWire, planPictures, planStockPhotos, planToWire, planWireGaps, planWirePartJsonSchema, planWirePartShape, planWordIssues, publishRefusal, publishVerdict, recipeListBinds, releasedLayoutDefaults, removeBarItem, requiredAcknowledgements, requiredShapeKeys, roleField, routeMatches, routeParams, sampleImageRef, scoreStockPhoto, sectionEntrances, sectionPatternIds, sectionToWire, setStyleProps, shapeKeys, showcaseGlobals, showcasePages, showcasePlans, showcaseScenes, siteNavPages, slotBudget, stockCopyKey, stockCreditLine, stockCreditLines, stockCreditNode, stockCreditNodeId, stockFits, stockGroupOf, stockItemSlots, stockKept, stockPhotoRatio, stockPhotoSubject, stockPhotoUsable, stockPhotoWords, stockSlots, stockWord, stockWords, strictSchemaComplexity, strictSchemaRefusal, typicalStepTokens, validatePlanEdits, validateSitePlan, walkSerialized, wireContentTypeJsonSchema, wireDataSourceJsonSchema, wireFieldJsonSchema, wirePageJsonSchema, wireSectionJsonSchema, withDerivedSources, wordPattern, wordsOverPicture, writtenTexts };
 //# sourceMappingURL=vectoriox-iox-ui-generation-core.mjs.map