@dotit/core 1.0.0

package/dist/renderer.js

@@ -0,0 +1,1286 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DOC_STYLE_TARGETS = void 0;
+exports.collectPrintLayout = collectPrintLayout;
+exports.cssContentValue = cssContentValue;
+exports.collectDocumentStyles = collectDocumentStyles;
+exports.documentStyleCSS = documentStyleCSS;
+exports.renderHTML = renderHTML;
+exports.renderPrint = renderPrint;
+const document_css_1 = require("./document-css");
+const theme_1 = require("./theme");
+function resolveThemeSync(ref) {
+    if (ref && typeof ref === "object")
+        return ref;
+    if (typeof ref === "string") {
+        const found = (0, theme_1.getBuiltinTheme)(ref);
+        if (found)
+            return found;
+    }
+    return (0, theme_1.getBuiltinTheme)("corporate");
+}
+const PAPER_SIZES = {
+    A4: "A4",
+    A5: "A5",
+    A3: "297mm 420mm",
+    Letter: "Letter",
+    Legal: "8.5in 14in",
+};
+function collectPrintLayout(doc) {
+    const allBlocks = doc.blocks.flatMap(function collect(b) {
+        return [b, ...(b.children ?? []).flatMap(collect)];
+    });
+    return {
+        page: allBlocks.find((b) => b.type === "page"),
+        header: allBlocks.filter((b) => b.type === "header").pop(),
+        footer: allBlocks.filter((b) => b.type === "footer").pop(),
+        watermark: allBlocks.filter((b) => b.type === "watermark").pop(),
+        breaks: allBlocks.filter((b) => b.type === "break" && (b.properties?.before || b.properties?.keep)),
+    };
+}
+function escapeHtml(text) {
+    return text
+        .replace(/&/g, "&")
+        .replace(/</g, "&lt;")
+        .replace(/>/g, "&gt;")
+        .replace(/\"/g, "&quot;")
+        .replace(/'/g, "&#39;");
+}
+function cssContentValue(text) {
+    if (!text)
+        return '""';
+    const parts = String(text)
+        .split(/(\{\{\s*pages?\s*\}\})/g)
+        .filter((p) => p !== "");
+    return (parts
+        .map((p) => {
+        if (/^\{\{\s*page\s*\}\}$/.test(p))
+            return "counter(page)";
+        if (/^\{\{\s*pages\s*\}\}$/.test(p))
+            return "counter(pages)";
+        return ('"' +
+            p
+                .replace(/\\/g, "\\\\")
+                .replace(/"/g, '\\"')
+                .replace(/[\r\n]+/g, " ") +
+            '"');
+    })
+        .join(" ") || '""');
+}
+function formatTrustDate(isoStr) {
+    try {
+        const d = new Date(isoStr);
+        if (isNaN(d.getTime()))
+            return escapeHtml(isoStr);
+        const months = [
+            "January",
+            "February",
+            "March",
+            "April",
+            "May",
+            "June",
+            "July",
+            "August",
+            "September",
+            "October",
+            "November",
+            "December",
+        ];
+        const day = d.getUTCDate();
+        const month = months[d.getUTCMonth()];
+        const year = d.getUTCFullYear();
+        const hours = String(d.getUTCHours()).padStart(2, "0");
+        const minutes = String(d.getUTCMinutes()).padStart(2, "0");
+        return `${day} ${month} ${year}, ${hours}:${minutes} UTC`;
+    }
+    catch {
+        return escapeHtml(isoStr);
+    }
+}
+function sanitizeUrl(url) {
+    const trimmed = url.trim();
+    if (trimmed === "")
+        return "";
+    if (trimmed.startsWith("/") ||
+        trimmed.startsWith("./") ||
+        trimmed.startsWith("../") ||
+        trimmed.startsWith("#")) {
+        return trimmed;
+    }
+    const lower = trimmed.toLowerCase();
+    if (lower.startsWith("javascript:") ||
+        lower.startsWith("vbscript:") ||
+        lower.startsWith("data:")) {
+        return "#";
+    }
+    if (!lower.includes(":") && !lower.startsWith("//")) {
+        return trimmed;
+    }
+    if (lower.startsWith("http://") ||
+        lower.startsWith("https://") ||
+        lower.startsWith("mailto:") ||
+        lower.startsWith("tel:")) {
+        return trimmed;
+    }
+    return "#";
+}
+function applyInlineFormatting(content, inline, originalContent) {
+    if (inline && inline.length > 0) {
+        return inline
+            .map((node) => {
+            switch (node.type) {
+                case "text":
+                    return escapeHtml(node.value);
+                case "bold":
+                    return `<strong>${escapeHtml(node.value)}</strong>`;
+                case "italic":
+                    return `<em>${escapeHtml(node.value)}</em>`;
+                case "strike":
+                    return `<del>${escapeHtml(node.value)}</del>`;
+                case "inline-quote":
+                    return `<q class="intent-inline-quote">${escapeHtml(node.value)}</q>`;
+                case "highlight":
+                    return `<mark class="intent-inline-highlight">${escapeHtml(node.value)}</mark>`;
+                case "code":
+                    return `<code>${escapeHtml(node.value)}</code>`;
+                case "styled": {
+                    const css = extractInlineStyles(node.props);
+                    return css
+                        ? `<span style="${css}">${escapeHtml(node.value)}</span>`
+                        : escapeHtml(node.value);
+                }
+                case "inline-note":
+                    return `<span class="intent-inline-note">${escapeHtml(node.value)}</span>`;
+                case "date":
+                    return `<time class="intent-inline-date" datetime="${escapeHtml(node.iso)}">${escapeHtml(node.value)}</time>`;
+                case "mention":
+                    return `<span class="intent-inline-mention">@${escapeHtml(node.value)}</span>`;
+                case "tag":
+                    return `<span class="intent-inline-tag">#${escapeHtml(node.value)}</span>`;
+                case "link":
+                    return `<a href="${escapeHtml(sanitizeUrl(node.href))}" class="intent-inline-link">${escapeHtml(node.value)}</a>`;
+                case "footnote-ref":
+                    return `<sup class="it-fn-ref"><a href="#fn-${escapeHtml(node.value)}">${escapeHtml(node.value)}</a></sup>`;
+                case "label":
+                    return `<span class="it-label">${escapeHtml(node.value)}</span>`;
+                default:
+                    return escapeHtml(node.value);
+            }
+        })
+            .join("");
+    }
+    return escapeHtml(originalContent || content);
+}
+function getAlignmentClass(props) {
+    const raw = String(props.align || "")
+        .toLowerCase()
+        .trim();
+    if (raw === "center")
+        return " intent-align-center";
+    if (raw === "right")
+        return " intent-align-right";
+    if (raw === "justify")
+        return " intent-align-justify";
+    return "";
+}
+const STYLE_PROPERTIES = {
+    color: "color",
+    size: "font-size",
+    family: "font-family",
+    weight: "font-weight",
+    align: "text-align",
+    bg: "background-color",
+    indent: "padding-left",
+    opacity: "opacity",
+    italic: "font-style",
+    border: "border",
+    underline: "text-decoration",
+    strike: "text-decoration",
+    valign: "vertical-align",
+};
+function extractInlineStyles(properties, context = "attr") {
+    const styles = [];
+    const decorations = [];
+    for (const [prop, css] of Object.entries(STYLE_PROPERTIES)) {
+        const value = properties[prop];
+        if (value === undefined || value === "")
+            continue;
+        const strValue = context === "attr"
+            ? escapeHtml(String(value).replace(/[;{}]/g, ""))
+            : String(value).replace(/[<>{};]/g, "");
+        if (prop === "border" && strValue === "true") {
+            styles.push("border: 1px solid currentColor");
+        }
+        else if (prop === "italic" && strValue === "true") {
+            styles.push("font-style: italic");
+        }
+        else if (prop === "underline" && strValue === "true") {
+            decorations.push("underline");
+        }
+        else if (prop === "strike" && strValue === "true") {
+            decorations.push("line-through");
+        }
+        else if (prop !== "underline" && prop !== "strike") {
+            styles.push(`${css}: ${strValue}`);
+        }
+    }
+    if (decorations.length)
+        styles.push(`text-decoration: ${decorations.join(" ")}`);
+    return styles.join("; ");
+}
+exports.DOC_STYLE_TARGETS = {
+    title: [".intent-title"],
+    summary: [".intent-summary"],
+    section: [".intent-section"],
+    sub: [".intent-sub"],
+    text: [".intent-text"],
+    quote: [".intent-quote"],
+    callout: [".intent-callout"],
+    info: [".intent-callout"],
+    table: [".intent-table-th", ".intent-table-td"],
+    "table-header": [".intent-table-th"],
+    metric: [".it-metric-row"],
+    contact: [".it-contact"],
+    divider: [".intent-divider"],
+};
+function collectDocumentStyles(doc) {
+    const rules = [];
+    const walk = (blocks) => {
+        for (const b of blocks) {
+            if (b.type === "style" && b.content) {
+                const target = String(b.content).trim().toLowerCase();
+                if (exports.DOC_STYLE_TARGETS[target]) {
+                    const declarations = extractInlineStyles(b.properties || {}, "stylesheet");
+                    if (declarations)
+                        rules.push({ target, declarations });
+                }
+            }
+            if (b.children)
+                walk(b.children);
+        }
+    };
+    walk(doc.blocks);
+    return rules;
+}
+function documentStyleCSS(doc, selectorMap = exports.DOC_STYLE_TARGETS, selectorPrefix = "") {
+    return collectDocumentStyles(doc)
+        .map((rule) => {
+        const sels = selectorMap[rule.target];
+        if (!sels || sels.length === 0)
+            return "";
+        const scoped = sels.map((s) => `${selectorPrefix}${s}`).join(",");
+        return `${scoped}{${rule.declarations};}`;
+    })
+        .filter(Boolean)
+        .join("\n");
+}
+function renderBlock(block) {
+    if (block.type === "agent" ||
+        block.type === "model" ||
+        block.type === "style") {
+        return "";
+    }
+    const content = applyInlineFormatting(block.content, block.inline, block.originalContent);
+    const props = block.properties || {};
+    const alignClass = getAlignmentClass(props);
+    const inlineStyle = extractInlineStyles(props);
+    const styleAttr = inlineStyle ? ` style="${inlineStyle}"` : "";
+    switch (block.type) {
+        case "title":
+            return `<h1 class="intent-title${alignClass}"${styleAttr}>${content}</h1>`;
+        case "summary":
+            return `<div class="intent-summary${alignClass}"${styleAttr}>${content}</div>`;
+        case "section":
+            return `<h2 id="${slugify(block.content)}" class="intent-section${alignClass}"${styleAttr}>${content}</h2>`;
+        case "sub":
+            return `<h3 id="${slugify(block.content)}" class="intent-sub${alignClass}"${styleAttr}>${content}</h3>`;
+        case "divider":
+            const dividerStyle = props.style
+                ? escapeHtml(String(props.style).replace(/[;{}"]/g, ""))
+                : "solid";
+            const label = content
+                ? `<span class="intent-divider-label">${content}</span>`
+                : "";
+            return `<div class="intent-divider">
+        <hr class="it-divider" style="border-style: ${dividerStyle}" />
+        ${label}
+      </div>`;
+        case "text":
+            return `<p class="intent-text${alignClass}"${styleAttr}>${content}</p>`;
+        case "body-text":
+            return `<p class="intent-prose${alignClass}"${styleAttr}>${content}</p>`;
+        case "info": {
+            const CALLOUT_VARIANTS = {
+                info: "Note",
+                warning: "Caution",
+                danger: "Danger",
+                tip: "Tip",
+                success: "Done",
+            };
+            const subtype = props.type || "info";
+            const variant = subtype in CALLOUT_VARIANTS ? subtype : "info";
+            const label = CALLOUT_VARIANTS[variant];
+            if (variant === "danger") {
+                return `<div class="it-callout it-danger" role="alert"${styleAttr}><span class="it-callout-icon" aria-hidden="true">⛔</span><div class="it-callout-body">${content}</div></div>`;
+            }
+            return `<div class="intent-callout intent-${variant}"${styleAttr}><span class="intent-callout-label">${label}</span><div class="intent-callout-content">${content}</div></div>`;
+        }
+        case "task":
+        case "done": {
+            const isDone = props.status === "done" || block.type === "done";
+            return `<div class="intent-task${isDone ? " intent-task-done" : ""}">
+        <input class="intent-task-checkbox" type="checkbox"${isDone ? " checked" : ""} />
+        <span class="intent-task-text${isDone ? " intent-task-text-done" : ""}">${content}</span>
+        <span class="intent-task-meta">
+          ${props.owner ? `<span class="intent-task-owner">${escapeHtml(String(props.owner))}</span>` : ""}
+          ${props.due ? `<span class="intent-task-due">${escapeHtml(String(props.due))}</span>` : ""}
+          ${props.time ? `<span class="intent-task-time">${escapeHtml(String(props.time))}</span>` : ""}
+        </span>
+      </div>`;
+        }
+        case "ask":
+            return `<div class="intent-ask"><span class="intent-ask-label">Query</span><div class="intent-ask-content">${content}</div></div>`;
+        case "quote": {
+            const attribution = props.by
+                ? `<cite class="intent-quote-cite">— ${escapeHtml(String(props.by))}</cite>`
+                : "";
+            return `<blockquote class="intent-quote"><p>${content}</p>${attribution}</blockquote>`;
+        }
+        case "cite": {
+            const citeAuthor = props.author
+                ? `<span class="it-cite-author">${escapeHtml(String(props.author))}</span>`
+                : "";
+            const citeDate = props.date
+                ? `<span class="it-cite-date">${escapeHtml(String(props.date))}</span>`
+                : "";
+            const citeUrl = props.url
+                ? ` href="${escapeHtml(sanitizeUrl(String(props.url)))}"`
+                : "";
+            const citeTitle = citeUrl
+                ? `<a class="it-cite-title"${citeUrl} target="_blank" rel="noopener noreferrer">${content}</a>`
+                : `<span class="it-cite-title">${content}</span>`;
+            return `<div class="it-cite">${citeTitle}${citeAuthor ? ` — ${citeAuthor}` : ""}${citeDate ? `, ${citeDate}` : ""}</div>`;
+        }
+        case "image":
+            const imgSrc = escapeHtml(sanitizeUrl(String(props.src ?? props.at ?? "")) ||
+                String(props.src ?? props.at ?? content));
+            const imgAlt = content;
+            return `<figure class="intent-image">
+        <img class="intent-image-img" src="${imgSrc}" alt="${imgAlt}" />
+        ${props.caption ? `<figcaption class="intent-image-caption">${escapeHtml(String(props.caption))}</figcaption>` : ""}
+      </figure>`;
+        case "link":
+            const href = escapeHtml(sanitizeUrl(String(props.to || content)));
+            const titleAttr = props.title
+                ? `title="${escapeHtml(String(props.title))}"`
+                : "";
+            return `<p class="intent-link"><a href="${href}" ${titleAttr}>${content}</a></p>`;
+        case "ref": {
+            const refFile = props.file ? String(props.file) : "";
+            const refUrl = props.url ? String(props.url) : "";
+            const refRel = props.rel ? escapeHtml(String(props.rel)) : "";
+            const refHref = refFile
+                ? escapeHtml(sanitizeUrl(refFile))
+                : refUrl
+                    ? escapeHtml(sanitizeUrl(refUrl))
+                    : "";
+            const refName = escapeHtml(block.content || refFile || refUrl);
+            const relBadge = refRel
+                ? `<span class="it-ref-rel">${refRel}</span>`
+                : "";
+            const linkEl = refHref
+                ? `<a href="${refHref}" class="it-ref-link">${refName}</a>`
+                : `<span class="it-ref-name">${refName}</span>`;
+            return `<div class="it-ref-card">
+        <span class="it-ref-icon">📎</span>
+        ${linkEl}
+        ${relBadge}
+      </div>`;
+        }
+        case "embed": {
+            const embedType = props.type || "iframe";
+            const src = String(props.src || "");
+            const embedContent = String(props.content || "");
+            switch (embedType) {
+                case "iframe":
+                    return `<div class="intent-embed"><iframe src="${escapeHtml(sanitizeUrl(src))}" frameborder="0" loading="lazy" style="width:100%;min-height:400px;border-radius:8px;"></iframe></div>`;
+                case "mermaid":
+                    return `<div class="intent-embed mermaid">${embedContent}</div>`;
+                case "svg":
+                    return `<div class="intent-embed svg">${embedContent}</div>`;
+                case "video":
+                    return `<div class="intent-embed video"><video src="${escapeHtml(sanitizeUrl(src))}" controls style="max-width:100%;border-radius:8px;"></video></div>`;
+                case "audio":
+                    return `<div class="intent-embed audio"><audio src="${escapeHtml(sanitizeUrl(src))}" controls style="width:100%;"></audio></div>`;
+                default:
+                    return `<div class="intent-embed unknown">${escapeHtml(embedContent || src)}</div>`;
+            }
+        }
+        case "code":
+            return `<pre class="intent-code"><code>${escapeHtml(block.content)}</code></pre>`;
+        case "table": {
+            const headers = block.table?.headers;
+            const rows = block.table?.rows || [];
+            const thead = headers
+                ? `<thead><tr>${headers
+                    .map((h) => `<th class="intent-table-th">${escapeHtml(h)}</th>`)
+                    .join("")}</tr></thead>`
+                : "";
+            const tbody = `<tbody>${rows
+                .map((row) => `<tr class="intent-row">${row
+                .map((c) => `<td class="intent-table-td">${escapeHtml(c)}</td>`)
+                .join("")}</tr>`)
+                .join("")}</tbody>`;
+            return `<table class="intent-table">${thead}${tbody}</table>`;
+        }
+        case "list-item": {
+            const listItemProps = block.properties || {};
+            const listItemMeta = [
+                listItemProps.owner &&
+                    `<span class="intent-task-owner">${escapeHtml(String(listItemProps.owner))}</span>`,
+                listItemProps.due &&
+                    `<span class="intent-task-due">${escapeHtml(String(listItemProps.due))}</span>`,
+            ]
+                .filter(Boolean)
+                .join(" ");
+            return `<li class="intent-list-item">${content}${listItemMeta ? ` <span class="intent-task-meta">${listItemMeta}</span>` : ""}</li>`;
+        }
+        case "step-item":
+            return `<li class="intent-step-item">${content}</li>`;
+        case "step": {
+            const statusVal = String(props.status || "pending");
+            const statusClass = `intent-status-${statusVal}`;
+            const toolBadge = props.tool
+                ? `<span class="intent-badge intent-badge-tool">${escapeHtml(String(props.tool))}</span>`
+                : "";
+            const statusBadge = `<span class="intent-badge ${statusClass}">${escapeHtml(statusVal)}</span>`;
+            const dependsArrow = props.depends
+                ? `<span class="intent-step-depends">⤷ ${escapeHtml(String(props.depends))}</span>`
+                : "";
+            const stepId = props.id
+                ? `<span class="intent-step-id">${escapeHtml(String(props.id))}</span>`
+                : "";
+            return `<div class="intent-step">
+        <span class="intent-step-icon">▶</span>
+        <span class="intent-step-content">${content}</span>
+        <span class="intent-step-meta">${stepId}${toolBadge}${statusBadge}${dependsArrow}</span>
+      </div>`;
+        }
+        case "decision": {
+            const ifExpr = props.if ? escapeHtml(String(props.if)) : "";
+            const thenTarget = props.then ? escapeHtml(String(props.then)) : "";
+            const elseTarget = props.else ? escapeHtml(String(props.else)) : "";
+            return `<div class="intent-decision">
+        <div class="intent-decision-diamond"></div>
+        <div class="intent-decision-body">
+          <div class="intent-decision-label">${content}</div>
+          ${ifExpr ? `<div class="intent-decision-condition"><strong>if</strong> ${ifExpr}</div>` : ""}
+          <div class="intent-decision-branches">
+            ${thenTarget ? `<span class="intent-decision-then">✓ then → ${thenTarget}</span>` : ""}
+            ${elseTarget ? `<span class="intent-decision-else">✗ else → ${elseTarget}</span>` : ""}
+          </div>
+        </div>
+      </div>`;
+        }
+        case "trigger": {
+            const eventBadge = props.event
+                ? `<span class="intent-badge intent-badge-event">${escapeHtml(String(props.event))}</span>`
+                : "";
+            return `<div class="intent-trigger">
+        <span class="intent-trigger-icon">⚡</span>
+        <span class="intent-trigger-content">${content}</span>
+        ${eventBadge}
+      </div>`;
+        }
+        case "loop": {
+            const overVal = props.over ? escapeHtml(String(props.over)) : "";
+            const doVal = props.do ? escapeHtml(String(props.do)) : "";
+            return `<div class="intent-loop">
+        <span class="intent-loop-icon">🔁</span>
+        <span class="intent-loop-content">${content}</span>
+        ${overVal ? `<span class="intent-loop-over">over: ${overVal}</span>` : ""}
+        ${doVal ? `<span class="intent-loop-do">do: ${doVal}</span>` : ""}
+      </div>`;
+        }
+        case "checkpoint":
+            return `<div class="intent-checkpoint">
+        <span class="intent-checkpoint-flag">🚩</span>
+        <span class="intent-checkpoint-label">${content}</span>
+        <hr class="intent-checkpoint-line" />
+      </div>`;
+        case "audit":
+            return `<div class="intent-audit"><span class="intent-audit-prefix">audit:</span> ${content}${props.by ? ` | by: ${escapeHtml(String(props.by))}` : ""}${props.at ? ` | at: ${escapeHtml(String(props.at))}` : ""}</div>`;
+        case "error": {
+            const fallbackInfo = props.fallback
+                ? `<span class="intent-error-fallback">fallback → ${escapeHtml(String(props.fallback))}</span>`
+                : "";
+            const notifyInfo = props.notify
+                ? `<span class="intent-error-notify">notify: ${escapeHtml(String(props.notify))}</span>`
+                : "";
+            return `<div class="intent-callout intent-error-block"><span class="intent-callout-label">Error</span><div class="intent-callout-content">${content} ${fallbackInfo} ${notifyInfo}</div></div>`;
+        }
+        case "context": {
+            const ctxEntries = Object.entries(props);
+            if (ctxEntries.length === 0) {
+                return `<div class="intent-context"><code>${content}</code></div>`;
+            }
+            const ctxRows = ctxEntries
+                .map(([k, v]) => `<tr><td class="intent-context-key">${escapeHtml(k)}</td><td class="intent-context-val">${escapeHtml(String(v))}</td></tr>`)
+                .join("");
+            return `<table class="intent-context-table"><tbody>${ctxRows}</tbody></table>`;
+        }
+        case "progress": {
+            let value = 0;
+            let total = 100;
+            const progressMatch = block.content.match(/(\d+)\s*\/\s*(\d+)/);
+            if (progressMatch) {
+                value = parseInt(progressMatch[1], 10);
+                total = parseInt(progressMatch[2], 10);
+            }
+            if (props.value)
+                value = Number(props.value);
+            if (props.total)
+                total = Number(props.total);
+            const pct = total > 0 ? Math.round((value / total) * 100) : 0;
+            return `<div class="intent-progress">
+        <span class="intent-progress-label">${content}</span>
+        <div class="intent-progress-bar"><div class="intent-progress-fill" style="width:${pct}%"></div></div>
+        <span class="intent-progress-pct">${pct}%</span>
+      </div>`;
+        }
+        case "import": {
+            const asAlias = props.as ? ` as ${escapeHtml(String(props.as))}` : "";
+            return `<div class="intent-file-ref intent-import"><span class="intent-file-ref-icon">📥</span> import: ${content}${asAlias}</div>`;
+        }
+        case "export": {
+            const fmt = props.format ? ` (${escapeHtml(String(props.format))})` : "";
+            return `<div class="intent-file-ref intent-export"><span class="intent-file-ref-icon">📤</span> export: ${content}${fmt}</div>`;
+        }
+        case "signal": {
+            const phase = props.phase
+                ? `<span class="intent-signal-phase">${escapeHtml(String(props.phase))}</span>`
+                : "";
+            const levelBadge = props.level
+                ? `<span class="intent-badge intent-badge-level">${escapeHtml(String(props.level))}</span>`
+                : "";
+            return `<div class="intent-signal-block">
+        <span class="intent-signal-icon">📡</span>
+        <span class="intent-signal-content">${content}</span>
+        <span class="intent-signal-meta">${phase}${levelBadge}</span>
+      </div>`;
+        }
+        case "result": {
+            const statusVal = String(props.status || "success");
+            const statusClass = `intent-result-${statusVal}`;
+            const codeBadge = props.code
+                ? `<span class="intent-badge intent-badge-code">${escapeHtml(String(props.code))}</span>`
+                : "";
+            const dataInfo = props.data
+                ? `<div class="intent-result-data"><code>${escapeHtml(String(props.data))}</code></div>`
+                : "";
+            return `<div class="intent-result ${statusClass}">
+        <span class="intent-result-icon">✅</span>
+        <span class="intent-result-content">${content}</span>
+        ${codeBadge}
+        ${dataInfo}
+      </div>`;
+        }
+        case "handoff": {
+            const fromAgent = props.from
+                ? `<span class="intent-handoff-agent intent-handoff-from">${escapeHtml(String(props.from))}</span>`
+                : "";
+            const toAgent = props.to
+                ? `<span class="intent-handoff-agent intent-handoff-to">${escapeHtml(String(props.to))}</span>`
+                : "";
+            const arrow = fromAgent || toAgent
+                ? `<span class="intent-handoff-arrow">${fromAgent} → ${toAgent}</span>`
+                : "";
+            return `<div class="intent-handoff">
+        <span class="intent-handoff-icon">🤝</span>
+        <span class="intent-handoff-content">${content}</span>
+        ${arrow}
+      </div>`;
+        }
+        case "wait": {
+            const onVal = props.on
+                ? `<span class="intent-badge intent-badge-event">${escapeHtml(String(props.on))}</span>`
+                : "";
+            const timeoutVal = props.timeout
+                ? `<span class="intent-badge intent-badge-timeout">${escapeHtml(String(props.timeout))}</span>`
+                : "";
+            const fallbackVal = props.fallback
+                ? `<span class="intent-wait-fallback">fallback → ${escapeHtml(String(props.fallback))}</span>`
+                : "";
+            return `<div class="intent-wait">
+        <span class="intent-wait-icon">⏳</span>
+        <span class="intent-wait-content">${content}</span>
+        <span class="intent-wait-meta">${onVal}${timeoutVal}${fallbackVal}</span>
+      </div>`;
+        }
+        case "parallel": {
+            const stepsVal = props.steps
+                ? String(props.steps)
+                    .split(",")
+                    .map((s) => s.trim())
+                : [];
+            const stepBadges = stepsVal.length > 0
+                ? stepsVal
+                    .map((s) => `<span class="intent-badge intent-badge-parallel-step">${escapeHtml(s)}</span>`)
+                    .join("")
+                : "";
+            const joinBadge = props.join
+                ? `<span class="intent-badge intent-badge-join">join: ${escapeHtml(String(props.join))}</span>`
+                : "";
+            return `<div class="intent-parallel">
+        <span class="intent-parallel-icon">⏩</span>
+        <span class="intent-parallel-content">${content}</span>
+        <span class="intent-parallel-steps">${stepBadges}${joinBadge}</span>
+      </div>`;
+        }
+        case "retry": {
+            const maxVal = props.max
+                ? `<span class="intent-badge intent-badge-retry-max">max: ${escapeHtml(String(props.max))}</span>`
+                : "";
+            const delayVal = props.delay
+                ? `<span class="intent-badge intent-badge-retry-delay">delay: ${escapeHtml(String(props.delay))}ms</span>`
+                : "";
+            const backoffVal = props.backoff
+                ? `<span class="intent-badge intent-badge-retry-backoff">${escapeHtml(String(props.backoff))}</span>`
+                : "";
+            return `<div class="intent-retry">
+        <span class="intent-retry-icon">🔄</span>
+        <span class="intent-retry-content">${content}</span>
+        <span class="intent-retry-meta">${maxVal}${delayVal}${backoffVal}</span>
+      </div>`;
+        }
+        case "gate": {
+            const approverBadge = props.approver
+                ? `<span class="intent-badge intent-badge-approver">${escapeHtml(String(props.approver))}</span>`
+                : "";
+            const timeoutBadge = props.timeout
+                ? `<span class="intent-badge intent-badge-timeout">${escapeHtml(String(props.timeout))}</span>`
+                : "";
+            const fallbackInfo = props.fallback
+                ? `<span class="intent-gate-fallback">fallback → ${escapeHtml(String(props.fallback))}</span>`
+                : "";
+            return `<div class="intent-gate">
+        <div class="intent-gate-icon">🛑</div>
+        <div class="intent-gate-body">
+          <div class="intent-gate-label">${content}</div>
+          <div class="intent-gate-meta">${approverBadge}${timeoutBadge}${fallbackInfo}</div>
+        </div>
+      </div>`;
+        }
+        case "call": {
+            const inputVal = props.input
+                ? `<span class="intent-call-input">input: ${escapeHtml(String(props.input))}</span>`
+                : "";
+            const outputVal = props.output
+                ? `<span class="intent-call-output">output: ${escapeHtml(String(props.output))}</span>`
+                : "";
+            return `<div class="intent-call">
+        <span class="intent-call-icon">📞</span>
+        <span class="intent-call-content">${content}</span>
+        <span class="intent-call-meta">${inputVal}${outputVal}</span>
+      </div>`;
+        }
+        case "policy": {
+            const conditions = [];
+            if (props.if)
+                conditions.push(`<span class="it-policy-condition">if ${escapeHtml(String(props.if))}</span>`);
+            if (props.always)
+                conditions.push(`<span class="it-policy-always">always: ${escapeHtml(String(props.always))}</span>`);
+            if (props.never)
+                conditions.push(`<span class="it-policy-never">never: ${escapeHtml(String(props.never))}</span>`);
+            if (props.action)
+                conditions.push(`<span class="it-policy-action">→ ${escapeHtml(String(props.action))}</span>`);
+            if (props.requires)
+                conditions.push(`<span class="it-policy-requires">requires: ${escapeHtml(String(props.requires))}</span>`);
+            if (props.notify)
+                conditions.push(`<span class="it-policy-notify">notify: ${escapeHtml(String(props.notify))}</span>`);
+            return `<div class="it-block it-policy">
+        <div class="it-policy-name">${content}</div>
+        <div class="it-policy-rules">${conditions.join(" ")}</div>
+      </div>`;
+        }
+        case "input": {
+            const inputType = props.type ? escapeHtml(String(props.type)) : "string";
+            const inputRequired = props.required === "true" || String(props.required) === "true";
+            const inputDef = props.default != null
+                ? `<span class="it-input-default">= ${escapeHtml(String(props.default))}</span>`
+                : "";
+            return `<div class="it-input"><span class="it-input-name">${content}</span><span class="it-input-type">${inputType}</span>${inputRequired ? '<span class="it-input-required">required</span>' : ""}${inputDef}</div>`;
+        }
+        case "output": {
+            const outputType = props.type ? escapeHtml(String(props.type)) : "any";
+            const outputFormat = props.format
+                ? `<span class="it-output-format">${escapeHtml(String(props.format))}</span>`
+                : "";
+            return `<div class="it-output"><span class="it-output-name">${content}</span><span class="it-output-type">${outputType}</span>${outputFormat}</div>`;
+        }
+        case "tool": {
+            const toolApi = props.api
+                ? `<code class="it-tool-api">${escapeHtml(String(props.api))}</code>`
+                : "";
+            const toolMethod = props.method
+                ? `<span class="it-tool-method">${escapeHtml(String(props.method))}</span>`
+                : "";
+            return `<div class="it-tool"><span class="it-tool-name">${content}</span>${toolApi}${toolMethod}</div>`;
+        }
+        case "prompt": {
+            const promptModel = props.model
+                ? `<span class="it-prompt-model">${escapeHtml(String(props.model))}</span>`
+                : "";
+            return `<div class="it-prompt">${promptModel}<div class="it-prompt-content">${content}</div></div>`;
+        }
+        case "memory": {
+            const memoryScope = props.scope
+                ? escapeHtml(String(props.scope))
+                : "session";
+            return `<div class="it-memory"><span class="it-memory-scope">${memoryScope}</span><span class="it-memory-content">${content}</span></div>`;
+        }
+        case "assert": {
+            const expectExpr = props.expect
+                ? `<code class="it-assert-expect">${escapeHtml(String(props.expect))}</code>`
+                : "";
+            const severity = props.severity
+                ? escapeHtml(String(props.severity))
+                : "error";
+            return `<div class="it-assert it-assert-${severity}"><span class="it-assert-label">ASSERT</span><span class="it-assert-content">${content}</span>${expectExpr}</div>`;
+        }
+        case "secret":
+            return `<div class="it-secret"><span class="it-secret-label">SECRET</span><span class="it-secret-value">${"\u2022".repeat(8)}</span></div>`;
+        case "font":
+            return "";
+        case "page":
+            return "";
+        case "break":
+            return `<div class="it-page-break" aria-hidden="true" style="display:none"></div>`;
+        case "history":
+            return "";
+        case "byline": {
+            const author = content;
+            const date = props.date ? escapeHtml(String(props.date)) : "";
+            const publication = props.publication
+                ? escapeHtml(String(props.publication))
+                : "";
+            const role = props.role ? escapeHtml(String(props.role)) : "";
+            const metaParts = [role, date, publication].filter(Boolean);
+            return `<div class="it-byline"><span class="it-byline-author">${author}</span>${metaParts.length > 0 ? `<span class="it-byline-meta">${metaParts.join(" · ")}</span>` : ""}</div>`;
+        }
+        case "epigraph": {
+            const by = props.by
+                ? `<span class="it-epigraph-by">— ${escapeHtml(String(props.by))}</span>`
+                : "";
+            return `<blockquote class="it-epigraph"><p>${content}</p>${by}</blockquote>`;
+        }
+        case "caption":
+            return `<figcaption class="it-caption">${content}</figcaption>`;
+        case "footnote":
+            return "";
+        case "toc":
+            return "";
+        case "dedication":
+            return `<div class="it-dedication">${content}</div>`;
+        case "track":
+            return "";
+        case "meta":
+            return "";
+        case "header":
+            return "";
+        case "footer":
+            return "";
+        case "watermark":
+            return "";
+        case "approve": {
+            const approveBy = props.by ? escapeHtml(String(props.by)) : "Unknown";
+            const approveRole = props.role ? escapeHtml(String(props.role)) : "";
+            const approveAt = props.at ? formatTrustDate(String(props.at)) : "";
+            return `<div class="it-approval">
+        <span class="it-approval__icon">✓</span>
+        <div class="it-approval__body">
+          <span class="it-approval__label">APPROVED</span>
+          <span class="it-approval__who">${approveBy}${approveRole ? ` — ${approveRole}` : ""}</span>
+          ${approveAt ? `<span class="it-approval__date">${approveAt}</span>` : ""}
+        </div>
+      </div>`;
+        }
+        case "sign": {
+            const signerName = escapeHtml(block.content);
+            const signRole = props.role ? escapeHtml(String(props.role)) : "";
+            const signAt = props.at ? formatTrustDate(String(props.at)) : "";
+            const signValid = props.hash ? true : false;
+            return `<div class="it-signature${signValid ? " it-signature--valid" : " it-signature--invalid"}">
+        <span class="it-signature__name">${signerName}</span>
+        ${signRole ? `<span class="it-signature__role">${signRole}</span>` : ""}
+        ${signAt ? `<span class="it-signature__date">${signAt}</span>` : ""}
+        <span class="it-signature__status">${signValid ? "✅ Verified" : "❌ Invalid"}</span>
+      </div>`;
+        }
+        case "freeze": {
+            const freezeAt = props.at ? formatTrustDate(String(props.at)) : "";
+            const freezeHash = props.hash
+                ? escapeHtml(String(props.hash)).slice(0, 20) + "..."
+                : "";
+            return `<div class="it-sealed-banner">
+        <span class="it-sealed-banner__icon">🔒</span>
+        <span class="it-sealed-banner__text">Sealed Document</span>
+        ${freezeAt ? `<span class="it-sealed-banner__date">${freezeAt}</span>` : ""}
+        ${freezeHash ? `<span class="it-sealed-banner__hash">${freezeHash}</span>` : ""}
+      </div>`;
+        }
+        case "revision":
+            return "";
+        case "def": {
+            const meaning = props.meaning ? escapeHtml(String(props.meaning)) : "";
+            const abbr = props.abbr
+                ? ` <span class="it-def-abbr">(${escapeHtml(String(props.abbr))})</span>`
+                : "";
+            return `<div class="it-def">
+        <dt class="it-def-term">${content}${abbr}</dt>
+        <dd class="it-def-meaning">${meaning}</dd>
+      </div>`;
+        }
+        case "metric": {
+            const val = props.value != null ? escapeHtml(String(props.value)) : "";
+            const unit = props.unit ? escapeHtml(String(props.unit)) : "";
+            const target = props.target != null ? String(props.target) : "";
+            const trend = props.trend ? String(props.trend) : "";
+            const period = props.period ? escapeHtml(String(props.period)) : "";
+            if (!target && !trend && !period) {
+                const isTotal = /\b(total|balance due|amount due|grand)\b/i.test(String(block.content || ""));
+                const valueText = [val, unit].filter(Boolean).join(" ");
+                return `<div class="it-metric-row${isTotal ? " it-metric-row--total" : ""}">
+        <span class="it-metric-row__label">${content}</span>
+        <span class="it-metric-row__value">${valueText}</span>
+      </div>`;
+            }
+            const trendIcon = trend === "up"
+                ? "↑"
+                : trend === "down"
+                    ? "↓"
+                    : trend === "stable"
+                        ? "→"
+                        : "";
+            let colorClass = "it-metric-neutral";
+            if (target && val) {
+                colorClass =
+                    Number(val) >= Number(target) ? "it-metric-green" : "it-metric-red";
+            }
+            return `<div class="it-metric ${colorClass}">
+        <div class="it-metric-name">${content}</div>
+        <div class="it-metric-value">${val}<span class="it-metric-unit">${unit}</span></div>
+        ${target ? `<div class="it-metric-target">Target: ${escapeHtml(target)}</div>` : ""}
+        ${trendIcon ? `<div class="it-metric-trend">${trendIcon}</div>` : ""}
+        ${period ? `<div class="it-metric-period">${period}</div>` : ""}
+      </div>`;
+        }
+        case "amendment": {
+            const amendRef = props.ref ? escapeHtml(String(props.ref)) : "";
+            const amendSection = props.section
+                ? escapeHtml(String(props.section))
+                : "";
+            const amendWas = props.was ? escapeHtml(String(props.was)) : "";
+            const amendNow = props.now ? escapeHtml(String(props.now)) : "";
+            const amendBy = props.by ? escapeHtml(String(props.by)) : "";
+            const amendAt = props.at ? formatTrustDate(String(props.at)) : "";
+            return `<div class="it-amendment">
+        <div class="it-amendment-header">
+          <span class="it-amendment-icon">✏️</span>
+          <span class="it-amendment-ref">${amendRef}</span>
+          <span class="it-amendment-title">${content}</span>
+        </div>
+        ${amendSection ? `<div class="it-amendment-section">Section: ${amendSection}</div>` : ""}
+        ${amendWas ? `<div class="it-amendment-was">Was: ${amendWas}</div>` : ""}
+        ${amendNow ? `<div class="it-amendment-now">Now: ${amendNow}</div>` : ""}
+        <div class="it-amendment-meta">
+          ${amendBy ? `<span class="it-amendment-by">${amendBy}</span>` : ""}
+          ${amendAt ? `<span class="it-amendment-at">${amendAt}</span>` : ""}
+        </div>
+      </div>`;
+        }
+        case "figure": {
+            const figSrc = props.src
+                ? escapeHtml(sanitizeUrl(String(props.src)))
+                : "";
+            const figCaption = props.caption ? escapeHtml(String(props.caption)) : "";
+            const figNum = props.num ? escapeHtml(String(props.num)) : "";
+            const figWidth = props.width
+                ? `width:${escapeHtml(String(props.width))};`
+                : "";
+            const figAlign = props.align ? String(props.align) : "center";
+            const figAlt = props.alt
+                ? escapeHtml(String(props.alt))
+                : escapeHtml(block.content);
+            const numPrefix = figNum ? `Figure ${figNum}: ` : "";
+            return `<figure class="it-figure" style="text-align:${escapeHtml(figAlign)};">
+        ${figSrc ? `<img src="${figSrc}" alt="${figAlt}" style="${figWidth}max-width:100%;" />` : ""}
+        <figcaption class="it-figure-caption">${numPrefix}${figCaption}</figcaption>
+      </figure>`;
+        }
+        case "signline": {
+            const sigLabel = props.label
+                ? escapeHtml(String(props.label))
+                : "Signature";
+            const sigRole = props.role ? escapeHtml(String(props.role)) : "";
+            const sigDateLine = String(props["date-line"]) === "true";
+            const sigWidth = props.width ? escapeHtml(String(props.width)) : "60%";
+            return `<div class="it-signline" style="width:${sigWidth};">
+        <div class="it-signline-label">${sigLabel}</div>
+        <div class="it-signline-rule"></div>
+        <div class="it-signline-name">${content}</div>
+        ${sigRole ? `<div class="it-signline-role">${sigRole}</div>` : ""}
+        ${sigDateLine ? `<div class="it-signline-date">Date: _______________</div>` : ""}
+      </div>`;
+        }
+        case "contact": {
+            const cRole = props.role ? escapeHtml(String(props.role)) : "";
+            const cEmail = props.email ? String(props.email) : "";
+            const cPhone = props.phone ? String(props.phone) : "";
+            const cOrg = props.org ? escapeHtml(String(props.org)) : "";
+            const cUrl2 = props.url ? String(props.url) : "";
+            return `<div class="it-contact">
+        <div class="it-contact-name">${content}</div>
+        ${cRole ? `<div class="it-contact-role">${cRole}</div>` : ""}
+        ${cOrg ? `<div class="it-contact-org">${cOrg}</div>` : ""}
+        ${cEmail ? `<div class="it-contact-email"><a href="mailto:${escapeHtml(cEmail)}">${escapeHtml(cEmail)}</a></div>` : ""}
+        ${cPhone ? `<div class="it-contact-phone"><a href="tel:${escapeHtml(cPhone)}">${escapeHtml(cPhone)}</a></div>` : ""}
+        ${cUrl2 ? `<div class="it-contact-url"><a href="${escapeHtml(sanitizeUrl(cUrl2))}">${escapeHtml(cUrl2)}</a></div>` : ""}
+      </div>`;
+        }
+        case "deadline": {
+            const dlDate = props.date ? String(props.date) : "";
+            const dlConsequence = props.consequence
+                ? escapeHtml(String(props.consequence))
+                : "";
+            const dlAuthority = props.authority
+                ? escapeHtml(String(props.authority))
+                : "";
+            const dlOwner = props.owner ? escapeHtml(String(props.owner)) : "";
+            let dlColorClass = "it-deadline-green";
+            if (dlDate) {
+                const dlDateObj = new Date(dlDate);
+                if (!isNaN(dlDateObj.getTime())) {
+                    const daysUntil = (dlDateObj.getTime() - Date.now()) / (1000 * 60 * 60 * 24);
+                    if (daysUntil < 7)
+                        dlColorClass = "it-deadline-red";
+                    else if (daysUntil < 30)
+                        dlColorClass = "it-deadline-amber";
+                }
+            }
+            return `<div class="it-deadline ${dlColorClass}">
+        <div class="it-deadline-name">${content}</div>
+        ${dlDate ? `<div class="it-deadline-date">${escapeHtml(dlDate)}</div>` : ""}
+        ${dlConsequence ? `<div class="it-deadline-consequence">${dlConsequence}</div>` : ""}
+        ${dlOwner ? `<div class="it-deadline-owner">${dlOwner}</div>` : ""}
+        ${dlAuthority ? `<div class="it-deadline-authority">${dlAuthority}</div>` : ""}
+      </div>`;
+        }
+        case "extension": {
+            const xType = props["x-type"]
+                ? escapeHtml(String(props["x-type"]))
+                : "unknown";
+            const xNs = props["x-ns"] ? escapeHtml(String(props["x-ns"])) : "ext";
+            return `<div class="it-extension it-ext-${xNs} it-ext-${xType}" data-x-type="${xType}" data-x-ns="${xNs}"${styleAttr}>${content}</div>`;
+        }
+        default:
+            return `<div class="intent-unknown">
+        <small class="intent-unknown-type">[${block.type}]</small> ${content}
+      </div>`;
+    }
+}
+function slugify(text) {
+    return text
+        .toLowerCase()
+        .replace(/[^a-z0-9]+/g, "-")
+        .replace(/^-|-$/g, "");
+}
+function collectSections(blocks, depth) {
+    const entries = [];
+    for (const block of blocks) {
+        if (block.type === "section") {
+            entries.push({
+                level: 1,
+                content: block.content,
+                slug: slugify(block.content),
+            });
+            if (depth >= 2 && block.children) {
+                for (const child of block.children) {
+                    if (child.type === "sub") {
+                        entries.push({
+                            level: 2,
+                            content: child.content,
+                            slug: slugify(child.content),
+                        });
+                    }
+                }
+            }
+        }
+    }
+    return entries;
+}
+function collectFootnotes(blocks) {
+    const footnotes = [];
+    for (const block of blocks) {
+        if (block.type === "footnote")
+            footnotes.push(block);
+        if (block.children)
+            footnotes.push(...collectFootnotes(block.children));
+    }
+    return footnotes;
+}
+function renderBlocks(blocks, allBlocks) {
+    const topBlocks = allBlocks || blocks;
+    let html = "";
+    let i = 0;
+    while (i < blocks.length) {
+        const block = blocks[i];
+        if (block.type === "toc") {
+            const depth = Number(block.properties?.depth || 2);
+            const title = String(block.properties?.title || "Contents");
+            const entries = collectSections(topBlocks, depth);
+            let tocHtml = `<nav class="it-toc"><h2 class="it-toc-title">${escapeHtml(title)}</h2><ol>`;
+            for (const entry of entries) {
+                const indent = entry.level === 2 ? ' class="it-toc-sub"' : "";
+                tocHtml += `<li${indent}><a href="#${entry.slug}">${escapeHtml(entry.content)}</a></li>`;
+            }
+            tocHtml += `</ol></nav>`;
+            html += tocHtml;
+            i++;
+            continue;
+        }
+        if (block.type === "list-item") {
+            html += '<ul class="intent-list">';
+            while (i < blocks.length && blocks[i].type === "list-item") {
+                html += renderBlock(blocks[i]);
+                i++;
+            }
+            html += "</ul>";
+            continue;
+        }
+        if (block.type === "step-item") {
+            html += '<ol class="intent-list">';
+            while (i < blocks.length && blocks[i].type === "step-item") {
+                html += renderBlock(blocks[i]);
+                i++;
+            }
+            html += "</ol>";
+            continue;
+        }
+        html += renderBlock(block);
+        if ((block.type === "section" || block.type === "sub") &&
+            block.children &&
+            block.children.length > 0) {
+            html += renderBlocks(block.children, topBlocks);
+        }
+        i++;
+    }
+    return html;
+}
+function renderHTML(document, options) {
+    if (!document || !document.blocks)
+        return "";
+    const bodyHtml = renderBlocks(document.blocks);
+    const footnotes = collectFootnotes(document.blocks);
+    let footnotesHtml = "";
+    if (footnotes.length > 0) {
+        const items = footnotes
+            .map((fn) => {
+            const num = escapeHtml(fn.content);
+            const text = fn.properties?.text
+                ? escapeHtml(String(fn.properties.text))
+                : escapeHtml(fn.content);
+            return `<li id="fn-${num}" value="${num}">${text}</li>`;
+        })
+            .join("");
+        footnotesHtml = `<div class="it-footnotes"><ol>${items}</ol></div>`;
+    }
+    const html = bodyHtml + footnotesHtml;
+    const themeRef = options?.theme ?? document.metadata?.meta?.theme ?? undefined;
+    const theme = resolveThemeSync(themeRef);
+    const themeCSS = (0, theme_1.generateThemeCSS)(theme, "web");
+    const docStyleCSS = documentStyleCSS(document);
+    const direction = document.metadata?.language === "rtl" ? 'dir="rtl"' : 'dir="ltr"';
+    return `<div class="intent-document" ${direction}>
+<style>
+${document_css_1.DOCUMENT_CSS}${themeCSS}
+${docStyleCSS}
+</style>
+${html}
+</div>`;
+}
+function buildDynamicCSS(doc) {
+    const fontBlock = doc.blocks.find((b) => b.type === "font");
+    const pageBlock = doc.blocks.find((b) => b.type === "page");
+    const fontFamily = String(fontBlock?.properties?.family || "Georgia, serif");
+    const fontSize = String(fontBlock?.properties?.size || "12pt");
+    const leading = String(fontBlock?.properties?.leading || "1.6");
+    const rawSize = String(pageBlock?.properties?.size || "A4");
+    let pageSize;
+    let widthHint = rawSize;
+    if (rawSize === "custom") {
+        const w = String(pageBlock?.properties?.width || "210mm");
+        const h = String(pageBlock?.properties?.height || "297mm");
+        widthHint = w;
+        pageSize = `${escapeHtml(w)} ${escapeHtml(h)}`;
+    }
+    else {
+        pageSize = escapeHtml(PAPER_SIZES[rawSize] || rawSize);
+    }
+    const explicitMargin = pageBlock?.properties?.margin ?? pageBlock?.properties?.margins;
+    const widthMatch = /(\d+(?:\.\d+)?)\s*mm/.exec(widthHint);
+    const widthMm = widthMatch ? parseFloat(widthMatch[1]) : Infinity;
+    const margins = String(explicitMargin ?? (widthMm <= 120 ? "4mm" : "20mm"));
+    return `@page{size:${pageSize};margin:${escapeHtml(margins)};}body.it-print{font-family:${escapeHtml(fontFamily)};font-size:${escapeHtml(fontSize)};line-height:${escapeHtml(leading)};}`;
+}
+function renderPrint(doc, options) {
+    if (!doc || !doc.blocks)
+        return "";
+    const bodyHtml = renderBlocks(doc.blocks);
+    const footnotes = collectFootnotes(doc.blocks);
+    let footnotesHtml = "";
+    if (footnotes.length > 0) {
+        const items = footnotes
+            .map((fn) => {
+            const num = escapeHtml(fn.content);
+            const text = fn.properties?.text
+                ? escapeHtml(String(fn.properties.text))
+                : escapeHtml(fn.content);
+            return `<li id="fn-${num}" value="${num}">${text}</li>`;
+        })
+            .join("");
+        footnotesHtml = `<div class="it-footnotes"><ol>${items}</ol></div>`;
+    }
+    const html = bodyHtml + footnotesHtml;
+    const dynamicCSS = buildDynamicCSS(doc);
+    const direction = doc.metadata?.language === "rtl" ? 'dir="rtl"' : 'dir="ltr"';
+    const themeRef = options?.theme ?? doc.metadata?.meta?.theme ?? undefined;
+    const theme = resolveThemeSync(themeRef);
+    const themeCSS = (0, theme_1.generateThemeCSS)(theme, "print");
+    const layout = collectPrintLayout(doc);
+    let headerFooterCSS = "";
+    if (layout.header) {
+        const hp = layout.header.properties || {};
+        const left = cssContentValue(String(hp.left ?? ""));
+        const center = cssContentValue(String(hp.center ?? ""));
+        const right = cssContentValue(String(hp.right ?? ""));
+        headerFooterCSS += `@page{@top-left{content:${left};}@top-center{content:${center};}@top-right{content:${right};}}`;
+        if (String(hp["skip-first"]) === "true") {
+            headerFooterCSS += `@page:first{@top-left{content:"";}@top-center{content:"";}@top-right{content:"";}}`;
+        }
+    }
+    if (layout.footer) {
+        const fp = layout.footer.properties || {};
+        const left = cssContentValue(String(fp.left ?? ""));
+        const center = cssContentValue(String(fp.center ?? ""));
+        const right = cssContentValue(String(fp.right ?? ""));
+        headerFooterCSS += `@page{@bottom-left{content:${left};}@bottom-center{content:${center};}@bottom-right{content:${right};}}`;
+        if (String(fp["skip-first"]) === "true") {
+            headerFooterCSS += `@page:first{@bottom-left{content:"";}@bottom-center{content:"";}@bottom-right{content:"";}}`;
+        }
+    }
+    let breakCSS = "";
+    for (const br of layout.breaks) {
+        const before = br.properties?.before ? String(br.properties.before) : "";
+        const keep = br.properties?.keep ? String(br.properties.keep) : "";
+        if (before) {
+            breakCSS += `.it-${escapeHtml(before)}{page-break-before:always;}`;
+        }
+        if (keep) {
+            breakCSS += `.it-${escapeHtml(keep)}{break-inside:avoid;}`;
+        }
+    }
+    let watermarkHtml = "";
+    if (layout.watermark && layout.watermark.content) {
+        const wp = layout.watermark.properties || {};
+        const color = wp.color ? String(wp.color) : "rgba(0,0,0,0.08)";
+        const angle = wp.angle ? String(wp.angle) : "-45";
+        const size = wp.size ? String(wp.size) : "80pt";
+        watermarkHtml = `<div class="it-watermark" style="position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) rotate(${escapeHtml(angle)}deg);font-size:${escapeHtml(size)};color:${escapeHtml(color)};z-index:-1;pointer-events:none;white-space:nowrap;">${escapeHtml(layout.watermark.content)}</div>`;
+    }
+    const pageBlock = layout.page;
+    const printMode = pageBlock?.properties?.["print-mode"]
+        ? String(pageBlock.properties["print-mode"])
+        : "full";
+    const bodyClass = printMode === "minimal-ink" ? "it-print it-print-minimal" : "it-print";
+    let backwardCompatCSS = "";
+    if (!layout.header && pageBlock?.properties?.header) {
+        const h = cssContentValue(String(pageBlock.properties.header));
+        backwardCompatCSS += `@page{@top-center{content:${h};}}`;
+    }
+    if (!layout.footer && pageBlock?.properties?.footer) {
+        const f = cssContentValue(String(pageBlock.properties.footer));
+        backwardCompatCSS += `@page{@bottom-center{content:${f};}}`;
+    }
+    const minimalInkCSS = printMode === "minimal-ink"
+        ? `
+@media print{.it-print-minimal *{background-color:transparent !important;color:black !important;}.it-print-minimal strong,.it-print-minimal b{font-weight:bold;color:black !important;}.it-print-minimal em,.it-print-minimal i{font-style:italic;color:black !important;}.it-print-minimal .it-border{border:1px solid black !important;}}`
+        : "";
+    return `<!DOCTYPE html><html ${direction}><head><meta charset="utf-8"><style>
+${dynamicCSS}
+${document_css_1.DOCUMENT_CSS}
+${themeCSS}
+${documentStyleCSS(doc)}
+/* Print: the page box is handled by @page margins, so neutralise the screen
+   document container's own max-width/centering/padding. */
+.intent-document{max-width:none;margin:0;padding:0;}
+${headerFooterCSS}
+${backwardCompatCSS}
+${breakCSS}
+${minimalInkCSS}
+@page{counter-increment:page;}
+@media print{body{margin:0;}.it-page-break{page-break-after:always;}.it-no-print{display:none;}a{text-decoration:none;color:inherit;}}
+body.it-print{color:#000;background:#fff;}
+body.it-print h1{font-size:1.8em;margin-bottom:0.3em;}
+body.it-print h2{font-size:1.3em;margin-top:1.5em;}
+body.it-print h3{font-size:1.1em;}
+body.it-print p{margin:0 0 0.8em 0;orphans:3;widows:3;}
+body.it-print table{width:100%;border-collapse:collapse;margin:1em 0;}
+body.it-print th{border-bottom:2px solid #000;padding:4pt 8pt;text-align:left;}
+body.it-print td{border-bottom:1px solid #ccc;padding:4pt 8pt;}
+/* Keep table rows whole across page breaks so they aren't clipped behind the
+   running footer/header, and repeat the table header on every page. */
+body.it-print tr{break-inside:avoid;page-break-inside:avoid;}
+body.it-print thead{display:table-header-group;}
+body.it-print tfoot{display:table-footer-group;}
+/* Sections may legitimately span pages; only avoid splitting their headings. */
+body.it-print section{break-inside:auto;}
+body.it-print h1,body.it-print h2,body.it-print h3{break-after:avoid;page-break-after:avoid;}
+body.it-print .intent-callout{border-left:3pt solid #000;padding-left:10pt;margin:1em 0;}
+body.it-print .intent-quote{font-style:italic;margin:1em 2em;}
+body.it-print .it-byline{font-size:0.9em;color:#333;margin-bottom:1.5em;}
+body.it-print .it-byline .it-byline-author{font-weight:bold;display:block;}
+body.it-print .it-byline .it-byline-meta{font-size:0.85em;color:#666;}
+body.it-print .it-epigraph{font-style:italic;text-align:center;margin:2em 3em;border:none;padding:0;}
+body.it-print .it-epigraph .it-epigraph-by{display:block;text-align:right;font-size:0.9em;margin-top:0.5em;}
+body.it-print .it-caption{font-size:0.85em;font-style:italic;text-align:center;color:#444;margin-top:0.3em;margin-bottom:1em;}
+body.it-print .it-dedication{font-style:italic;text-align:center;margin:4em auto;page-break-after:always;}
+body.it-print .it-toc{margin:2em 0;}
+body.it-print .it-toc ol{list-style:none;padding:0;}
+body.it-print .it-toc li{margin:0.3em 0;}
+body.it-print .it-footnotes{border-top:1pt solid #ccc;margin-top:2em;padding-top:0.5em;font-size:0.85em;}
+body.it-print .it-footnotes ol{padding-left:1.5em;margin:0;}
+body.it-print .it-footnotes li{margin:0.3em 0;}
+body.it-print sup.it-fn-ref{font-size:0.7em;vertical-align:super;}
+body.it-print .it-page-break{page-break-after:always;break-after:page;height:0;}
+body.it-print .intent-task-checkbox{display:none;}
+body.it-print .intent-task::before{content:"\\2610 ";margin-right:4pt;}
+body.it-print .intent-task-done::before{content:"\\2611 ";}
+/* ── v2.11 Print ───────────────────────────────────────── */
+body.it-print .it-ref-card{border:none;padding:0;margin:0.5em 0;font-style:italic;}
+body.it-print .it-def{margin:0.3em 0;}
+body.it-print .it-def-term{font-weight:bold;}
+body.it-print .it-def-meaning{padding-left:1.5em;}
+body.it-print .it-metric{border:1pt solid #ccc;padding:6pt 10pt;display:inline-block;min-width:100pt;margin:4pt;vertical-align:top;}
+body.it-print .it-amendment{border:2pt solid #000;padding:8pt 12pt;margin:1em 0;}
+body.it-print .it-amendment-ref{border:1pt solid #000;color:#000;}
+body.it-print .it-figure{margin:1em 0;text-align:center;}
+body.it-print .it-figure img{max-width:100%;border:1pt solid #ccc;}
+body.it-print .it-figure-caption{font-size:0.85em;font-style:italic;text-align:center;margin-top:0.3em;}
+body.it-print .it-signline{display:inline-block;width:45%;margin:2em 2%;vertical-align:top;}
+body.it-print .it-signline-rule{border-bottom:1pt solid #000;margin-bottom:4pt;}
+body.it-print .it-contact{border:none;padding:0;margin:0.3em 0;}
+body.it-print .it-deadline{border-left:3pt solid #000;padding-left:8pt;margin:0.5em 0;}
+body.it-print .it-deadline-date{font-weight:bold;text-decoration:underline;}
+</style></head><body class="${bodyClass}"><div class="intent-document">${watermarkHtml}${html}</div></body></html>`;
+}