:root{font-family:Inter,"Segoe UI","Microsoft YaHei",system-ui,sans-serif;color:#203d4b;background:#edf2f3;font-synthesis:none;--ink:#173b4c;--muted:#73878e;--line:#dbe3e5;--teal:#136f71;--mint:#d8eee7;--orange:#ba683b}*{box-sizing:border-box}body{margin:0;height:100dvh;display:flex;flex-direction:column;overflow:hidden}button,input,select{font:inherit}button,select{cursor:pointer}button{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:7px;padding:9px 12px;font-size:12px;font-weight:600;min-height:38px;transition:background .15s}button:hover{background:#e7f2ee}button.active,button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #4da9a5;outline-offset:3px}button:disabled{opacity:.4;cursor:default}.quiet{border:0;background:transparent}h1,h2,p{margin:0}h1{font-size:26px;letter-spacing:-.5px}h2{font-size:17px}small{font-size:11px}.header{height:78px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 30px;border-bottom:1px solid var(--line);background:#fff;gap:20px;z-index:20}.brand{display:flex;align-items:center;gap:12px;min-width:210px}.brandmark{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--ink);border-radius:10px;color:#b6e0d1;font-size:22px;font-weight:750;letter-spacing:-7px;padding-right:7px}.brandmark span{color:white;font-size:17px}.brand strong{font-size:20px;letter-spacing:1.5px}.brand small{display:block;color:var(--muted);margin-top:2px;letter-spacing:3px}.header nav{display:flex;gap:5px;background:#f0f4f4;border:1px solid #e8eeee;border-radius:9px;padding:4px}.header nav button{border:0;background:transparent;padding:10px 23px}.header nav button.active{background:#fff;color:var(--ink);box-shadow:0 2px 8px #203d4b12}.helpbutton span{display:inline-flex;justify-content:center;align-items:center;border:1px solid #b9c9cd;border-radius:100%;width:20px;height:20px;margin-left:8px}#workspace{flex:1;min-height:0;display:flex;position:relative}.sidebar{width:247px;flex-shrink:0;background:#fbfcfc;display:flex;flex-direction:column;border-right:1px solid var(--line);z-index:10}.panelhead{padding:25px 21px 18px;display:flex;justify-content:space-between;align-items:center}.eyebrow{color:var(--teal);font-size:10px;letter-spacing:1.6px;font-weight:700;display:block;margin-bottom:7px}.panelhead h2 small{font-size:11px;font-weight:400;color:var(--muted);margin-left:5px}.search{display:flex;align-items:center;border:1px solid var(--line);border-radius:7px;margin:0 18px 15px;padding:0 10px;background:white}.search span{font-size:24px;color:#789}.search input{width:100%;border:0;outline:0!important;background:transparent;padding:11px 7px;font-size:12px;min-width:0}.partlist{overflow:auto;flex:1;padding:0 9px 18px}.partgroup{padding:17px 12px 8px;font-size:10px;font-weight:600;color:#8b9ca2;letter-spacing:2px}.partrow{display:flex;gap:4px;align-items:center;margin:2px 0;border:1px solid transparent;border-radius:7px}.partrow.active{background:#e6f1ed;border-color:#c5ded4}.partrow button{background:transparent;border:0;text-align:left;font-weight:400}.partrow .partselect{flex:1;min-width:0;line-height:1.5;font-size:12px;padding:9px 6px}.partdot{display:inline-block;width:6px;height:6px;border-radius:2px;background:#7f9ba0;margin:0 9px 1px 2px}.partrow.active .partdot{background:#18776e}.partrow .eye{color:#a3b3b8;width:28px;padding:5px;font-size:14px;min-height:32px}.partrow.hiddenpart .partselect{opacity:.4}.sidebarfoot{border-top:1px solid var(--line);padding:16px 21px;font-size:11px;line-height:1.9}.sidebarfoot small{color:var(--muted);font-size:10px}.statusdot{display:inline-block;background:#419a79;width:6px;height:6px;border-radius:50%;margin-right:5px}.viewer{flex:1;min-width:0;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 32%,#f9fcfd,#e4ecef)}#canvasHost{position:absolute;inset:0}canvas{display:block;width:100%;height:100%;touch-action:none}.viewheadline{position:absolute;top:27px;left:30px;pointer-events:none;display:flex;gap:14px}.viewheadline button{pointer-events:auto}.viewheadline h1{font-size:24px}.viewheadline p{font-size:11px;color:#7b929b;margin-top:9px}.viewpresets{position:absolute;top:28px;right:27px;display:flex;gap:4px}.viewpresets button{font-size:11px;min-height:33px;padding:7px 10px;box-shadow:0 2px 7px #00000003}.viewerbottom{position:absolute;bottom:16px;left:20px;right:20px;pointer-events:none;display:flex;align-items:center;flex-direction:column;gap:13px}.toolbar{display:flex;gap:6px;align-items:center;background:#fffefef2;padding:7px 9px;border:1px solid #dce4e5;border-radius:12px;box-shadow:0 6px 30px #31536613;pointer-events:auto;max-width:100%}.segmented{display:flex;background:#eef3f3;border-radius:7px;padding:2px}.segmented button{border:0;background:transparent}.segmented .active{background:var(--ink)}#dragAxis{border:0;background:#eff4f4;padding:10px 7px;border-radius:6px;color:#47636c;font-size:11px;max-width:100px}.tooldivider{width:1px;height:24px;background:var(--line);margin:0 4px}.explode{display:flex;align-items:center;gap:7px;font-size:11px;white-space:nowrap;padding:0 6px}.explode input{width:72px;accent-color:var(--teal);cursor:pointer}.toolbar>button{border:0;font-size:11px;white-space:nowrap;padding:9px}.hintrow{width:100%;display:flex;justify-content:space-between;color:#7a9099;font-size:10px;gap:10px}.selectedcard{position:absolute;right:25px;top:86px;width:247px;border:1px solid #d9e4e5;background:#fffffff0;backdrop-filter:blur(10px);border-radius:10px;padding:16px;box-shadow:0 5px 20px #24465808}.selectedtop{display:flex;align-items:center;justify-content:space-between}.selectedtop .eyebrow{margin:0}.selectedtop button{padding:0;min-height:24px;font-size:20px;color:#8d9ca0}.selectedcard h2{font-size:17px;margin:9px 0}.selectedcard p{font-size:11px;line-height:1.8;color:#637c85}.selectedcard>small{display:block;font-size:10px;color:#9ba9ad;line-height:1.6;margin-top:8px}.selectedactions{display:flex;gap:5px;margin-top:16px;flex-wrap:wrap}.selectedactions button{font-size:10px;padding:7px 8px;min-height:32px}.positionreadout{display:block;border-top:1px solid #edf1f1;font-size:9px;color:#8b9da3;margin-top:13px;padding-top:10px;line-height:1.8}.positionreadout output{display:block;font-variant-numeric:tabular-nums;color:#4a6874;font-size:10px}.legend3d{position:absolute;bottom:110px;left:30px;font-size:11px;color:#5f7985}.legend3d i{display:inline-block;width:18px;height:3px;background:#2697a3;margin-right:6px;vertical-align:middle}#loading{position:absolute;inset:0;background:#edf3f5ed;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;z-index:3}#loading[hidden]{display:none}#loading span{font-size:11px;color:var(--muted)}.spinner{width:28px;height:28px;border:2px solid #d0dfde;border-top-color:#287f77;border-radius:100%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.footer{display:flex;align-items:center;justify-content:space-between;height:44px;flex-shrink:0;background:#fff;border-top:1px solid var(--line);padding:0 23px;font-size:9px;letter-spacing:1.2px;color:#7d9299;gap:15px}.footer button{font-size:10px;min-height:30px;padding:5px 10px;border:0;background:transparent;font-weight:400}.footerhint{letter-spacing:0}.mobile{display:none}#toast{position:fixed;left:50%;bottom:130px;transform:translateX(-50%);background:#183f4ef2;color:#fff;padding:13px 20px;border-radius:9px;font-size:12px;z-index:50;box-shadow:0 8px 30px #182f4d22;max-width:90vw;text-align:center}dialog{border:0;border-radius:16px;max-width:660px;width:calc(100% - 32px);padding:36px;color:var(--ink);box-shadow:0 20px 120px #0a283a44}dialog::backdrop{background:#173e515c;backdrop-filter:blur(4px)}dialog h2{font-size:25px;margin:10px 0 25px}.dialogclose{position:absolute;right:15px;top:15px;min-height:32px;font-size:20px;border:0}.helpgrid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.helpgrid b{font-size:13px;color:var(--teal)}.helpgrid p{font-size:12px;line-height:1.9;color:#627b84;margin-top:8px}.notebox{font-size:11px;line-height:1.9;background:#eff5f3;padding:14px;border-radius:8px;margin:24px 0 15px}.muted{font-size:10px;color:#8ba0a7;line-height:1.9}dialog a{color:#547e80;font-size:10px}#electrical{overflow:auto;flex:1;padding:30px 34px;background:#f0f4f4;min-width:0}#electrical[hidden]{display:none}.electricalintro h1{font-size:28px}.electricalintro p{font-size:12px;color:#81949b;margin-top:10px}.diagramtabs{display:flex;gap:6px;flex-wrap:wrap;margin:22px 0}.diagramtabs button{font-size:11px;padding:9px 16px}.diagramtabs .active{background:#176d70;border-color:#176d70}.systemlayout{display:grid;grid-template-columns:minmax(440px,1.6fr) minmax(240px,1fr);gap:20px}.systemboard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px;position:relative}.systemboardheader{font-size:12px;font-weight:600;padding-bottom:20px;border-bottom:1px solid #edf1f2;display:flex;justify-content:space-between}.systemboardheader span{color:#91a4aa;font-weight:400;font-size:10px}.networkmap{display:grid;grid-template-columns:105px 1fr;align-items:center;gap:38px;padding:20px 0 6px}.hub{background:#163e50;color:#fff;border-radius:9px;padding:23px 10px;text-align:center;position:relative;font-size:15px;font-weight:700}.hub small{display:block;color:#97bcc5;font-size:9px;margin-top:6px}.networknodes{display:grid;grid-template-columns:1fr 1fr;gap:9px;position:relative}.networknodes:before{content:'';position:absolute;border-left:1px solid #b5ced0;left:-20px;top:20px;bottom:20px}.systemnode{text-align:left;position:relative;min-height:65px;padding:10px 11px;font-size:11px;font-weight:500;border-color:#e0e9e9;line-height:1.5}.systemnode:nth-child(odd):before{content:'';position:absolute;left:-21px;width:20px;height:1px;top:50%;background:#b5ced0}.systemnode small{display:block;font-size:9px;color:#809aa2;margin-top:5px}.systemnode.active{background:#e2f0eb;border-color:#67a99d;color:#205953}.systemnode.active small{color:#4d8781}.systeminfo{padding:25px;border:1px solid var(--line);border-radius:12px;background:#fff;align-self:start}.systeminfo h2{font-size:21px;line-height:1.5;margin:10px 0 18px}.systeminfo p{font-size:12px;line-height:1.9;color:#67818a}.infofield{padding:15px 0;border-top:1px solid #e7eeee}.infofield label{display:block;color:#97a8ad;font-size:10px;margin-bottom:8px}.infofield strong{font-size:12px;font-weight:500;line-height:1.8;overflow-wrap:anywhere}.systeminfo button{margin-top:18px;background:#e7f2ee}.legendrow{display:flex;gap:18px;flex-wrap:wrap;font-size:10px;color:#8a9ca3;margin-top:18px}.legendrow i{display:inline-block;width:7px;height:7px;border-radius:100%;margin-right:6px}.electricalnote{font-size:11px;color:#8a9da4;line-height:1.8;margin:24px 0}.portslayout{display:grid;grid-template-columns:minmax(400px,1fr) 280px;gap:20px}.portsboard{border:1px solid var(--line);border-radius:12px;background:#fff;padding:22px}.porthead{display:flex;justify-content:space-between;gap:15px;margin-bottom:15px}.porthead p{font-size:11px;color:#8ba0a6;margin-top:7px}.porthead input{width:190px;border:1px solid var(--line);border-radius:7px;padding:9px;font-size:11px}.portgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.portcolumnheading{text-align:center;padding:10px;font-size:12px;color:#547783;font-weight:bold}.port{min-height:44px;text-align:left;padding:6px 8px;display:flex;align-items:center;gap:9px;font-size:10px;font-weight:400}.port b{color:#3d8581;min-width:25px;font-size:11px}.port span{overflow-wrap:anywhere}.port.unassigned{background:#f7f9f9;color:#b8c6c9}.port.active b{color:#a9ded0}.signalboard{padding:24px;border-radius:12px;border:1px solid var(--line);background:white}.signalintro{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}.signalintro p{font-size:11px;color:#8a9fa5;margin-top:9px}.signalintro input{padding:10px;border:1px solid var(--line);border-radius:7px;width:220px;font-size:11px}.signalrow{display:grid;grid-template-columns:40px minmax(100px,1fr) 110px minmax(100px,1fr);gap:12px;border-bottom:1px solid #eaf0f0;align-items:center;min-height:57px;font-size:12px}.signalrow strong{font-size:11px;font-weight:500;overflow-wrap:anywhere;line-height:1.5}.signalrow .pin{color:#6e939d;font-size:11px}.signalrow .wire{height:2px;background:var(--wire,#8999a2);position:relative}.signalrow .wire:before,.signalrow .wire:after{content:'';position:absolute;width:6px;height:6px;background:white;border:2px solid var(--wire,#8999a2);border-radius:100%;top:-2px;left:0}.signalrow .wire:after{left:auto;right:0}.wirelabel{position:absolute;top:-16px;left:0;width:100%;text-align:center;font-size:9px;color:var(--wire)}.signalrow.headings{color:#8da0a7;font-size:10px;min-height:32px}.pathrow{display:grid;grid-template-columns:1fr 130px 1fr;gap:22px;align-items:center;padding:25px 0;border-bottom:1px solid #e6eeee}.pathbox{border:1px solid #d4e3e2;background:#f6fafa;border-radius:8px;padding:18px;font-size:13px;line-height:1.9}.pathbox small{display:block;color:#7f9ca4}.pathline{text-align:center;font-size:10px;color:#368c86;line-height:1.8;border-bottom:2px solid #479c91;padding-bottom:8px}.hvzones{display:grid;grid-template-columns:1fr 170px 1fr;align-items:center;gap:20px;margin:30px 0}.hvzone{border:1px solid #d7e3e5;padding:25px;border-radius:10px;background:#f5f9f9;min-height:200px}.hvzone.float{background:#f3edf8;border-color:#d8c6e8}.hvzone h3{font-size:15px;margin:0 0 20px}.hvzone p{line-height:2;font-size:12px;color:#75909a}.fiber{border-top:3px dashed #9c6caf;padding-top:15px;color:#9464a5;text-align:center;font-size:11px;line-height:2}.emptyresult{padding:20px;color:#849ba5;font-size:12px}
@media(min-width:1600px){.sidebar{width:275px}.selectedcard{width:280px}.viewheadline{left:40px;top:36px}.viewheadline h1{font-size:30px}.toolbar{padding:9px 14px}.toolbar button{font-size:12px}.explode input{width:100px}}
@media(max-width:1150px){.header{padding:0 18px}.brand{min-width:180px}.header nav button{padding:10px 16px}.sidebar{width:210px}.selectedcard{width:212px;right:17px;top:83px}.viewheadline{left:22px}.viewpresets{right:17px}.toolbar{gap:3px}.toolbar>button{padding:8px 6px}.tooldivider{display:none}.explode input{width:56px}.systemlayout{grid-template-columns:1fr}.systeminfo{min-width:0}.portslayout{grid-template-columns:1fr}.portinfo{min-height:0}.footerhint{display:none}}
@media(max-width:760px){.header{height:112px;display:block;padding:14px 16px 8px;position:relative}.brand{gap:9px}.brandmark{width:30px;height:30px;font-size:18px;border-radius:7px}.brand strong{font-size:17px;letter-spacing:1px}.brand small{display:inline-block;margin:0 0 0 12px;letter-spacing:1px;font-size:10px}.header nav{margin-top:13px;padding:2px;justify-content:space-between;gap:0}.header nav button{flex:1;min-height:34px;padding:7px 10px;font-size:12px}.helpbutton{position:absolute;right:11px;top:10px;font-size:0;padding:5px;min-height:34px}.helpbutton span{font-size:12px;margin:0}.mobile{display:block}.sidebar{position:absolute;top:0;bottom:0;left:0;width:265px;box-shadow:20px 0 80px #193d4c30;display:none}.sidebar.open{display:flex}.panelhead{padding-top:20px}.partrow button{min-height:44px}.viewheadline{top:17px;left:13px;gap:9px;align-items:flex-start}.viewheadline>button{background:#ffffffb0;font-size:11px;min-height:36px;padding:8px}.viewheadline h1{font-size:19px}.viewheadline .eyebrow{font-size:8px;letter-spacing:1px;margin-bottom:5px}.viewheadline p{font-size:9px;margin-top:5px}.viewpresets{top:80px;left:13px;right:auto;gap:3px}.viewpresets button{min-height:34px;font-size:10px;padding:6px 10px}.viewerbottom{bottom:9px;left:10px;right:10px;gap:8px}.toolbar{width:100%;justify-content:center;flex-wrap:wrap;padding:6px;gap:3px;border-radius:10px}.toolbar button{min-height:36px;padding:7px 9px}.segmented button{font-size:12px;min-height:37px}.explode{padding:0 7px;font-size:10px}.explode input{width:55px}.toolbar>button{font-size:11px;flex:1;min-width:70px}.toolbar .explode{min-width:98px;flex:1;justify-content:center}.toolbar .explode input{max-width:70px}#dragAxis{min-height:38px;font-size:11px;flex:1;max-width:none}.hintrow{font-size:9px;line-height:1.6;justify-content:center;text-align:center}#renderStats{display:none}.selectedcard{top:auto;bottom:128px;right:11px;left:11px;width:auto;padding:12px 14px;border-radius:10px}.selectedcard .selectedtop{float:right;gap:12px}.selectedcard .selectedtop .eyebrow{display:none}.selectedcard h2{font-size:15px;margin:0 0 7px;max-width:85%}.selectedcard p{font-size:10px;line-height:1.6;max-width:95%}.selectedcard>small{display:none}.selectedactions{margin-top:10px;gap:6px}.selectedactions button{font-size:10px;min-height:35px;flex:1}.positionreadout{margin-top:7px;padding-top:6px;display:flex;gap:10px;align-items:center}.positionreadout output{font-size:9px}.legend3d{left:13px;bottom:130px;font-size:9px}.footer{height:38px;padding:0 10px;justify-content:center;padding-bottom:env(safe-area-inset-bottom);flex-basis:auto}.footer>span{display:none}.footer button{font-size:10px;min-height:34px;padding:5px 20px}#toast{bottom:140px;width:max-content;font-size:11px}#electrical{padding:21px 14px}.electricalintro h1{font-size:24px}.electricalintro p{font-size:10px;line-height:1.8}.diagramtabs{gap:5px;margin:18px 0}.diagramtabs button{font-size:10px;padding:9px 12px;min-height:38px;flex:1;white-space:nowrap}.systemboard,.systeminfo,.portsboard,.signalboard{padding:16px;border-radius:10px}.systemlayout{grid-template-columns:1fr;gap:12px}.systemboardheader{font-size:11px}.systemboardheader span{font-size:9px}.networkmap{grid-template-columns:65px 1fr;gap:23px;padding-top:16px}.hub{font-size:12px;padding:20px 5px}.hub small{font-size:8px}.networknodes{gap:6px}.networknodes:before{left:-13px}.systemnode{min-height:68px;padding:8px 6px;font-size:10px}.systemnode small{font-size:8px;line-height:1.6}.systemnode:nth-child(odd):before{left:-14px;width:13px}.systeminfo h2{font-size:19px}.infofield{padding:12px 0}.porthead{display:block}.porthead input{width:100%;margin-top:12px;min-height:40px}.port{font-size:9px;gap:4px;padding:6px 4px;min-height:45px}.port b{font-size:10px;min-width:21px}.portgrid{gap:4px}.portslayout{gap:12px}.signalintro{display:block}.signalintro h2{font-size:15px}.signalintro p{font-size:10px;line-height:1.8}.signalintro input{width:100%;margin-top:15px;min-height:40px}.signalrow{grid-template-columns:25px minmax(80px,1fr) 44px minmax(80px,1fr);gap:7px;min-height:74px}.signalrow strong{font-size:10px;line-height:1.8}.signalrow .pin{font-size:10px}.wirelabel{font-size:8px;top:-20px}.legendrow{gap:12px;font-size:9px}.signalrow.headings{font-size:9px}.pathrow{grid-template-columns:1fr;gap:10px;padding:20px 0}.pathline{max-width:none;width:100%;border-bottom:1px solid #479c91}.pathbox{padding:12px;font-size:12px}.hvzones{grid-template-columns:1fr;gap:15px;margin:20px 0}.hvzone{padding:18px;min-height:140px}.fiber{border-top:2px dashed #9c6caf;border-bottom:2px dashed #9c6caf;padding:15px}.helpgrid{grid-template-columns:1fr;gap:15px}dialog{padding:27px 22px}dialog h2{font-size:22px}.notebox{margin:18px 0 12px}}
@media(max-height:620px) and (min-width:761px){.header{height:60px}.selectedcard{top:75px}.selectedcard>small,.positionreadout{display:none}.selectedcard p{font-size:10px}.viewheadline p{display:none}}
[hidden]{display:none!important}

.selectedactions{flex-wrap:wrap}.selectedactions button{flex:1 1 42%}.system-maint-link{display:block;margin-top:10px;width:100%}
