:root{--paper: #F2F5F4;--sheet: #FBFCFC;--ink: #18221F;--ink-2: #4E5C57;--ink-3: #85928D;--rule: #D5DDDA;--grid: #E3E9E7;--accent: #D9480F;--accent-soft: #FCE6DB;--ok: #2B7A4B;--warn: #A86A00;--err: #C62828;--info: #3D6FA8;--ok-soft: #E1F0E6;--warn-soft: #FBF0D9;--err-soft: #FBE3E3;--info-soft: #E3ECF6;--c-phoenix: #D9480F;--c-field: #2F7D32;--c-control: #1F5FAD;--c-safety: #C62828;--c-supervisory: #5B3FB0;--c-operations: #00796B;--c-infrastructure: #5F6B67;--c-network: #6D6A5A;--c-boundary: #A07800;--c-enterprise: #3B4A63;--c-external: #7C8784;--c-fill: #FFFFFF;--l-industrial: #1F5FAD;--l-telemetry: #1F5FAD;--l-substation: #6A1B9A;--l-fieldbus: #2F7D32;--l-field: #2F7D32;--l-management: #D9480F;--l-remote: #C2185B;--l-monitoring: #D9480F;--l-sectel: #795548;--l-it: #3B4A63;--l-identity: #5F6B67;--l-infra: #85928D;--l-wan: #D9480F;--l-boundary: #A07800;--l-virtual: #D9480F;--l-building: #00796B;--l-iiot: #00796B;--zone: #6F7E79;--zone-hi: #A07800;--f-display: "Barlow Condensed", "Arial Narrow", sans-serif;--f-body: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--f-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--paper: #111816;--sheet: #172120;--ink: #E4ECE9;--ink-2: #A5B3AE;--ink-3: #6E7C77;--rule: #2A3633;--grid: #1C2725;--accent: #FF7A3D;--accent-soft: #3A2318;--ok: #5CC283;--warn: #E2A93B;--err: #FF6B6B;--info: #7FA9DC;--ok-soft: #173326;--warn-soft: #342A12;--err-soft: #3A1B1B;--info-soft: #182A3D;--c-phoenix: #FF7A3D;--c-field: #6BC46F;--c-control: #6FA3E8;--c-safety: #FF6B6B;--c-supervisory: #A88BF0;--c-operations: #4CC1B2;--c-infrastructure: #A5B3AE;--c-network: #B9B49C;--c-boundary: #E2BC4A;--c-enterprise: #9AABC9;--c-external: #8D9A96;--c-fill: #1B2725;--l-industrial: #6FA3E8;--l-telemetry: #6FA3E8;--l-substation: #C38BEA;--l-fieldbus: #6BC46F;--l-field: #6BC46F;--l-management: #FF7A3D;--l-remote: #F06AA0;--l-monitoring: #FF7A3D;--l-sectel: #C29A86;--l-it: #9AABC9;--l-identity: #A5B3AE;--l-infra: #7E8C87;--l-wan: #FF7A3D;--l-boundary: #E2BC4A;--l-virtual: #FF7A3D;--l-building: #4CC1B2;--l-iiot: #4CC1B2;--zone: #6E7C77;--zone-hi: #E2BC4A;color-scheme:dark}}:root[data-theme=dark]{--paper: #111816;--sheet: #172120;--ink: #E4ECE9;--ink-2: #A5B3AE;--ink-3: #6E7C77;--rule: #2A3633;--grid: #1C2725;--accent: #FF7A3D;--accent-soft: #3A2318;--ok: #5CC283;--warn: #E2A93B;--err: #FF6B6B;--info: #7FA9DC;--ok-soft: #173326;--warn-soft: #342A12;--err-soft: #3A1B1B;--info-soft: #182A3D;--c-phoenix: #FF7A3D;--c-field: #6BC46F;--c-control: #6FA3E8;--c-safety: #FF6B6B;--c-supervisory: #A88BF0;--c-operations: #4CC1B2;--c-infrastructure: #A5B3AE;--c-network: #B9B49C;--c-boundary: #E2BC4A;--c-enterprise: #9AABC9;--c-external: #8D9A96;--c-fill: #1B2725;--l-industrial: #6FA3E8;--l-telemetry: #6FA3E8;--l-substation: #C38BEA;--l-fieldbus: #6BC46F;--l-field: #6BC46F;--l-management: #FF7A3D;--l-remote: #F06AA0;--l-monitoring: #FF7A3D;--l-sectel: #C29A86;--l-it: #9AABC9;--l-identity: #A5B3AE;--l-infra: #7E8C87;--l-wan: #FF7A3D;--l-boundary: #E2BC4A;--l-virtual: #FF7A3D;--l-building: #4CC1B2;--l-iiot: #4CC1B2;--zone: #6E7C77;--zone-hi: #E2BC4A;color-scheme:dark}html,body,#root{height:100%}body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:13px;overflow:hidden}*{box-sizing:border-box}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.app{height:100%;display:grid;grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-block:8px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));background:var(--sheet);border-bottom:1px solid var(--rule)}.brand{display:flex;align-items:baseline;gap:4px 10px;flex-wrap:wrap;margin-right:auto;min-width:0}.brand h1{margin:0;font-family:var(--f-display);font-weight:700;font-size:22px;letter-spacing:.02em;text-transform:uppercase}.brand .sheet-no{font-family:var(--f-mono);font-size:11.5px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tools,.acts{display:flex;gap:4px;flex-wrap:wrap}.btn{border:1px solid var(--rule);background:var(--sheet);border-radius:4px;padding:5px 10px;cursor:pointer;white-space:nowrap}.btn:hover{border-color:var(--ink-3)}.btn[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn:disabled{opacity:.45;cursor:default}.status{display:flex;gap:6px}.pill{font-family:var(--f-mono);font-size:11.5px;padding:3px 8px;border-radius:999px;border:1px solid transparent;cursor:pointer;background:none}.pill.err{background:var(--err-soft);color:var(--err)}.pill.warn{background:var(--warn-soft);color:var(--warn)}.pill.info{background:var(--info-soft);color:var(--info)}.pill.ok{background:var(--ok-soft);color:var(--ok)}.main{display:grid;grid-template-columns:232px minmax(0,1fr) 312px;min-height:0}.palette,.side{background:var(--sheet);overflow-y:auto;min-height:0}.palette{border-right:1px solid var(--rule);padding:12px 0 24px}.side{border-left:1px solid var(--rule);display:grid;grid-template-rows:minmax(0,1fr) minmax(0,40%);overflow:hidden}.side>section{overflow-y:auto;min-height:0;padding:12px 16px 16px}.side>section+section{border-top:1px solid var(--rule)}.eyebrow{font-family:var(--f-display);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin:0 0 8px}.pgroup{padding:0 12px}.pgroup+.pgroup{margin-top:14px}.pgroup .eyebrow{padding:0 4px}.pitem{display:grid;grid-template-columns:22px 1fr;align-items:center;gap:8px;width:100%;text-align:left;padding:5px 4px;border:0;background:none;border-radius:4px;cursor:grab}.pitem:hover{background:var(--paper)}.pitem .sw{width:18px;height:14px;border:1.5px solid currentColor;border-radius:3px}.pitem .sw.circle{border-radius:50%;width:14px;margin-left:2px}.pitem .sw.hex{clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:currentColor;opacity:.5;border:0}.pitem .nm{font-size:12.5px;line-height:1.25}.pitem .prov{font-family:var(--f-mono);font-size:10.5px;color:var(--ink-3)}.legend{padding:0 16px;margin-top:18px;display:grid;gap:4px}.legend div{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:8px;font-size:12px;color:var(--ink-2)}.stage{position:relative;min-width:0;min-height:0;overflow:hidden;touch-action:none}#cv{width:100%;height:100%;display:block;cursor:default;user-select:none;-webkit-user-select:none}#cv.panning{cursor:grabbing}#cv.zoning{cursor:crosshair}.hud{position:absolute;left:12px;bottom:12px;display:flex;gap:4px;align-items:center;font-family:var(--f-mono);font-size:11.5px;color:var(--ink-2)}.hud .btn{padding:3px 8px}.hint{position:absolute;right:12px;bottom:12px;font-size:11.5px;color:var(--ink-3);max-width:46ch;text-align:right;pointer-events:none}.gridline{stroke:var(--grid);stroke-width:1}.zone rect.body{fill:var(--zone);fill-opacity:.04;stroke:var(--zone);stroke-dasharray:10 6;stroke-width:1.5}.zone.hi rect.body{stroke:var(--zone-hi);fill:var(--zone-hi)}.zone .title{font-family:var(--f-display);font-weight:600;font-size:15px;letter-spacing:.04em;fill:var(--ink-2);text-transform:uppercase}.zone.hi .title{fill:var(--zone-hi)}.zone .grab{fill:transparent;cursor:move}.zone .resize{fill:var(--sheet);stroke:var(--zone);cursor:nwse-resize}.zone.sel rect.body{stroke:var(--accent);stroke-dasharray:none;stroke-width:2}.conduit path{fill:var(--zone-hi);stroke:var(--sheet);stroke-width:1.5;cursor:pointer}.conduit text{font-family:var(--f-mono);font-size:11px;font-weight:600;fill:var(--zone-hi);pointer-events:none}.conduit.sel path{fill:var(--accent)}.conduit.bad path{fill:var(--err)}.link .hit{stroke:transparent;stroke-width:12;fill:none;cursor:pointer}.link .ln{fill:none;stroke-linejoin:round}.link .halo{fill:none;stroke:var(--err);stroke-opacity:.28;stroke-width:9}.link.sel .ln{stroke:var(--accent)!important;stroke-width:3!important}.link.dim,.node.dim{opacity:.2}.link .lbl{font-family:var(--f-mono);font-size:10px;paint-order:stroke;stroke:var(--paper);stroke-width:3px;pointer-events:none}.node{cursor:move}.node .shape{fill:var(--c-fill);stroke-width:1.75}.node.sel .shape{stroke:var(--accent)!important;stroke-width:3}.node .tag{font-family:var(--f-mono);font-weight:600;font-size:11.5px;fill:var(--ink);pointer-events:none}.node .sub{font-size:9.5px;fill:var(--ink-2);pointer-events:none}.node .badge circle{fill:var(--err)}.node .badge.warn circle{fill:var(--warn)}.node .badge text{fill:#fff;font:700 10px var(--f-body);pointer-events:none}.port{fill:var(--sheet);stroke:var(--ink-3);stroke-width:1.25;cursor:crosshair}.port:hover,.port.cand{stroke:var(--accent);fill:var(--accent-soft);stroke-width:2}.port.cand{r:6}.port.no{opacity:.15}.ghost{fill:none;stroke:var(--accent);stroke-width:2;stroke-dasharray:5 4;pointer-events:none}.marquee{fill:var(--accent);fill-opacity:.06;stroke:var(--accent);stroke-dasharray:4 3}.ins-head{display:grid;gap:4px;margin-bottom:10px}.ins-head h2{margin:0;font-family:var(--f-mono);font-size:15px;font-weight:600;word-break:break-all}.ins-head .ty{color:var(--ink-2)}.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{font-family:var(--f-mono);font-size:10.5px;padding:2px 6px;border-radius:3px;background:var(--paper);color:var(--ink-2);border:1px solid var(--rule)}.chip.conf{color:var(--ok);border-color:var(--ok)}.chip.inf{color:var(--warn);border-color:var(--warn)}.fields{display:grid;gap:8px}.f{display:grid;gap:3px}.f label{font-size:11.5px;color:var(--ink-2);display:flex;justify-content:space-between;gap:8px}.f label .req{color:var(--accent)}.f input[type=text],.f input[type=number],.f select,.f textarea{width:100%;border:1px solid var(--rule);background:var(--paper);border-radius:4px;padding:5px 7px;font-size:12.5px}.f textarea{min-height:54px;resize:vertical}.f .ro{font-family:var(--f-mono);font-size:12.5px;padding:5px 0}.f.chk{grid-template-columns:auto 1fr;align-items:center}.f.chk label{order:2}details.set{border-top:1px solid var(--rule);padding-top:8px;margin-top:10px}details.set summary{cursor:pointer;font-family:var(--f-display);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);font-size:12.5px;margin-bottom:8px}.empty{color:var(--ink-2);line-height:1.5}.empty kbd{font-family:var(--f-mono);font-size:11px;border:1px solid var(--rule);border-radius:3px;padding:0 4px}.row-acts{display:flex;gap:6px;margin-top:12px;flex-wrap:wrap}.typelist{display:grid;gap:4px;max-height:200px;overflow:auto;border:1px solid var(--rule);border-radius:4px;padding:6px;background:var(--paper)}.typelist label{display:flex;gap:6px;align-items:center;font-size:12px}.vlist{display:grid;gap:4px}.v{display:grid;grid-template-columns:54px 1fr;gap:8px;text-align:left;border:0;background:none;padding:6px;border-radius:4px;cursor:pointer;border-left:3px solid transparent}.v:hover{background:var(--paper)}.v.error{border-left-color:var(--err)}.v.warning{border-left-color:var(--warn)}.v.info{border-left-color:var(--info)}.v .id{font-family:var(--f-mono);font-size:11px;color:var(--ink-2);padding-top:1px}.v .msg{font-size:12px;line-height:1.4}.vfilter{display:flex;gap:4px;margin-bottom:8px}.pop{position:absolute;z-index:20;background:var(--sheet);border:1px solid var(--rule);border-radius:6px;box-shadow:0 8px 24px #0000002e;padding:10px;width:280px;max-height:360px;overflow:auto}.pop h3{margin:0 0 4px;font-family:var(--f-display);font-size:15px;letter-spacing:.04em;text-transform:uppercase}.pop .ctx{font-size:11.5px;color:var(--ink-2);margin-bottom:8px;line-height:1.4}.opt{display:grid;grid-template-columns:26px 1fr;gap:8px;align-items:center;width:100%;text-align:left;border:1px solid transparent;background:none;padding:5px;border-radius:4px;cursor:pointer}.opt:hover,.opt:focus-visible{background:var(--paper);border-color:var(--rule)}.opt .sample{height:0;border-top-width:2.5px;border-top-style:solid}.opt .t{font-size:12.5px}.opt .d{font-family:var(--f-mono);font-size:10.5px;color:var(--ink-3)}.opt.off .t{color:var(--err)}.pop .note{font-size:11.5px;color:var(--warn);margin:6px 0 0}.modal{position:fixed;inset:0;z-index:40;background:#0a100e73;display:grid;place-items:center;padding:16px}.modal .box{background:var(--sheet);border-radius:8px;width:min(760px,100%);max-height:90%;display:grid;grid-template-rows:auto 1fr auto;gap:10px;padding:16px}.modal h3{margin:0;font-family:var(--f-display);font-size:20px;text-transform:uppercase;letter-spacing:.04em}.modal textarea{width:100%;min-height:280px;font-family:var(--f-mono);font-size:11.5px;border:1px solid var(--rule);border-radius:4px;background:var(--paper);padding:8px;resize:vertical}.modal .row-acts{justify-content:flex-end;margin:0}.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translate(-50%);background:var(--ink);color:var(--paper);padding:8px 14px;border-radius:4px;font-size:12.5px;z-index:50}@media(max-width:900px){body{overflow:auto}.app{height:auto;min-height:100%}.main{grid-template-columns:1fr}.stage{height:62vh;order:1;border-bottom:1px solid var(--rule)}.palette{order:2;border-right:0;max-height:none}.side{order:3;border-left:0;display:block;overflow:visible}.hint{display:none}.pgroup{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:2px 8px}.pgroup .eyebrow{grid-column:1 / -1}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}