:root{--bg:#f4f6f9;--panel:#fff;--panel-2:#fff;--line:#e4e8ef;--field:#f6f8fb;--hover:#eef2f8;--accent-soft:#e9f1ff;--grid:#2d5aa00d;--grid-strong:#2d5aa01a;--ink:#1b2330;--ink-dim:#6c7686;--steel:#475569;--amber:#f59e0b;--amber-dim:#f0d6a8;--cyan:#2563eb;--ground:#64748b;--tens:#2563eb;--comp:#ef4444;--react:#10b981;--apply:#f59e0b;--danger:#ef4444;--good:#10b981;--node-fill:#fff;--node-ring:#64748b;--driven-fill:#fef3da;--slider:#3b82f6;--slider-rail:#9aa7bd;--weld:#8b5cf6;--brace:#8b5cf66b;--lock:#db2777;--moment:#7c3aed;--r:12px;--shadow:0 1px 3px #141e320d}*{box-sizing:border-box}html,body{height:100%;margin:0}#root{min-height:100%}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;font:14px/1.45 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.app{max-width:1180px;margin:0 auto;padding:14px 18px 40px}header.bar{border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:baseline;gap:14px;margin-bottom:2px;padding-bottom:12px;display:flex}.brand{align-items:center;gap:9px;display:flex}.brand .logo{flex:none;width:26px;height:26px;display:block}header.bar h1{letter-spacing:-.01em;margin:0;font-size:17px;font-weight:700}header.bar h1 .byline{color:var(--ink-dim);letter-spacing:0;font-size:12px;font-weight:500}header.bar .tag{color:var(--cyan);background:var(--accent-soft);letter-spacing:.06em;text-transform:uppercase;border:1px solid #0000;border-radius:999px;padding:5px 9px;font:11px/1 ui-monospace,Menlo,monospace}header.bar .sub{color:var(--ink-dim);font-size:12.5px}header.bar .spacer{margin-left:auto}.tabbar{border-bottom:1px solid var(--line);align-items:center;gap:2px;margin-top:12px;display:flex;overflow-x:auto}.tab{color:var(--ink-dim);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-bottom:2px solid #0000;border-radius:8px 8px 0 0;align-items:center;gap:7px;padding:9px 13px;font-size:13px;display:flex}.tab:hover{background:var(--hover);color:var(--ink)}.tab.on{color:var(--ink);border-bottom-color:var(--cyan);font-weight:600}.tabbar.sub{background:var(--field);margin-top:0;padding-left:6px}.tabbar.sub .tab{padding:7px 12px;font-size:12.5px}.tab .ic{flex:none;width:15px;height:15px}.tab .x{width:17px;height:17px;color:var(--ink-dim);border-radius:5px;justify-content:center;align-items:center;margin-left:3px;font-size:13px;display:inline-flex}.tab .x:hover{background:var(--line);color:var(--danger)}.tab-add{color:var(--ink-dim);cursor:pointer;background:0 0;border:0;border-radius:8px;padding:8px 12px;font-size:17px;line-height:1}.tab-add:hover{background:var(--hover);color:var(--cyan)}.view{margin-top:16px}.view-narrow{max-width:600px}.editor-grid{grid-template-columns:1fr 248px;gap:16px;margin-top:16px;display:grid}.workspace{flex-direction:column;min-width:0;display:flex}.board{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);border-radius:12px;overflow:hidden}.board .ribbon{box-shadow:none;border:0;border-bottom:1px solid var(--line);border-radius:0}.board .stage-wrap{box-shadow:none;border:0;border-radius:0}.modeswitch{border:1px solid var(--line);background:var(--field);touch-action:pan-y;border-radius:10px;display:flex;overflow:hidden}.modetab{color:var(--ink-dim);cursor:pointer;background:0 0;border:0;flex:1;padding:11px 8px;font-size:13px;font-weight:600}.modetab.on{background:var(--accent-soft);color:var(--cyan)}.toolbar{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);border-radius:10px;flex-wrap:wrap;align-items:center;gap:10px;padding:6px 8px;display:flex}.toolgroup{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.toolgroup+.toolgroup{border-left:1px solid var(--line);margin-left:auto;padding-left:8px}.toolbar-note{color:var(--ink-dim);padding:6px 4px;font-size:12.5px}.iconbtn{background:var(--field);border:1px solid var(--line);width:34px;height:34px;color:var(--ink);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;display:inline-flex;position:relative}.iconbtn .ic{width:24px;height:24px;color:var(--ink)}.iconbtn:hover{background:#fff;border-color:#cdd6e4}.iconbtn.on{border-color:var(--cyan);background:var(--accent-soft)}.iconbtn.on .ic{color:var(--cyan)}.iconbtn:disabled{opacity:.4;cursor:default}.iconbtn-tip{color:#fff;white-space:nowrap;z-index:50;pointer-events:none;background:#1b2330;border-radius:6px;padding:4px 7px;font-size:11.5px;position:absolute;top:110%;left:50%;transform:translate(-50%)}.dialog-backdrop{z-index:1100;background:#141e3247;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.dialog{border:1px solid var(--line);background:#fff;border-radius:12px;width:280px;max-width:100%;max-height:90vh;padding:14px;overflow:auto;box-shadow:0 18px 48px #141e3238}.dialog-h{justify-content:space-between;align-items:center;margin-bottom:6px;font-weight:650;display:flex}.dialog-h .x{color:var(--ink-dim);cursor:pointer;background:0 0;border:0;font-size:20px;line-height:1}.dialog-sec{letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim);margin:12px 0 6px;font-size:10.5px;font-weight:700}.dialog .field input{background:var(--field);border:1px solid var(--line);width:120px;color:var(--ink);font:inherit;border-radius:7px;padding:6px 8px}.seg-wrap{flex-wrap:wrap}.seg-wrap button{padding:8px 6px;font-size:12px}.rail{flex-direction:column;gap:14px;display:flex}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:13px}.card h2{letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim);margin:0 0 10px;font-size:10.5px;font-weight:700}.modeseg{border:1px solid var(--line);background:var(--field);border-radius:10px;margin-bottom:9px;display:flex;overflow:hidden}.modeseg button{color:var(--ink-dim);cursor:pointer;background:0 0;border:0;flex:1;justify-content:center;align-items:center;gap:6px;padding:10px 0;font-size:13px;font-weight:600;display:flex}.modeseg button.on{background:var(--accent-soft);color:var(--cyan)}.tools{grid-template-columns:1fr 1fr;gap:7px;display:grid}.tool{background:var(--field);color:var(--ink);border:1px solid var(--line);cursor:pointer;border-radius:9px;justify-content:flex-start;align-items:center;gap:7px;padding:9px;font-size:12.5px;transition:border-color .12s,background .12s,transform 40ms;display:flex}.tool:hover{background:#fff;border-color:#cdd6e4}.tool:active{transform:translateY(1px)}.tool.active{border-color:var(--cyan);background:var(--accent-soft);color:var(--cyan)}.tool .ic{width:16px;height:16px;color:var(--cyan);flex:none}.row{gap:7px;display:flex}.btn{border:1px solid var(--line);color:var(--ink);cursor:pointer;background:#fff;border-radius:9px;flex:1;justify-content:center;align-items:center;gap:7px;padding:10px;font-size:13px;transition:border-color .12s,background .12s;display:flex}.btn:hover{background:var(--hover);border-color:#cdd6e4}.btn:disabled{opacity:.45;cursor:default}.btn .ic{width:15px;height:15px}.btn.primary{background:var(--amber);border-color:var(--amber);color:#3a2600;font-weight:650}.btn.primary:hover{filter:brightness(.97);background:var(--amber)}.btn.ghost{color:var(--ink-dim)}.btn.danger{color:var(--danger)}.btn.danger:hover{border-color:var(--danger);color:var(--danger);background:#fdecec}.field{justify-content:space-between;align-items:center;gap:10px;margin:8px 0;display:flex}.field label{color:var(--ink-dim);font-size:12.5px}input[type=range]{accent-color:var(--amber);width:120px;height:26px}.seg{border:1px solid var(--line);background:var(--field);border-radius:9px;display:flex;overflow:hidden}.seg button{color:var(--ink-dim);cursor:pointer;background:0 0;border:0;flex:1;padding:8px 0;font-size:12px}.seg button.on{background:var(--accent-soft);color:var(--cyan)}.readout{color:var(--ink-dim);font:12px/1.55 ui-monospace,Menlo,monospace}.readout b{color:var(--ink);font-weight:600}.fl{flex-direction:column;gap:5px;margin-top:8px;display:flex}.fl span{color:var(--ink-dim);align-items:center;gap:7px;font-size:12px;display:inline-flex}.bar2{border-radius:2px;width:13px;height:4px;display:inline-block}.stage-wrap{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);flex-direction:column;display:flex;position:relative;overflow:hidden}.stage-toast{color:#fff;pointer-events:none;z-index:20;text-align:center;background:#1b2330;border-radius:8px;max-width:90%;padding:7px 12px;font-size:12.5px;position:absolute;bottom:12px;left:50%;transform:translate(-50%);box-shadow:0 6px 18px #141e3240}.stage-top{border-bottom:1px solid var(--line);color:var(--ink-dim);flex-wrap:wrap;align-items:center;gap:10px;padding:10px 12px;font:12px/1 ui-monospace,monospace;display:flex}.stage-top .dot{background:#c2cad6;border-radius:50%;width:7px;height:7px;margin-right:6px;display:inline-block}.stage-top .dot.run{background:var(--good);box-shadow:0 0 8px var(--good)}.stage-top .hint{color:var(--cyan)}.minibtn{border:1px solid var(--line);color:var(--ink-dim);cursor:pointer;background:#fff;border-radius:8px;margin-left:auto;padding:6px 9px;font-size:12px}.minibtn:hover{color:var(--ink);border-color:#cdd6e4}canvas{touch-action:none;background:0 0;width:100%;height:auto;display:block}.ctx{z-index:1000;border:1px solid var(--line);background:#fff;border-radius:12px;min-width:200px;padding:5px;position:fixed;box-shadow:0 12px 32px #141e3229}.ctx .hd{letter-spacing:.1em;text-transform:uppercase;color:var(--ink-dim);padding:8px 10px 6px;font:10.5px/1 ui-monospace,Menlo,monospace}.ctx button{width:100%;color:var(--ink);cursor:pointer;text-align:left;background:0 0;border:0;border-radius:8px;align-items:center;gap:9px;padding:10px;font-size:13px;display:flex}.ctx button:hover{background:var(--hover)}.ctx button.danger{color:var(--danger)}.ctx button.danger:hover{color:var(--danger);background:#fdecec}.ctx .sep{background:var(--line);height:1px;margin:5px 4px}.userchip{color:var(--ink-dim);align-items:center;gap:8px;font-size:12.5px;display:flex}.userchip img{border-radius:50%;width:22px;height:22px}.linkbtn{color:var(--cyan);cursor:pointer;background:0 0;border:0;padding:4px 0;font-size:12.5px}.linkbtn:hover{text-decoration:underline}.proj-list{flex-direction:column;gap:5px;max-height:180px;margin-top:8px;display:flex;overflow:auto}.proj-item{background:var(--field);border:1px solid var(--line);border-radius:9px;align-items:center;gap:6px;padding:7px 9px;font-size:12.5px;display:flex}.proj-item .name{cursor:pointer;color:var(--ink);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.proj-item .name:hover{color:var(--cyan)}.proj-item .del{color:var(--ink-dim);cursor:pointer;background:0 0;border:0}.proj-item .del:hover{color:var(--danger)}.cloud-note{color:var(--ink-dim);font-size:11.5px;line-height:1.5}.ribbon{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);border-radius:12px;overflow:hidden}.ribbon-tabs{border-bottom:1px solid var(--line);background:var(--field);touch-action:pan-y;display:flex}.ribbon-tab{color:var(--ink-dim);cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;flex:1;padding:7px 6px;font-size:12.5px;font-weight:600}.ribbon-tab.on{color:var(--cyan);border-bottom-color:var(--cyan);background:var(--accent-soft)}.ribbon-row{flex-wrap:wrap;align-items:center;gap:6px;padding:5px 8px;display:flex}.ribbon-row+.ribbon-row{border-top:1px solid var(--line)}.ribbon-tools{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.ribbon-undo{border-left:1px solid var(--line);gap:4px;margin-left:2px;padding-left:6px;display:flex}.ribbon-drive{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.ribbon-drive input[type=range]{width:110px}.ribbon-note{color:var(--ink-dim);font-size:12px}.ribbon-sep{background:var(--line);align-self:stretch;width:1px;margin:0 4px}.ribbon-row.props{gap:6px;overflow-x:auto}.props-id{color:var(--ink-dim);font:700 12px ui-monospace,monospace}.numin{color:var(--ink-dim);align-items:center;gap:4px;font-size:12px;display:inline-flex}.numin input{background:var(--field);border:1px solid var(--line);width:62px;color:var(--ink);font:inherit;border-radius:6px;padding:5px 6px}.seg-mini button{padding:6px 8px;font-size:11.5px}.chip{background:var(--field);border:1px solid var(--line);color:var(--ink);cursor:pointer;white-space:nowrap;border-radius:999px;padding:6px 10px;font-size:12px}.chip:hover{border-color:#cdd6e4}.chip.danger{color:var(--danger)}.chip.danger:hover{border-color:var(--danger);background:#fdecec}.ribbon-row.analysis{color:var(--ink-dim);gap:10px;font-size:12px}.ribbon-row.analysis .lg{align-items:center;gap:5px;display:inline-flex}.ribbon-row.analysis .lg i{border-radius:2px;width:12px;height:4px;display:inline-block}.ribbon-row.analysis b{color:var(--ink)}@media (width<=820px){.app{padding:10px 10px 26px}.editor-grid{grid-template-columns:1fr;gap:11px}header.bar{gap:10px;margin-bottom:0;padding-bottom:10px}header.bar .sub{display:none}.workspace{order:1}.rail{order:2}.btn{padding:12px 10px}.iconbtn{width:38px;height:34px}.iconbtn .ic{width:26px;height:26px}.ctx{min-width:215px}.ctx button{padding:13px 12px;font-size:14.5px}input[type=range]{width:130px}}