:root{font-family:Arial Narrow,Helvetica Neue,Arial,Microsoft YaHei,sans-serif;color:#050505;background:#fbfaf6;font-size:14px}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #d6a82e;outline-offset:2px}button:disabled{opacity:.4;cursor:default}[hidden]{display:none!important}.quiet,.primary{border:2px solid #050505;border-radius:7px;background:#fbfaf6;color:#050505;padding:9px 13px;min-height:40px}.primary,.quiet:hover,.quiet.active{background:#050505;color:#fbfaf6}.primary:hover{background:#262626}.site-head{min-height:76px;display:flex;align-items:center;gap:14px;padding:14px clamp(16px,3vw,45px);border-bottom:2px solid #050505;flex-wrap:wrap}.brand{display:flex;align-items:center;gap:15px;text-decoration:none;color:inherit;white-space:nowrap}.brand img{width:32px;height:32px}.brand span{font:700 21px/1 Consolas,Courier New,monospace;letter-spacing:.12em}.site-name{font:12px Consolas,Courier New,monospace;margin-right:auto;color:#555}main{max-width:1800px;margin:0 auto;padding:28px clamp(16px,3vw,45px) 50px}.page-heading{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:24px}.eyebrow{font:11px Consolas,Courier New,monospace;letter-spacing:.1em;color:#555}.page-heading h1{font-size:clamp(30px,4vw,48px);margin:8px 0 0}.page-heading>p{max-width:390px;line-height:1.6;margin:0 0 5px}.plan-tools{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;border:2px solid #050505;border-bottom:0;border-radius:9px 9px 0 0;padding:12px 16px;background:#f2f1ec}.tools,.graph-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.tools button{white-space:nowrap}#plan-status{font-size:12px;color:#555}.workspace{border:2px solid #050505;border-radius:0 0 9px 9px;overflow:hidden;background:#fbfaf6}.canvas-panel{min-width:0}.canvas-toolbar{min-height:60px;border-bottom:2px solid #050505;display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:10px 14px;background:#fbfaf6}.canvas-toolbar b{font:700 14px Consolas,Courier New,monospace;white-space:nowrap}.toolbar-hint{font-size:12px;color:#555;margin-right:auto}.graph-actions .quiet{font-size:12px;padding:6px 9px;min-height:34px}.graph-actions button:disabled{opacity:.4}#graph-save-status{font-size:12px;white-space:nowrap;margin-right:5px}#graph-save-status[data-state=failed]{color:#9d2d1c}#canvas{height:max(65vh,560px);position:relative;overflow:hidden;touch-action:none;user-select:none;background-color:#fbfaf6;background-image:radial-gradient(#05050530 1px,transparent 1px);background-size:24px 24px;cursor:default}#canvas.space-pan{cursor:grab}#canvas.dragging.space-pan{cursor:grabbing}#canvas.is-linking,#canvas.link-mode{cursor:crosshair}#world{position:absolute;left:0;top:0;transform-origin:0 0;width:0;height:0;will-change:transform}#world:not(.instant){transition:transform .22s cubic-bezier(.22,1,.36,1)}#nodes{position:absolute;left:0;top:0}#edges{position:absolute;left:0;top:0;overflow:visible;pointer-events:none}.node{position:absolute;left:0;top:0;width:154px;min-height:84px;padding:9px 10px;text-align:left;display:flex;flex-direction:column;gap:5px;border:2px solid #050505;border-radius:7px;background:#fbfaf6;color:#050505;box-shadow:5px 5px 0 #05050518;cursor:grab;touch-action:none}.node:active{cursor:grabbing}.node.selected{outline:3px solid #d6a82e;outline-offset:3px}.node h3{font-size:14px;line-height:1.35;margin:0;overflow-wrap:anywhere}.node-kind{font:10px Consolas,Courier New,monospace;letter-spacing:.08em;display:flex;justify-content:space-between}.node-indicator{width:6px;height:6px;border-radius:50%;background:#d6a82e}.node-sub{font-size:11px;line-height:1.3;max-height:32px;overflow:hidden;color:#555}.node.execute-node{background:#050505;color:#fbfaf6}.node.execute-node .node-sub{color:#ddd}.node.connect-point{width:18px;min-height:18px;height:18px;padding:0;border-radius:50%;background:#050505;box-shadow:none}.node.connect-point>*{display:none}.node.link-target,.node.insert-node{outline:3px solid #d6a82e;outline-offset:5px}.node.cut-warning{outline:3px solid #d15134;outline-offset:3px}#edges path.editable-edge{stroke:#050505;stroke-width:3;stroke-linecap:round;fill:none;pointer-events:stroke;cursor:pointer}#edges path.editable-edge:hover,#edges path.edge-selected{stroke:#ad8123;stroke-width:5}#edges path.cut-warning{stroke:#d15134;stroke-width:6}#edges path.insert-target{stroke:#d6a82e;stroke-width:6;stroke-dasharray:8 4}.edge-label{fill:#050505;stroke:#fbfaf6;stroke-width:4;paint-order:stroke;stroke-linejoin:round;text-anchor:middle;font:13px Arial,sans-serif;pointer-events:all;cursor:pointer}.canvas-caption{position:absolute;left:16px;top:15px;z-index:3;font:11px Consolas,Courier New,monospace;letter-spacing:.08em;pointer-events:none;background:#fbfaf6dd;padding:5px 7px}.canvas-caption span{font-family:Arial,Microsoft YaHei,sans-serif;letter-spacing:0;margin-left:10px}.zoom-controls{position:absolute;left:16px;bottom:16px;z-index:8;display:flex;align-items:center;background:#fbfaf6;border:2px solid #050505;border-radius:7px}.zoom-controls button{background:transparent;border:0;min-width:36px;height:36px}.zoom-controls span{min-width:52px;text-align:center;font:12px Consolas,Courier New,monospace}.graph-overlay{position:absolute;inset:0;pointer-events:none;z-index:5;overflow:hidden}.gesture-svg{width:100%;height:100%;overflow:visible}.gesture-path{fill:none;stroke:#050505;stroke-width:2;stroke-dasharray:6 4}.gesture-path.cut{stroke:#d15134;stroke-width:3;stroke-dasharray:none}.selection-box{position:absolute;border:2px solid #050505;background:#d6a82e30}.graph-hint{position:absolute;right:14px;bottom:16px;max-width:65%;font-size:11px;line-height:1.5;background:#fbfaf6ed;padding:5px 8px;color:#262626;border:1px solid #05050530}.cut-tip{position:absolute;left:0;top:0;width:8px;height:8px;margin:-4px;border-radius:50%;background:#d15134;box-shadow:0 0 0 3px #fbfaf6}.cut-effects{position:absolute;inset:0;pointer-events:none;overflow:hidden}.cut-node-half{position:absolute;pointer-events:none;transform-origin:center;isolation:isolate}.cut-node-half .node{opacity:1!important;outline:none!important}.cut-seam{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.cut-seam line{stroke:#d15134;stroke-width:3}.cut-edge-ghost{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.cut-edge-ghost path{fill:none;stroke:#d15134;stroke-width:5;stroke-linecap:round}.graph-menu,.graph-editor{position:fixed;z-index:1000;background:#fbfaf6;border:2px solid #050505;border-radius:9px;box-shadow:9px 9px 0 #05050525;padding:6px;min-width:240px}.graph-menu button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:15px;text-align:left;background:transparent;color:#050505;border:0;border-radius:5px;padding:10px}.graph-menu button:hover,.graph-menu button:focus-visible{background:#050505;color:#fbfaf6;outline:none}.graph-menu kbd{font:11px Consolas,Courier New,monospace}.graph-menu button:disabled{opacity:.4}.node-add-heading,.node-add-foot{padding:8px 10px;font:11px Consolas,Courier New,monospace}.node-add-heading{border-bottom:1px solid #999}.node-add-foot{border-top:1px solid #999}.node-type-symbol{font-size:18px;min-width:22px}.node-type-copy{display:grid;gap:3px}.node-type-copy small{font-size:11px}.graph-editor{padding:10px}.graph-editor input{width:100%;border:2px solid #050505;border-radius:5px;padding:8px;background:#fff}.graph-editor small{display:block;margin-top:7px}.graph-help,.plan-node-dialog{background:#fbfaf6;color:#050505;border:2px solid #050505;border-radius:9px;box-shadow:12px 12px 0 #05050530;width:min(620px,calc(100vw - 32px));max-height:85vh;overflow:auto;padding:22px}.graph-help::backdrop,.plan-node-dialog::backdrop{background:#050505a8}.graph-help form{float:right}.graph-help h2,.plan-node-dialog h2{margin:0 0 15px;font-size:22px}.graph-help dl{display:grid;grid-template-columns:150px 1fr;margin:15px 0}.graph-help dt,.graph-help dd{padding:9px 0;margin:0;border-bottom:1px solid #c9c8c3;line-height:1.5}.graph-help dt{font-weight:700}.graph-help p{line-height:1.6}.plan-node-dialog label{display:grid;gap:7px;margin:14px 0}.plan-node-dialog input,.plan-node-dialog textarea{width:100%;background:#fff;color:#050505;border:2px solid #050505;border-radius:5px;padding:9px}.node-dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}#plan-node-error{color:#9d2d1c}.workspace.graph-expanded{position:fixed;inset:10px;z-index:100;background:#fbfaf6;border-radius:9px;box-shadow:0 0 0 20px #05050590}.graph-expanded .canvas-panel{display:flex;flex-direction:column;height:100%}.graph-expanded #canvas{height:auto;min-height:0;flex:1}.graph-expanded-page{overflow:hidden}.storage-note{font-size:12px;color:#555;line-height:1.5}#toast{position:fixed;bottom:22px;right:22px;z-index:1100;max-width:360px;background:#050505;color:#fbfaf6;padding:12px 15px;border-radius:7px;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .18s,transform .18s}#toast.is-visible{opacity:1;transform:none}@media(max-width:720px){.site-name{width:100%;order:3}.page-heading{display:block}.page-heading>p{margin-top:14px}.canvas-caption span,.toolbar-hint,.graph-hint{display:none}#canvas{height:65vh;min-height:480px}.graph-help dl{grid-template-columns:1fr}.graph-help dt{border-bottom:0;padding-bottom:0}.graph-help dd{padding-top:2px}}@media(prefers-reduced-motion:reduce){#world,#toast{transition:none!important}}

.mobile-tip{display:none}@media(max-width:720px){.mobile-tip{display:block;width:100%;margin:0;border-top:1px solid #b5b4ae;padding-top:10px;color:#555;font-size:12px;line-height:1.55}}

.mobile-edit{display:none}@media(max-width:720px){.mobile-edit{display:inline-block}}

/* The canvas owns the viewport; controls float above it instead of pushing it down. */
html,body{width:100%;height:100%;overflow:hidden}
body{display:flex;flex-direction:column;min-height:0;height:100dvh}
.site-head{flex:0 0 58px;min-height:58px;padding:8px 16px;gap:10px;flex-wrap:nowrap;z-index:12;background:#fbfaf6}
.brand img{width:28px;height:28px}.brand span{font-size:15px}
.site-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
main{position:relative;flex:1;min-height:0;max-width:none;width:100%;padding:0;overflow:hidden}
.page-heading,.storage-note,.mobile-tip{display:none!important}
.workspace{position:relative;width:100%;height:100%;border:0;border-radius:0;overflow:hidden}
.canvas-panel{position:relative;width:100%;height:100%}
#canvas{width:100%;height:100%;min-height:0}
.plan-tools{position:absolute;z-index:20;top:12px;left:12px;max-width:calc(100% - 24px);border:2px solid #050505;border-radius:8px;padding:8px 10px;box-shadow:5px 5px 0 #05050518}
.canvas-toolbar{position:absolute;z-index:20;top:12px;right:12px;max-width:calc(100% - 24px);min-height:0;border:2px solid #050505;border-radius:8px;padding:8px 10px;box-shadow:5px 5px 0 #05050518}
.canvas-toolbar b,.toolbar-hint{display:none}
.graph-actions{flex-wrap:nowrap}
.graph-actions button{white-space:nowrap}
.zoom-controls{bottom:12px;left:12px}
.canvas-caption{top:76px}
.workspace.graph-expanded{position:relative;inset:auto;z-index:auto;box-shadow:none;border-radius:0}
.graph-expanded-page{overflow:hidden}
.mobile-help{display:none}
@media(max-width:1100px){.canvas-toolbar{top:auto;right:12px;bottom:12px}}
@media(max-width:720px){
 .site-head{flex-basis:52px;min-height:52px;padding:6px 10px;gap:6px}
 .brand span,.site-name{display:none}
 .site-head .quiet{font-size:12px;min-height:38px;padding:7px 9px}
 .site-head #export-graph{margin-left:auto}
 .plan-tools{top:8px;left:8px;right:8px;max-width:none;padding:7px;display:block}
 .tools{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:6px;scrollbar-width:thin}
 .tools::-webkit-scrollbar,.graph-actions::-webkit-scrollbar{display:none}
 .tools{scrollbar-width:none}
 .tools button{flex:none;min-height:42px;padding:8px 10px;font-size:13px}
 #disconnect-slot:disabled,#remove-slot:disabled{display:none}
 #plan-status{display:block;margin:5px 2px 0;min-height:14px;font-size:11px}
 .canvas-toolbar{left:8px;right:8px;bottom:8px;max-width:none;padding:6px}
 .graph-actions{width:100%;overflow-x:auto;gap:5px;scrollbar-width:none}
 .graph-actions .quiet{flex:none;min-height:42px;padding:7px;font-size:11px}
 #graph-save-status{display:none}
 #canvas{height:100%;min-height:0}
 .canvas-caption{display:none}
 .zoom-controls{left:8px;bottom:72px}
 .zoom-controls button{min-width:42px;height:42px}
 .graph-menu{max-height:min(65dvh,400px);overflow:auto}
 .graph-editor{max-width:calc(100vw - 24px)}
 .graph-hint{display:none}
 .mobile-help{display:block;font-weight:700}
}