.canvas-container{flex:1;position:relative;background-color:var(--bg-canvas);overflow:hidden}.canvas-wrapper{width:100%;height:100%;overflow:hidden;cursor:grab}.canvas-wrapper:active{cursor:grabbing}.xml-canvas{width:100%;height:100%}.canvas-content{transform-origin:0 0}.canvas-empty-state{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:var(--text-secondary)}.canvas-empty-state .welcome-logo{width:96px;height:auto;margin-bottom:8px;filter:drop-shadow(0 4px 12px rgba(59, 130, 246, .25))}.canvas-empty-state h2{margin:16px 0 8px;font-size:24px;color:var(--text-primary)}.canvas-empty-state p{margin-bottom:16px;font-size:15px}.canvas-empty-state .hint{margin-bottom:0;color:var(--text-muted)}.canvas-empty-state .privacy-notice{display:inline-flex;align-items:center;gap:6px;margin-top:20px;margin-bottom:0;padding:8px 16px;font-size:12px;color:var(--text-muted);background:var(--bg-secondary);border-radius:20px;border:1px solid var(--border-color)}.canvas-empty-state .privacy-notice .privacy-icon{width:14px;height:14px;flex-shrink:0;color:var(--color-success,#4ade80)}.empty-state-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:0}.empty-state-actions .btn-large{min-width:160px}.empty-state-divider{display:flex;align-items:center;justify-content:center;gap:16px;margin:20px 0;color:var(--text-muted);font-size:13px;width:100%}.empty-state-divider::after,.empty-state-divider::before{content:'';width:60px;height:1px;background-color:#b0b8c4}[data-theme=dark] .empty-state-divider::after,[data-theme=dark] .empty-state-divider::before{background-color:var(--border-color)}.canvas-empty-state.hidden{display:none}.xml-node{cursor:pointer}.xml-node .node-rect{fill:var(--node-bg);stroke:var(--node-border);stroke-width:1.5;rx:6;transition:all var(--transition-fast);cursor:pointer;pointer-events:all}.xml-node:hover .node-rect{fill:var(--node-hover)}.xml-node.selected .node-rect{stroke:var(--node-selected);stroke-width:2;filter:drop-shadow(0 2px 4px rgba(59, 130, 246, .3))}.xml-node.dragging{opacity:.8;pointer-events:none}.xml-node.drop-target .node-rect{stroke:var(--color-success);stroke-width:2}.xml-node.drop-before .node-rect{stroke-dasharray:5,3}.xml-node.drop-before::before{content:'';position:absolute;top:-4px;left:0;right:0;height:3px;background-color:var(--color-success)}.xml-node.drop-after .node-rect{stroke-dasharray:5,3}.xml-node.drop-inside .node-rect{fill:#dcfce7;stroke:var(--color-success)}.xml-node .node-tag{font-family:'SF Mono',Monaco,Inconsolata,'Fira Code',monospace;font-size:12px;font-weight:600;fill:var(--color-primary);pointer-events:none}.xml-node .node-text{font-size:11px;fill:var(--text-secondary);pointer-events:none}.xml-node .node-attr-count{font-size:10px;fill:var(--text-muted);pointer-events:none}.xml-node .collapse-btn{cursor:pointer;fill:var(--bg-tertiary);stroke:var(--border-color-dark);stroke-width:1;pointer-events:all}.xml-node .collapse-btn:hover{fill:var(--border-color)}.xml-node .collapse-icon{font-size:12px;font-weight:700;fill:var(--text-secondary);text-anchor:middle;dominant-baseline:central;pointer-events:none}.connection-line{fill:none;stroke:var(--border-color-dark);stroke-width:1.5;pointer-events:none}.connection-line.dashed{stroke-dasharray:5,3}.connection-line.bold{stroke-width:2.5}.connection-line.dotted{stroke-dasharray:2,2}.drop-indicator-after,.drop-indicator-before{stroke:var(--color-success);stroke-width:2;fill:none;pointer-events:none}.xml-node .node-shape{fill:var(--node-bg);stroke:var(--node-border);stroke-width:1.5;transition:all var(--transition-fast);cursor:pointer;pointer-events:all}.xml-node:hover .node-shape{fill:var(--node-hover)}.xml-node.selected .node-shape{stroke:var(--node-selected);stroke-width:2;filter:drop-shadow(0 2px 4px rgba(59, 130, 246, .3))}.xml-node .shape-accent{pointer-events:none}