*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0a0a0a;--surface:#1c1c1c;--border:#2e2e2e;--amber:#f59e0b;--violet:#8b5cf6;--rose:#f43f5e;--text:#e5e5e5;--muted:#555;--font-mono:"JetBrains Mono", "Fira Code", "Cascadia Code", ui-monospace, monospace}html,body{background:var(--bg);width:100%;height:100%;color:var(--text);font-family:var(--font-mono);overscroll-behavior:none;overflow:hidden}#canvas{touch-action:none;-webkit-user-select:none;user-select:none;width:100vw;height:100vh;display:block}#toolbar{background:var(--surface);border:1px solid var(--border);z-index:100;touch-action:manipulation;border-radius:12px;align-items:center;gap:8px;padding:8px 14px;display:flex;position:fixed;top:16px;left:50%;transform:translate(-50%);box-shadow:0 4px 24px #00000080}#toolbar .logo{letter-spacing:.08em;color:var(--amber);margin-right:4px;font-size:13px;font-weight:700}#toolbar .sep{background:var(--border);width:1px;height:18px;margin:0 2px}#toolbar .hint{color:var(--muted);letter-spacing:.04em;font-size:10px}#toolbar button{border:1px solid var(--border);color:var(--text);font-family:var(--font-mono);cursor:pointer;touch-action:manipulation;background:0 0;border-radius:6px;min-height:36px;padding:6px 14px;font-size:11px;transition:border-color .15s,color .15s}#toolbar button:hover{border-color:var(--amber);color:var(--amber)}#toolbar button:active{border-color:var(--amber);color:var(--amber);opacity:.7}@media (width<=600px){#toolbar .hint,#toolbar .sep{display:none}}#op-picker{background:var(--surface);border:1px solid var(--rose);z-index:200;touch-action:manipulation;border-radius:10px;gap:6px;padding:8px 10px;animation:.12s pop-in;display:flex;position:fixed;transform:translate(-50%,-50%);box-shadow:0 0 20px #f43f5e26,0 4px 16px #0009}#op-picker button{border:1px solid var(--border);color:var(--rose);font-family:var(--font-mono);cursor:pointer;touch-action:manipulation;background:0 0;border-radius:6px;justify-content:center;align-items:center;width:44px;height:44px;font-size:18px;font-weight:700;transition:background .12s,border-color .12s;display:flex}#op-picker button:hover,#op-picker button:active{border-color:var(--rose);background:#f43f5e1f}#edit-popup{z-index:200;animation:.1s pop-in;position:fixed;transform:translate(-50%,-50%)}#edit-popup input{background:var(--surface);border:1.5px solid var(--amber);color:var(--amber);font-family:var(--font-mono);text-align:center;border-radius:7px;outline:none;width:150px;padding:8px 14px;font-size:max(16px,1em);font-weight:700;box-shadow:0 0 16px #f59e0b33}#label-edit{border:none;border-bottom:1px solid var(--muted);color:var(--text);font-family:var(--font-mono);letter-spacing:.08em;z-index:200;text-transform:uppercase;background:0 0;outline:none;width:80px;padding:0 2px;font-size:16px;font-weight:400;position:fixed}#label-edit::placeholder{color:var(--muted)}@keyframes pop-in{0%{opacity:0;transform:translate(-50%,-50%)scale(.92)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}.node{cursor:grab}.node:active{cursor:grabbing}.del-btn{opacity:0;transition:opacity .15s}.node:hover .del-btn{opacity:1}.node-label{opacity:.6;transition:opacity .15s}.node:hover .node-label{opacity:1}.op-badge{transition:stroke .15s}.op-hit:hover~.op-badge,.op-hit:active~.op-badge{stroke:#ff6b6b}.port-hit{cursor:crosshair}.del-hit{cursor:pointer}@media (hover:none){.del-btn{opacity:.7}.node-label{opacity:1}}::-webkit-scrollbar{display:none}