const COMPARATOR_VERSION = 1;
const CANONICAL_VERSION = 1;

export class ArchitectureDeltaError extends Error {
  constructor(code, message, details = {}) {
    super(message);
    this.name = 'ArchitectureDeltaError';
    this.code = code;
    this.details = details;
  }
}

const codepointOrder = (left, right) => (left < right ? -1 : left > right ? 1 : 0);
const sorted = (values) => [...values].sort((left, right) => codepointOrder(String(left), String(right)));

function canonical(value) {
  if (Array.isArray(value)) return `[${value.map(canonical).join(',')}]`;
  if (value && typeof value === 'object') {
    return `{${Object.keys(value).sort(codepointOrder).map((key) => `${JSON.stringify(key)}:${canonical(value[key])}`).join(',')}}`;
  }
  return JSON.stringify(value);
}

const equal = (left, right) => canonical(left) === canonical(right);

function sortedObjects(values) {
  return [...values].sort((left, right) => codepointOrder(canonical(left), canonical(right)));
}

function sortedBy(values, keyFor) {
  return [...values].sort((left, right) => codepointOrder(String(keyFor(left)), String(keyFor(right))));
}

function normalizeRepository(repository) {
  if (!repository) return undefined;
  return {
    url: String(repository.url || '').trim().replace(/\.git\/?$/i, '').replace(/\/$/, '').toLowerCase(),
    revision: String(repository.revision || '').toLowerCase(),
  };
}

function normalizeComponent(component) {
  return {
    ...component,
    ...(Array.isArray(component.sources) ? { sources: sortedObjects(component.sources) } : {}),
  };
}

function normalizeBoundary(boundary) {
  return { ...boundary, wraps: sorted(boundary.wraps || []) };
}

export function canonicalArchitecture(diagram) {
  const meta = { ...(diagram.meta || {}) };
  delete meta.output;
  if (meta.repository) meta.repository = normalizeRepository(meta.repository);
  return {
    schema_version: diagram.schema_version,
    diagram_type: diagram.diagram_type,
    meta,
    ...(diagram.layout ? { layout: diagram.layout } : {}),
    components: sortedBy((diagram.components || []).map(normalizeComponent), (component) => component.id),
    boundaries: sortedBy((diagram.boundaries || []).map(normalizeBoundary), boundaryKey),
    connections: sortedBy(diagram.connections || [], (connection) => connection.id || ''),
    ...(diagram.cards ? { cards: diagram.cards } : {}),
  };
}

export function canonicalArchitectureJson(diagram) {
  return canonical(canonicalArchitecture(diagram));
}

function fail(code, message, details) {
  throw new ArchitectureDeltaError(code, message, details);
}

function requireComparableShape(diagram, side) {
  if (diagram?.schema_version !== 1) {
    fail('delta/schema-version-mismatch', `${side} must use schema_version 1.`, { side, path: '/schema_version', actual: diagram?.schema_version });
  }
  if (diagram?.diagram_type !== 'architecture') {
    fail('delta/type-mismatch', `${side} must use diagram_type architecture.`, { side, path: '/diagram_type', actual: diagram?.diagram_type });
  }
}

function stableIndex(items, collection, side, missingCode = 'delta/stable-id-required') {
  const index = new Map();
  const missing = [];
  const duplicates = [];
  (items || []).forEach((item, itemIndex) => {
    if (!item?.id) missing.push(`/${collection}/${itemIndex}/id`);
    else if (index.has(item.id)) duplicates.push(item.id);
    else index.set(item.id, item);
  });
  if (missing.length) {
    fail(missingCode, `${side} ${collection} require authored stable ids for comparison.`, {
      side,
      paths: sorted(missing),
      supportedFixes: [`add a unique id to every ${collection} item`],
    });
  }
  if (duplicates.length) {
    fail('delta/duplicate-stable-id', `${side} ${collection} contain duplicate ids.`, {
      side,
      collection,
      ids: sorted(new Set(duplicates)),
      supportedFixes: [`make every ${collection} id unique`],
    });
  }
  return index;
}

const boundaryKey = (boundary) => `${boundary.kind}\u001f${boundary.label}`;

function boundaryIndex(boundaries, side) {
  const index = new Map();
  const ambiguous = [];
  for (const boundary of boundaries || []) {
    const key = boundaryKey(boundary);
    if (index.has(key)) ambiguous.push(`${boundary.kind}:${boundary.label}`);
    else index.set(key, boundary);
  }
  if (ambiguous.length) {
    fail('delta/boundary-key-ambiguous', `${side} boundary kind + label keys must be unique.`, {
      side,
      boundaries: sorted(new Set(ambiguous)),
      supportedFixes: ['rename one duplicate boundary or add stable boundary ids in a future schema version'],
    });
  }
  return index;
}

function normalizedField(item, field) {
  const value = item?.[field];
  if (field === 'sources' && Array.isArray(value)) return sortedObjects(value);
  if (field === 'wraps' && Array.isArray(value)) return sorted(value);
  return value;
}

function fieldChanges(before, after, groups) {
  const classifications = [];
  const changedFields = [];
  for (const [classification, fields] of Object.entries(groups)) {
    const changed = fields.filter((field) => !equal(normalizedField(before, field), normalizedField(after, field)));
    if (changed.length) classifications.push(classification);
    changedFields.push(...changed.map((field) => `/${field}`));
  }
  return { classifications: sorted(classifications), changedFields: sorted(changedFields) };
}

const COMPONENT_FIELDS = {
  semantic: ['type', 'label', 'sublabel', 'tag'],
  evidence: ['sources'],
  geometry: ['row', 'col', 'pos', 'size'],
};
const CONNECTION_FIELDS = {
  topology: ['from', 'to'],
  semantic: ['label', 'variant'],
  geometry: ['fromSide', 'toSide', 'route', 'via', 'labelAt', 'labelDx', 'labelDy', 'labelSegment', 'width'],
};
const BOUNDARY_FIELDS = { scope: ['wraps'], geometry: ['pad'] };

function statusFor(classifications, kind) {
  if (classifications.some((value) => ['topology', 'semantic', 'scope'].includes(value))) return 'changed';
  if (classifications.includes('evidence')) return 'evidence-changed';
  if (classifications.includes('geometry')) return kind === 'connection' ? 'rerouted' : kind === 'component' ? 'moved' : 'geometry-changed';
  return 'same';
}

function compareEntities(baseIndex, headIndex, kind, groups, describe) {
  const changes = [];
  const identityClassification = kind === 'connection' ? 'topology' : kind === 'boundary' ? 'scope' : 'semantic';
  for (const id of sorted(new Set([...baseIndex.keys(), ...headIndex.keys()]))) {
    const base = baseIndex.get(id);
    const head = headIndex.get(id);
    if (!base) changes.push({ ...describe(id, undefined, head), status: 'added', classifications: [identityClassification], changedFields: [] });
    else if (!head) changes.push({ ...describe(id, base, undefined), status: 'removed', classifications: [identityClassification], changedFields: [] });
    else {
      const fields = fieldChanges(base, head, groups);
      const status = statusFor(fields.classifications, kind);
      if (status !== 'same') changes.push({ ...describe(id, base, head), status, ...fields });
    }
  }
  return changes;
}

function summaryFor(changes, shape) {
  const summary = Object.fromEntries(shape.map((key) => [key, 0]));
  for (const change of changes) {
    const key = change.status.replace(/-([a-z])/g, (_all, letter) => letter.toUpperCase());
    if (Object.hasOwn(summary, key)) summary[key] += 1;
  }
  return summary;
}

function presentationChanged(base, head) {
  const basePresentation = {
    title: base.meta?.title,
    subtitle: base.meta?.subtitle,
    animation: base.meta?.animation,
    visual_preset: base.meta?.visual_preset,
    quality_profile: base.meta?.quality_profile,
    engineering_profile: base.meta?.engineering_profile,
    legend: base.meta?.legend,
    views: base.meta?.views,
    viewBox: base.meta?.viewBox,
    layout: base.layout,
    cards: base.cards,
  };
  const headPresentation = {
    title: head.meta?.title,
    subtitle: head.meta?.subtitle,
    animation: head.meta?.animation,
    visual_preset: head.meta?.visual_preset,
    quality_profile: head.meta?.quality_profile,
    engineering_profile: head.meta?.engineering_profile,
    legend: head.meta?.legend,
    views: head.meta?.views,
    viewBox: head.meta?.viewBox,
    layout: head.layout,
    cards: head.cards,
  };
  return !equal(basePresentation, headPresentation);
}

export function compareArchitecture(base, head, evidence = {}) {
  requireComparableShape(base, 'base');
  requireComparableShape(head, 'head');
  const baseComponents = stableIndex(base.components, 'components', 'base');
  const headComponents = stableIndex(head.components, 'components', 'head');
  const shared = sorted([...baseComponents.keys()].filter((id) => headComponents.has(id)));
  if (!shared.length) {
    fail('delta/no-shared-component-id', 'The snapshots share no component id, so Archify cannot prove that they describe the same system.', {
      supportedFixes: ['preserve at least one authored component id across snapshots'],
    });
  }

  const baseConnections = stableIndex(base.connections, 'connections', 'base', 'delta/relationship-id-required');
  const headConnections = stableIndex(head.connections, 'connections', 'head', 'delta/relationship-id-required');
  const baseBoundaries = boundaryIndex(base.boundaries, 'base');
  const headBoundaries = boundaryIndex(head.boundaries, 'head');

  const baseRepository = normalizeRepository(base.meta?.repository);
  const headRepository = normalizeRepository(head.meta?.repository);
  if (baseRepository && headRepository && baseRepository.url !== headRepository.url) {
    fail('delta/repository-mismatch', 'The snapshots name different repositories.', {
      baseRepository: baseRepository.url,
      headRepository: headRepository.url,
      supportedFixes: ['compare snapshots from the same repository or remove repository evidence from both inputs'],
    });
  }
  const proofLevel = baseRepository && headRepository
    && evidence.baseVerified && evidence.headVerified
    && /^[a-f0-9]{40}$/.test(baseRepository.revision)
    && /^[a-f0-9]{40}$/.test(headRepository.revision)
    ? 'revision-pinned'
    : 'authored';

  const components = compareEntities(baseComponents, headComponents, 'component', COMPONENT_FIELDS, (id, before, after) => ({
    id,
    baseLabel: before?.label,
    headLabel: after?.label,
  }));
  const connections = compareEntities(baseConnections, headConnections, 'connection', CONNECTION_FIELDS, (id, before, after) => ({
    id,
    ...(before ? { base: { from: before.from, to: before.to, label: before.label || '' } } : {}),
    ...(after ? { head: { from: after.from, to: after.to, label: after.label || '' } } : {}),
  }));
  const boundaries = compareEntities(baseBoundaries, headBoundaries, 'boundary', BOUNDARY_FIELDS, (_key, before, after) => ({
    key: `${(after || before).kind}:${(after || before).label}`,
    kind: (after || before).kind,
    label: (after || before).label,
  }));
  const provenanceChanged = !equal(baseRepository, headRepository);

  return {
    schemaVersion: 1,
    ok: true,
    command: 'compare',
    type: 'architecture',
    comparatorVersion: COMPARATOR_VERSION,
    canonicalVersion: CANONICAL_VERSION,
    completeness: 'complete',
    proofLevel,
    base: {
      title: base.meta?.title || '',
      ...(evidence.baseRawSha256 ? { rawSha256: evidence.baseRawSha256 } : {}),
      ...(evidence.baseSemanticSha256 ? { semanticSha256: evidence.baseSemanticSha256 } : {}),
      ...(Number.isInteger(evidence.baseBytes) ? { bytes: evidence.baseBytes } : {}),
      ...(baseRepository?.revision ? { revision: baseRepository.revision } : {}),
    },
    head: {
      title: head.meta?.title || '',
      ...(evidence.headRawSha256 ? { rawSha256: evidence.headRawSha256 } : {}),
      ...(evidence.headSemanticSha256 ? { semanticSha256: evidence.headSemanticSha256 } : {}),
      ...(Number.isInteger(evidence.headBytes) ? { bytes: evidence.headBytes } : {}),
      ...(headRepository?.revision ? { revision: headRepository.revision } : {}),
    },
    summary: {
      components: summaryFor(components, ['added', 'changed', 'evidenceChanged', 'removed', 'moved']),
      connections: summaryFor(connections, ['added', 'changed', 'removed', 'rerouted']),
      boundaries: summaryFor(boundaries, ['added', 'changed', 'removed', 'geometryChanged']),
      presentationChanged: presentationChanged(base, head),
      provenanceChanged,
    },
    changes: { components, connections, boundaries },
    identity: {
      components: 'components[].id',
      connections: 'connections[].id (required)',
      boundaries: 'boundaries[].kind + boundaries[].label (derived)',
    },
    view: { visualPreset: head.meta?.visual_preset || 'classic' },
    limitations: [
      'Authored Architecture IR only; no runtime impact, causality, risk, or mergeability is inferred.',
      'Boundary identity is conservatively derived from kind + label.',
    ],
  };
}

function esc(value) {
  return String(value ?? '').replaceAll('&', '&amp;').replaceAll('<', '&lt;').replaceAll('>', '&gt;').replaceAll('"', '&quot;').replaceAll("'", '&#39;');
}

const safeJson = (value) => JSON.stringify(value, null, 2).replaceAll('<', '\\u003c').replaceAll('>', '\\u003e').replaceAll('&', '\\u0026');

export function extractArchitectureSvg(html) {
  const match = html.match(/<svg viewBox="0 0 [^"]+" role="img"[\s\S]*?<\/svg>/);
  if (!match) fail('delta/svg-missing', 'A validated Architecture artifact did not contain its primary SVG.');
  return match[0];
}

export function extractArtifactCss(html) {
  const match = html.match(/<style>([\s\S]*?)<\/style>/);
  if (!match) fail('delta/css-missing', 'A validated Architecture artifact did not contain its stylesheet.');
  return match[1];
}

function changeMap(changes) {
  return new Map(changes.map((change) => [change.id, change]));
}

function boundaryChangeMap(changes) {
  return new Map(changes.map((change) => [`${change.kind}:${esc(change.label)}`, change]));
}

function addState(tag, change, side, forcedState) {
  const append = (attributes) => tag.endsWith('/>')
    ? tag.replace(/\/>$/, `${attributes}/>`)
    : tag.replace(/>$/, `${attributes}>`);
  if (!change && !forcedState) return append(' data-delta-state="same"');
  let state = forcedState || change.status;
  if (change?.status === 'added' && side === 'base') state = 'same';
  if (change?.status === 'removed' && side === 'head') state = 'same';
  const classes = change?.classifications?.join(',') || '';
  return append(` data-delta-state="${esc(state)}"${classes ? ` data-delta-classifications="${esc(classes)}"` : ''}`);
}

function markerFor(state) {
  return ({ added: '+', removed: '−', changed: '~', moved: '↔', 'moved-from': '↔', rerouted: '↔', 'geometry-changed': '↔', 'evidence-changed': 'E' })[state] || '';
}

function addNodeMarker(group, state) {
  const symbol = markerFor(state);
  if (!symbol) return group;
  const box = group.match(/<rect x="([^"]+)" y="([^"]+)" width="([^"]+)"/);
  if (!box) return group;
  const x = Number(box[1]) + Number(box[3]) - 9;
  const y = Number(box[2]) + 9;
  return group.replace(/<\/g>$/, `\n          <g class="delta-node-marker" aria-hidden="true"><circle cx="${x}" cy="${y}" r="8"/><text x="${x}" y="${y + 3}" text-anchor="middle">${symbol}</text></g>\n        </g>`);
}

function prefixSvgIds(svg, prefix) {
  const ids = [...svg.matchAll(/\sid="([^"]+)"/g)].map((match) => match[1]);
  let result = svg.replace(/(\s)id="([^"]+)"/g, (_match, space, id) => `${space}id="${prefix}-${id}"`);
  for (const id of ids) {
    result = result.replaceAll(`url(#${id})`, `url(#${prefix}-${id})`).replaceAll(`href="#${id}"`, `href="#${prefix}-${id}"`);
  }
  result = result.replace(/aria-labelledby="([^"]+)"/g, (_match, value) => `aria-labelledby="${value.split(/\s+/).map((id) => `${prefix}-${id}`).join(' ')}"`);
  return result;
}

function staticize(svg) {
  return svg.replaceAll('tabindex="0" role="button"', 'role="group"').replaceAll(' aria-pressed="false"', '').replaceAll('aria-label="Focus ', 'aria-label="');
}

function nodeGroupRanges(svg) {
  const ranges = [];
  const opener = /<g\s+[^>]*\bdata-node-id="([^"]+)"[^>]*>/g;
  let open;
  while ((open = opener.exec(svg))) {
    const tags = /<\/?g\b[^>]*>/g;
    tags.lastIndex = open.index;
    let depth = 0;
    let tag;
    while ((tag = tags.exec(svg))) {
      depth += tag[0].startsWith('</') ? -1 : 1;
      if (depth === 0) {
        ranges.push({ id: open[1], start: open.index, end: tags.lastIndex });
        opener.lastIndex = tags.lastIndex;
        break;
      }
    }
  }
  return ranges;
}

function transformNodeGroups(svg, transform) {
  const ranges = nodeGroupRanges(svg);
  let cursor = 0;
  const parts = [];
  for (const range of ranges) {
    parts.push(svg.slice(cursor, range.start));
    parts.push(transform(svg.slice(range.start, range.end), range.id));
    cursor = range.end;
  }
  parts.push(svg.slice(cursor));
  return parts.join('');
}

const BOUNDARY_FRAME_RE = /<rect data-graph-role="structural-frame"[^>]*data-composition-frame-kind="([^"]+)"[^>]*data-composition-frame-label="([^"]+)"[^>]*\/>/g;
const BOUNDARY_LABEL_RE = /<g data-graph-role="structural-frame-label"[^>]*data-composition-frame-kind="([^"]+)"[^>]*data-composition-frame-label="([^"]+)"[^>]*>[\s\S]*?<\/g>/g;

function boundaryElements(svg) {
  const collect = (pattern, part) => [...svg.matchAll(pattern)].map((match) => ({
    start: match.index,
    end: match.index + match[0].length,
    markup: match[0],
    key: `${match[1]}:${match[2]}`,
    part,
  }));
  return [
    ...collect(BOUNDARY_FRAME_RE, 'frame'),
    ...collect(BOUNDARY_LABEL_RE, 'label'),
  ].sort((left, right) => left.start - right.start);
}

function transformBoundaryElements(svg, transform) {
  let cursor = 0;
  const parts = [];
  for (const element of boundaryElements(svg)) {
    parts.push(svg.slice(cursor, element.start));
    parts.push(transform(element.markup, element.key, element.part));
    cursor = element.end;
  }
  parts.push(svg.slice(cursor));
  return parts.join('');
}

export function annotateArchitectureSideSvg(svg, receipt, side) {
  const nodes = changeMap(receipt.changes.components);
  const edges = changeMap(receipt.changes.connections);
  const boundaries = boundaryChangeMap(receipt.changes.boundaries);
  let result = transformBoundaryElements(svg, (markup, key, part) => {
    const change = boundaries.get(key);
    if (!change) return markup;
    if (part === 'frame') {
      return addState(markup, change, side)
        .replace(/\/>$/, ` data-delta-boundary-key="${esc(change.key)}"/>`);
    }
    return markup.replace(
      /<text[^>]*>/,
      (tag) => tag.replace(/>$/, ` data-delta-state="${change.status}" data-delta-boundary-state="${change.status}" data-delta-boundary-key="${esc(change.key)}">`),
    );
  });
  result = transformNodeGroups(result, (group, id) => {
    const change = nodes.get(id);
    if ((side === 'base' && change?.status === 'added') || (side === 'head' && change?.status === 'removed')) return group;
    const tagged = group.replace(/^<g[^>]+>/, (tag) => addState(tag, change, side));
    return addNodeMarker(tagged, change?.status);
  });
  result = result.replace(/<(?:path|g)\s+[^>]*\bdata-edge-id="([^"]+)"[^>]*>/g, (tag, id) => addState(tag, edges.get(id), side));
  return prefixSvgIds(staticize(result), side);
}

function elementById(svg, kind, id) {
  const safe = id.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
  if (kind === 'node') {
    const range = nodeGroupRanges(svg).find((candidate) => candidate.id === id);
    return range ? svg.slice(range.start, range.end) : '';
  }
  const path = svg.match(new RegExp(`<path\\s+[^>]*\\bdata-edge-id="${safe}"[^>]*/>`))?.[0] || '';
  const label = svg.match(new RegExp(`<g\\s+[^>]*\\bdata-edge-id="${safe}"[^>]*>[\\s\\S]*?<\\/g>`))?.[0] || '';
  return [path, label].filter(Boolean).join('\n');
}

function forceElementState(markup, state, classifications = []) {
  let result;
  if (markup.includes('data-node-id=')) {
    result = markup.replace(/^<g\s+[^>]*>/, (tag) => addState(tag, { classifications }, 'delta', state));
  } else {
    result = markup
      .replace(/<path\s+[^>]*\bdata-edge-id="[^"]+"[^>]*\/>/g, (tag) => addState(tag, { classifications }, 'delta', state))
      .replace(/<g\s+[^>]*\bdata-edge-id="[^"]+"[^>]*>/g, (tag) => addState(tag, { classifications }, 'delta', state));
  }
  result = result.replace(/\bid="node-/, 'id="base-node-');
  if (markup.includes('data-node-id=')) result = addNodeMarker(result, state);
  return result;
}

function boundaryMarkupByKey(svg, key) {
  return boundaryElements(svg)
    .filter((element) => element.key === key)
    .map((element) => element.markup)
    .join('\n');
}

function boundaryMarkupParts(markup) {
  const parts = { frame: '', label: '' };
  for (const element of boundaryElements(markup)) parts[element.part] = element.markup;
  return parts;
}

function forceBoundaryState(markup, state, key, classifications = []) {
  return markup
    .replace(/^<rect[^>]+\/>/, (tag) => addState(tag, { classifications }, 'delta', state).replace(/\/>$/, ` data-delta-boundary-key="${esc(key)}"/>`))
    .replace(
      /<rect data-graph-role="structural-frame-label-mask"[^>]*\/>/,
      (tag) => addState(tag, { classifications }, 'delta', state)
        .replace(/\/>$/, ` data-delta-boundary-state="${state}" data-delta-boundary-mask-key="${esc(key)}"/>`),
    )
    .replace(/<text[^>]*>/, (tag) => tag.replace(/>$/, ` data-delta-state="${state}" data-delta-boundary-state="${state}" data-delta-boundary-key="${esc(key)}">`));
}

function viewBoxSize(svg) {
  const match = svg.match(/viewBox="0 0 ([\d.]+) ([\d.]+)"/);
  return match ? [Number(match[1]), Number(match[2])] : [0, 0];
}

function edgeSymbolMarkup(markup, state) {
  const symbol = markerFor(state);
  const point = markup.match(/data-composition-points="([\d.-]+),([\d.-]+)/);
  const edgeId = markup.match(/\bdata-edge-id="([^"]+)"/)?.[1];
  if (!symbol || !point) return '';
  return `<text class="delta-edge-marker" data-delta-state="${state}"${edgeId ? ` data-edge-id="${esc(edgeId)}"` : ''} x="${Number(point[1]) + 9}" y="${Number(point[2]) - 7}" aria-hidden="true">${symbol}</text>`;
}

function boundarySymbolMarkup(markup, state) {
  const symbol = markerFor(state);
  const frame = markup.match(/<rect[^>]*\bx="([\d.-]+)"\s+y="([\d.-]+)"\s+width="([\d.-]+)"/);
  if (!symbol || !frame) return '';
  const x = Number(frame[1]) + Number(frame[3]) - 12;
  const y = Number(frame[2]) + 16;
  return `<text class="delta-boundary-marker" data-delta-state="${state}" x="${x}" y="${y}" text-anchor="middle" aria-hidden="true">${symbol}</text>`;
}

export function buildDeltaSvg(baseSvg, headSvg, receipt) {
  const [baseW, baseH] = viewBoxSize(baseSvg);
  const [headW, headH] = viewBoxSize(headSvg);
  const nodes = changeMap(receipt.changes.components);
  const edges = changeMap(receipt.changes.connections);
  const boundaries = boundaryChangeMap(receipt.changes.boundaries);
  const baseNodePhantoms = [];
  const baseEdgePhantoms = [];
  const baseBoundaryFramePhantoms = [];
  const baseBoundaryLabelPhantoms = [];
  const edgeMarkers = [];
  const boundaryMarkers = [];

  for (const change of nodes.values()) {
    if (change.status === 'removed') baseNodePhantoms.push(forceElementState(elementById(baseSvg, 'node', change.id), 'removed', change.classifications));
    else if (change.classifications.includes('geometry')) baseNodePhantoms.push(forceElementState(elementById(baseSvg, 'node', change.id), 'moved-from', change.classifications));
  }
  for (const change of edges.values()) {
    if (change.status === 'removed' || change.classifications.includes('topology')) {
      const phantom = forceElementState(elementById(baseSvg, 'edge', change.id), 'removed', change.classifications);
      baseEdgePhantoms.push(phantom);
      edgeMarkers.push(edgeSymbolMarkup(phantom, 'removed'));
    } else if (change.classifications.includes('geometry')) {
      const phantom = forceElementState(elementById(baseSvg, 'edge', change.id), 'moved-from', change.classifications);
      baseEdgePhantoms.push(phantom);
      edgeMarkers.push(edgeSymbolMarkup(phantom, 'moved-from'));
    }
  }
  for (const change of boundaries.values()) {
    const renderedKey = `${change.kind}:${esc(change.label)}`;
    if (change.status === 'removed') {
      const phantom = forceBoundaryState(boundaryMarkupByKey(baseSvg, renderedKey), 'removed', change.key, change.classifications);
      const parts = boundaryMarkupParts(phantom);
      baseBoundaryFramePhantoms.push(parts.frame);
      baseBoundaryLabelPhantoms.push(parts.label);
      boundaryMarkers.push(boundarySymbolMarkup(phantom, 'removed'));
    }
    else if (change.status === 'changed' || change.status === 'geometry-changed') {
      const phantom = forceBoundaryState(boundaryMarkupByKey(baseSvg, renderedKey), 'moved-from', change.key, change.classifications);
      const parts = boundaryMarkupParts(phantom);
      baseBoundaryFramePhantoms.push(parts.frame);
      baseBoundaryLabelPhantoms.push(parts.label);
    }
  }

  let delta = annotateArchitectureSideSvg(headSvg, receipt, 'head');
  delta = delta.replace(/^<svg[^>]+>/, (tag) => tag.replace(/viewBox="[^"]+"/, `viewBox="0 0 ${Math.max(baseW, headW) + 24} ${Math.max(baseH, headH) + 24}"`));
  delta = delta.replace('        <!-- Boundaries (behind everything) -->', `        <!-- Baseline boundary frame phantoms -->\n${baseBoundaryFramePhantoms.filter(Boolean).join('\n')}\n\n        <!-- Boundaries (behind everything) -->`);
  delta = delta.replace('        <!-- Connection paths (before components for correct z-order) -->', `        <!-- Baseline relationship phantoms -->\n${baseEdgePhantoms.join('\n')}\n\n        <!-- Connection paths (before components for correct z-order) -->`);
  delta = delta.replace('        <!-- Components -->', `        <!-- Baseline boundary label phantoms (below current components) -->\n${baseBoundaryLabelPhantoms.filter(Boolean).join('\n')}\n\n        <!-- Baseline removed and move-from component phantoms -->\n${baseNodePhantoms.join('\n')}\n\n        <!-- Components -->`);

  for (const change of edges.values()) {
    if (change.status === 'added' || change.status === 'changed' || change.status === 'rerouted') {
      const current = elementById(delta, 'edge', change.id);
      edgeMarkers.push(edgeSymbolMarkup(current, change.status === 'changed' && change.classifications.includes('topology') ? 'added' : change.status));
    }
  }
  for (const change of boundaries.values()) {
    if (!['added', 'changed', 'geometry-changed'].includes(change.status)) continue;
    const renderedKey = `${change.kind}:${esc(change.label)}`;
    boundaryMarkers.push(boundarySymbolMarkup(boundaryMarkupByKey(delta, renderedKey), change.status));
  }
  delta = delta.replace('        <!-- Legend -->', `        <!-- Delta relationship symbols -->\n${edgeMarkers.filter(Boolean).join('\n')}\n\n        <!-- Delta boundary symbols -->\n${boundaryMarkers.filter(Boolean).join('\n')}\n\n        <!-- Legend -->`);
  return prefixSvgIds(staticize(delta), 'delta');
}

export function architectureDeltaChangeRows(receipt) {
  const rows = [];
  for (const change of receipt.changes.components) rows.push({ ...change, kind: 'Component', kindKey: 'component', key: `component:${change.id}`, id: change.id });
  for (const change of receipt.changes.connections) rows.push({ ...change, kind: 'Relationship', kindKey: 'relationship', key: `relationship:${change.id}`, id: change.id });
  for (const change of receipt.changes.boundaries) rows.push({ ...change, kind: 'Boundary', kindKey: 'boundary', key: `boundary:${change.key}`, id: change.key });
  return rows.sort((left, right) => codepointOrder(`${left.status}:${left.kind}:${left.id}`, `${right.status}:${right.kind}:${right.id}`));
}

function reviewPrimaryStates(row) {
  if (row.kindKey === 'component' && row.classifications.includes('geometry')) return [row.status, 'moved-from'];
  if (row.kindKey === 'relationship' && row.status === 'changed' && row.classifications.includes('topology')) return ['changed', 'removed'];
  if (row.kindKey === 'relationship' && row.classifications.includes('geometry')) return ['moved-from', row.status];
  if (row.kindKey === 'boundary' && ['changed', 'geometry-changed'].includes(row.status)) return [row.status, 'moved-from'].sort();
  return [row.status];
}

function reviewIdentity(row) {
  const attribute = row.kindKey === 'component' ? 'data-node-id' : row.kindKey === 'relationship' ? 'data-edge-id' : 'data-delta-boundary-key';
  return { attribute, value: esc(row.id) };
}

function reviewTargetTags(deltaMarkup, row) {
  const { attribute, value } = reviewIdentity(row);
  const safeValue = value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
  const identity = new RegExp(`\\b${attribute}="${safeValue}"`);
  return [...deltaMarkup.matchAll(/<([a-z][\w:-]*)\s+[^>]*>/g)]
    .map((match) => ({ name: match[1], tag: match[0] }))
    .filter(({ tag }) => identity.test(tag));
}

function primaryReviewTags(deltaMarkup, row) {
  const tagName = row.kindKey === 'component' ? 'g' : row.kindKey === 'relationship' ? 'path' : 'rect';
  return reviewTargetTags(deltaMarkup, row).filter(({ name }) => name === tagName).map(({ tag }) => tag);
}

function reviewTargetSignature(tags) {
  return tags.map(({ name, tag }) => {
    const state = tag.match(/\bdata-delta-state="([^"]+)"/)?.[1] || '';
    const classifications = tag.match(/\bdata-delta-classifications="([^"]*)"/)?.[1] || '';
    return `${name}:${state}:${classifications}`;
  }).sort(codepointOrder).join('|');
}

function expectedReviewTargetSignature(row) {
  const classifications = row.classifications.join(',');
  const descriptors = [];
  if (row.kindKey === 'component') {
    for (const state of reviewPrimaryStates(row)) descriptors.push(`g:${state}:${classifications}`);
  } else if (row.kindKey === 'boundary') {
    for (const state of reviewPrimaryStates(row)) {
      descriptors.push(`rect:${state}:${classifications}`, `text:${state}:`);
    }
  } else {
    const forms = row.status === 'added'
      ? [{ state: 'added', marker: 'added', label: row.head?.label }]
      : row.status === 'removed'
        ? [{ state: 'removed', marker: 'removed', label: row.base?.label }]
        : row.classifications.includes('topology')
          ? [
              { state: 'removed', marker: 'removed', label: row.base?.label },
              { state: 'changed', marker: 'added', label: row.head?.label },
            ]
          : row.classifications.includes('geometry')
            ? [
                { state: 'moved-from', marker: 'moved-from', label: row.base?.label },
                { state: row.status, marker: row.status, label: row.head?.label },
              ]
            : [{ state: 'changed', marker: 'changed', label: row.head?.label }];
    for (const form of forms) {
      descriptors.push(`path:${form.state}:${classifications}`, `text:${form.marker}:`);
      if (form.label) descriptors.push(`g:${form.state}:${classifications}`);
    }
  }
  return descriptors.sort(codepointOrder).join('|');
}

const total = (summary, key) => summary.components[key] + summary.connections[key] + summary.boundaries[key];

export function renderArchitectureDeltaHtml({ receipt, baseSvg, deltaSvg, headSvg, baseHtml = '', headHtml = '', artifactCss }) {
  const rows = architectureDeltaChangeRows(receipt);
  const changed = total(receipt.summary, 'changed');
  const proof = receipt.proofLevel === 'revision-pinned' ? 'REVISION-PINNED INPUTS' : 'AUTHORED SNAPSHOTS';
  const rowHtml = rows.length ? rows.map((row, index) => {
    const label = row.headLabel || row.baseLabel || row.head?.label || row.base?.label || row.label || row.id;
    const targetSignature = expectedReviewTargetSignature(row);
    return `<li data-change-status="${esc(row.status)}"><button class="change-row" type="button" data-change-index="${index}" data-change-key="${esc(row.key)}" data-change-kind="${esc(row.kindKey)}" data-change-id="${esc(row.id)}" data-change-label="${esc(label)}" data-change-status="${esc(row.status)}" data-change-classifications="${esc(row.classifications.join(', '))}" data-change-target-signature="${esc(targetSignature)}"><span class="token">${esc(markerFor(row.status) || '~')}</span><span>${esc(row.kind)}</span><strong>${esc(label)}</strong><code>${esc(row.id)}</code><span>${esc(row.classifications.join(', '))}</span><span>${esc(row.changedFields.join(', ') || 'identity')}</span></button></li>`;
  }).join('\n') : '<li class="empty">No authored architecture changes.</li>';
  const baseView = baseHtml
    ? `<iframe class="snapshot-frame" title="Before architecture explorer" srcdoc="${esc(baseHtml)}"></iframe>`
    : baseSvg;
  const headView = headHtml
    ? `<iframe class="snapshot-frame" title="After architecture explorer" srcdoc="${esc(headHtml)}"></iframe>`
    : headSvg;
  const html = `<!doctype html>
<html lang="en" data-theme="dark" data-preset="${esc(receipt.view.visualPreset)}">
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>${esc(receipt.head.title)} Architecture Delta</title>
<style>
${artifactCss}
:root{color-scheme:dark;--d-add:#34d399;--d-remove:#fb7185;--d-change:#fbbf24;--d-move:#7dd3fc;--d-focus:#7dd3fc;--d-ink:#e6edf5;--d-muted:#8aa0b5;--d-line:#25384a}
*{box-sizing:border-box}body{margin:0;overflow-x:hidden;background:#071019;color:var(--d-ink);font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace}.proof-page{width:min(1600px,calc(100vw - 64px));margin:auto;padding:30px 0 42px}.proof-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:end;padding-bottom:20px;border-bottom:1px solid var(--d-line)}.eyebrow{margin:0 0 8px;color:#7dd3fc;font:700 11px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em}.proof-head h1{margin:0;font-size:clamp(32px,4vw,56px);line-height:.96;letter-spacing:-.04em}.subtitle{margin:12px 0 0;color:var(--d-muted);font-size:14px}.metrics{display:flex;gap:9px}.metric{min-width:86px;padding:11px 13px;border:1px solid var(--d-line);border-radius:8px;background:#0b1722}.metric strong{display:block;font:700 23px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.metric span{display:block;margin-top:6px;color:var(--d-muted);font:700 9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em}.add strong{color:var(--d-add)}.remove strong{color:var(--d-remove)}.change strong{color:var(--d-change)}
.proof-tools{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:16px 0 10px}.view-switch{display:inline-flex;padding:3px;border:1px solid var(--d-line);border-radius:8px;background:#0a141e}.view-switch button,.utility,.review-step{border:0;border-radius:6px;background:transparent;color:var(--d-muted);padding:8px 14px;font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;cursor:pointer}.view-switch button[aria-selected="true"]{background:#173047;color:#fff}.utility{border:1px solid var(--d-line)}.view-switch button:focus-visible,.utility:focus-visible,.review-step:focus-visible,.change-row:focus-visible{outline:2px solid var(--d-focus);outline-offset:2px}.utility:disabled,.review-step:disabled{cursor:not-allowed;opacity:.45}.legend{display:flex;gap:16px;color:var(--d-muted);font:650 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.legend span{display:inline-flex;align-items:center;gap:6px}.legend i{width:22px;border-top:3px solid currentColor}.legend .add{color:var(--d-add)}.legend .remove{color:var(--d-remove)}.legend .remove i{border-top-style:dashed}.legend .change{color:var(--d-change)}.legend .change i{border-top-style:dotted}.legend .move{color:var(--d-move)}.legend .move i{border-top-style:double}
.review-strip{display:grid;grid-template-columns:auto auto auto auto minmax(0,1fr);align-items:center;gap:5px;margin:0 0 10px;padding:7px 8px;border-block:1px solid var(--d-line);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.review-step{min-height:34px;border:1px solid var(--d-line);padding-inline:11px}.review-step[aria-pressed="true"]{border-color:var(--d-focus);color:var(--d-ink)}.review-status{min-width:0;padding-left:9px;color:var(--d-muted);font-size:10px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.review-status strong{color:var(--d-ink);font-weight:750}.review-status[data-state="unavailable"]{color:var(--d-remove)}
.canvas{overflow:hidden;border:1px solid var(--d-line);border-radius:10px;background:#09141e;padding:12px;min-height:520px}.canvas svg{display:block;width:100%;height:auto;max-height:72vh}.canvas[hidden]{display:none}.snapshot-frame{display:block;width:100%;height:min(76vh,920px);min-height:620px;border:0;border-radius:6px;background:#071019}.canvas[data-view="base"],.canvas[data-view="head"]{padding:0}.canvas[data-view="delta"] [data-delta-state="same"]{opacity:.38}.canvas[data-delta-review-active]{--review-same-opacity:.14;--review-change-opacity:.28}.canvas[data-delta-review-active] [data-delta-state="same"]{opacity:var(--review-same-opacity)!important}.canvas[data-delta-review-active] [data-delta-state]:not([data-delta-state="same"]):not([data-delta-review-current]){opacity:var(--review-change-opacity)!important}.canvas[data-delta-review-active] [data-delta-review-current]{opacity:1!important;transition:opacity .16s ease-out}g[data-node-id][data-delta-state="added"]>rect:last-of-type{stroke:var(--d-add)!important;stroke-width:3!important}g[data-node-id][data-delta-state="removed"]>rect:last-of-type{stroke:var(--d-remove)!important;stroke-width:3!important;stroke-dasharray:7 5}g[data-node-id][data-delta-state="changed"]>rect:last-of-type{stroke:var(--d-change)!important;stroke-width:3!important;stroke-dasharray:2 3}g[data-node-id][data-delta-state="moved"]>rect:last-of-type,g[data-node-id][data-delta-state="moved-from"]>rect:last-of-type{stroke:var(--d-move)!important;stroke-width:3!important;stroke-dasharray:8 3 2 3}g[data-node-id][data-delta-state="moved-from"],path[data-delta-state="moved-from"]{opacity:.42}path[data-delta-state="added"]{stroke:var(--d-add)!important;stroke-width:3!important}path[data-delta-state="removed"]{stroke:var(--d-remove)!important;stroke-width:3!important;stroke-dasharray:7 5!important}path[data-delta-state="changed"]{stroke:var(--d-change)!important;stroke-width:3!important;stroke-dasharray:2 3!important}path[data-delta-state="rerouted"],path[data-delta-state="moved-from"]{stroke:var(--d-move)!important;stroke-width:2.5!important;stroke-dasharray:8 3 2 3!important}.delta-node-marker circle{fill:#071019;stroke:currentColor;stroke-width:1.5}.delta-node-marker text,.delta-edge-marker,.delta-boundary-marker{fill:currentColor;font:800 9px ui-monospace,SFMono-Regular,Menlo,monospace}[data-delta-state="added"] .delta-node-marker,.delta-edge-marker[data-delta-state="added"],.delta-boundary-marker[data-delta-state="added"]{color:var(--d-add)}[data-delta-state="removed"] .delta-node-marker,.delta-edge-marker[data-delta-state="removed"],.delta-boundary-marker[data-delta-state="removed"]{color:var(--d-remove)}[data-delta-state="changed"] .delta-node-marker,.delta-edge-marker[data-delta-state="changed"],.delta-boundary-marker[data-delta-state="changed"]{color:var(--d-change)}[data-delta-state="moved"] .delta-node-marker,[data-delta-state="moved-from"] .delta-node-marker,.delta-edge-marker[data-delta-state="moved-from"],.delta-edge-marker[data-delta-state="rerouted"],.delta-boundary-marker[data-delta-state="geometry-changed"]{color:var(--d-move)}.delta-edge-marker,.delta-boundary-marker{paint-order:stroke;stroke:#071019;stroke-width:3px}
rect[data-graph-role="structural-frame"][data-delta-state="added"]{stroke:var(--d-add)!important;stroke-width:2.5!important}rect[data-graph-role="structural-frame"][data-delta-state="removed"]{stroke:var(--d-remove)!important;stroke-width:2.5!important;stroke-dasharray:7 5!important}rect[data-graph-role="structural-frame"][data-delta-state="changed"]{stroke:var(--d-change)!important;stroke-width:2.5!important;stroke-dasharray:2 3!important}rect[data-graph-role="structural-frame"][data-delta-state="moved-from"]{stroke:var(--d-move)!important;stroke-width:2!important;stroke-dasharray:8 3 2 3!important;opacity:.42}text[data-delta-boundary-state="added"]{fill:var(--d-add)!important}text[data-delta-boundary-state="removed"]{fill:var(--d-remove)!important}text[data-delta-boundary-state="changed"]{fill:var(--d-change)!important}text[data-delta-boundary-state="moved-from"]{fill:var(--d-move)!important;opacity:.55}
details{margin-top:12px;border:1px solid var(--d-line);border-radius:9px;background:#0a141e}summary{padding:13px 15px;cursor:pointer;font-weight:700}.changes{list-style:none;margin:0;padding:0 8px 8px}.changes li{border-top:1px solid rgba(138,160,181,.16)}.change-row{display:grid;grid-template-columns:30px 90px minmax(140px,1fr) minmax(100px,.7fr) minmax(120px,.8fr) minmax(140px,1.2fr);gap:10px;width:100%;margin:0;padding:9px 7px;border:0;border-radius:5px;background:transparent;color:inherit;font:inherit;font-size:11px;text-align:left;align-items:baseline;cursor:pointer}.change-row:hover{background:rgba(125,211,252,.06)}.change-row[aria-current="step"]{background:rgba(125,211,252,.1);box-shadow:inset 0 0 0 1px var(--d-focus)}.change-row:disabled{cursor:default}.token{font:800 13px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.changes code,.change-row>span:last-child{color:var(--d-muted)}.proof-foot{display:flex;justify-content:space-between;gap:24px;margin-top:14px;color:var(--d-muted);font:650 10px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace}
html[data-theme="dark"] body{background:#071019!important;background-image:none!important}html[data-theme="light"]{color-scheme:light;--d-ink:#10283c;--d-muted:#587187;--d-line:#c8d6e2;--d-focus:#006b8f}html[data-theme="light"] body{background:#eef3f7!important;background-image:none!important;color:var(--d-ink)}html[data-theme="light"] .metric,html[data-theme="light"] .view-switch,html[data-theme="light"] details{background:#fff}html[data-theme="light"] .canvas{background:#f8fbfd}html[data-theme="light"] .view-switch button[aria-selected="true"]{background:#dbeaf5;color:#10283c}html[data-theme="light"] .delta-node-marker circle{fill:#fff}html[data-preset="blueprint"] body{background-image:none!important}
@media(max-width:760px){.proof-page{width:100%;padding:12px}.proof-head{grid-template-columns:1fr;gap:14px;align-items:start}.proof-head h1{font-size:32px}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.metric{min-width:0}.proof-tools{align-items:stretch;flex-wrap:wrap;gap:8px}.view-switch{display:flex;flex:1 1 100%}.view-switch button{flex:1;padding-inline:8px}.legend{flex-wrap:wrap;gap:8px}.proof-tools>div:last-child{margin-left:auto}.review-strip{grid-template-columns:auto auto auto auto}.review-status{grid-column:1/-1;padding:4px 2px 0}.canvas{min-height:0;padding:6px;overflow:auto}.canvas svg{min-width:720px;max-height:none}.snapshot-frame{min-width:720px}.changes{overflow-x:auto}.change-row{min-width:820px}.proof-foot{flex-direction:column;gap:4px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.canvas[data-delta-review-active] [data-delta-review-current]{transition:none!important}}@media print{body{min-width:0;background:#fff;color:#111}.proof-page{width:100%;padding:0}.proof-tools,.review-strip,details{display:none!important}.canvas{display:none!important}.canvas[data-view="delta"]{display:block!important;border:0}.canvas[data-view="delta"] [data-delta-state="same"]{opacity:1!important;transition:none!important}.canvas[data-delta-review-active]{--review-same-opacity:1;--review-change-opacity:1}.canvas[data-delta-review-active] [data-delta-review-current]{opacity:1!important;transition:none!important}.proof-foot{color:#444}}
</style></head>
<body><main class="proof-page"><header class="proof-head"><div><p class="eyebrow">ARCHITECTURE DELTA · ${proof}</p><h1>See what changed<br>before you merge.</h1><p class="subtitle">${esc(receipt.base.title)} → ${esc(receipt.head.title)}</p></div><div class="metrics"><div class="metric add"><strong>${total(receipt.summary, 'added')}</strong><span>ADDED</span></div><div class="metric remove"><strong>${total(receipt.summary, 'removed')}</strong><span>REMOVED</span></div><div class="metric change"><strong>${changed}</strong><span>CHANGED</span></div></div></header>
<div class="proof-tools"><div class="view-switch" role="tablist" aria-label="Architecture snapshot"><button role="tab" data-target="base" aria-selected="false">Before</button><button role="tab" data-target="delta" aria-selected="true">Delta</button><button role="tab" data-target="head" aria-selected="false">After</button></div><div class="legend"><span class="add"><i></i>+ ADD</span><span class="remove"><i></i>− DEL</span><span class="change"><i></i>~ MOD</span><span class="move"><i></i>↔ MOVE</span></div><div><button class="utility" id="export-svg" type="button">Export SVG</button> <button class="utility" id="share-card" type="button">Share Card</button> <button class="utility" id="preset" type="button">Preset</button> <button class="utility" id="theme" type="button">Theme</button></div></div>
<nav class="review-strip" aria-label="Authored change review"><button class="review-step" id="review-overview" type="button" disabled>Overview</button><button class="review-step" id="review-previous" type="button" aria-label="Previous authored change" disabled>←</button><button class="review-step" id="review-play" type="button" aria-pressed="false"${rows.length ? '' : ' disabled'}>Review</button><button class="review-step" id="review-next" type="button" aria-label="Next authored change" disabled>→</button><div class="review-status" id="review-status" role="status" aria-live="polite">Overview · ${rows.length} authored changes</div></nav>
<section class="canvas" data-view="base" hidden>${baseView}</section><section class="canvas" data-view="delta">${deltaSvg}</section><section class="canvas" data-view="head" hidden>${headView}</section>
<details${rows.length <= 10 ? ' open' : ''}><summary>Exact authored changes · ${rows.length}</summary><ul class="changes">${rowHtml}</ul></details>
<footer class="proof-foot"><span>Stable IDs only · completeness: complete · ${proof}</span><span>Authored IR only · no risk or mergeability inference</span></footer></main>
<script id="archify-compare-receipt" type="application/json">${safeJson(receipt)}</script>
<script>(()=>{
  const REVIEW_DWELL_MS = 1400;
  const tabs = [...document.querySelectorAll('[role="tab"]')];
  const views = [...document.querySelectorAll('[data-view]')];
  const deltaCanvas = document.querySelector('[data-view="delta"]');
  const rowButtons = [...document.querySelectorAll('.change-row')];
  const overviewButton = document.querySelector('#review-overview');
  const previousButton = document.querySelector('#review-previous');
  const playButton = document.querySelector('#review-play');
  const nextButton = document.querySelector('#review-next');
  const status = document.querySelector('#review-status');
  const receiptNode = document.querySelector('#archify-compare-receipt');
  const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');
  const exportCss = ${safeJson(artifactCss)};
  let activeIndex = -1;
  let playbackToken = 0;
  let playbackTimer = 0;
  let playing = false;
  let reviewAvailable = false;
  let reviewSources = [];

  function show(id) {
    tabs.forEach((tab) => tab.setAttribute('aria-selected', String(tab.dataset.target === id)));
    views.forEach((view) => { view.hidden = view.dataset.view !== id; });
  }

  function stopPlayback() {
    playbackToken += 1;
    if (playbackTimer) window.clearTimeout(playbackTimer);
    playbackTimer = 0;
    playing = false;
    playButton.setAttribute('aria-pressed', 'false');
    playButton.textContent = activeIndex === rowButtons.length - 1 && rowButtons.length ? 'Replay' : 'Review';
    status.setAttribute('aria-live', 'polite');
  }

  function failReview() {
    stopPlayback();
    reviewAvailable = false;
    activeIndex = -1;
    deltaCanvas?.removeAttribute('data-delta-review-active');
    deltaCanvas?.querySelectorAll('[data-delta-review-current]').forEach((element) => element.removeAttribute('data-delta-review-current'));
    rowButtons.forEach((row) => {
      row.disabled = true;
      row.tabIndex = -1;
      row.removeAttribute('aria-current');
    });
    [overviewButton, previousButton, playButton, nextButton].forEach((button) => { button.disabled = true; });
    status.dataset.state = 'unavailable';
    status.textContent = 'Review unavailable · compare identity mismatch';
  }

  function receiptRows(receipt) {
    const definitions = [
      { collection: 'components', kind: 'component', id: 'id', statuses: ['added', 'changed', 'evidence-changed', 'removed', 'moved'] },
      { collection: 'connections', kind: 'relationship', id: 'id', statuses: ['added', 'changed', 'removed', 'rerouted'] },
      { collection: 'boundaries', kind: 'boundary', id: 'key', statuses: ['added', 'changed', 'removed', 'geometry-changed'] },
    ];
    const rows = [];
    for (const definition of definitions) {
      const changes = receipt.changes[definition.collection];
      if (!Array.isArray(changes)) return null;
      for (const change of changes) {
        if (!change || typeof change !== 'object' || Array.isArray(change)) return null;
        const id = change[definition.id];
        if (typeof id !== 'string' || !id || !definition.statuses.includes(change.status)) return null;
        if (!Array.isArray(change.classifications) || !change.classifications.length || change.classifications.some((value) => typeof value !== 'string')) return null;
        if (new Set(change.classifications).size !== change.classifications.length) return null;
        if (!Array.isArray(change.changedFields) || change.changedFields.some((value) => typeof value !== 'string')) return null;
        rows.push({ ...change, kind: definition.kind, key: definition.kind + ':' + id, id });
      }
    }
    return rows;
  }

  function exactTargets(row) {
    const attribute = row.dataset.changeKind === 'component'
      ? 'data-node-id'
      : row.dataset.changeKind === 'relationship'
        ? 'data-edge-id'
        : 'data-delta-boundary-key';
    return [...deltaCanvas.querySelectorAll('[' + attribute + ']')]
      .filter((element) => element.getAttribute(attribute) === row.dataset.changeId);
  }

  function targetSignature(matches) {
    return matches.map((element) => {
      const tag = element.tagName.toLowerCase();
      const state = element.dataset.deltaState || '';
      const classifications = element.dataset.deltaClassifications || '';
      return tag + ':' + state + ':' + classifications;
    }).sort().join('|');
  }

  function targetsMatch(source, row, matches) {
    if (!source || !matches.length || !row.dataset.changeTargetSignature) return false;
    if (row.dataset.changeKind !== source.kind || row.dataset.changeId !== source.id || row.dataset.changeStatus !== source.status) return false;
    if (row.dataset.changeClassifications !== source.classifications.join(', ')) return false;
    return row.dataset.changeTargetSignature === targetSignature(matches);
  }

  function validateReview() {
    try {
      if (document.querySelectorAll('#archify-compare-receipt').length !== 1 || !receiptNode) return false;
      if (!deltaCanvas || !['base', 'delta', 'head'].every((id) => document.querySelectorAll('[data-view="' + id + '"]').length === 1)) return false;
      if (deltaCanvas.children.length !== 1 || deltaCanvas.firstElementChild?.tagName.toLowerCase() !== 'svg') return false;
      const receipt = JSON.parse(receiptNode.textContent);
      if (!receipt || receipt.schemaVersion !== 1 || receipt.command !== 'compare' || receipt.completeness !== 'complete' || !receipt.changes) return false;
      const sources = receiptRows(receipt);
      if (!sources || sources.length !== rowButtons.length) return false;
      const sourceByKey = new Map(sources.map((source) => [source.key, source]));
      if (sourceByKey.size !== sources.length) return false;
      const seen = new Set();
      const orderedSources = [];
      for (let index = 0; index < rowButtons.length; index += 1) {
        const row = rowButtons[index];
        const source = sourceByKey.get(row.dataset.changeKey);
        if (!source || seen.has(source.key) || row.dataset.changeIndex !== String(index)) return false;
        const matches = exactTargets(row);
        if (!targetsMatch(source, row, matches)) return false;
        seen.add(source.key);
        orderedSources.push(source);
      }
      if (seen.size !== sourceByKey.size) return false;
      reviewSources = orderedSources;
      return true;
    } catch {
      return false;
    }
  }

  function updateControls() {
    overviewButton.disabled = !reviewAvailable || activeIndex < 0;
    previousButton.disabled = !reviewAvailable || activeIndex <= 0;
    nextButton.disabled = !reviewAvailable || activeIndex < 0 || activeIndex >= rowButtons.length - 1;
  }

  function selectChange(index, fromPlayback = false) {
    if (!reviewAvailable || index < 0 || index >= rowButtons.length) return false;
    const row = rowButtons[index];
    const matches = exactTargets(row);
    if (!targetsMatch(reviewSources[index], row, matches)) { failReview(); return false; }
    show('delta');
    deltaCanvas.querySelectorAll('[data-delta-review-current]').forEach((element) => element.removeAttribute('data-delta-review-current'));
    matches.forEach((element) => element.setAttribute('data-delta-review-current', 'true'));
    deltaCanvas.setAttribute('data-delta-review-active', 'true');
    rowButtons.forEach((button, rowIndex) => {
      button.tabIndex = rowIndex === index ? 0 : -1;
      if (rowIndex === index) button.setAttribute('aria-current', 'step');
      else button.removeAttribute('aria-current');
    });
    activeIndex = index;
    updateControls();
    const kind = row.dataset.changeKind.charAt(0).toUpperCase() + row.dataset.changeKind.slice(1);
    status.textContent = String(index + 1).padStart(2, '0') + ' / ' + String(rowButtons.length).padStart(2, '0') + ' · ' + kind + ' · ' + row.dataset.changeLabel + ' [' + row.dataset.changeId + '] · ' + row.dataset.changeClassifications;
    if (fromPlayback) status.setAttribute('aria-live', 'off');
    return true;
  }

  function overview() {
    if (!reviewAvailable) { failReview(); return; }
    stopPlayback();
    activeIndex = -1;
    deltaCanvas.removeAttribute('data-delta-review-active');
    deltaCanvas.querySelectorAll('[data-delta-review-current]').forEach((element) => element.removeAttribute('data-delta-review-current'));
    rowButtons.forEach((row, index) => {
      row.tabIndex = index === 0 ? 0 : -1;
      row.removeAttribute('aria-current');
    });
    show('delta');
    status.removeAttribute('data-state');
    status.textContent = 'Overview · ' + rowButtons.length + ' authored changes';
    updateControls();
  }

  function schedulePlayback(token) {
    if (!playing || token !== playbackToken || activeIndex >= rowButtons.length - 1) {
      if (activeIndex >= rowButtons.length - 1) stopPlayback();
      return;
    }
    playbackTimer = window.setTimeout(() => {
      if (!playing || token !== playbackToken) return;
      if (!selectChange(activeIndex + 1, true)) return;
      schedulePlayback(token);
    }, REVIEW_DWELL_MS);
  }

  function startReview() {
    if (!reviewAvailable) return;
    if (playing) { stopPlayback(); return; }
    stopPlayback();
    if (!selectChange(0, false)) return;
    if (reducedMotion.matches || rowButtons.length < 2) return;
    playing = true;
    const token = ++playbackToken;
    playButton.textContent = 'Pause';
    playButton.setAttribute('aria-pressed', 'true');
    status.setAttribute('aria-live', 'off');
    schedulePlayback(token);
  }

  function canonicalDeltaSvg() {
    const source = deltaCanvas?.querySelector(':scope > svg');
    if (!source) throw new Error('Canonical Delta SVG is unavailable.');
    const clone = source.cloneNode(true);
    clone.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
    clone.removeAttribute('style');
    clone.querySelectorAll('[data-delta-review-current]').forEach((element) => element.removeAttribute('data-delta-review-current'));
    const style = document.createElementNS('http://www.w3.org/2000/svg', 'style');
    style.textContent = exportCss + '\\n' +
      '[data-delta-state="same"]{opacity:.38}' +
      '[data-delta-state="added"]{--delta:#34d399}' +
      '[data-delta-state="removed"]{--delta:#fb7185}' +
      '[data-delta-state="changed"]{--delta:#fbbf24}' +
      '[data-delta-state="moved"],[data-delta-state="moved-from"],[data-delta-state="rerouted"],[data-delta-state="geometry-changed"]{--delta:#7dd3fc}' +
      'g[data-node-id][data-delta-state]:not([data-delta-state="same"])>rect:last-of-type{stroke:var(--delta)!important;stroke-width:3!important}' +
      'path[data-delta-state]:not([data-delta-state="same"]){stroke:var(--delta)!important;stroke-width:3!important}' +
      'rect[data-graph-role="structural-frame"][data-delta-state]:not([data-delta-state="same"]){stroke:var(--delta)!important;stroke-width:2.5!important}' +
      'rect[data-graph-role="structural-frame"][data-delta-state="changed"]{stroke-dasharray:2 3!important}' +
      '[data-delta-state="removed"],[data-delta-state="moved-from"]{stroke-dasharray:7 5!important}' +
      '[data-delta-state="moved-from"]{opacity:.42}' +
      '[data-delta-state]:not([data-delta-state="same"]) .delta-node-marker,.delta-edge-marker[data-delta-state],.delta-boundary-marker[data-delta-state]{color:var(--delta)}' +
      'text[data-delta-boundary-state="added"]{fill:#34d399!important}text[data-delta-boundary-state="removed"]{fill:#fb7185!important}text[data-delta-boundary-state="changed"]{fill:#fbbf24!important}text[data-delta-boundary-state="moved-from"]{fill:#7dd3fc!important;opacity:.55}' +
      '.delta-node-marker circle{fill:#071019;stroke:currentColor;stroke-width:1.5}.delta-node-marker text,.delta-edge-marker,.delta-boundary-marker{fill:currentColor;font:800 9px ui-monospace,SFMono-Regular,Menlo,monospace}';
    clone.insertBefore(style, clone.firstChild);
    return new XMLSerializer().serializeToString(clone);
  }

  function artifactName(suffix) {
    const title = String(JSON.parse(receiptNode.textContent).head.title || 'architecture-delta')
      .toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/^-+|-+$/g, '') || 'architecture-delta';
    return title + suffix;
  }

  function downloadBlob(blob, name) {
    const url = URL.createObjectURL(blob);
    const link = document.createElement('a');
    link.href = url;
    link.download = name;
    document.body.appendChild(link);
    link.click();
    link.remove();
    window.setTimeout(() => URL.revokeObjectURL(url), 1000);
  }

  function recordExport(format, blob, dimensions) {
    document.documentElement.dataset.archifyDeltaExport = JSON.stringify({
      ok: true,
      format,
      bytes: blob.size,
      mime: blob.type,
      ...(dimensions || {}),
    });
  }

  function exportCanonicalSvg() {
    const blob = new Blob([canonicalDeltaSvg()], { type: 'image/svg+xml;charset=utf-8' });
    downloadBlob(blob, artifactName('-architecture-delta.svg'));
    recordExport('svg', blob);
    return blob;
  }

  function loadSvgImage(blob) {
    return new Promise((resolve, reject) => {
      const url = URL.createObjectURL(blob);
      const image = new Image();
      image.onload = () => { URL.revokeObjectURL(url); resolve(image); };
      image.onerror = () => { URL.revokeObjectURL(url); reject(new Error('Could not rasterize canonical Delta SVG.')); };
      image.src = url;
    });
  }

  function pngBlob(canvas) {
    return new Promise((resolve, reject) => canvas.toBlob((blob) => {
      if (blob) resolve(blob);
      else reject(new Error('Canvas returned no Share Card PNG.'));
    }, 'image/png'));
  }

  async function shareCard() {
    const receipt = JSON.parse(receiptNode.textContent);
    const canvas = document.createElement('canvas');
    canvas.width = 1200;
    canvas.height = 630;
    const ctx = canvas.getContext('2d');
    if (!ctx) throw new Error('2D canvas context unavailable for Architecture Delta Share Card.');
    ctx.fillStyle = '#071019';
    ctx.fillRect(0, 0, 1200, 630);
    ctx.fillStyle = '#0b1722';
    ctx.fillRect(34, 28, 1132, 574);
    ctx.strokeStyle = '#25384a';
    ctx.lineWidth = 2;
    ctx.strokeRect(34, 28, 1132, 574);
    ctx.font = '700 18px ui-monospace, SFMono-Regular, Menlo, monospace';
    ctx.fillStyle = '#7dd3fc';
    ctx.fillText('ARCHITECTURE DELTA', 66, 68);
    ctx.font = '700 34px ui-monospace, SFMono-Regular, Menlo, monospace';
    ctx.fillStyle = '#e6edf5';
    const title = String(receipt.head.title || 'Architecture').slice(0, 46) + ' Architecture Delta';
    ctx.fillText(title.slice(0, 58), 66, 112);
    ctx.font = '700 17px ui-monospace, SFMono-Regular, Menlo, monospace';
    ctx.fillStyle = '#8aa0b5';
    const componentLine = 'COMPONENTS  +' + receipt.summary.components.added + '  ~' + receipt.summary.components.changed + '  −' + receipt.summary.components.removed;
    const connectionLine = 'CONNECTIONS  +' + receipt.summary.connections.added + '  ~' + receipt.summary.connections.changed + '  −' + receipt.summary.connections.removed;
    const boundaryLine = 'BOUNDARY SCOPE  +' + receipt.summary.boundaries.added + '  ~' + receipt.summary.boundaries.changed + '  −' + receipt.summary.boundaries.removed;
    ctx.fillText(componentLine, 66, 151);
    ctx.fillText(connectionLine, 420, 151);
    ctx.fillText(boundaryLine, 786, 151);
    ctx.font = '650 14px ui-monospace, SFMono-Regular, Menlo, monospace';
    const authoredChanges = ['components', 'connections', 'boundaries'].reduce((sum, collection) => {
      const summary = receipt.summary[collection];
      return sum + summary.added + summary.changed + summary.removed;
    }, 0);
    const movementSummary = '↔ moved ' + receipt.summary.components.moved + ' · rerouted ' + receipt.summary.connections.rerouted + ' · presentation ' + (receipt.summary.presentationChanged ? 'changed' : 'unchanged');
    const secondary = authoredChanges === 0
      ? 'No authored architecture changes · ' + movementSummary
      : movementSummary;
    ctx.fillText(secondary, 66, 181);
    const proofLine = receipt.proofLevel === 'revision-pinned'
      ? 'REV ' + String(receipt.base.revision).slice(0, 8) + ' → ' + String(receipt.head.revision).slice(0, 8) + ' · REVISION-PINNED INPUTS'
      : 'AUTHORED SNAPSHOTS';
    ctx.textAlign = 'right';
    ctx.fillText(proofLine, 1134, 181);
    ctx.textAlign = 'left';
    ctx.fillStyle = '#09141e';
    ctx.fillRect(66, 206, 1068, 358);
    ctx.strokeStyle = '#25384a';
    ctx.strokeRect(66, 206, 1068, 358);
    const svgBlob = new Blob([canonicalDeltaSvg()], { type: 'image/svg+xml;charset=utf-8' });
    const image = await loadSvgImage(svgBlob);
    const ratio = Math.min(1024 / image.width, 322 / image.height);
    const width = image.width * ratio;
    const height = image.height * ratio;
    ctx.drawImage(image, 600 - width / 2, 385 - height / 2, width, height);
    ctx.font = '650 12px ui-monospace, SFMono-Regular, Menlo, monospace';
    ctx.fillStyle = '#8aa0b5';
    ctx.fillText('Stable authored IDs · static complete Delta · no risk or mergeability inference', 66, 588);
    return pngBlob(canvas);
  }

  async function downloadShareCard() {
    const blob = await shareCard();
    downloadBlob(blob, artifactName('-architecture-delta-share-card.png'));
    recordExport('share-card', blob, { width: 1200, height: 630 });
    return blob;
  }

  window.Archify = window.Archify || {};
  window.Archify.deltaExport = { canonicalSvg: canonicalDeltaSvg, shareCard, exportSvg: exportCanonicalSvg, downloadShareCard };
  window.Archify.exportMenu = {
    shareCard,
    run(format) {
      if (format === 'svg') return exportCanonicalSvg();
      if (format === 'share-card') return downloadShareCard();
      throw new Error('Unknown Architecture Delta export format: ' + format);
    },
  };

  tabs.forEach((tab, index) => {
    tab.addEventListener('click', () => { stopPlayback(); show(tab.dataset.target); });
    tab.addEventListener('keydown', (event) => {
      if (!['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)) return;
      event.preventDefault();
      stopPlayback();
      const next = event.key === 'Home' ? 0 : event.key === 'End' ? tabs.length - 1 : (index + (event.key === 'ArrowRight' ? 1 : -1) + tabs.length) % tabs.length;
      tabs[next].focus();
      show(tabs[next].dataset.target);
    });
  });

  rowButtons.forEach((row, index) => {
    row.tabIndex = index === 0 ? 0 : -1;
    row.addEventListener('click', () => { stopPlayback(); selectChange(index); });
    row.addEventListener('keydown', (event) => {
      if (event.key === 'Enter' || event.key === ' ') {
        event.preventDefault();
        stopPlayback();
        selectChange(index);
        return;
      }
      if (!['ArrowUp', 'ArrowDown', 'Home', 'End'].includes(event.key)) return;
      event.preventDefault();
      stopPlayback();
      const next = event.key === 'Home' ? 0 : event.key === 'End' ? rowButtons.length - 1 : (index + (event.key === 'ArrowDown' ? 1 : -1) + rowButtons.length) % rowButtons.length;
      rowButtons.forEach((button, rowIndex) => { button.tabIndex = rowIndex === next ? 0 : -1; });
      rowButtons[next].focus();
    });
  });

  overviewButton.addEventListener('click', overview);
  previousButton.addEventListener('click', () => { stopPlayback(); selectChange(activeIndex - 1); });
  nextButton.addEventListener('click', () => { stopPlayback(); selectChange(activeIndex + 1); });
  playButton.addEventListener('click', startReview);
  document.addEventListener('focusin', (event) => {
    if (playing && event.target.closest('button')) stopPlayback();
  });
  document.addEventListener('visibilitychange', () => { if (document.hidden) stopPlayback(); });
  window.addEventListener('beforeprint', overview);
  reducedMotion.addEventListener('change', () => { if (reducedMotion.matches) stopPlayback(); });
  document.addEventListener('keydown', (event) => {
    if (event.key === 'Escape' && activeIndex >= 0) {
      event.preventDefault();
      overview();
      playButton.focus();
    }
  });

  document.querySelector('#theme').addEventListener('click', () => { document.documentElement.dataset.theme = document.documentElement.dataset.theme === 'dark' ? 'light' : 'dark'; });
  const presets = ['classic', 'signal-flow', 'blueprint'];
  document.querySelector('#preset').addEventListener('click', () => { const now = document.documentElement.dataset.preset; document.documentElement.dataset.preset = presets[(presets.indexOf(now) + 1) % presets.length]; });
  document.querySelector('#export-svg').addEventListener('click', exportCanonicalSvg);
  document.querySelector('#share-card').addEventListener('click', () => { downloadShareCard().catch((error) => window.alert(error.message)); });

  reviewAvailable = validateReview();
  if (!reviewAvailable) failReview();
  else {
    status.removeAttribute('data-state');
    updateControls();
  }
})();</script></body></html>`;
  return html.replace(/[ \t]+$/gm, '');
}

export function validateArchitectureDeltaHtml(html, receipt) {
  const failures = [];
  const rows = architectureDeltaChangeRows(receipt);
  const deltaMarkup = html.match(/<section class="canvas" data-view="delta">([\s\S]*?)<\/section>/)?.[1] || '';
  const svgTags = [...deltaMarkup.matchAll(/<\/?svg\b[^>]*>/g)];
  let svgDepth = 0;
  let svgRoots = 0;
  let rootStart = -1;
  let rootEnd = -1;
  let svgBalanced = true;
  for (const match of svgTags) {
    if (match[0].startsWith('</')) {
      svgDepth -= 1;
      if (svgDepth < 0) svgBalanced = false;
      if (svgDepth === 0) rootEnd = match.index + match[0].length;
    } else {
      if (svgDepth === 0) {
        svgRoots += 1;
        if (rootStart < 0) rootStart = match.index;
      }
      svgDepth += 1;
    }
  }
  if (!['base', 'delta', 'head'].every((id) => (html.match(new RegExp(`<section class="canvas" data-view="${id}"`, 'g')) || []).length === 1)) failures.push('expected one Before, Delta, and After canvas');
  if ((html.match(/class="snapshot-frame" title="Before architecture explorer"/g) || []).length !== 1
    || (html.match(/class="snapshot-frame" title="After architecture explorer"/g) || []).length !== 1) {
    failures.push('Before and After must preserve one complete architecture explorer each');
  }
  if (!svgBalanced || svgDepth !== 0 || svgRoots !== 1 || deltaMarkup.slice(0, rootStart).trim() || deltaMarkup.slice(rootEnd).trim()) failures.push('expected exactly one root SVG in the Delta canvas');
  if ((html.match(/id="archify-compare-receipt"/g) || []).length !== 1) failures.push('expected exactly one embedded compare receipt');
  if (!html.includes('aria-label="Authored change review"')) failures.push('missing exact-ID change navigator');
  if ((html.match(/class="change-row"/g) || []).length !== rows.length) failures.push('change navigator row count does not match the receipt');
  if (!html.includes('id="export-svg"') || !html.includes('id="share-card"')
    || !html.includes('window.Archify.deltaExport = { canonicalSvg: canonicalDeltaSvg, shareCard')) {
    failures.push('missing canonical Delta SVG or Share Card export contract');
  }
  for (const [index, row] of rows.entries()) {
    const safeKey = esc(row.key).replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
    const rowMatches = [...html.matchAll(new RegExp(`<button class="change-row"[^>]*data-change-key="${safeKey}"[^>]*>`, 'g'))].map((match) => match[0]);
    if (rowMatches.length !== 1) failures.push(`expected exactly one change row ${row.key}`);
    const targets = reviewTargetTags(deltaMarkup, row);
    if (!targets.length) failures.push(`missing Delta identity ${row.key}`);
    if (targets.some(({ tag }) => !/\bdata-delta-state="[^"]+"/.test(tag))) failures.push(`missing Delta target state ${row.key}`);
    const signature = reviewTargetSignature(targets);
    const expectedSignature = expectedReviewTargetSignature(row);
    const storedSignature = rowMatches[0]?.match(/\bdata-change-target-signature="([^"]*)"/)?.[1];
    if (!signature || signature !== expectedSignature || storedSignature !== expectedSignature) failures.push(`ambiguous Delta target signature ${row.key}`);
    if (rowMatches[0]?.match(/\bdata-change-index="([^"]+)"/)?.[1] !== String(index)) failures.push(`incorrect change row order ${row.key}`);
    const primary = primaryReviewTags(deltaMarkup, row);
    const states = primary.map((tag) => tag.match(/\bdata-delta-state="([^"]+)"/)?.[1]).filter(Boolean).sort();
    if (JSON.stringify(states) !== JSON.stringify(reviewPrimaryStates(row).sort())) failures.push(`ambiguous Delta identity ${row.key}`);
    const classifications = row.classifications.join(',');
    if (primary.some((tag) => tag.match(/\bdata-delta-classifications="([^"]*)"/)?.[1] !== classifications)) failures.push(`conflicting Delta classification ${row.key}`);
  }
  // Before/After embed the complete existing explorer runtime. Validate claims
  // made by the Delta shell itself, not implementation vocabulary inside an
  // escaped srcdoc script (for example, "safe scale" in image export code).
  const deltaShell = html.replace(/<iframe\b[^>]*><\/iframe>/g, '');
  if (/\b(?:SAFE|LOW RISK|MERGEABLE|NO IMPACT|VERIFIED PR)\b/i.test(deltaShell)) failures.push('contains a forbidden risk or mergeability claim');
  if (/\b(?:NaN|Infinity)\b/.test(html)) failures.push('contains non-finite output');
  if (receipt.completeness !== 'complete') failures.push('receipt is not complete');
  if (failures.length) fail('delta/artifact-invalid', `Architecture Delta artifact failed validation: ${failures.join('; ')}.`, { failures });
  return { ok: true, checksPassed: 10, checkCount: 10 };
}