:root{color-scheme:light;--rgb-0:255 255 255;--rgb-1:250 250 250;--rgb-2:243 243 243;--rgb-3:234 234 234;--rgb-4:221 221 221;--rgb-5:199 199 199;--rgb-6:146 146 146;--rgb-7:98 98 98;--rgb-8:68 68 68;--rgb-9:23 23 23;--tone-0:rgb(var(--rgb-0));--tone-1:rgb(var(--rgb-1));--tone-2:rgb(var(--rgb-2));--tone-3:rgb(var(--rgb-3));--tone-4:rgb(var(--rgb-4));--tone-5:rgb(var(--rgb-5));--tone-6:rgb(var(--rgb-6));--tone-7:rgb(var(--rgb-7));--tone-8:rgb(var(--rgb-8));--tone-9:rgb(var(--rgb-9));--green:var(--tone-9);--line:var(--tone-4);--ink:var(--tone-9);--paper:var(--tone-0);--error:#a23e33;--warning:#8a651c;--info:#3c657c}
:root[data-theme=dark]{color-scheme:dark;--rgb-0:12 12 12;--rgb-1:20 20 20;--rgb-2:29 29 29;--rgb-3:41 41 41;--rgb-4:61 61 61;--rgb-5:83 83 83;--rgb-6:115 115 115;--rgb-7:170 170 170;--rgb-8:198 198 198;--rgb-9:238 238 238;--error:#e3a499;--warning:#d7bf87;--info:#a0becd}
body{background:var(--paper);color:var(--ink);font-size:13px;-webkit-font-smoothing:antialiased}button,input,select,textarea{font-family:inherit}button{transition:background .15s,border-color .15s,color .15s}button:focus-visible,a:focus-visible{outline:2px solid var(--tone-9);outline-offset:3px}input:focus,select:focus,textarea:focus{border-color:var(--tone-8);box-shadow:0 0 0 2px rgb(var(--rgb-8) / .08)}.topbar{height:62px;background:var(--paper);gap:17px;border-bottom-color:var(--line)}.brand{letter-spacing:-1px;font-size:24px}.brand-logo{color:var(--ink);width:24px}.brand sup{background:var(--tone-2);color:var(--tone-7);border:0;letter-spacing:1px;font-size:7px}.avatar{background:var(--tone-2);color:var(--tone-8);border:1px solid var(--line)}.breadcrumb{color:var(--tone-7);font-size:10px}.save-status{color:var(--tone-7)}.save-status .status-dot,.statusbar .status-dot{background:var(--tone-7)}.theme-toggle{display:flex;align-items:center;gap:7px;white-space:nowrap}.theme-toggle .icon{width:16px;height:16px}.projectbar{height:82px;background:var(--paper);gap:22px}.project-title h1{font-weight:550;letter-spacing:-.4px}.project-title p{font-size:10px;color:var(--tone-7)}.project-icon{background:var(--tone-2);color:var(--tone-8);border:1px solid var(--line)}.tabs{gap:22px}.tab{font-size:11px;font-weight:500;color:var(--tone-7)}.tab.active{color:var(--ink);border-bottom-color:var(--ink)}.tab .icon{width:15px;height:15px}.btn,.top-btn{border-radius:6px;box-shadow:none;border-color:var(--line);font-weight:500}.btn:hover,.top-btn:hover{background:var(--tone-2);border-color:var(--tone-5)}.btn.primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}.btn.primary:hover{background:var(--tone-8)}.library,.inspector{background:var(--paper)}.panel-title{font-size:12px;font-weight:550;padding-top:23px;letter-spacing:-.1px}.library-tabs{border-color:var(--line);background:var(--tone-1);padding:3px}.library-tabs button{color:var(--tone-7);border-radius:4px}.library-tabs button.active{background:var(--paper);color:var(--ink);box-shadow:0 1px 3px #0000000d}.library-item{border-radius:6px;padding-top:11px;padding-bottom:11px}.library-item:hover{background:var(--tone-2)}.library-item small{font-size:9px;color:var(--tone-7)}.item-icon{background:var(--tone-1);color:var(--tone-8);border-color:var(--line);border-radius:6px}.node-glyph{color:var(--tone-8)}.library-divider,.form-divider{background:var(--line)}.canvas-area{background-color:var(--tone-1);background-image:radial-gradient(var(--tone-4) .7px,transparent .7px);background-size:24px 24px}.canvas-top{left:20px;right:20px;top:19px;align-items:center;gap:13px}.diagram-switch{display:flex;align-items:center;padding:3px;gap:2px;background:var(--paper);border:1px solid var(--line);border-radius:7px;box-shadow:0 2px 8px #00000005}.diagram-switch button{padding:7px 13px;border-radius:4px;font-size:11px;font-weight:500;color:var(--tone-7)}.diagram-switch button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.diagram-caption{font:8px var(--mono);letter-spacing:1px;color:var(--tone-7);white-space:nowrap}.canvas-hint{top:70px;background:var(--ink);color:var(--paper);font-size:10px}.node{background:var(--paper);border-color:var(--tone-5);box-shadow:0 2px 5px #00000005;border-radius:7px}.node:hover{border-color:var(--tone-7)}.node.selected{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}.node.selected:after{display:none}.node-head{border-bottom-color:var(--line);background:var(--paper);padding-top:12px;padding-bottom:12px}.node-head strong{font-size:11px;color:var(--ink);font-weight:550}.node-head small{color:var(--tone-7)}.node-body{color:var(--tone-7)}.node-body .tag{color:var(--tone-8);background:var(--tone-2);border-color:var(--line);border-radius:3px}.node-dot{background:#6d8b74}.node-dot.offline{background:#b98278}.node-dot.planned{background:#a99a77}.port{background:var(--paper);border-color:var(--tone-6);width:9px;height:9px}.port:hover,.port.pending{background:var(--ink);border-color:var(--ink)}.edge{stroke:var(--tone-6);stroke-width:1.5}.edge-wireless{stroke:var(--tone-7)}.edge:hover,.edge.selected{stroke:var(--ink);stroke-width:2}.edge-label{fill:var(--tone-7);stroke:var(--tone-1);font-size:9px}.network-group{border-color:var(--tone-5);background:rgb(var(--rgb-3) / .16);border-radius:8px}.network-group.folded{background:var(--tone-2);border-color:var(--tone-5);box-shadow:none}.group-header{border-bottom-color:transparent}.group-name,.group-count{color:var(--tone-8)}.group-name{font-weight:550}.group-subtitle{color:var(--tone-7)}.group-list-item{border-color:var(--line);background:var(--tone-1)!important;border-left:1px solid var(--line);border-radius:6px}.group-list-title strong{color:var(--ink)}.group-list-title small{color:var(--tone-7)}.group-toggle,.group-edit,.group-io,.group-add-child{color:var(--tone-7)}.group-library-actions .btn{font-size:10px}.projection-fold-summary{padding:15px 17px;font-size:11px;color:var(--tone-7)}.projection-group .group-name{font-size:12px;flex:1;padding:0 5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.projection-group .group-header{padding-right:16px}.topology-node-context{margin-bottom:24px;padding:12px;background:var(--tone-1);border:1px solid var(--line);border-radius:6px}.topology-node-context small{font:8px var(--mono);letter-spacing:.5px;color:var(--tone-7)}.topology-node-context p{font-size:11px;line-height:1.8;margin:5px 0 8px;color:var(--tone-8);overflow-wrap:anywhere}.canvas-toolbar{background:var(--paper);border-color:var(--line);box-shadow:0 3px 12px #00000008;border-radius:7px}.tool{color:var(--tone-7)}.tool.active{background:var(--ink);color:var(--paper)}.tool:hover{background:var(--tone-2)}.tool.active:hover{background:var(--tone-8)}.canvas-legend{color:var(--tone-7)}.legend-line,.legend-line.wireless{border-color:var(--tone-6)}.minimap{background:var(--paper);border-color:var(--line)}.mini-node{background:var(--tone-4);border-color:var(--tone-6)}.mini-view{border-color:var(--tone-6);background:transparent}.inspector-heading{font-weight:500}.inspector-content{padding-top:22px}.field>span{font-size:11px;color:var(--tone-7)}.field input,.field select,.field textarea{background:var(--tone-1);border-color:var(--line);border-radius:5px;font-size:12px;padding:10px;color:var(--ink)}.form-heading{font-size:9px;color:var(--tone-7);letter-spacing:.8px}.inspector-footer{color:var(--tone-7)}.statusbar{height:28px;background:var(--paper);color:var(--tone-7);font-size:8px}.view-main{background:var(--tone-1)}.view-heading h2{font-size:26px;font-weight:500;letter-spacing:-.8px}.view-heading p{color:var(--tone-7);font-size:12px}.eyebrow{color:var(--tone-7);font-size:8px;letter-spacing:1.5px}.card,.stat-card{background:var(--paper);border-color:var(--line);box-shadow:none;border-radius:8px}.card-heading{font-weight:500;border-color:var(--line)}.stat-number{font-size:32px;font-weight:450;letter-spacing:-1.5px}.stat-label,.stat-card small{color:var(--tone-7)}.network-review-summary{background:var(--paper);border-color:var(--line)}.network-review-summary>svg,.network-review-summary small{color:var(--tone-7)}.inventory-table th{background:var(--tone-1);color:var(--tone-7);border-color:var(--line)}.inventory-table td{color:var(--tone-8);border-color:var(--line)}.inventory-table tbody tr:hover{background:var(--tone-1)}.table-device{color:var(--ink)}.table-device svg{color:var(--tone-7)}.table-device small{color:var(--tone-7)}.badge{color:var(--tone-8);background:var(--tone-2);border-color:var(--line)}.badge.offline{color:var(--error);background:transparent;border-color:var(--line)}.badge.planned{color:var(--warning);background:transparent;border-color:var(--line)}.text-link,.ipam-node-link{color:var(--tone-8)}.network-hint,.review-scope{color:var(--tone-7)}.issue-error,.group-error{color:var(--error)}.issue-warning{color:var(--warning)}.issue-info{color:var(--info)}.node.has-network-error{border-color:var(--error);box-shadow:none}.link-profile{background:var(--tone-2);color:var(--tone-8);border-color:var(--line)}.port-state.used{background:var(--tone-8);border-color:var(--tone-8)}.port-state.disabled{background:var(--warning);border-color:var(--warning)}.issue-row:hover{background:var(--tone-1)}.issue-row{border-color:var(--line)}.ipam-subnet{background:var(--paper);border-color:var(--line)}.ipam-subnet.active{background:var(--tone-2);border-color:var(--tone-8)}.ipam-subnet strong,.ipam-subnet>span{color:var(--ink)}.ipam-subnet small,.ipam-subnet em{color:var(--tone-7)}.ipam-mini-bar{background:var(--tone-3)}.ipam-mini-bar i{background:var(--tone-8)}.ipam-stat{background:var(--paper);border-color:var(--line)}.ipam-stat strong,.ipam-stat.occupied strong,.ipam-stat.reserved strong,.ipam-stat.free strong{color:var(--ink)}.ipam-stat small{color:var(--tone-7)}.ipam-plan-card{background:var(--paper);border-color:var(--line)}.ipam-plan-card strong{color:var(--ink)}.ipam-plan-card small{color:var(--tone-7)}.ipam-pool-list button{background:var(--tone-2);border-color:var(--line);color:var(--tone-8)}.ipam-pool-list strong{color:var(--ink)}.ipam-alerts{background:var(--tone-2);border-color:var(--line)}.ip-cell{background:var(--tone-2);color:var(--tone-7);border-color:var(--line);border-radius:3px}.ip-cell.occupied,.ipam-legend i.occupied{background:var(--tone-8);border-color:var(--tone-8);color:var(--paper)}.ip-cell.reserved,.ipam-legend i.reserved{background:var(--tone-4);border:1px dashed var(--tone-8);color:var(--ink)}.ip-cell.gateway,.ipam-legend i.gateway{background:var(--tone-1);border:2px solid var(--tone-8);color:var(--ink)}.ip-cell.conflict,.ipam-legend i.conflict{background:var(--error);border-color:var(--error);color:var(--paper)}.ip-cell.in-dhcp{box-shadow:inset 0 -3px var(--tone-6)}.ipam-legend i.in-dhcp{background:var(--tone-6)}.ipam-badge,.ipam-badge.occupied,.ipam-badge.reserved,.ipam-badge.gateway{background:var(--tone-2);color:var(--tone-8)}.ipam-badge.conflict{background:var(--error);color:var(--paper)}.ipam-address-table th{background:var(--tone-1)}.ipam-reservation,.ipam-address-table td{border-color:var(--line)}.ipam-address-table td{color:var(--tone-8)}.ipam-address-table td small,.ipam-reservation small{color:var(--tone-7)}dialog{background:var(--paper);color:var(--ink);border-color:var(--line);border-radius:10px;box-shadow:0 20px 100px #00000026}dialog::backdrop{background:#00000033;backdrop-filter:blur(3px)}dialog p{color:var(--tone-7)}.export-option{border-color:var(--line)}.export-option:hover{background:var(--tone-1)}#toast{background:var(--ink);color:var(--paper);border-color:var(--ink);box-shadow:0 5px 20px #00000014;font-size:12px;border-radius:7px}.group-member{border-color:var(--line)}.group-member strong{color:var(--ink)}.group-member small{color:var(--tone-7)}.hierarchy-tree-root{color:var(--tone-7);background:var(--tone-1);border-color:var(--line)}#hierarchy-drag-hint{background:var(--ink);color:var(--paper)}.io-link{background:var(--tone-1);border-color:var(--line)}.io-link strong{color:var(--ink)}.io-link>span,.io-link small,.io-breadcrumb{color:var(--tone-7)}.io-stats span{background:var(--tone-1);border-color:var(--line);color:var(--tone-7)}.io-stats b{color:var(--ink)}.group-error{font-size:11px}
@media(min-width:1500px){.library{width:230px}.inspector{width:280px}}@media(max-width:1200px){.tabs{gap:14px}.projectbar{gap:16px}.tab{font-size:10px}.project-title{min-width:170px}.project-actions .btn{font-size:10px}.save-status{display:none}.theme-toggle span{font-size:10px}}@media(max-width:900px){.tabs{gap:13px}.project-title{min-width:150px}.project-title p{font-size:9px}.project-title h1{font-size:14px}.diagram-caption{display:none}.canvas-top{left:13px;right:13px}.diagram-switch button{padding:7px 11px}.theme-toggle span{display:none}.theme-toggle{padding:8px}.topbar{height:58px}.projectbar{height:82px}.inspector{width:230px}.library{width:180px}}@media(max-width:680px){.topbar{height:54px}.projectbar{height:100px}.project-title{min-width:0}.tabs{gap:20px;max-width:calc(100vw - 30px);overflow-x:auto}.library{width:62px}.projection-library .panel-title,.projection-library .groups-footer,.projection-library .library-tabs{display:none}.projection-library .group-list{padding:8px 3px}.projection-library .group-list-title{padding:3px;font-size:8px}.projection-library .group-list-title strong{font-size:8px;white-space:normal}.projection-library .group-list-title small{display:none}.projection-library .group-tree-row{margin-left:0}.projection-library .group-toggle{width:12px}.projection-library .group-list-item{gap:0;padding:8px 1px}.inspector{width:245px}.diagram-switch button{font-size:10px;padding:6px 9px}.canvas-top{top:12px}.theme-toggle .icon{display:block}.brand{font-size:22px}.view-heading h2{font-size:22px}}
.canvas-toolbar{gap:2px}.tool{height:30px;min-width:28px;width:28px}.zoom-value{width:35px}.tool-divider{margin:0 2px}.tab{font-size:11px}.network-group.projection-group{border-style:solid}.projection-library .group-tree-row{margin-left:calc(var(--depth)*10px)}@media(max-width:680px){.tab{font-size:10px}.projection-library .group-tree-row{margin-left:0}}

.network-group:not(.projection-group){border-left-color:var(--group-color)}