:root{--navy: #0b2a5b;--navy-2: #28436e;--primary: #2563eb;--primary-soft: #eff6ff;--primary-border: #bfdbfe;--bg: #f1f5f9;--panel: #ffffff;--panel2: #f5f7fa;--line: #e2e8f0;--line-2: #cbd5e1;--ink: #0f172a;--ink2: #475569;--ink3: #94a3b8;--select: #f59e0b;--ok: #16a34a;--warn: #b45309;--err: #dc2626;--mono: "Consolas", "Cascadia Mono", monospace}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font-family:Inter,Segoe UI,system-ui,sans-serif;font-size:13px;overflow:hidden;-webkit-user-select:none;user-select:none}.app{display:flex;flex-direction:column;height:100%}.titlebar{display:flex;align-items:center;gap:10px;background:var(--navy);color:#fff;padding:6px 14px}.titlebar .brand{font-weight:700;letter-spacing:.03em;display:flex;align-items:center;gap:8px}.titlebar .brand small{font-weight:400;font-size:9px;letter-spacing:.18em;opacity:.75;display:block}.titlebar .sub{font-weight:400;opacity:.92;font-size:12.5px}.titlebar .dirty{color:#fbbf24;font-size:12px}.menubar{display:flex;background:var(--panel);border-bottom:1px solid var(--line);padding:0 6px;position:relative;z-index:40}.menubar>.menu-root{padding:6px 11px;cursor:default;font-size:12.5px;color:var(--ink)}.menubar>.menu-root:hover,.menubar>.menu-root.open{background:var(--primary-soft);color:var(--primary)}.menu-pop{position:absolute;top:100%;min-width:240px;background:var(--panel);border:1px solid var(--line);border-radius:0 0 8px 8px;box-shadow:0 10px 30px #0f172a24;padding:5px 0;z-index:50}.menu-item{padding:6px 24px 6px 14px;cursor:default;display:flex;justify-content:space-between;gap:18px;white-space:nowrap;color:var(--ink)}.menu-item:hover{background:var(--primary-soft);color:var(--primary)}.menu-item.disabled{color:var(--ink3);pointer-events:none}.menu-sep{border-top:1px solid var(--line);margin:4px 0}.menu-item .shortcut{color:var(--ink3);font-size:11px}.toolbar{display:flex;align-items:center;gap:1px;background:var(--panel);border-bottom:1px solid var(--line);padding:3px 6px;flex-wrap:wrap}.tbtn{border:1px solid transparent;background:transparent;color:var(--ink2);min-width:26px;height:26px;padding:0 5px;border-radius:5px;cursor:pointer;font:inherit;font-size:12px;display:inline-flex;align-items:center;justify-content:center;gap:5px}.tbtn:hover{background:var(--primary-soft);color:var(--primary)}.tbtn.on{background:var(--primary-soft);color:var(--primary);border-color:var(--primary-border)}.tbtn:disabled{color:var(--line-2);pointer-events:none}.tbtn .lbl{font-size:11.5px}.toolbar2{padding-top:1px;padding-bottom:1px}.toolbar2 .tb2-label{font-size:11px;color:var(--ink3);margin:0 4px 0 2px}.toolbar2 .grow{flex:1}.tb2-sel{font:inherit;font-size:11.5px;border:1px solid var(--line-2);border-radius:5px;padding:1px 4px;background:#fff;color:var(--ink)}.tsep{width:1px;height:20px;background:var(--line);margin:0 5px;flex:none}.pipe{display:flex;align-items:center;gap:2px;margin-left:auto}.pipe .step{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:11.5px;color:var(--ink3);border:1px solid transparent;background:transparent;cursor:pointer;font-family:inherit}.pipe .step.done{color:var(--primary);background:var(--primary-soft);border-color:var(--primary-border)}.pipe .step.todo{color:var(--ink2)}.pipe .step:hover{border-color:var(--line-2)}.pipe .arrow{color:var(--line-2);font-size:10px}.main{flex:1;display:flex;min-height:0}.ltoolbar{width:34px;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:4px 0;gap:1px}.ltoolbar .tbtn{width:28px}.ltoolbar .lsep{height:1px;width:22px;background:var(--line);margin:3px 0}.ltoolbar .bottom{margin-top:auto;display:flex;flex-direction:column;gap:1px;align-items:center;padding-bottom:4px}.ltoolbar .mini{font-size:9.5px;font-weight:600;letter-spacing:.02em;height:22px}.sidebar{width:248px;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}.sidebar .tabs{display:flex;border-bottom:1px solid var(--line)}.sidebar .tabs button{flex:1;border:0;background:transparent;color:var(--ink2);padding:7px 2px;font:inherit;font-size:12px;cursor:pointer;border-bottom:2px solid transparent}.sidebar .tabs button.on{color:var(--primary);border-bottom-color:var(--primary);font-weight:600}.sidebar .body{flex:1;overflow:auto;padding:6px}.tree{font-size:12.5px;line-height:1.8}.tree .ti{cursor:default;padding:0 6px;border-radius:5px;white-space:nowrap;display:flex;align-items:center;gap:6px;color:var(--ink)}.tree .ti svg{color:var(--ink3);flex:none}.tree .ti:hover{background:var(--panel2)}.tree .ti:hover svg{color:var(--primary)}.tree .ti.sel{background:var(--primary-soft);color:var(--primary)}.tree .kids{margin-left:13px;border-left:1px solid var(--line);padding-left:7px}.tree .cnt{color:var(--ink3)}.viewarea{flex:1;display:flex;min-width:0;gap:0}.viewport{flex:1;position:relative;min-width:0;background:#fff;display:flex;flex-direction:column;border:2px solid transparent}.viewport+.viewport{border-left:1px solid var(--line)}.viewport.active{border-color:var(--primary)}.viewport.active .viewtag{background:var(--primary-soft)}.viewport .cv{flex:1;min-height:0;position:relative}.viewport canvas{display:block;width:100%;height:100%}.viewport .viewtag{background:var(--panel2);border-bottom:1px solid var(--line);padding:0 10px;font-size:12px;color:var(--ink2);display:flex;gap:12px;flex:none;align-items:center;height:28px;white-space:nowrap;overflow:hidden}.viewport .viewtag b{color:var(--ink);font-weight:600}.viewport .drawhint{position:absolute;left:50%;transform:translate(-50%);top:10px;background:var(--navy);color:#fff;padding:4px 16px;border-radius:999px;font-size:12px;box-shadow:0 4px 14px #0b2a5b40}.props{width:262px;background:var(--panel);border-left:1px solid var(--line);overflow:auto;padding:10px 12px;font-size:12.5px}.props h4{margin:2px 0 10px;color:var(--ink);font-size:12.5px;font-weight:700}.props h4 span{color:var(--primary)}.pgrid{display:grid;grid-template-columns:45% 55%;row-gap:4px;align-items:center}.pgrid .k{color:var(--ink2)}.pgrid .v{color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dock{height:158px;background:var(--panel);border-top:1px solid var(--line);display:flex;flex-direction:column;min-height:0}.dock .tabs{display:flex;border-bottom:1px solid var(--line);padding:0 8px;gap:2px;align-items:center}.dock .tabs button{border:0;background:transparent;color:var(--ink2);padding:5px 12px;font:inherit;font-size:12px;cursor:pointer;border-bottom:2px solid transparent}.dock .tabs button.on{color:var(--primary);border-bottom-color:var(--primary);font-weight:600}.dock .body{flex:1;overflow:auto;font-family:var(--mono);font-size:12px;padding:5px 12px;background:#fff}.dock .E{color:var(--err)}.dock .W{color:var(--warn)}.dock .I{color:var(--ink2)}.statusbar{display:flex;align-items:center;gap:16px;background:var(--panel);border-top:1px solid var(--line);padding:4px 12px;font-size:12px;color:var(--ink2)}.statusbar .grow{flex:1}.statusbar b{color:var(--ink);font-weight:600}.dlg-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:#0b2a5b61;z-index:100;display:flex;align-items:center;justify-content:center}.dlg{background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 28px 70px #0b2a5b4d;min-width:420px;max-width:94vw;max-height:92vh;display:flex;flex-direction:column}.dlg>header{padding:11px 16px;font-weight:700;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;color:var(--ink)}.dlg>header button{border:0;background:transparent;font-size:15px;cursor:pointer;color:var(--ink3)}.dlg>header button:hover{color:var(--ink)}.dlg>.body{padding:14px 16px;overflow:auto;flex:1}.dlg>footer{padding:10px 16px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:8px;align-items:center}.btn{border:1px solid var(--line-2);background:var(--panel);color:var(--ink);padding:6px 16px;border-radius:8px;cursor:pointer;font:inherit;font-size:12.5px}.btn:hover{border-color:var(--primary);color:var(--primary)}.btn.primary{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:600}.btn.primary:hover{background:#1d4ed8;color:#fff}.btn:disabled{opacity:.45;pointer-events:none}.frow{display:flex;align-items:center;gap:8px;margin:6px 0}.frow label{width:160px;color:var(--ink2);flex:none}.frow input[type=text],.frow input[type=number],.frow select,.frow textarea{flex:1;background:#fff;color:var(--ink);border:1px solid var(--line-2);border-radius:7px;padding:5px 9px;font:inherit;min-width:0}.frow input:focus,.frow select:focus,.frow textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}.vtable{border-collapse:collapse;width:100%;font-size:12.5px}.vtable th{position:sticky;top:0;background:var(--panel2);border:1px solid var(--line);padding:6px 9px;text-align:left;font-weight:600;color:var(--ink2);white-space:nowrap}.vtable td{border:1px solid var(--line);padding:3px 9px;white-space:nowrap;background:#fff}.vtable td input,.vtable td select{width:100%;border:0;background:transparent;color:var(--ink);font:inherit;padding:2px 0}.vtable td input:focus{outline:2px solid var(--primary);border-radius:3px}.vtable tr.sel td{background:var(--primary-soft)}.vtable tr:hover td{background:#f8fafc}.vtable tr.sel:hover td{background:var(--primary-soft)}.vtable td.ro{color:var(--ink2);background:var(--panel2)}.texted{width:100%;height:100%;background:#fff;color:var(--ink);font-family:var(--mono);font-size:12.5px;border:1px solid var(--line-2);border-radius:8px;padding:10px;resize:none;white-space:pre;overflow:auto}.texted:focus{outline:none;border-color:var(--primary)}.wizard-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.wcard{border:1px solid var(--line-2);border-radius:10px;padding:18px 12px;cursor:pointer;text-align:center;background:#fff}.wcard:hover{border-color:var(--primary)}.wcard.on{border-color:var(--primary);background:var(--primary-soft)}.wcard .ico{margin-bottom:8px;color:var(--primary)}.wcard .t{font-weight:600}.wcard .d{color:var(--ink2);font-size:11.5px;margin-top:5px}.pill{display:inline-block;border-radius:999px;padding:1px 9px;font-size:11px}.pill.ok{background:var(--primary-soft);color:var(--primary)}.pill.err{background:#fee2e2;color:var(--err)}fieldset.grp{border:1px solid var(--line);border-radius:8px;padding:6px 10px 8px;margin:8px 0;min-width:0}fieldset.grp>legend{padding:0 4px;font-size:12px;font-weight:600;color:var(--navy-2, #28436e)}.chk{display:flex;align-items:center;gap:6px;margin:3px 0;font-size:12.5px;cursor:pointer}.btncol{display:flex;flex-direction:column;gap:6px}.btncol .btn{width:100%;text-align:left}.listbox{border:1px solid var(--line);border-radius:6px;overflow:auto;background:#fff}.listbox .li{display:flex;justify-content:space-between;gap:8px;padding:3px 8px;font-size:12.5px;cursor:pointer}.listbox .li:hover{background:#f1f5f9}.listbox .li.sel{background:var(--primary-soft);color:var(--primary)}.listbox .ro,.vtable td.ro{color:var(--ink2)}.radio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 12px}.radio-grid.five{grid-template-columns:repeat(5,1fr)}.note{margin:8px 0;padding:6px 10px;border-radius:6px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;font-size:12px}.demo-tag{display:inline-block;padding:0 6px;border-radius:4px;background:#f97316;color:#fff;font-size:10.5px;font-weight:700;letter-spacing:.04em}.muted{color:var(--ink2);font-size:12px}.swatch{display:inline-block;width:14px;height:10px;border:1px solid var(--line);vertical-align:middle;margin-right:4px}svg.chart{background:#fff;border:1px solid var(--line);border-radius:6px;font-size:11px}svg.chart .axis{stroke:#334155}svg.chart .gridl{stroke:#e2e8f0}svg.chart .series{fill:none;stroke:var(--primary);stroke-width:2}svg.chart .dot{fill:var(--primary)}svg.chart text{fill:#334155}.viewport .cv{position:relative}.contour-legend{position:absolute;left:50%;bottom:10px;transform:translate(-50%);width:min(460px,80%);background:#ffffffeb;border:1px solid var(--line);border-radius:8px;padding:6px 10px 4px;font-size:11px;pointer-events:none}.contour-legend .bar{height:10px;border-radius:3px}.contour-legend .ticks{display:flex;justify-content:space-between;margin-top:2px;color:var(--ink)}.contour-legend .unit{text-align:center;color:var(--ink2)}.viewtag .demo-tag{margin-left:4px}.statusbar .sb-sel{font:inherit;font-size:11.5px;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--ink);padding:0 4px;height:20px}.statusbar .sb-anim{display:inline-flex;gap:4px}.statusbar .sb-btn{font:inherit;font-size:11.5px;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--ink);padding:0 8px;height:20px;cursor:pointer}.statusbar .sb-btn:hover{border-color:var(--primary);color:var(--primary)}