@markdy/core 1.3.1 → 1.3.3

package/dist/index.d.ts

@@ -85,6 +85,8 @@ type SceneMeta = {
     explicitHeight?: boolean;
     /** Whether theme was explicitly specified by the author in the script. */
     explicitTheme?: boolean;
+    /** Whether layout direction was explicitly specified by the author in the script. */
+    explicitDirection?: boolean;
     /** Opt-in diagram mode; defaults to architecture. */
     type?: DiagramType;
     /** Playback, controls, interaction, and chrome behavior. Source of truth. */
@@ -376,6 +378,10 @@ type RenderPlan = {
     duration: number;
 };
 
+declare function computeNodeDimensions(decl: NodeDecl, baseW?: number, baseH?: number): {
+    width: number;
+    height: number;
+};
 /**
  * Computes optimal, content-adaptive canvas width and height for a diagram AST
  * when dimensions are omitted or partially specified in the script.
@@ -434,6 +440,7 @@ type PlayerOverrides = {
         playback?: boolean;
     });
     interactiveViewport?: boolean;
+    clickToPlay?: boolean;
     progress?: PlayerProgress;
     progressColor?: string;
 };
@@ -1131,4 +1138,4 @@ interface AutoHealResult {
  */
 declare function autoHealArchitectureDrift(ast: DiagramAST, report: ArchitectureDriftReport, existingFiles?: string[]): AutoHealResult;
 
-export { ARCHITECTURE_RECIPES, ARCH_RULE_PRESETS, type AnnotationDecl, type ArchRuleType, type ArchitectureDriftReport, type ArchitecturePreset, type ArchitectureRecipe, type ArchitectureRecommendation, type ArchitectureRule, type ArchitectureViolation, type AutoHealResult, type AutoRepairResult, BEAT_CUE_KEYWORDS, type BeatDecl, type BeatRange, type Box, type BrokenAnchorDrift, type C4Level, type C4LevelViewExport, type C4ModelReport, type C4NodeMeta, CUE_ALIASES, type CardinalPort, type CodeProvenanceAnchor, type CodeProvenanceDiagnostic, type CodeProvenanceVerificationReport, type Cue, DIAGRAM_TYPES, type Diagnostic, type DiagnosticIssue, type DiagramAST, type DiagramContext, type DiagramDiffResult, type DiagramQualityMetrics, type DiagramType, type DiffChangeType, EDGE_OPERATORS, type EdgeDecl, type EdgeDiff, type EdgeKind, type EdgeSelector, type ExtractedBeat, type ExtractedGroup, type ExtractedNode, type FlowSegment, type GhostTextSuggestion, type GroupBoundary, type GroupDecl, type GroupDiff, type IntelliCodeItem, type IntelliCodeItemKind, type LayoutDirection, type MarkdyConfig, NODE_ALIASES, NODE_KINDS, type NodeDecl, type NodeDiff, type NodeSelector, type NodeShape, OUTPUT_PRESETS, type OrphanCodeServiceDrift, type OutputPreset, PLAYER_FLAT_KEYS, PLAYER_GROUPS, POPULAR_TECHS, ParseError, type ParseOptions, type ParseResult, type PatternDecl, type PatternRecommendationResult, type PlayerChromeConfig, type PlayerConfig, type PlayerControlsConfig, type PlayerInteractionConfig, type PlayerOverrides, type PlayerPlaybackConfig, type PlayerProgress, type PlayerScope, type Point, type PortLane, type PositionedNode, type QualityCheckItem, type QualityGateOptions, type QualityGateReport, type QualityProfile, type RenderPlan, type RepairPromptBundle, type ResolvedPlayer, type RouteOptions, type RoutedEdge, type RoutedPath, type RuleSeverity, SCENE_KEYS, type SceneMeta, type SemanticProfile, type SequenceActivation, type SequenceMessage, type StyleDecl, type SyntaxDiagnosticReport, type SynthesizedRecipeResult, TECHNICAL_NODE_KINDS, TECHNICAL_NODE_TYPES, THEMES, type TechPreset, type ThemeGeneratorOptions, type ThemeTokens, type TimedCue, type TreeBus, VECTOR_SYMBOLS, VISUAL_PRIMITIVE_TYPES, type VectorSymbol, allocatePortLanes, analyzeAndBuildRepairPrompt, analyzeC4Model, applyPlayerSetting, autoHealArchitectureDrift, buildSmoothSvgPath, canonicalNodeKind, classifyTechnology, compile, compilePlan, compressMarkdyToUrlHash, computeAdaptiveDimensions, damerauLevenshteinDistance, decompressMarkdyFromUrlHash, detectArchitectureDrift, diagnoseMarkdyCode, diffDiagramASTs, exportC4LevelViews, extractDiagramCodeAnchors, extractDiagramContext, filterC4Hierarchy, findClosestMatch, formatScene, generateC4Storyboard, generateThemeFromBrand, getArchitectureRecipe, getArchitectureSuggestions, getBoxPortPosition, getIntelliCodeCompletions, humanizeId, inferNodeC4Level, listArchitectureRecipes, listAvailableSymbols, listOutputPresets, nodeRole, parse, parseAndCompile, parseCodeAnchor, predictNextLineSuggestion, recommendArchitecturePattern, renderSymbolSvg, repairMarkdyCode, resolveArchitectureConfig, resolveOutputPreset, resolvePlayer, resolveTheme, resolveVectorSymbol, routeOrthogonalEdge, selectOptimalPorts, synthesizeCustomRecipe, validateArchitecture, validateC4Containment, verifyCodeAnchorsWithReader, verifyDiagramQuality };
+export { ARCHITECTURE_RECIPES, ARCH_RULE_PRESETS, type AnnotationDecl, type ArchRuleType, type ArchitectureDriftReport, type ArchitecturePreset, type ArchitectureRecipe, type ArchitectureRecommendation, type ArchitectureRule, type ArchitectureViolation, type AutoHealResult, type AutoRepairResult, BEAT_CUE_KEYWORDS, type BeatDecl, type BeatRange, type Box, type BrokenAnchorDrift, type C4Level, type C4LevelViewExport, type C4ModelReport, type C4NodeMeta, CUE_ALIASES, type CardinalPort, type CodeProvenanceAnchor, type CodeProvenanceDiagnostic, type CodeProvenanceVerificationReport, type Cue, DIAGRAM_TYPES, type Diagnostic, type DiagnosticIssue, type DiagramAST, type DiagramContext, type DiagramDiffResult, type DiagramQualityMetrics, type DiagramType, type DiffChangeType, EDGE_OPERATORS, type EdgeDecl, type EdgeDiff, type EdgeKind, type EdgeSelector, type ExtractedBeat, type ExtractedGroup, type ExtractedNode, type FlowSegment, type GhostTextSuggestion, type GroupBoundary, type GroupDecl, type GroupDiff, type IntelliCodeItem, type IntelliCodeItemKind, type LayoutDirection, type MarkdyConfig, NODE_ALIASES, NODE_KINDS, type NodeDecl, type NodeDiff, type NodeSelector, type NodeShape, OUTPUT_PRESETS, type OrphanCodeServiceDrift, type OutputPreset, PLAYER_FLAT_KEYS, PLAYER_GROUPS, POPULAR_TECHS, ParseError, type ParseOptions, type ParseResult, type PatternDecl, type PatternRecommendationResult, type PlayerChromeConfig, type PlayerConfig, type PlayerControlsConfig, type PlayerInteractionConfig, type PlayerOverrides, type PlayerPlaybackConfig, type PlayerProgress, type PlayerScope, type Point, type PortLane, type PositionedNode, type QualityCheckItem, type QualityGateOptions, type QualityGateReport, type QualityProfile, type RenderPlan, type RepairPromptBundle, type ResolvedPlayer, type RouteOptions, type RoutedEdge, type RoutedPath, type RuleSeverity, SCENE_KEYS, type SceneMeta, type SemanticProfile, type SequenceActivation, type SequenceMessage, type StyleDecl, type SyntaxDiagnosticReport, type SynthesizedRecipeResult, TECHNICAL_NODE_KINDS, TECHNICAL_NODE_TYPES, THEMES, type TechPreset, type ThemeGeneratorOptions, type ThemeTokens, type TimedCue, type TreeBus, VECTOR_SYMBOLS, VISUAL_PRIMITIVE_TYPES, type VectorSymbol, allocatePortLanes, analyzeAndBuildRepairPrompt, analyzeC4Model, applyPlayerSetting, autoHealArchitectureDrift, buildSmoothSvgPath, canonicalNodeKind, classifyTechnology, compile, compilePlan, compressMarkdyToUrlHash, computeAdaptiveDimensions, computeNodeDimensions, damerauLevenshteinDistance, decompressMarkdyFromUrlHash, detectArchitectureDrift, diagnoseMarkdyCode, diffDiagramASTs, exportC4LevelViews, extractDiagramCodeAnchors, extractDiagramContext, filterC4Hierarchy, findClosestMatch, formatScene, generateC4Storyboard, generateThemeFromBrand, getArchitectureRecipe, getArchitectureSuggestions, getBoxPortPosition, getIntelliCodeCompletions, humanizeId, inferNodeC4Level, listArchitectureRecipes, listAvailableSymbols, listOutputPresets, nodeRole, parse, parseAndCompile, parseCodeAnchor, predictNextLineSuggestion, recommendArchitecturePattern, renderSymbolSvg, repairMarkdyCode, resolveArchitectureConfig, resolveOutputPreset, resolvePlayer, resolveTheme, resolveVectorSymbol, routeOrthogonalEdge, selectOptimalPorts, synthesizeCustomRecipe, validateArchitecture, validateC4Containment, verifyCodeAnchorsWithReader, verifyDiagramQuality };

package/dist/index.js

@@ -673,7 +673,8 @@ function resolvePlayer(config = {}, overrides = {}) {
   const controls = {
     ...requestedControls,
     speed: requestedControls.speed && speeds.length > 1,
-    resetView: requestedControls.resetView && interactionEnabled
+    resetView: requestedControls.resetView && interactionEnabled,
+    fit: requestedControls.fit
   };
   const controlsEnabled = Object.values(controls).some(Boolean);
   const rate = overrides.playbackRate ?? playback.rate ?? 1;
@@ -691,8 +692,8 @@ function resolvePlayer(config = {}, overrides = {}) {
     interaction: {
       ...gestures,
       enabled: interactionEnabled,
-      clickToPlay: interaction.clickToPlay ?? true,
-      keyboard: interaction.keyboard ?? false
+      clickToPlay: overrides.clickToPlay ?? (interactionOn && (interaction.clickToPlay ?? true)),
+      keyboard: interactionOn && (interaction.keyboard ?? false)
     },
     chrome: {
       badge: overrides.copyright ?? chrome.badge ?? true,
@@ -757,6 +758,7 @@ var SCENE_KEYS = /* @__PURE__ */ new Set([
   "duration",
   "direction",
   "layout",
+  "rankdir",
   "type",
   ...PLAYER_FLAT_KEYS
 ]);
@@ -804,35 +806,123 @@ var NODE_W = 180;
 var NODE_H = 76;
 var VENN_NODE_SIZE = 220;
 var GROUP_PAD = 28;
-function computeNodeDimensions(decl, baseW = 180, baseH = 76) {
-  if (typeof decl.props?.width === "number") {
-    return {
-      width: decl.props.width,
-      height: typeof decl.props.height === "number" ? decl.props.height : baseH
-    };
+function estimateTextLines(words, charsPerLine) {
+  if (words.length === 0) return 0;
+  let lines = 1;
+  let curLen = 0;
+  for (const w of words) {
+    if (curLen === 0) {
+      curLen = w.length;
+    } else if (curLen + 1 + w.length <= charsPerLine) {
+      curLen += 1 + w.length;
+    } else {
+      lines++;
+      curLen = w.length;
+    }
   }
-  const labelLen = (decl.label || "").length;
-  const tech = decl.props?.tech ?? decl.props?.sub;
-  const techLen = tech ? String(tech).length : 0;
-  const val = decl.props?.value ?? decl.props?.metric;
-  const valLen = val ? String(val).length : 0;
+  return lines;
+}
+function measureLabelLines(rawLabel, words, charsPerLine) {
+  if (words.length === 0) return 0;
+  if (!rawLabel.includes("\n")) {
+    return Math.max(1, estimateTextLines(words, charsPerLine));
+  }
+  const explicitLines = rawLabel.split("\n");
+  let total = 0;
+  for (const line of explicitLines) {
+    const lineWords = line.trim().split(/\s+/).filter(Boolean);
+    total += Math.max(1, estimateTextLines(lineWords, charsPerLine));
+  }
+  return Math.max(explicitLines.length, total);
+}
+function computeNodeDimensions(decl, baseW = 180, baseH = 76) {
   if (decl.kind === "dot") return { width: 64, height: 64 };
   if (decl.kind === "matrix") return { width: 220, height: 96 };
-  const valueW = valLen > 0 ? Math.max(50, valLen * 9.5 + 16) : 0;
-  const words = (decl.label || "").trim().split(/\s+/).filter(Boolean);
+  const rawLabel = (decl.label || "").trim();
+  const labelLen = rawLabel.length;
+  const words = rawLabel.split(/\s+/).filter(Boolean);
   const longestWord = Math.max(...words.map((w) => w.length), 0);
-  const avgLineChars = words.length > 1 ? Math.ceil(labelLen / Math.min(words.length, 2)) : labelLen;
-  const neededLabelChars = Math.max(longestWord + 2, avgLineChars, Math.min(labelLen, 22));
-  const maxChars = Math.max(neededLabelChars, techLen);
-  const neededTextW = Math.max(96, maxChars * 8.4);
-  const calculatedW = 56 + neededTextW + (valueW > 0 ? valueW + 14 : 0) + 18;
-  const minW = Math.max(baseW, Math.min(360, calculatedW));
-  let width = Math.ceil(minW / 8) * 8;
-  let height = baseH;
-  if (labelLen > 24 && techLen > 0) {
-    height = Math.max(height, 84);
-  }
-  return { width, height };
+  const tech = decl.props?.tech ?? decl.props?.sub;
+  const techStr = tech ? String(tech).trim() : "";
+  const techLen = techStr.length;
+  const val = decl.props?.value ?? decl.props?.metric;
+  const valStr = val ? String(val).trim() : "";
+  const valLen = valStr.length;
+  const leftSpace = 56;
+  const valueW = valLen > 0 ? Math.max(50, valLen * 9.5 + 16) : 0;
+  const rightSpace = valueW > 0 ? valueW + 14 : 18;
+  const isDiamond = decl.props?.shape === "diamond" || decl.kind === "decision" || decl.kind === "condition";
+  const isCircle = decl.props?.shape === "circle";
+  const isPill = decl.props?.shape === "pill";
+  const effectiveBaseW = isDiamond ? Math.max(baseW, 208) : isCircle ? Math.max(baseW, 140) : baseW;
+  const effectiveBaseH = isDiamond ? Math.max(baseH, 88) : isCircle ? Math.max(baseH, 140) : baseH;
+  const neededTechW = techLen > 0 ? Math.ceil(techLen * 6.6 + 16) : 0;
+  const longestWordW = Math.ceil(longestWord * 8.4 + 4);
+  const minColW = Math.max(96, longestWordW, neededTechW);
+  if (isCircle) {
+    const targetTextW2 = Math.max(minColW, Math.min(220, Math.ceil(labelLen * 7.5)));
+    const charsPerLine2 = Math.max(longestWord, Math.floor(targetTextW2 / 8));
+    const numLines2 = Math.max(words.length > 0 ? 1 : 0, measureLabelLines(rawLabel, words, charsPerLine2));
+    const labelH2 = numLines2 * 16;
+    const techH2 = techLen > 0 ? 20 : 0;
+    const circleContentH = 28 + labelH2 + techH2;
+    const circleContentW = Math.max(targetTextW2, 60);
+    const radiusNeeded = Math.sqrt((circleContentW / 2) ** 2 + (circleContentH / 2) ** 2) + 20;
+    const diameter = Math.max(effectiveBaseW, effectiveBaseH, Math.ceil(radiusNeeded * 2 / 8) * 8);
+    return {
+      width: typeof decl.props?.width === "number" ? Math.max(decl.props.width, diameter) : diameter,
+      height: typeof decl.props?.height === "number" ? Math.max(decl.props.height, diameter) : diameter
+    };
+  }
+  if (isDiamond) {
+    let targetTextW2;
+    if (labelLen <= 12) {
+      targetTextW2 = Math.max(minColW, Math.ceil(labelLen * 8));
+    } else if (labelLen <= 28) {
+      targetTextW2 = Math.max(minColW, Math.min(180, Math.ceil(labelLen / 2 * 8.2 + 8)));
+    } else {
+      targetTextW2 = Math.max(minColW, Math.min(260, Math.ceil(labelLen / 3 * 8.2 + 12)));
+    }
+    const charsPerLine2 = Math.max(longestWord, Math.floor(targetTextW2 / 8));
+    const numLines2 = Math.max(words.length > 0 ? 1 : 0, measureLabelLines(rawLabel, words, charsPerLine2));
+    const labelH2 = numLines2 * 16;
+    const techH2 = techLen > 0 ? 20 : 0;
+    const diamondContentH = 24 + labelH2 + techH2;
+    const neededH2 = Math.max(effectiveBaseH, Math.ceil(diamondContentH / 0.58 / 8) * 8);
+    const neededW = Math.max(effectiveBaseW, Math.ceil((targetTextW2 + 32) / 0.52 / 8) * 8);
+    return {
+      width: typeof decl.props?.width === "number" ? Math.max(decl.props.width, neededW) : neededW,
+      height: typeof decl.props?.height === "number" ? Math.max(decl.props.height, neededH2) : neededH2
+    };
+  }
+  let targetTextW;
+  if (labelLen <= 14) {
+    targetTextW = Math.max(minColW, Math.ceil(labelLen * 8.4));
+  } else if (labelLen <= 30) {
+    targetTextW = Math.max(minColW, Math.min(220, Math.ceil(labelLen * 8.4)));
+  } else if (labelLen <= 54) {
+    targetTextW = Math.max(minColW, Math.min(260, Math.max(180, Math.ceil(labelLen / 2 * 8.4 + 8))));
+  } else if (labelLen <= 84) {
+    targetTextW = Math.max(minColW, Math.min(300, Math.max(220, Math.ceil(labelLen / 3 * 8.4 + 12))));
+  } else {
+    targetTextW = Math.max(minColW, Math.min(360, Math.max(250, Math.ceil(labelLen / 4 * 8.4 + 16))));
+  }
+  const charsPerLine = Math.max(longestWord, Math.floor((targetTextW - 4) / 8.2));
+  const numLines = Math.max(words.length > 0 ? 1 : 0, measureLabelLines(rawLabel, words, charsPerLine));
+  const labelLineH = 18;
+  const labelH = numLines * labelLineH;
+  const techH = techLen > 0 ? 22 : 0;
+  const padV = 28;
+  const neededContentH = Math.max(28, labelH + techH);
+  const neededH = neededContentH + padV;
+  const height = Math.max(effectiveBaseH, Math.ceil(neededH / 8) * 8);
+  const pillPad = isPill ? 24 : 0;
+  const calculatedW = leftSpace + targetTextW + rightSpace + pillPad;
+  const width = Math.max(effectiveBaseW, Math.ceil(calculatedW / 8) * 8);
+  return {
+    width: typeof decl.props?.width === "number" ? Math.max(decl.props.width, width) : width,
+    height: typeof decl.props?.height === "number" ? Math.max(decl.props.height, height) : height
+  };
 }
 function resolveNodeStyle(decl, ast) {
   if (!decl.style) return void 0;
@@ -853,6 +943,9 @@ var DEFAULTS = {
 function diagramType(ast) {
   return ast.meta.type ?? "architecture";
 }
+function effectiveTitleBand(ast) {
+  return ast.meta.title && ast.meta.title.trim().length > 0 ? TITLE_BAND : 16;
+}
 function nodeShape(kind, dtype, props) {
   if (typeof props?.shape === "string") {
     const s = props.shape.toLowerCase();
@@ -1127,6 +1220,11 @@ function layoutRanked(ast, edges, opts) {
 function layoutTree(ast, edges) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
+  const maxNodeH = Math.max(...nodeIds.map((id) => nodeDims.get(id).height), NODE_H);
   const children = /* @__PURE__ */ new Map();
   const parent = /* @__PURE__ */ new Map();
   for (const id of nodeIds) children.set(id, []);
@@ -1155,18 +1253,22 @@ function layoutTree(ast, edges) {
   for (const id of nodeIds) if (!depth.has(id)) depth.set(id, 0);
   const maxDepth = Math.max(...depth.values(), 0);
   const subtreeSpan = /* @__PURE__ */ new Map();
-  const minLeafWidth = NODE_W + 48;
+  function leafSpan(id) {
+    const w = nodeDims.get(id)?.width ?? NODE_W;
+    return w + 36;
+  }
   function measureSubtree(id) {
     const kids = children.get(id) ?? [];
+    const minSpan = leafSpan(id);
     if (kids.length === 0) {
-      subtreeSpan.set(id, minLeafWidth);
-      return minLeafWidth;
+      subtreeSpan.set(id, minSpan);
+      return minSpan;
     }
     let total = 0;
     for (const kid of kids) {
       total += measureSubtree(kid);
     }
-    const span = Math.max(minLeafWidth, total);
+    const span = Math.max(minSpan, total);
     subtreeSpan.set(id, span);
     return span;
   }
@@ -1177,34 +1279,37 @@ function layoutTree(ast, edges) {
   const contentW = ast.meta.width - SAFE * 2;
   const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
   const treeStartX = SAFE + Math.max(0, (contentW - totalRootsWidth) / 2);
-  const levelHeight = Math.max(NODE_H + 48, Math.min(160, contentH / Math.max(maxDepth + 1, 1)));
-  const totalTreeHeight = maxDepth * levelHeight + NODE_H;
+  const levelHeight = Math.max(maxNodeH + 40, Math.min(220, contentH / Math.max(maxDepth + 1, 1)));
+  const totalTreeHeight = maxDepth * levelHeight + maxNodeH;
   const treeStartY = TITLE_BAND + Math.max(16, (contentH - totalTreeHeight) / 2);
   const nodePositions = /* @__PURE__ */ new Map();
   function positionSubtree(id, leftX) {
     const d = depth.get(id) ?? 0;
     const y = treeStartY + d * levelHeight;
     const kids = children.get(id) ?? [];
-    const span = subtreeSpan.get(id) ?? minLeafWidth;
+    const span = subtreeSpan.get(id) ?? leafSpan(id);
+    const dims = nodeDims.get(id) ?? { width: NODE_W, height: NODE_H };
     if (kids.length === 0) {
       const centerX = leftX + span / 2;
-      nodePositions.set(id, { x: centerX - NODE_W / 2, y });
+      nodePositions.set(id, { x: centerX - dims.width / 2, y });
       return;
     }
     let curX = leftX;
     for (const kid of kids) {
-      const kidSpan = subtreeSpan.get(kid) ?? minLeafWidth;
+      const kidSpan = subtreeSpan.get(kid) ?? leafSpan(kid);
       positionSubtree(kid, curX);
       curX += kidSpan;
     }
     const firstChild = nodePositions.get(kids[0]);
     const lastChild = nodePositions.get(kids[kids.length - 1]);
-    const parentCenterX = (firstChild.x + NODE_W / 2 + lastChild.x + NODE_W / 2) / 2;
-    nodePositions.set(id, { x: parentCenterX - NODE_W / 2, y });
+    const firstDims = nodeDims.get(kids[0]) ?? { width: NODE_W, height: NODE_H };
+    const lastDims = nodeDims.get(kids[kids.length - 1]) ?? { width: NODE_W, height: NODE_H };
+    const parentCenterX = (firstChild.x + firstDims.width / 2 + lastChild.x + lastDims.width / 2) / 2;
+    nodePositions.set(id, { x: parentCenterX - dims.width / 2, y });
   }
   let currentRootLeft = treeStartX;
   for (const r of roots) {
-    const span = subtreeSpan.get(r) ?? minLeafWidth;
+    const span = subtreeSpan.get(r) ?? leafSpan(r);
     positionSubtree(r, currentRootLeft);
     currentRootLeft += span;
   }
@@ -1212,6 +1317,7 @@ function layoutTree(ast, edges) {
   for (const id of nodeIds) {
     const decl = ast.nodes[id];
     const pos = nodePositions.get(id) ?? { x: SAFE, y: TITLE_BAND };
+    const dims = nodeDims.get(id) ?? { width: NODE_W, height: NODE_H };
     nodes.push({
       id,
       kind: decl.kind,
@@ -1219,12 +1325,12 @@ function layoutTree(ast, edges) {
       label: decl.label,
       x: snapGrid(pos.x),
       y: snapGrid(pos.y),
-      width: NODE_W,
-      height: NODE_H,
+      width: dims.width,
+      height: dims.height,
       style: resolveNodeStyle(decl, ast),
       props: decl.props,
       opacity: 0,
-      shape: "card",
+      shape: nodeShape(decl.kind, "tree", decl.props),
       focal: decl.props.focal === true || decl.props.accent === true
     });
   }
@@ -1260,6 +1366,12 @@ function cycleSafeEdges(nodeIds, edges) {
 function layoutConstellation(ast) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
+  const maxNodeW = Math.max(...nodeIds.map((id) => nodeDims.get(id).width), NODE_W);
+  const maxNodeH = Math.max(...nodeIds.map((id) => nodeDims.get(id).height), NODE_H);
   const incoming = /* @__PURE__ */ new Set();
   for (const edge of ast.edges) {
     if (edge.kind !== "response" && edge.from !== edge.to && ast.nodes[edge.to]) incoming.add(edge.to);
@@ -1267,19 +1379,18 @@ function layoutConstellation(ast) {
   const focalId = nodeIds.find((id) => ast.nodes[id].props.focal === true || ast.nodes[id].props.accent === true) ?? nodeIds.find((id) => !incoming.has(id)) ?? nodeIds[0];
   const contentW = ast.meta.width - SAFE * 2;
   const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
-  const centerX = SAFE + contentW / 2 - NODE_W / 2;
-  const centerY = TITLE_BAND + contentH / 2 - NODE_H / 2;
   const orbitIds = nodeIds.filter((id) => id !== focalId);
-  const radiusX = Math.max(140, contentW / 2 - NODE_W / 2 - SAFE);
-  const radiusY = Math.max(120, contentH / 2 - NODE_H / 2 - SAFE);
+  const radiusX = Math.max(140, contentW / 2 - maxNodeW / 2 - SAFE);
+  const radiusY = Math.max(120, contentH / 2 - maxNodeH / 2 - SAFE);
   const nodes = [];
   for (const id of nodeIds) {
     const decl = ast.nodes[id];
+    const dims = nodeDims.get(id) ?? { width: NODE_W, height: NODE_H };
     const isFocal = id === focalId;
     const index = orbitIds.indexOf(id);
     const angle = orbitIds.length > 0 ? -Math.PI / 2 + index * Math.PI * 2 / orbitIds.length : 0;
-    const x = isFocal ? centerX : SAFE + contentW / 2 + Math.cos(angle) * radiusX - NODE_W / 2;
-    const y = isFocal ? centerY : TITLE_BAND + contentH / 2 + Math.sin(angle) * radiusY - NODE_H / 2;
+    const x = isFocal ? SAFE + contentW / 2 - dims.width / 2 : SAFE + contentW / 2 + Math.cos(angle) * radiusX - dims.width / 2;
+    const y = isFocal ? TITLE_BAND + contentH / 2 - dims.height / 2 : TITLE_BAND + contentH / 2 + Math.sin(angle) * radiusY - dims.height / 2;
     nodes.push({
       id,
       kind: decl.kind,
@@ -1287,8 +1398,8 @@ function layoutConstellation(ast) {
       label: decl.label,
       x: snapGrid(x),
       y: snapGrid(y),
-      width: NODE_W,
-      height: NODE_H,
+      width: dims.width,
+      height: dims.height,
       style: resolveNodeStyle(decl, ast),
       props: decl.props,
       opacity: 0,
@@ -1301,6 +1412,12 @@ function layoutConstellation(ast) {
 function layoutLoop(ast) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
+  const maxNodeW = Math.max(...nodeIds.map((id) => nodeDims.get(id).width), NODE_W);
+  const maxNodeH = Math.max(...nodeIds.map((id) => nodeDims.get(id).height), NODE_H);
   const hubId = nodeIds.find((id) => {
     const decl = ast.nodes[id];
     return decl.kind === "hub" || decl.props.hub === true || /^(hub|state|memory|shared_memory|core)$/i.test(id);
@@ -1310,22 +1427,25 @@ function layoutLoop(ast) {
   const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
   const centerX = SAFE + contentW / 2;
   const centerY = TITLE_BAND + contentH / 2;
-  const radiusX = Math.min(contentW * 0.4, Math.max(220, (contentW - NODE_W) / 2 - 32));
-  const radiusY = Math.min(contentH * 0.38, Math.max(150, (contentH - NODE_H) / 2 - 32));
+  const radiusX = Math.min(contentW * 0.4, Math.max(220, (contentW - maxNodeW) / 2 - 32));
+  const radiusY = Math.min(contentH * 0.38, Math.max(150, (contentH - maxNodeH) / 2 - 32));
   const nodes = [];
   for (const id of nodeIds) {
     const decl = ast.nodes[id];
     const isHub = id === hubId;
+    const dims = nodeDims.get(id) ?? { width: NODE_W, height: NODE_H };
+    const w = isHub ? Math.max(dims.width, snapGrid(NODE_W * 1.25)) : dims.width;
+    const h = isHub ? Math.max(dims.height, snapGrid(NODE_H * 1.15)) : dims.height;
     let x;
     let y;
     if (isHub) {
-      x = centerX - NODE_W * 1.25 / 2;
-      y = centerY - NODE_H * 1.15 / 2;
+      x = centerX - w / 2;
+      y = centerY - h / 2;
     } else {
       const idx = stationIds.indexOf(id);
       const angle = -Math.PI / 2 + idx * 2 * Math.PI / Math.max(stationIds.length, 1);
-      x = centerX + Math.cos(angle) * radiusX - NODE_W / 2;
-      y = centerY + Math.sin(angle) * radiusY - NODE_H / 2;
+      x = centerX + Math.cos(angle) * radiusX - w / 2;
+      y = centerY + Math.sin(angle) * radiusY - h / 2;
     }
     const focal = isHub || decl.props.focal === true || decl.props.accent === true;
     nodes.push({
@@ -1335,8 +1455,8 @@ function layoutLoop(ast) {
       label: decl.label,
       x: snapGrid(x),
       y: snapGrid(y),
-      width: isHub ? snapGrid(NODE_W * 1.25) : NODE_W,
-      height: isHub ? snapGrid(NODE_H * 1.15) : NODE_H,
+      width: w,
+      height: h,
       style: resolveNodeStyle(decl, ast),
       props: decl.props,
       opacity: 0,
@@ -1357,6 +1477,10 @@ function layoutMedallion(ast, edges) {
     if (combined.includes("bi") || combined.includes("dash") || combined.includes("model") || combined.includes("app") || combined.includes("consumer") || combined.includes("user") || combined.includes("client")) return 4;
     return 0;
   }
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
   const tiers = /* @__PURE__ */ new Map();
   for (let i = 0; i <= 4; i++) tiers.set(i, []);
   for (const id of nodeIds) {
@@ -1368,29 +1492,35 @@ function layoutMedallion(ast, edges) {
   const tierCount = activeTiers.length || 1;
   const contentW = ast.meta.width - SAFE * 2;
   const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
-  const colGap = Math.max(NODE_W + 48, contentW / (tierCount + 1));
-  const totalW = (tierCount - 1) * colGap + NODE_W;
+  const maxNodeW = Math.max(...nodeIds.map((id) => nodeDims.get(id).width));
+  const availableColGap = tierCount > 1 ? (contentW - maxNodeW) / (tierCount - 1) : 0;
+  const colGap = Math.max(maxNodeW + 36, Math.min(360, availableColGap));
+  const totalW = (tierCount - 1) * colGap + maxNodeW;
   const startX = SAFE + Math.max(0, (contentW - totalW) / 2);
   const nodes = [];
   activeTiers.forEach(([_, ids], colIdx) => {
     const colCount = ids.length;
+    const colTierMaxW = Math.max(...ids.map((id) => nodeDims.get(id).width));
+    const colTierMaxH = Math.max(...ids.map((id) => nodeDims.get(id).height));
     const colX = startX + colIdx * colGap;
-    const rowSpacing = Math.max(NODE_H + 32, contentH / (colCount + 1));
-    const colH = (colCount - 1) * rowSpacing + NODE_H;
+    const rowSpacing = Math.max(colTierMaxH + 32, contentH / (colCount + 1));
+    const colH = (colCount - 1) * rowSpacing + colTierMaxH;
     const startY = TITLE_BAND + Math.max(0, (contentH - colH) / 2);
     ids.forEach((id, rowIdx) => {
       const decl = ast.nodes[id];
-      const rowY = startY + rowIdx * rowSpacing;
+      const dims = nodeDims.get(id);
+      const rowY = startY + rowIdx * rowSpacing + (colTierMaxH - dims.height) / 2;
+      const nodeX = colX + (colTierMaxW - dims.width) / 2;
       const focal = decl.props.focal === true || decl.props.accent === true;
       nodes.push({
         id,
         kind: decl.kind,
         role: nodeRole(decl.kind),
         label: decl.label,
-        x: snapGrid(colX),
+        x: snapGrid(nodeX),
         y: snapGrid(rowY),
-        width: NODE_W,
-        height: NODE_H,
+        width: dims.width,
+        height: dims.height,
         style: resolveNodeStyle(decl, ast),
         props: decl.props,
         opacity: 0,
@@ -1404,6 +1534,10 @@ function layoutMedallion(ast, edges) {
 function layoutQuadrant(ast) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
   const contentW = ast.meta.width - SAFE * 2;
   const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
   const centerX = SAFE + contentW / 2;
@@ -1437,12 +1571,15 @@ function layoutQuadrant(ast) {
   };
   for (const [qNum, ids] of quadNodes) {
     const center = quadCenters[qNum];
+    const offsetCount = ids.length;
+    const maxQHeight = ids.length > 0 ? Math.max(...ids.map((id) => nodeDims.get(id).height)) : NODE_H;
+    const rowStep = maxQHeight + 20;
     ids.forEach((id, idx) => {
       const decl = ast.nodes[id];
-      const offsetCount = ids.length;
-      const rowOffset = (idx - (offsetCount - 1) / 2) * (NODE_H + 20);
-      const x = center.x - NODE_W / 2;
-      const y = center.y + rowOffset - NODE_H / 2;
+      const dims = nodeDims.get(id);
+      const rowOffset = (idx - (offsetCount - 1) / 2) * rowStep;
+      const x = center.x - dims.width / 2;
+      const y = center.y + rowOffset - dims.height / 2;
       const focal = decl.props.focal === true || decl.props.accent === true;
       nodes.push({
         id,
@@ -1451,8 +1588,8 @@ function layoutQuadrant(ast) {
         label: decl.label,
         x: snapGrid(x),
         y: snapGrid(y),
-        width: NODE_W,
-        height: NODE_H,
+        width: dims.width,
+        height: dims.height,
         style: resolveNodeStyle(decl, ast),
         props: decl.props,
         opacity: 0,
@@ -1466,6 +1603,10 @@ function layoutQuadrant(ast) {
 function layoutSwimlane(ast, edges) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
   const lanes = /* @__PURE__ */ new Map();
   const groupKeys = Object.keys(ast.groups);
   if (groupKeys.length > 0) {
@@ -1488,14 +1629,16 @@ function layoutSwimlane(ast, edges) {
   const laneHeight = contentH / laneCount;
   const nodes = [];
   activeLanes.forEach(([_, ids], laneIdx) => {
-    const laneY = TITLE_BAND + laneIdx * laneHeight + (laneHeight - NODE_H) / 2;
     const count = ids.length;
-    const colSpacing = Math.max(NODE_W + 48, Math.min(260, contentW / Math.max(count + 1, 2)));
-    const totalW = (count - 1) * colSpacing + NODE_W;
+    const maxLaneW = count > 0 ? Math.max(...ids.map((id) => nodeDims.get(id).width)) : NODE_W;
+    const colSpacing = Math.max(maxLaneW + 40, Math.min(320, contentW / Math.max(count + 1, 2)));
+    const totalW = (count - 1) * colSpacing + maxLaneW;
     const startX = SAFE + Math.max(0, (contentW - totalW) / 2);
     ids.forEach((id, colIdx) => {
       const decl = ast.nodes[id];
-      const colX = startX + colIdx * colSpacing;
+      const dims = nodeDims.get(id);
+      const colX = startX + colIdx * colSpacing + (maxLaneW - dims.width) / 2;
+      const laneY = TITLE_BAND + laneIdx * laneHeight + (laneHeight - dims.height) / 2;
       const focal = decl.props.focal === true || decl.props.accent === true;
       nodes.push({
         id,
@@ -1504,8 +1647,8 @@ function layoutSwimlane(ast, edges) {
         label: decl.label,
         x: snapGrid(colX),
         y: snapGrid(laneY),
-        width: NODE_W,
-        height: NODE_H,
+        width: dims.width,
+        height: dims.height,
         style: resolveNodeStyle(decl, ast),
         props: decl.props,
         opacity: 0,
@@ -1519,6 +1662,10 @@ function layoutSwimlane(ast, edges) {
 function layoutPyramid(ast) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
   const ranks = /* @__PURE__ */ new Map();
   nodeIds.forEach((id, idx) => {
     const decl = ast.nodes[id];
@@ -1531,20 +1678,26 @@ function layoutPyramid(ast) {
   const contentW = ast.meta.width - SAFE * 2;
   const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
   const centerX = SAFE + contentW / 2;
-  const totalH = tierCount * NODE_H + (tierCount - 1) * 24;
+  const maxNodeH = Math.max(...nodeIds.map((id) => nodeDims.get(id).height));
+  const tierH = Math.max(NODE_H, maxNodeH);
+  const totalH = tierCount * tierH + (tierCount - 1) * 24;
   const startY = TITLE_BAND + Math.max(16, (contentH - totalH) / 2);
   const nodes = [];
   sortedTiers.forEach(([_, ids], tierIdx) => {
-    const tierY = startY + tierIdx * (NODE_H + 24);
+    const tierY = startY + tierIdx * (tierH + 24);
     const baseFraction = 0.32 + 0.44 * tierIdx / Math.max(tierCount - 1, 1);
     const tierWidth = contentW * baseFraction;
     const count = ids.length;
-    const nodeW = Math.max(NODE_W, Math.min(tierWidth / count - 12, 480));
+    const maxTierW = Math.max(...ids.map((id) => nodeDims.get(id).width));
+    const nodeW = Math.max(maxTierW, Math.min(tierWidth / count - 12, 480));
     const totalTierW = count * nodeW + (count - 1) * 16;
     const tierStartX = centerX - totalTierW / 2;
     ids.forEach((id, idx) => {
       const decl = ast.nodes[id];
-      const x = tierStartX + idx * (nodeW + 16);
+      const dims = nodeDims.get(id);
+      const finalW = Math.max(nodeW, dims.width);
+      const x = tierStartX + idx * (finalW + 16);
+      const y = tierY + (tierH - dims.height) / 2;
       const focal = decl.props.focal === true || decl.props.accent === true;
       nodes.push({
         id,
@@ -1553,8 +1706,8 @@ function layoutPyramid(ast) {
         label: decl.label,
         x: snapGrid(x),
         y: snapGrid(tierY),
-        width: snapGrid(nodeW),
-        height: NODE_H,
+        width: snapGrid(finalW),
+        height: dims.height,
         style: resolveNodeStyle(decl, ast),
         props: decl.props,
         opacity: 0,
@@ -1568,6 +1721,10 @@ function layoutPyramid(ast) {
 function layoutTimeline(ast) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
   const contentW = ast.meta.width - SAFE * 2;
   const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
   const baselineY = TITLE_BAND + contentH / 2;
@@ -1575,9 +1732,10 @@ function layoutTimeline(ast) {
   const nodes = [];
   nodeIds.forEach((id, idx) => {
     const decl = ast.nodes[id];
-    const x = SAFE + spacing * idx + (spacing - NODE_W) / 2;
+    const dims = nodeDims.get(id);
+    const x = SAFE + spacing * idx + (spacing - dims.width) / 2;
     const above = idx % 2 === 0;
-    const y = above ? baselineY - NODE_H - 24 : baselineY + 24;
+    const y = above ? baselineY - dims.height - 24 : baselineY + 24;
     const focal = decl.props.focal === true || decl.props.accent === true;
     nodes.push({
       id,
@@ -1586,8 +1744,8 @@ function layoutTimeline(ast) {
       label: decl.label,
       x: snapGrid(x),
       y: snapGrid(y),
-      width: NODE_W,
-      height: NODE_H,
+      width: dims.width,
+      height: dims.height,
       style: resolveNodeStyle(decl, ast),
       props: decl.props,
       opacity: 0,
@@ -1600,16 +1758,23 @@ function layoutTimeline(ast) {
 function layoutGantt(ast) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
+  const topBand = effectiveTitleBand(ast);
   const contentW = ast.meta.width - SAFE * 2;
-  const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
+  const contentH = ast.meta.height - SAFE - topBand - SAFE;
   const N = nodeIds.length;
-  const rowH = Math.min(68, Math.max(52, (contentH - 24) / Math.max(N, 1)));
-  const barH = Math.min(44, rowH - 16);
+  const maxNodeH = Math.max(...nodeIds.map((id) => nodeDims.get(id).height));
+  const baseBarH = Math.max(44, maxNodeH);
+  const rowH = Math.max(baseBarH + 16, Math.min(100, (contentH - 24) / Math.max(N, 1)));
   const totalH = N * rowH;
-  const startY = TITLE_BAND + Math.max(16, (contentH - totalH) / 2);
+  const startY = topBand + Math.max(16, (contentH - totalH) / 2);
   const nodes = [];
   nodeIds.forEach((id, idx) => {
     const decl = ast.nodes[id];
+    const dims = nodeDims.get(id);
     const phase = typeof decl.props.phase === "number" ? decl.props.phase : 0;
     const span = typeof decl.props.span === "number" ? decl.props.span : 1;
     const totalPhases = Math.max(...nodeIds.map((nid) => {
@@ -1619,7 +1784,8 @@ function layoutGantt(ast) {
     }), 1);
     const unitW = contentW / totalPhases;
     const x = SAFE + phase * unitW;
-    const w = Math.max(span * unitW - 8, NODE_W);
+    const w = Math.max(span * unitW - 8, dims.width);
+    const barH = dims.height;
     const y = startY + idx * rowH + (rowH - barH) / 2;
     const focal = decl.props.focal === true || decl.props.accent === true;
     nodes.push({
@@ -1630,7 +1796,7 @@ function layoutGantt(ast) {
       x: snapGrid(x),
       y: snapGrid(y),
       width: snapGrid(w),
-      height: barH,
+      height: snapGrid(barH),
       style: resolveNodeStyle(decl, ast),
       props: decl.props,
       opacity: 0,
@@ -1643,23 +1809,31 @@ function layoutGantt(ast) {
 function layoutVenn(ast) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
   const contentW = ast.meta.width - SAFE * 2;
   const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
   const centerX = SAFE + contentW / 2;
   const centerY = TITLE_BAND + contentH / 2;
   const N = nodeIds.length;
-  const radius = Math.min(contentW, contentH) * 0.24;
+  const maxNodeDim = Math.max(...nodeIds.map((id) => Math.max(nodeDims.get(id).width, nodeDims.get(id).height)));
+  const vennSize = Math.max(VENN_NODE_SIZE, maxNodeDim);
+  const radius = Math.max(vennSize * 0.7, Math.min(contentW, contentH) * 0.24);
   const nodes = [];
   nodeIds.forEach((id, idx) => {
     const decl = ast.nodes[id];
+    const dims = nodeDims.get(id);
+    const circleSize = Math.max(vennSize, dims.width, dims.height);
     let x, y;
     if (N === 2) {
-      x = centerX + (idx === 0 ? -radius * 0.7 : radius * 0.7) - VENN_NODE_SIZE / 2;
-      y = centerY - VENN_NODE_SIZE / 2;
+      x = centerX + (idx === 0 ? -radius * 0.7 : radius * 0.7) - circleSize / 2;
+      y = centerY - circleSize / 2;
     } else {
       const angle = -Math.PI / 2 + idx * 2 * Math.PI / N;
-      x = centerX + radius * 0.85 * Math.cos(angle) - VENN_NODE_SIZE / 2;
-      y = centerY + radius * 0.85 * Math.sin(angle) - VENN_NODE_SIZE / 2;
+      x = centerX + radius * 0.85 * Math.cos(angle) - circleSize / 2;
+      y = centerY + radius * 0.85 * Math.sin(angle) - circleSize / 2;
     }
     const focal = decl.props.focal === true || decl.props.accent === true;
     nodes.push({
@@ -1669,8 +1843,8 @@ function layoutVenn(ast) {
       label: decl.label,
       x: snapGrid(x),
       y: snapGrid(y),
-      width: VENN_NODE_SIZE,
-      height: VENN_NODE_SIZE,
+      width: circleSize,
+      height: circleSize,
       style: resolveNodeStyle(decl, ast),
       props: decl.props,
       opacity: 0,
@@ -1683,18 +1857,26 @@ function layoutVenn(ast) {
 function layoutLayers(ast) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
   const contentW = ast.meta.width - SAFE * 2;
   const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
   const N = nodeIds.length;
-  const layerH = Math.min(Math.max((contentH - (N - 1) * 14) / N, 52), 68);
+  const maxNodeH = Math.max(...nodeIds.map((id) => nodeDims.get(id).height));
+  const layerH = Math.max(maxNodeH, Math.min(Math.max((contentH - (N - 1) * 14) / N, 52), 96));
   const totalH = N * layerH + (N - 1) * 14;
-  const startY = TITLE_BAND + (contentH - totalH) / 2;
-  const layerW = Math.min(contentW, 880);
+  const startY = TITLE_BAND + Math.max(16, (contentH - totalH) / 2);
+  const maxNodeW = Math.max(...nodeIds.map((id) => nodeDims.get(id).width));
+  const layerW = Math.max(maxNodeW, Math.min(contentW, 880));
   const startX = SAFE + (contentW - layerW) / 2;
   const nodes = [];
   nodeIds.forEach((id, idx) => {
     const decl = ast.nodes[id];
+    const dims = nodeDims.get(id);
     const y = startY + idx * (layerH + 14);
+    const nodeH = Math.max(layerH, dims.height);
     const focal = decl.props.focal === true || decl.props.accent === true;
     nodes.push({
       id,
@@ -1704,7 +1886,7 @@ function layoutLayers(ast) {
       x: snapGrid(startX),
       y: snapGrid(y),
       width: snapGrid(layerW),
-      height: snapGrid(layerH),
+      height: snapGrid(nodeH),
       style: resolveNodeStyle(decl, ast),
       props: decl.props,
       opacity: 0,
@@ -1717,6 +1899,10 @@ function layoutLayers(ast) {
 function layoutNested(ast) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
   const topHeadroom = 20;
   const startY = TITLE_BAND + topHeadroom;
   const contentW = ast.meta.width - SAFE * 2;
@@ -1729,18 +1915,19 @@ function layoutNested(ast) {
   const nodes = [];
   nodeIds.forEach((id, idx) => {
     const decl = ast.nodes[id];
+    const dims = nodeDims.get(id);
     const isCore = idx === N - 1;
     let x, y, w, h;
     if (isCore) {
-      w = Math.min(320, contentW - idx * padX * 2);
-      h = 84;
+      w = Math.max(dims.width, Math.min(320, contentW - idx * padX * 2));
+      h = Math.max(dims.height, 84);
       x = centerX - w / 2;
       y = centerY - h / 2 + (N > 1 ? 16 : 0);
     } else {
       x = SAFE + idx * padX;
       y = startY + idx * padY;
-      w = contentW - idx * padX * 2;
-      h = contentH - idx * padY * 2;
+      w = Math.max(dims.width, contentW - idx * padX * 2);
+      h = Math.max(dims.height, contentH - idx * padY * 2);
     }
     const focal = decl.props.focal === true || decl.props.accent === true || isCore;
     nodes.push({
@@ -1764,6 +1951,10 @@ function layoutNested(ast) {
 function layoutRadar(ast) {
   const nodeIds = Object.keys(ast.nodes);
   if (nodeIds.length === 0) return [];
+  const nodeDims = /* @__PURE__ */ new Map();
+  for (const id of nodeIds) {
+    nodeDims.set(id, computeNodeDimensions(ast.nodes[id]));
+  }
   const contentW = ast.meta.width - SAFE * 2;
   const contentH = ast.meta.height - SAFE - TITLE_BAND - SAFE;
   const centerX = SAFE + contentW / 2;
@@ -1773,9 +1964,10 @@ function layoutRadar(ast) {
   const nodes = [];
   nodeIds.forEach((id, idx) => {
     const decl = ast.nodes[id];
+    const dims = nodeDims.get(id);
     const angle = -Math.PI / 2 + idx * 2 * Math.PI / N;
-    const x = centerX + radius * Math.cos(angle) - NODE_W / 2;
-    const y = centerY + radius * Math.sin(angle) - NODE_H / 2;
+    const x = centerX + radius * Math.cos(angle) - dims.width / 2;
+    const y = centerY + radius * Math.sin(angle) - dims.height / 2;
     const focal = decl.props.focal === true || decl.props.accent === true;
     nodes.push({
       id,
@@ -1784,8 +1976,8 @@ function layoutRadar(ast) {
       label: decl.label,
       x: snapGrid(x),
       y: snapGrid(y),
-      width: NODE_W,
-      height: NODE_H,
+      width: dims.width,
+      height: dims.height,
       style: resolveNodeStyle(decl, ast),
       props: decl.props,
       opacity: 0,
@@ -1830,9 +2022,9 @@ function layoutNodes(ast, edges) {
     case "nested":
       return layoutNested(ast);
     case "state":
-      return layoutRanked(ast, cycleSafeEdges(Object.keys(ast.nodes), edges), { forceVertical: false });
+      return layoutRanked(ast, cycleSafeEdges(Object.keys(ast.nodes), edges), { forceVertical: ast.meta.direction === "TB" || ast.meta.direction === "BT" });
     default:
-      return layoutRanked(ast, edges, { forceVertical: false });
+      return layoutRanked(ast, edges, { forceVertical: ast.meta.direction === "TB" || ast.meta.direction === "BT" });
   }
 }
 function computeGroupBoundaries(ast, nodes) {
@@ -1940,21 +2132,33 @@ function scheduleBeats(ast, edges) {
       }
     }
   }
-  const isSequence = ast.meta.type === "sequence";
-  if (!hasShowCue && Object.keys(ast.nodes).length > 0) {
-    const nodesToReveal = !isSequence && flowNodeIds.size > 0 ? Object.keys(ast.nodes).filter((id) => !flowNodeIds.has(id)) : Object.keys(ast.nodes);
-    if (nodesToReveal.length > 0) {
-      cues.push({
-        start: 0,
-        duration: DEFAULTS.show,
-        kind: "show",
-        targets: nodesToReveal,
-        params: { stagger: DEFAULTS.stagger },
-        beat: "__intro"
-      });
-      t += DEFAULTS.show + DEFAULTS.cueGap;
+  const explicitlyShownNodes = /* @__PURE__ */ new Set();
+  for (const b of ast.beats) {
+    for (const c of b.cues) {
+      if (c.kind === "show") {
+        resolveTargets(c.targets, ast, groupMap, edgeIds).forEach((id) => explicitlyShownNodes.add(id));
+      } else if (c.kind === "parallel") {
+        for (const pc of c.cues) {
+          if (pc.kind === "show") {
+            resolveTargets(pc.targets, ast, groupMap, edgeIds).forEach((id) => explicitlyShownNodes.add(id));
+          }
+        }
+      }
     }
   }
+  const isSequence = ast.meta.type === "sequence";
+  const nodesToReveal = !isSequence && flowNodeIds.size > 0 ? Object.keys(ast.nodes).filter((id) => !flowNodeIds.has(id) && !explicitlyShownNodes.has(id)) : !hasShowCue ? Object.keys(ast.nodes) : [];
+  if (nodesToReveal.length > 0) {
+    cues.push({
+      start: 0,
+      duration: DEFAULTS.show,
+      kind: "show",
+      targets: nodesToReveal,
+      params: { stagger: DEFAULTS.stagger },
+      beat: "__intro"
+    });
+    t += DEFAULTS.show + DEFAULTS.cueGap;
+  }
   for (const beat of ast.beats) {
     const beatStart = t;
     const scheduled = [];
@@ -2024,8 +2228,10 @@ function scheduleBeats(ast, edges) {
 }
 function buildSequencePlan(ast, cues) {
   if (diagramType(ast) !== "sequence") return { messages: [], activations: [] };
+  const nodeDims = Object.values(ast.nodes).map((n) => computeNodeDimensions(n));
+  const maxNodeH = nodeDims.length > 0 ? Math.max(...nodeDims.map((d) => d.height)) : NODE_H;
   const flowCues = cues.filter((cue) => cue.kind === "flow" && cue.segments?.[0]);
-  const firstY = TITLE_BAND + NODE_H + 56;
+  const firstY = TITLE_BAND + maxNodeH + 56;
   const lastY = ast.meta.height - SAFE - 48;
   const availH = Math.max(120, lastY - firstY);
   const step = flowCues.length > 1 ? Math.max(52, Math.min(90, availH / flowCues.length)) : 0;
@@ -2074,19 +2280,44 @@ function computeAdaptiveDimensions(ast, edges) {
   const direction = ast.meta.direction ?? "LR";
   const isVertical = direction === "TB" || direction === "BT";
   const groupCount = Object.keys(ast.groups).length;
-  let autoW = 1280;
-  let autoH = 720;
+  const nodeDims = nodeIds.map((id) => computeNodeDimensions(ast.nodes[id]));
+  const maxNodeW = nodeDims.length > 0 ? Math.max(...nodeDims.map((d) => d.width)) : NODE_W;
+  const maxNodeH = nodeDims.length > 0 ? Math.max(...nodeDims.map((d) => d.height)) : NODE_H;
+  const hasTitle = Boolean(ast.meta.title && ast.meta.title.trim().length > 0);
+  const titleBand = hasTitle ? TITLE_BAND : 0;
+  const hasBeatCaptions = ast.beats.some((b) => b.label && b.label.trim().length > 0);
+  const bottomBand = hasBeatCaptions ? 44 : 0;
+  const titleW = hasTitle ? Math.max(320, ast.meta.title.trim().length * 11 + SAFE * 2) : 0;
+  let autoW = 1024;
+  let autoH = 640;
   if (nodeCount === 0) {
-    autoW = 1280;
-    autoH = 720;
+    autoW = 960;
+    autoH = 540;
   } else if (dtype === "sequence") {
     const flowCues = ast.beats.flatMap((b) => b.cues).filter((c) => c.kind === "flow");
     const count = Math.max(nodeCount, 1);
     const flowCount = flowCues.length;
-    const requiredW = SAFE * 2 + Math.max(count * 220, 800);
-    const requiredH = TITLE_BAND + NODE_H + 56 + Math.max(flowCount * 76, 280) + SAFE + 48;
-    autoW = Math.max(1088, Math.min(2560, requiredW));
-    autoH = Math.max(640, Math.min(1800, requiredH));
+    const colW = Math.max(200, maxNodeW + 36);
+    const requiredW = SAFE * 2 + Math.max(count * colW, titleW);
+    const requiredH = titleBand + maxNodeH + 48 + Math.max(flowCount * 68, 160) + SAFE + bottomBand;
+    autoW = Math.max(480, Math.min(2560, requiredW));
+    autoH = Math.max(320, Math.min(1800, requiredH));
+  } else if (dtype === "medallion") {
+    const tierSet = /* @__PURE__ */ new Set();
+    for (const id of nodeIds) {
+      const combined = `${id} ${ast.nodes[id].kind}`.toLowerCase();
+      if (combined.includes("bronze") || combined.includes("raw") || combined.includes("landing")) tierSet.add(1);
+      else if (combined.includes("silver") || combined.includes("clean") || combined.includes("curated") || combined.includes("conformed")) tierSet.add(2);
+      else if (combined.includes("gold") || combined.includes("agg") || combined.includes("mart") || combined.includes("analytics")) tierSet.add(3);
+      else if (combined.includes("bi") || combined.includes("dash") || combined.includes("model") || combined.includes("app") || combined.includes("consumer") || combined.includes("user") || combined.includes("client")) tierSet.add(4);
+      else tierSet.add(0);
+    }
+    const tierCount = Math.max(tierSet.size, 4);
+    const tierW = Math.max(260, maxNodeW + 48);
+    const requiredW = Math.max(SAFE * 2 + tierCount * tierW, titleW);
+    const requiredH = titleBand + SAFE * 2 + Math.max(440, maxNodeH * 3 + 120) + bottomBand;
+    autoW = Math.max(640, Math.min(2800, requiredW));
+    autoH = Math.max(400, Math.min(1600, requiredH));
   } else if (dtype === "tree") {
     let measureSubtree2 = function(id) {
       const kids = children.get(id) ?? [];
@@ -2127,15 +2358,16 @@ function computeAdaptiveDimensions(ast, edges) {
     }
     for (const id of nodeIds) if (!depth.has(id)) depth.set(id, 0);
     const maxDepth = Math.max(...depth.values(), 0);
-    const minLeafWidth = NODE_W + 48;
+    const minLeafWidth = Math.max(NODE_W + 36, maxNodeW + 36);
     const subtreeSpan = /* @__PURE__ */ new Map();
     let totalRootsWidth = 0;
     const activeRoots = roots.length > 0 ? roots : nodeIds;
     for (const r of activeRoots) totalRootsWidth += measureSubtree2(r);
-    const requiredW = SAFE * 2 + totalRootsWidth;
-    const requiredH = TITLE_BAND + SAFE * 2 + (maxDepth + 1) * 140;
-    autoW = Math.max(1120, Math.min(2560, requiredW));
-    autoH = Math.max(640, Math.min(1600, requiredH));
+    const levelH = Math.max(130, maxNodeH + 54);
+    const requiredW = Math.max(SAFE * 2 + totalRootsWidth, titleW);
+    const requiredH = titleBand + SAFE * 2 + (maxDepth + 1) * levelH + bottomBand;
+    autoW = Math.max(480, Math.min(2560, requiredW));
+    autoH = Math.max(320, Math.min(1800, requiredH));
   } else if (dtype === "swimlane") {
     const laneCount = Math.max(groupCount, 1);
     const maxInLane = Math.max(
@@ -2143,37 +2375,56 @@ function computeAdaptiveDimensions(ast, edges) {
       Math.ceil(nodeCount / laneCount),
       1
     );
-    const requiredW = SAFE * 2 + 140 + maxInLane * 220;
-    const requiredH = TITLE_BAND + SAFE * 2 + laneCount * 140;
-    autoW = Math.max(1152, Math.min(2560, requiredW));
-    autoH = Math.max(640, Math.min(1600, requiredH));
+    const stepX = Math.max(200, maxNodeW + 36);
+    const laneH = Math.max(130, maxNodeH + 54);
+    const requiredW = Math.max(SAFE * 2 + 140 + maxInLane * stepX, titleW);
+    const requiredH = titleBand + SAFE * 2 + laneCount * laneH + bottomBand;
+    autoW = Math.max(480, Math.min(2560, requiredW));
+    autoH = Math.max(320, Math.min(1800, requiredH));
   } else if (dtype === "pyramid") {
     const tierCount = Math.max(nodeCount, 1);
-    autoW = 1280;
-    const requiredH = TITLE_BAND + SAFE * 2 + tierCount * 110;
-    autoH = Math.max(640, Math.min(1440, requiredH));
+    const tierH = Math.max(100, maxNodeH + 28);
+    autoW = Math.max(480, Math.min(2e3, Math.max(SAFE * 2 + maxNodeW * 2 + 100, titleW)));
+    const requiredH = titleBand + SAFE * 2 + tierCount * tierH + bottomBand;
+    autoH = Math.max(320, Math.min(1440, requiredH));
   } else if (dtype === "layers") {
     const layerCount = Math.max(nodeCount, 1);
-    autoW = 1280;
-    const requiredH = TITLE_BAND + SAFE * 2 + layerCount * 96;
-    autoH = Math.max(640, Math.min(1440, requiredH));
+    const layerH = Math.max(90, maxNodeH + 18);
+    autoW = Math.max(480, Math.min(2e3, Math.max(SAFE * 2 + maxNodeW + 160, titleW)));
+    const requiredH = titleBand + SAFE * 2 + layerCount * layerH + bottomBand;
+    autoH = Math.max(320, Math.min(1440, requiredH));
   } else if (dtype === "timeline" || dtype === "gantt") {
     const milestones = Math.max(nodeCount, 1);
-    const requiredW = SAFE * 2 + milestones * 240;
-    const requiredH = TITLE_BAND + SAFE * 2 + 380;
-    autoW = Math.max(1200, Math.min(2560, requiredW));
-    autoH = Math.max(640, Math.min(1200, requiredH));
+    let totalPhases = milestones;
+    if (dtype === "gantt") {
+      totalPhases = Math.max(...nodeIds.map((nid) => {
+        const p = ast.nodes[nid].props.phase;
+        const s = ast.nodes[nid].props.span;
+        return (typeof p === "number" ? p : 0) + (typeof s === "number" ? s : 1);
+      }), milestones);
+    }
+    const milestoneW = Math.max(220, maxNodeW + 36);
+    const requiredW = Math.max(
+      SAFE * 2 + (dtype === "gantt" ? totalPhases * Math.max(160, maxNodeW + 16) : milestones * milestoneW),
+      titleW
+    );
+    const requiredH = dtype === "gantt" ? titleBand + SAFE * 2 + milestones * Math.max(76, maxNodeH + 16) + 40 + bottomBand : titleBand + SAFE * 2 + Math.max(260, maxNodeH * 2 + 80) + bottomBand;
+    autoW = Math.max(480, Math.min(2560, requiredW));
+    autoH = Math.max(320, Math.min(1600, requiredH));
   } else if (dtype === "loop" || dtype === "flywheel" || dtype === "radar" || dtype === "venn" || dtype === "constellation") {
     const N = Math.max(nodeCount, 3);
-    const minRadius = 200;
-    const radiusNeeded = Math.max(minRadius, N * 180 / (2 * Math.PI));
-    const requiredW = SAFE * 2 + radiusNeeded * 2 + 240;
-    const requiredH = TITLE_BAND + SAFE * 2 + radiusNeeded * 2 + 140;
-    autoW = Math.max(1088, Math.min(2200, requiredW));
-    autoH = Math.max(720, Math.min(1600, requiredH));
+    const minRadius = Math.max(160, maxNodeW * 0.75);
+    const nodeFootprint = Math.max(160, maxNodeW + 16);
+    const radiusNeeded = Math.max(minRadius, N * nodeFootprint / (2 * Math.PI));
+    const requiredW = Math.max(SAFE * 2 + radiusNeeded * 2 + maxNodeW + 40, titleW);
+    const requiredH = titleBand + SAFE * 2 + radiusNeeded * 2 + maxNodeH + 40 + bottomBand;
+    autoW = Math.max(480, Math.min(2400, requiredW));
+    autoH = Math.max(360, Math.min(1800, requiredH));
   } else if (dtype === "quadrant") {
-    autoW = 1200;
-    autoH = 800;
+    const requiredW = Math.max(480, SAFE * 2 + maxNodeW * 2.5, titleW);
+    const requiredH = titleBand + SAFE * 2 + maxNodeH * 3 + bottomBand;
+    autoW = Math.min(2400, requiredW);
+    autoH = Math.min(1600, requiredH);
   } else {
     const forceVertical = dtype === "flowchart" && isVertical || isVertical;
     const ranks = assignRanks(nodeIds, effectiveEdges, forceVertical ? "TB" : "LR");
@@ -2186,47 +2437,26 @@ function computeAdaptiveDimensions(ast, edges) {
     const rankCount = Math.max(...byRank.keys(), 0) + 1;
     const maxInRank = Math.max(...[...byRank.values()].map((v) => v.length), 1);
     const groupPaddingBonus = groupCount > 0 ? GROUP_PAD * 2 : 0;
+    const maxRankW = maxNodeW;
+    const maxRankH = maxNodeH;
     if (forceVertical) {
-      const requiredW = SAFE * 2 + maxInRank * NODE_W + (maxInRank - 1) * 44 + groupPaddingBonus;
-      const requiredH = SAFE * 2 + TITLE_BAND + rankCount * NODE_H + (rankCount - 1) * 56 + groupPaddingBonus;
-      if (nodeCount <= 2) {
-        autoW = 960;
-        autoH = 640;
-      } else if (nodeCount <= 4 && rankCount <= 3) {
-        autoW = 1024;
-        autoH = 720;
-      } else {
-        autoW = Math.max(960, Math.min(2400, requiredW));
-        autoH = Math.max(720, Math.min(2e3, requiredH));
-      }
+      const colSpacing = 44;
+      const rowGap = 56;
+      const contentNeededW = maxInRank * maxRankW + Math.max(0, maxInRank - 1) * colSpacing + groupPaddingBonus;
+      const requiredW = SAFE * 2 + contentNeededW;
+      autoW = Math.max(480, Math.min(2400, Math.max(requiredW, titleW)));
+      const contentNeededH = rankCount * maxRankH + Math.max(0, rankCount - 1) * rowGap + groupPaddingBonus;
+      const requiredH = SAFE * 2 + titleBand + bottomBand + contentNeededH;
+      autoH = Math.max(360, Math.min(3200, requiredH));
     } else {
-      const hasTitle = Boolean(ast.meta.title && ast.meta.title.trim().length > 0);
-      const hasBeatCaptions = ast.beats.some((b) => b.label && b.label.trim().length > 0);
-      const titleBand = hasTitle ? TITLE_BAND : 0;
-      const bottomBand = hasBeatCaptions ? 44 : 0;
-      const maxRankW = Math.max(...nodeIds.map((id) => computeNodeDimensions(ast.nodes[id]).width));
-      const maxRankH = Math.max(...nodeIds.map((id) => computeNodeDimensions(ast.nodes[id]).height));
-      const requiredW = SAFE * 2 + rankCount * maxRankW + (rankCount - 1) * 56 + groupPaddingBonus;
-      const requiredH = SAFE * 2 + titleBand + bottomBand + maxInRank * maxRankH + (maxInRank - 1) * 44 + groupPaddingBonus;
-      if (maxInRank === 1 && !hasTitle) {
-        autoW = Math.max(1024, Math.min(2560, requiredW));
-        autoH = Math.max(hasBeatCaptions ? 240 : 208, Math.min(360, requiredH + 24));
-      } else if (maxInRank === 2 && !hasTitle) {
-        autoW = Math.max(1024, Math.min(2560, requiredW));
-        autoH = Math.max(hasBeatCaptions ? 368 : 336, Math.min(480, requiredH + 24));
-      } else if (maxInRank === 3 && !hasTitle) {
-        autoW = Math.max(1152, Math.min(2560, requiredW));
-        autoH = Math.max(hasBeatCaptions ? 480 : 448, Math.min(640, requiredH + 24));
-      } else if (nodeCount <= 2 && rankCount <= 2) {
-        autoW = 1024;
-        autoH = hasTitle ? 576 : 384;
-      } else if (nodeCount <= 4 && rankCount <= 3 && maxInRank <= 2) {
-        autoW = 1152;
-        autoH = hasTitle ? 648 : 448;
-      } else {
-        autoW = Math.max(1152, Math.min(2560, requiredW));
-        autoH = Math.max(hasTitle ? 648 : maxInRank <= 2 ? 448 : 576, Math.min(1600, requiredH));
-      }
+      const colGap = 56;
+      const rowGap = 44;
+      const contentNeededW = rankCount * maxRankW + Math.max(0, rankCount - 1) * colGap + groupPaddingBonus;
+      const requiredW = SAFE * 2 + contentNeededW;
+      const contentNeededH = maxInRank * maxRankH + Math.max(0, maxInRank - 1) * rowGap + groupPaddingBonus;
+      const requiredH = SAFE * 2 + titleBand + bottomBand + contentNeededH;
+      autoW = Math.max(480, Math.min(2560, Math.max(requiredW, titleW)));
+      autoH = Math.max(240, Math.min(1800, requiredH));
     }
   }
   return {
@@ -3365,7 +3595,8 @@ function parse(source, opts = {}) {
     fps: 60,
     theme: "paper",
     explicitTheme: false,
-    direction: "LR"
+    direction: "LR",
+    explicitDirection: false
   };
   const styles = {};
   const nodes = {};
@@ -3466,10 +3697,11 @@ function parse(source, opts = {}) {
         meta.title = title;
         remainder = str.rest;
       }
-      const inlineLayout = remainder.match(/\blayout\s+(LR|RL|TB|BT)\b/i);
+      const inlineLayout = remainder.match(/\b(?:layout|direction|rankdir)\s+(LR|RL|TB|BT)\b/i);
       if (inlineLayout) {
         meta.direction = inlineLayout[1].toUpperCase();
-        remainder = remainder.replace(/\blayout\s+(LR|RL|TB|BT)\b/i, " ");
+        meta.explicitDirection = true;
+        remainder = remainder.replace(/\b(?:layout|direction|rankdir)\s+(LR|RL|TB|BT)\b/i, " ");
       }
       const props = parseProps(remainder);
       for (const [k, v] of Object.entries(props)) {
@@ -3490,8 +3722,10 @@ function parse(source, opts = {}) {
           const val = String(v).toLowerCase();
           meta.theme = val;
           meta.explicitTheme = val !== "auto";
-        } else if (k === "direction" || k === "layout") meta.direction = String(v).toUpperCase();
-        else if (PLAYER_FLAT_KEY_SET.has(k)) {
+        } else if (k === "direction" || k === "layout" || k === "rankdir") {
+          meta.direction = String(v).toUpperCase();
+          meta.explicitDirection = true;
+        } else if (PLAYER_FLAT_KEY_SET.has(k)) {
           const error = applyPlayerSetting(meta.player ??= {}, "player", k, String(v));
           if (error) diagnostics.push({ severity: "warning", message: error, line: lineNo });
         } else if (k === "type") {
@@ -3500,8 +3734,9 @@ function parse(source, opts = {}) {
             diagnostics.push({ severity: "warning", message: `unknown diagram type '${v}'`, line: lineNo });
           } else {
             meta.type = t;
-            if (t === "flowchart" && !props.direction && !props.layout && !inlineLayout) {
+            if (t === "flowchart" && !props.direction && !props.layout && !props.rankdir && !inlineLayout) {
               meta.direction = "TB";
+              meta.explicitDirection = true;
             }
           }
         }
@@ -3528,6 +3763,7 @@ function parse(source, opts = {}) {
     }
     if (/^layout\s+(LR|RL|TB|BT)\b/i.test(line)) {
       meta.direction = line.split(/\s+/)[1].toUpperCase();
+      meta.explicitDirection = true;
       i++;
       continue;
     }
@@ -5659,7 +5895,7 @@ function diagnoseMarkdyCode(code, options = {}) {
           });
         }
       }
-      const layoutMatch = trimmed.match(/\blayout\s*=?\s*(\w+)/i);
+      const layoutMatch = trimmed.match(/\b(?:layout|direction|rankdir)\s*=?\s*(\w+)/i);
       if (layoutMatch) {
         const layoutVal = layoutMatch[1].toUpperCase();
         if (!LAYOUT_DIRECTIONS.includes(layoutVal)) {
@@ -8725,6 +8961,7 @@ export {
   compilePlan,
   compressMarkdyToUrlHash,
   computeAdaptiveDimensions,
+  computeNodeDimensions,
   damerauLevenshteinDistance,
   decompressMarkdyFromUrlHash,
   detectArchitectureDrift,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@markdy/core",
-  "version": "1.3.1",
+  "version": "1.3.3",
   "description": "Diagram-native MarkdyScript parser and compiler (auto-layout, edge routing, cue scheduling) — zero runtime dependencies.",
   "license": "MIT",
   "type": "module",