rivet-design 0.10.7 → 0.10.9

package/dist/mcp/agent-variants/designCritique.js

@@ -0,0 +1,710 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.capturePlaywrightScreenshot = exports.runDesignCritique = exports.lintStaticPreview = exports.evaluateCritique = exports.passesDesignBar = exports.buildDesignContract = exports.inferDesignArtifactType = exports.getDesignCritiqueRouteAction = exports.CRITIQUE_CHECK_CATEGORIES = exports.MAJOR_FINDING_SCORE_CAP = exports.DIMENSION_FLOOR = exports.OVERALL_PASS_BAR = exports.DESIGN_CRITIQUE_GATEWAY_TIMEOUT_MS = void 0;
+const v3_1 = require("zod/v3");
+const fs_1 = __importDefault(require("fs"));
+const path_1 = __importDefault(require("path"));
+const logger_1 = require("../../utils/logger");
+const GatewayClient_1 = require("../../services/GatewayClient");
+const log = (0, logger_1.createLogger)('designCritique');
+/**
+ * Aesthetic self-critique for 0→1 variants. Renders a generated variant with
+ * Playwright, screenshots it, and scores the screenshot on a small design
+ * rubric via a vision model — preferentially against the variant's bound
+ * DESIGN.md, falling back to a generic rubric when none is bound.
+ *
+ * On top of the holistic aesthetic score, the critique enforces a stricter,
+ * task-aware quality gate: a deterministic artifact lint plus the model's own
+ * severity-coded findings across five usability checks (task fit, source
+ * fidelity, UI polish, readability, responsive). Any `critical` finding fails
+ * the variant outright regardless of how high its visual scores are; `major`
+ * findings cap the overall score below the pass bar so a strong vibe can never
+ * mask a serious defect.
+ *
+ * The GatewayClient and the screenshot capture are injected as seams so unit
+ * tests can stub both and never touch the real model or launch a browser.
+ * The runner is failure-tolerant by design: render or model errors
+ * degrades to a non-blocking "skipped" outcome rather than failing the
+ * variant, so an unauthenticated / headless / browserless environment never
+ * breaks the existing objective QA gate.
+ */
+/** Sonnet 4.6 is multimodal and fast enough for single-screenshot scoring. */
+const DESIGN_CRITIQUE_MODEL = 'claude-sonnet-4-6';
+const DESIGN_CRITIQUE_MAX_TOKENS = 1_024;
+const DESIGN_CRITIQUE_TEMPERATURE = 0;
+exports.DESIGN_CRITIQUE_GATEWAY_TIMEOUT_MS = 30_000;
+/** Default screenshot viewport — desktop-first, tall enough to capture a
+ *  typical hero + first fold without scrolling the whole page. */
+const SCREENSHOT_VIEWPORT_WIDTH = 1_280;
+const SCREENSHOT_VIEWPORT_HEIGHT = 900;
+/** Hard ceiling on a single render+screenshot so a hung page can't stall the
+ *  QA gate. */
+const SCREENSHOT_TIMEOUT_MS = 15_000;
+const STATIC_PREVIEW_ALLOWED_PROTOCOLS = new Set(['about:', 'blob:', 'data:']);
+const STATIC_PREVIEW_ASSET_ORIGIN = 'http://rivet-static-preview.local';
+/**
+ * Must-pass bar for the aesthetic gate. Deliberately conservative: the
+ * critique ships advisory-first to calibrate against real output before it
+ * blocks, and the orchestrator caps regeneration at one retry so a harsh
+ * critique can never loop. A variant passes only when its holistic score
+ * clears `OVERALL_PASS_BAR` AND no single dimension drops below
+ * `DIMENSION_FLOOR` (one badly broken dimension fails even a high overall).
+ */
+exports.OVERALL_PASS_BAR = 6.5;
+exports.DIMENSION_FLOOR = 4;
+const MAX_SCORE = 10;
+const MIN_SCORE = 0;
+/**
+ * Ceiling applied to the effective overall score when at least one `major`
+ * finding is present. Sits below `OVERALL_PASS_BAR` so any unresolved major
+ * usability issue forces a retry/degrade even when the raw visual scores are
+ * high — a high vibe score can never carry a variant past a real defect.
+ */
+exports.MAJOR_FINDING_SCORE_CAP = 5;
+/**
+ * The five task-aware checks a 0→1 variant is evaluated against, beyond the
+ * holistic aesthetic dimensions. Mirrors `CritiqueCheckCategory` in contracts.
+ */
+exports.CRITIQUE_CHECK_CATEGORIES = [
+    'task_fit',
+    'source_fidelity',
+    'ui_polish',
+    'readability',
+    'responsive',
+];
+const parseUrl = (value) => {
+    try {
+        return new URL(value);
+    }
+    catch {
+        return undefined;
+    }
+};
+/**
+ * Decide whether a Playwright request may run while rendering a critique
+ * target. Static HTML previews are networkless by default; URL targets are
+ * not rendered by the critique sandbox.
+ */
+const getDesignCritiqueRouteAction = (target, requestUrl) => {
+    const parsedRequestUrl = parseUrl(requestUrl);
+    if (!parsedRequestUrl)
+        return 'abort';
+    if (target.kind === 'html') {
+        if (target.assetBase &&
+            parsedRequestUrl.origin === STATIC_PREVIEW_ASSET_ORIGIN) {
+            return 'allow';
+        }
+        return STATIC_PREVIEW_ALLOWED_PROTOCOLS.has(parsedRequestUrl.protocol)
+            ? 'allow'
+            : 'abort';
+    }
+    return 'abort';
+};
+exports.getDesignCritiqueRouteAction = getDesignCritiqueRouteAction;
+const assertAllowedDesignCritiqueTarget = (target) => {
+    if (target.kind === 'html')
+        return;
+    throw new Error('Design critique URL targets are not supported');
+};
+const addStaticPreviewBase = (html) => {
+    const base = `<base href="${STATIC_PREVIEW_ASSET_ORIGIN}/">`;
+    if (/<head[\s>]/i.test(html)) {
+        return html.replace(/<head(\s[^>]*)?>/i, (match) => `${match}\n${base}`);
+    }
+    return `${base}\n${html}`;
+};
+const contentTypeForAsset = (filePath) => {
+    const extension = filePath.toLowerCase().split('.').pop();
+    switch (extension) {
+        case 'avif':
+            return 'image/avif';
+        case 'css':
+            return 'text/css';
+        case 'gif':
+            return 'image/gif';
+        case 'glb':
+            return 'model/gltf-binary';
+        case 'gltf':
+            return 'model/gltf+json';
+        case 'htm':
+        case 'html':
+            return 'text/html';
+        case 'jpeg':
+        case 'jpg':
+            return 'image/jpeg';
+        case 'js':
+            return 'text/javascript';
+        case 'png':
+            return 'image/png';
+        case 'svg':
+            return 'image/svg+xml';
+        case 'webp':
+            return 'image/webp';
+        case 'woff':
+            return 'font/woff';
+        case 'woff2':
+            return 'font/woff2';
+        default:
+            return 'application/octet-stream';
+    }
+};
+const resolveStaticPreviewCritiqueAsset = (target, requestUrl) => {
+    if (target.kind !== 'html' || !target.assetBase)
+        return null;
+    const parsedRequestUrl = parseUrl(requestUrl);
+    if (!parsedRequestUrl)
+        return null;
+    if (parsedRequestUrl.origin !== STATIC_PREVIEW_ASSET_ORIGIN)
+        return null;
+    const relativePath = decodeURIComponent(parsedRequestUrl.pathname.slice(1));
+    if (!relativePath)
+        return null;
+    const candidate = path_1.default.resolve(target.assetBase, relativePath);
+    if (candidate !== target.assetBase &&
+        !candidate.startsWith(target.assetBase + path_1.default.sep)) {
+        return null;
+    }
+    try {
+        const realTarget = fs_1.default.realpathSync(candidate);
+        if (realTarget !== target.assetBase &&
+            !realTarget.startsWith(target.assetBase + path_1.default.sep)) {
+            return null;
+        }
+        const stat = fs_1.default.statSync(realTarget);
+        if (!stat.isFile() || stat.nlink !== 1)
+            return null;
+        return realTarget;
+    }
+    catch {
+        return null;
+    }
+};
+const critiqueFindingSchema = v3_1.z.object({
+    severity: v3_1.z.enum(['critical', 'major', 'minor']),
+    category: v3_1.z.enum([
+        'task_fit',
+        'source_fidelity',
+        'ui_polish',
+        'readability',
+        'responsive',
+    ]),
+    evidence: v3_1.z.string(),
+    fix: v3_1.z.string(),
+});
+const designScoresSchema = v3_1.z.object({
+    hierarchy: v3_1.z.number(),
+    typography: v3_1.z.number(),
+    color: v3_1.z.number(),
+    spacing: v3_1.z.number(),
+    slopResistance: v3_1.z.number(),
+    overall: v3_1.z.number(),
+    critique: v3_1.z.string(),
+    // Optional so existing stubs (and a model that surfaces no issues) parse
+    // cleanly; absence is treated as "no findings".
+    findings: v3_1.z.array(critiqueFindingSchema).optional(),
+});
+const SUBMIT_DESIGN_SCORES_TOOL = {
+    name: 'submit_design_scores',
+    strict: true,
+    description: 'Submit the per-dimension aesthetic scores (0-10), a short critique, and any severity-coded findings for the rendered variant. Call exactly once.',
+    input_schema: {
+        type: 'object',
+        properties: {
+            hierarchy: { type: 'number' },
+            typography: { type: 'number' },
+            color: { type: 'number' },
+            spacing: { type: 'number' },
+            slopResistance: { type: 'number' },
+            overall: { type: 'number' },
+            critique: { type: 'string' },
+            findings: {
+                type: 'array',
+                description: 'Concrete usability/quality issues. Use severity "critical" for a defect that makes the variant unusable (unreadable text, broken layout, missing required content/action), "major" for a serious issue that must be fixed before this ships, "minor" for a nit. Each finding names the affected check category and gives evidence + a concrete fix.',
+                items: {
+                    type: 'object',
+                    properties: {
+                        severity: { type: 'string', enum: ['critical', 'major', 'minor'] },
+                        category: {
+                            type: 'string',
+                            enum: [
+                                'task_fit',
+                                'source_fidelity',
+                                'ui_polish',
+                                'readability',
+                                'responsive',
+                            ],
+                        },
+                        evidence: { type: 'string' },
+                        fix: { type: 'string' },
+                    },
+                    required: ['severity', 'category', 'evidence', 'fix'],
+                    additionalProperties: false,
+                },
+            },
+        },
+        required: [
+            'hierarchy',
+            'typography',
+            'color',
+            'spacing',
+            'slopResistance',
+            'overall',
+            'critique',
+            'findings',
+        ],
+        additionalProperties: false,
+    },
+};
+const DESIGN_CRITIQUE_SYSTEM_PROMPT = `You are a discerning senior product designer doing a fast, honest visual QA pass on a single rendered web UI screenshot.
+
+Score the screenshot on each dimension from 0 (broken / generic) to 10 (exceptional, ships at a top design-led company):
+- hierarchy: is the visual hierarchy and focal flow clear and intentional?
+- typography: type scale, pairing, rhythm, and legibility.
+- color: palette cohesion and disciplined use of color roles.
+- spacing: spacing rhythm, alignment, and density.
+- slopResistance: how far it is from generic "AI slop" (boilerplate centered hero card, three feature columns, default shadows, lorem-ipsum vibe). Higher = more distinctive and considered.
+
+Then give an overall 0-10 holistic verdict and a one-paragraph critique naming the most important concrete fixes. Be calibrated and critical — most first-draft AI output lands in the 4-7 range.
+
+Separately, raise severity-coded findings for concrete usability/quality problems across these checks:
+- task_fit: does it actually do the requested job (right artifact, required sections/actions present)?
+- source_fidelity: does it honor explicit required content, assets, and constraints from the request?
+- ui_polish: clipped/overlapping/misaligned elements, broken images, placeholder text, visual artifacts.
+- readability: is primary text and are key controls legible (contrast, size, not clipped or hidden)?
+- responsive: is core content and the primary action usable at the review viewport?
+
+Use severity "critical" for anything that makes the variant unusable or fails the requested task — a critical fails the variant no matter how high the visual scores are. Use "major" for a serious issue that must be fixed before shipping. Use "minor" for nits. Do NOT invent findings; only raise issues you can actually see. Submit via the submit_design_scores tool exactly once.`;
+const TASK_FIT_RUBRIC = {
+    landing_page: 'This is a LANDING PAGE: require a clear message hierarchy, an obvious primary call-to-action above the fold, and trust/intent signals. A landing page with no primary action is a critical task_fit failure.',
+    dashboard: 'This is a DASHBOARD: require clear data hierarchy, scannable groupings, sensible control placement, and legible metrics. Unreadable or unlabeled data is a readability/task_fit issue.',
+    form: 'This is a FORM: require labeled, legible inputs, an obvious submit action, and visible field affordances. Unlabeled or unusable inputs are a critical task_fit failure.',
+    app_screen: 'This is an APP SCREEN: require a clear primary task, usable navigation/controls, and legible content for the core action.',
+    generic: 'Judge it against the most reasonable interpretation of the requested artifact: the core content and primary action must be present and usable.',
+};
+const PLACEHOLDER_TEXT_PATTERN = /lorem ipsum|dolor sit amet/i;
+const HTML_TAG_PATTERN = /<[^>]+>/g;
+const SCRIPT_STYLE_PATTERN = /<(script|style)[\s\S]*?<\/\1>/gi;
+/** Minimum count of rendered, non-whitespace text characters before the body
+ *  is treated as having visible content. Below this the variant is effectively
+ *  blank. */
+const MIN_VISIBLE_TEXT_CHARS = 1;
+const LANDING_ACTION_PATTERN = /<(a|button)\b|role\s*=\s*["']button["']/i;
+const BROKEN_IMG_PATTERN = /<img\b(?![^>]*\bsrc\s*=\s*("|')\s*[^"'\s][^"']*\1)[^>]*>/i;
+const REQUIRED_ASSET_PATH_PATTERN = /\b[\w@./ -]+\/([\w@ -]+\.(?:glb|gltf|obj|fbx|usdz|png|jpe?g|gif|webp|svg|avif|bmp|ico|mp4|webm|mov|mp3|wav|ogg|m4a|woff2?|ttf|otf|eot|pdf))\b/gi;
+const ARTIFACT_TYPE_KEYWORDS = [
+    [
+        'landing_page',
+        /landing page|marketing site|hero section|homepage|home page/i,
+    ],
+    ['dashboard', /dashboard|analytics|admin panel|metrics|reporting/i],
+    ['form', /\bform\b|sign[ -]?up|sign[ -]?in|login|checkout|contact page/i],
+    [
+        'app_screen',
+        /\bapp\b|screen|todo|kanban|timer|settings page|profile page/i,
+    ],
+];
+/**
+ * Infer the artifact type from free-text request copy (prompt and/or brief).
+ * Falls back to `generic` when nothing matches so the gate stays usable for
+ * arbitrary requests.
+ */
+const inferDesignArtifactType = (text) => {
+    for (const [type, pattern] of ARTIFACT_TYPE_KEYWORDS) {
+        if (pattern.test(text))
+            return type;
+    }
+    return 'generic';
+};
+exports.inferDesignArtifactType = inferDesignArtifactType;
+/**
+ * Derive the design contract from the request copy. `artifactType` drives the
+ * task-specific rubric; `requirements` echoes the raw request lines so the
+ * critique prompt can hold the model to explicit asks.
+ */
+const buildDesignContract = (input) => {
+    const prompt = input.prompt?.trim() ?? '';
+    const brief = input.brief?.trim() ?? '';
+    const requirements = [prompt, brief].filter((line) => line.length > 0);
+    const requiredAssetFilenames = extractRequiredAssetFilenames(requirements);
+    return {
+        artifactType: (0, exports.inferDesignArtifactType)(`${prompt}\n${brief}`),
+        requirements,
+        requiredAssetFilenames,
+    };
+};
+exports.buildDesignContract = buildDesignContract;
+const extractRequiredAssetFilenames = (requirements) => {
+    const filenames = new Set();
+    for (const requirement of requirements) {
+        REQUIRED_ASSET_PATH_PATTERN.lastIndex = 0;
+        let match;
+        while ((match = REQUIRED_ASSET_PATH_PATTERN.exec(requirement))) {
+            filenames.add(match[1].toLowerCase());
+        }
+    }
+    return [...filenames];
+};
+const buildCritiquePrompt = (designContextMarkdown, designContract) => {
+    const sections = [];
+    if (designContextMarkdown && designContextMarkdown.trim().length > 0) {
+        sections.push(`Score the attached screenshot against the design system it is meant to express. Judge fidelity to this DESIGN.md, not just generic taste.\n\n--- DESIGN.md ---\n${designContextMarkdown}\n--- end DESIGN.md ---`);
+    }
+    else {
+        sections.push('No bound DESIGN.md — score the attached screenshot on general product-design quality using the rubric.');
+    }
+    if (designContract) {
+        sections.push(TASK_FIT_RUBRIC[designContract.artifactType]);
+        if (designContract.requirements.length > 0) {
+            sections.push(`The request asked for:\n${designContract.requirements
+                .map((line) => `- ${line}`)
+                .join('\n')}\nRaise source_fidelity findings for anything explicitly required that is missing or wrong.`);
+        }
+    }
+    return sections.join('\n\n');
+};
+const clampScore = (value) => Math.max(MIN_SCORE, Math.min(MAX_SCORE, value));
+/**
+ * Apply the must-pass bar to a set of dimension scores. Returns true only
+ * when the holistic score clears `OVERALL_PASS_BAR` and every dimension is at
+ * or above `DIMENSION_FLOOR`.
+ */
+const passesDesignBar = (scores) => {
+    if (scores.overall < exports.OVERALL_PASS_BAR)
+        return false;
+    const dimensions = [
+        scores.hierarchy,
+        scores.typography,
+        scores.color,
+        scores.spacing,
+        scores.slopResistance,
+    ];
+    return dimensions.every((value) => value >= exports.DIMENSION_FLOOR);
+};
+exports.passesDesignBar = passesDesignBar;
+const statusForSeverity = (severity) => severity === 'minor' ? 'warn' : 'fail';
+/** Derive per-category pass/warn/fail status from the gathered findings. */
+const deriveChecks = (findings) => {
+    const checks = {};
+    for (const category of exports.CRITIQUE_CHECK_CATEGORIES) {
+        checks[category] = 'pass';
+    }
+    for (const finding of findings) {
+        const next = statusForSeverity(finding.severity);
+        if (next === 'fail' || checks[finding.category] === 'pass') {
+            // fail dominates warn; warn dominates pass.
+            if (next === 'fail' || checks[finding.category] !== 'fail') {
+                checks[finding.category] = next;
+            }
+        }
+    }
+    return checks;
+};
+/**
+ * Apply the strict critique gate: a `critical` finding fails the variant
+ * outright and caps the overall score to the floor; a `major` finding caps the
+ * overall score below the pass bar. The variant passes only when no critical is
+ * present and the (capped) overall + dimension floors clear the aesthetic bar.
+ */
+const evaluateCritique = (scores, findings) => {
+    const hasCritical = findings.some((f) => f.severity === 'critical');
+    const hasMajor = findings.some((f) => f.severity === 'major');
+    const scoreCaps = [];
+    let overallScore = scores.overall;
+    if (hasCritical) {
+        overallScore = MIN_SCORE;
+        for (const finding of findings) {
+            if (finding.severity === 'critical') {
+                scoreCaps.push({
+                    category: finding.category,
+                    max: MIN_SCORE,
+                    reason: `Critical: ${finding.evidence}`,
+                });
+            }
+        }
+    }
+    else if (hasMajor) {
+        overallScore = Math.min(overallScore, exports.MAJOR_FINDING_SCORE_CAP);
+        for (const finding of findings) {
+            if (finding.severity === 'major') {
+                scoreCaps.push({
+                    category: finding.category,
+                    max: exports.MAJOR_FINDING_SCORE_CAP,
+                    reason: `Major: ${finding.evidence}`,
+                });
+            }
+        }
+    }
+    const passed = !hasCritical && (0, exports.passesDesignBar)({ ...scores, overall: overallScore });
+    return {
+        passed,
+        blocked: hasCritical,
+        overallScore,
+        scoreCaps,
+        checks: deriveChecks(findings),
+        findings,
+    };
+};
+exports.evaluateCritique = evaluateCritique;
+const stripToVisibleText = (html) => html
+    .replace(SCRIPT_STYLE_PATTERN, ' ')
+    .replace(HTML_TAG_PATTERN, ' ')
+    .replace(/&[a-z]+;/gi, ' ')
+    .replace(/\s+/g, ' ')
+    .trim();
+/**
+ * Deterministic artifact lint over a static-preview HTML document. Catches
+ * mechanical defects the vision model can underweight — a blank document,
+ * placeholder copy, broken images, or a landing page with no primary action —
+ * and emits them as severity-coded findings so they feed the same gate as the
+ * model's findings. Runs before the subjective critique; never throws.
+ */
+const lintStaticPreview = (html, contract) => {
+    const findings = [];
+    const visibleText = stripToVisibleText(html);
+    if (visibleText.length < MIN_VISIBLE_TEXT_CHARS) {
+        findings.push({
+            severity: 'critical',
+            category: 'readability',
+            evidence: 'The rendered document has no visible text content.',
+            fix: 'Render the core content of the requested artifact as visible text.',
+        });
+    }
+    if (PLACEHOLDER_TEXT_PATTERN.test(visibleText)) {
+        findings.push({
+            severity: 'major',
+            category: 'ui_polish',
+            evidence: 'Placeholder lorem-ipsum copy is present in the output.',
+            fix: 'Replace placeholder copy with real, task-appropriate content.',
+        });
+    }
+    if (BROKEN_IMG_PATTERN.test(html)) {
+        findings.push({
+            severity: 'major',
+            category: 'ui_polish',
+            evidence: 'An <img> element is missing a usable src.',
+            fix: 'Give every image a valid src or remove the broken element.',
+        });
+    }
+    if (contract?.artifactType === 'landing_page' &&
+        !LANDING_ACTION_PATTERN.test(html)) {
+        findings.push({
+            severity: 'critical',
+            category: 'task_fit',
+            evidence: 'A landing page was requested but it has no primary action (link or button).',
+            fix: 'Add a clear primary call-to-action (a link or button) above the fold.',
+        });
+    }
+    for (const filename of contract?.requiredAssetFilenames ?? []) {
+        if (html.toLowerCase().includes(filename))
+            continue;
+        findings.push({
+            severity: 'critical',
+            category: 'source_fidelity',
+            evidence: `The output does not reference the explicitly requested asset '${filename}'.`,
+            fix: `Use the requested '${filename}' asset in the generated preview instead of recreating or omitting it.`,
+        });
+    }
+    return findings;
+};
+exports.lintStaticPreview = lintStaticPreview;
+/**
+ * Render → screenshot → VLM rubric → strict gate → verdict. Never throws:
+ * render/model failures resolve to a non-blocking skipped outcome.
+ */
+const runDesignCritique = async (input, deps = {}) => {
+    if (input.target.kind === 'url') {
+        log.warn('Design critique skipped — live URL targets are not supported');
+        return {
+            ran: false,
+            passed: true,
+            blocked: false,
+            findings: [],
+            scoreCaps: [],
+            skippedReason: 'live_url_target',
+        };
+    }
+    const screenshot = deps.screenshot ?? exports.capturePlaywrightScreenshot;
+    const gatewayClient = deps.gatewayClient ?? new GatewayClient_1.GatewayClient();
+    let image;
+    try {
+        image = await screenshot(input.target);
+    }
+    catch (err) {
+        const reason = err instanceof Error ? err.message : String(err);
+        log.warn(`Design critique skipped — screenshot failed: ${reason}`);
+        return {
+            ran: false,
+            passed: true,
+            blocked: false,
+            findings: [],
+            scoreCaps: [],
+            skippedReason: `screenshot: ${reason}`,
+        };
+    }
+    let raw;
+    try {
+        const toolInput = await gatewayClient.scoreImage({
+            model: DESIGN_CRITIQUE_MODEL,
+            maxTokens: DESIGN_CRITIQUE_MAX_TOKENS,
+            temperature: DESIGN_CRITIQUE_TEMPERATURE,
+            system: DESIGN_CRITIQUE_SYSTEM_PROMPT,
+            prompt: buildCritiquePrompt(input.designContextMarkdown, input.designContract),
+            images: [image],
+            tool: SUBMIT_DESIGN_SCORES_TOOL,
+            timeoutMs: exports.DESIGN_CRITIQUE_GATEWAY_TIMEOUT_MS,
+        });
+        const parsed = designScoresSchema.safeParse(toolInput);
+        if (!parsed.success) {
+            log.warn('Design critique skipped — model response failed schema');
+            return {
+                ran: false,
+                passed: true,
+                blocked: false,
+                findings: [],
+                scoreCaps: [],
+                skippedReason: 'invalid_model_response',
+            };
+        }
+        raw = parsed.data;
+    }
+    catch (err) {
+        const reason = err instanceof Error ? err.message : String(err);
+        log.warn(`Design critique skipped — scoring failed: ${reason}`);
+        return {
+            ran: false,
+            passed: true,
+            blocked: false,
+            findings: [],
+            scoreCaps: [],
+            skippedReason: `score: ${reason}`,
+        };
+    }
+    const scores = {
+        hierarchy: clampScore(raw.hierarchy),
+        typography: clampScore(raw.typography),
+        color: clampScore(raw.color),
+        spacing: clampScore(raw.spacing),
+        slopResistance: clampScore(raw.slopResistance),
+        overall: clampScore(raw.overall),
+    };
+    // Deterministic artifact lint runs only when the rendered HTML is available
+    // (static_preview). vite_app targets are URL-only here, so they rely on the
+    // model's findings alone.
+    const lintFindings = input.target.kind === 'html'
+        ? (0, exports.lintStaticPreview)(input.target.html, input.designContract)
+        : [];
+    const findings = [
+        ...lintFindings,
+        ...(raw.findings ?? []),
+    ];
+    const evaluation = (0, exports.evaluateCritique)(scores, findings);
+    return {
+        ran: true,
+        passed: evaluation.passed,
+        blocked: evaluation.blocked,
+        scores,
+        overallScore: evaluation.overallScore,
+        findings: evaluation.findings,
+        checks: evaluation.checks,
+        scoreCaps: evaluation.scoreCaps,
+        summary: raw.critique,
+    };
+};
+exports.runDesignCritique = runDesignCritique;
+/**
+ * Default screenshot capturer backed by Playwright Chromium. Lazily imports
+ * Playwright so the dependency is only loaded when a real critique runs (unit
+ * tests inject a stub and never reach this path).
+ *
+ * @effect Launches a headless Chromium browser and renders the target.
+ */
+const capturePlaywrightScreenshot = async (target) => {
+    assertAllowedDesignCritiqueTarget(target);
+    // Lazy import keeps Playwright out of the module's static dependency graph
+    // for callers that always inject a stub screenshot seam.
+    const { chromium } = await Promise.resolve().then(() => __importStar(require('playwright')));
+    const browser = await chromium.launch();
+    try {
+        const page = await browser.newPage({
+            viewport: {
+                width: SCREENSHOT_VIEWPORT_WIDTH,
+                height: SCREENSHOT_VIEWPORT_HEIGHT,
+            },
+        });
+        await page.routeWebSocket('**/*', (ws) => ws.close());
+        await page.route('**/*', async (route) => {
+            const assetPath = resolveStaticPreviewCritiqueAsset(target, route.request().url());
+            if (assetPath) {
+                await route.fulfill({
+                    path: assetPath,
+                    contentType: contentTypeForAsset(assetPath),
+                });
+                return;
+            }
+            const action = (0, exports.getDesignCritiqueRouteAction)(target, route.request().url());
+            if (action === 'allow') {
+                await route.continue();
+                return;
+            }
+            await route.abort();
+        });
+        if (target.kind === 'html') {
+            const html = target.assetBase
+                ? addStaticPreviewBase(target.html)
+                : target.html;
+            await page.setContent(html, {
+                waitUntil: 'domcontentloaded',
+                timeout: SCREENSHOT_TIMEOUT_MS,
+            });
+        }
+        else {
+            await page.goto(target.url, {
+                waitUntil: 'domcontentloaded',
+                timeout: SCREENSHOT_TIMEOUT_MS,
+            });
+        }
+        const buffer = await page.screenshot({ type: 'png' });
+        return { mediaType: 'image/png', data: buffer.toString('base64') };
+    }
+    finally {
+        await browser.close();
+    }
+};
+exports.capturePlaywrightScreenshot = capturePlaywrightScreenshot;
+//# sourceMappingURL=designCritique.js.map