:root{--bg: #080c14;--panel: #0d131f;--panel-2: #111a29;--panel-3: #16202f;--line: #1e2a3d;--line-soft: #16203042;--text: #e2e8f0;--text-dim: #8fa0b8;--text-faint: #5a6b83;--accent: #38bdf8;--accent-dim: #0ea5e9;--ok: #34d399;--warn: #fbbf24;--danger: #f87171;--violet: #a78bfa;--radius: 7px;--mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:13px/1.45 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow:hidden}.muted{color:var(--text-dim)}.small{font-size:11.5px}.spacer{flex:1}.btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:7px 11px;border-radius:6px;border:1px solid var(--line);background:var(--panel-2);color:var(--text);font-size:12px;font-weight:500;cursor:pointer;transition:background .12s,border-color .12s,transform .06s;white-space:nowrap}.btn:hover:not(:disabled){background:var(--panel-3);border-color:#2b3b53}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.42;cursor:not-allowed}.btn-primary{background:var(--accent-dim);border-color:var(--accent-dim);color:#04121c;font-weight:650}.btn-primary:hover:not(:disabled){background:var(--accent);border-color:var(--accent)}.btn-ghost{background:transparent}.btn-ghost:hover:not(:disabled){background:var(--panel-3)}.btn-danger{background:#2a1116;border-color:#4d1d26;color:var(--danger)}.btn-danger:hover:not(:disabled){background:#3a1720}.btn-active{background:#0c2b3c;border-color:var(--accent-dim);color:var(--accent)}.btn-block{width:100%;justify-content:flex-start}.btn-sm{padding:5px 9px;font-size:11.5px}.btn-row{display:flex;gap:4px;flex-wrap:wrap}.btn-mini{padding:4px 8px;font-size:11px;border-radius:5px;border:1px solid var(--line);background:var(--panel-2);color:var(--text-dim);cursor:pointer}.btn-mini.on{background:#0c2b3c;border-color:#1d5b76;color:var(--accent)}.btn-mini:hover{color:var(--text)}.btn-mini.danger{color:var(--danger);border-color:#4d1d26}.file-btn{position:relative;overflow:hidden}.file-btn input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.btn-x{background:none;border:none;color:var(--text-faint);font-size:19px;line-height:1;cursor:pointer;padding:0 4px}.btn-x:hover{color:var(--text)}input,select,textarea{width:100%;padding:6px 8px;border-radius:5px;border:1px solid var(--line);background:var(--panel);color:var(--text);font:inherit;font-size:12px}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent-dim);box-shadow:0 0 0 2px #0ea5e933}input:disabled,select:disabled,textarea:disabled{opacity:.55;cursor:not-allowed}label>span{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);margin-bottom:3px}label{display:block;margin-bottom:9px}.alert{padding:9px 11px;border-radius:6px;font-size:12px}.alert-error{background:#2a1116;border:1px solid #4d1d26;color:#fca5a5}.banner{margin:0 12px 8px}.pill{font-size:10.5px;padding:2px 7px;border-radius:999px;border:1px solid var(--line);color:var(--text-dim)}.pill.ok{border-color:#1d5b44;color:var(--ok)}.pill.off{border-color:#4d3a1d;color:var(--warn)}.boot{height:100%;display:flex;align-items:center;justify-content:center;gap:10px;color:var(--text-dim)}.spin{width:15px;height:15px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--accent);animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.auth-shell{height:100%;display:grid;place-items:center;background:radial-gradient(900px 480px at 15% -8%,#0e2a3f 0%,transparent 62%),radial-gradient(700px 420px at 105% 110%,#1a1030 0%,transparent 58%),var(--bg)}.auth-card{width:340px;padding:26px;border-radius:11px;background:var(--panel);border:1px solid var(--line);box-shadow:0 26px 60px -22px #000c}.brand{display:flex;gap:11px;align-items:center;margin-bottom:20px}.brand h1{font-size:20px;margin:0;letter-spacing:-.02em}.brand p{margin:1px 0 0;font-size:11.5px}.brand-mark{font-size:24px;color:var(--accent)}.app{height:100%;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:10px;height:44px;padding:0 12px;flex:none;background:var(--panel);border-bottom:1px solid var(--line)}.brand-sm{display:flex;align-items:center;gap:7px;font-size:12.5px}.brand-sm .brand-mark{font-size:15px}.rev{font-family:var(--mono);font-size:11px}.status-msg{font-size:11.5px;color:var(--accent)}.role-pill{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;padding:3px 8px;border-radius:999px;border:1px solid var(--line);color:var(--text-dim)}.role-admin{border-color:#6d28d9;color:var(--violet)}.role-approver{border-color:#1d5b76;color:var(--accent)}.role-editor{border-color:#1d5b44;color:var(--ok)}.workspace{flex:1;display:flex;min-height:0}.palette{width:268px;flex:none;display:flex;flex-direction:column;background:var(--panel);border-right:1px solid var(--line);overflow-y:auto;overflow-x:hidden}.palette-block{padding:11px;border-bottom:1px solid var(--line-soft)}.palette-block.grow{flex:1;min-height:200px;display:flex;flex-direction:column}.palette-block h3{margin:0 0 8px;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-faint);font-weight:600}.search{margin-bottom:8px}.lib-scroll{flex:1;overflow-y:auto;margin:0 -4px;padding:0 4px}.lib-cat{margin-bottom:6px}.lib-cat-head{width:100%;display:flex;align-items:center;gap:6px;background:var(--panel-2);border:1px solid var(--line-soft);color:var(--text-dim);font-size:11.5px;font-weight:600;padding:5px 7px;border-radius:5px;cursor:pointer;text-align:left}.lib-cat-head:hover{color:var(--text)}.lib-cat-head .count{margin-left:auto;font-size:10px;color:var(--text-faint);background:var(--panel);padding:1px 5px;border-radius:999px}.chev{transition:transform .14s;font-size:9px}.chev.open{transform:rotate(90deg)}.lib-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:6px 0 2px}.lib-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:7px 3px;border-radius:6px;cursor:grab;background:var(--panel-2);border:1px solid var(--line-soft);color:var(--text-dim);transition:all .12s}.lib-item:hover:not(:disabled){background:var(--panel-3);border-color:#2b3b53;color:var(--text);transform:translateY(-1px)}.lib-item:disabled{opacity:.45;cursor:not-allowed}.lib-icon{width:26px;height:26px;display:block}.lib-icon svg{width:100%;height:100%;display:block}.lib-name{font-size:9.5px;text-align:center;line-height:1.2;color:inherit;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.canvas-col{flex:1 1 auto;min-width:0;min-height:0;display:flex}.canvas-wrap{flex:1 1 auto;position:relative;min-width:0;min-height:0;display:flex;flex-direction:column;background:linear-gradient(180deg,#0a0f18,#070b12)}.canvas-wrap>div:first-child{cursor:default}.overlay-bar{position:absolute;top:10px;left:10px;right:10px;z-index:5;display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:7px 10px;border-radius:9px;background:#0d131fe8;border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 12px 30px -16px #000d}.ob-group{display:flex;align-items:center;gap:6px}.ob-group.right{margin-left:auto}.ob-tab{padding:4px 10px;font-size:11.5px;border-radius:999px;border:1px solid transparent;background:transparent;color:var(--text-dim);cursor:pointer}.ob-tab:hover{color:var(--text)}.ob-tab.active{background:#0c2b3c;border-color:#1d5b76;color:var(--accent);font-weight:600}.ob-slider,.ob-zoom{display:flex;align-items:center;gap:6px;margin:0}.ob-slider span,.ob-zoom span{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);margin:0}.ob-slider input,.ob-zoom input{width:74px}.ob-zoom b{font-size:11px;font-family:var(--mono);color:var(--text-dim);width:34px}.save-state{font-size:11px}.save-state.clean{color:var(--text-faint)}.save-state.dirty{color:var(--warn)}.conflict-banner{flex-basis:100%;display:flex;align-items:center;gap:8px;padding:7px 10px;margin-top:2px;border-radius:7px;font-size:11.5px;background:#2a1d11;border:1px solid #4d3a1d;color:#fcd34d}.props{width:340px;flex:0 0 340px;display:flex;flex-direction:column;min-height:0;align-self:stretch;background:var(--panel);border-left:1px solid var(--line);overflow:hidden}.props-empty{justify-content:center;padding:22px;text-align:center}.props-head{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);flex:none}.props-head h3{margin:0;font-size:12.5px;font-weight:650}.props-head .btn-x{margin-left:auto}.props-body{flex:1;overflow-y:auto;padding:12px}.pp{margin-bottom:15px;padding-bottom:12px;border-bottom:1px solid var(--line-soft)}.pp:last-of-type{border-bottom:none}.pp h4{margin:0 0 8px;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--text-faint);font-weight:600}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:7px}.checks{display:flex;flex-wrap:wrap;gap:8px;padding-top:2px}.check{display:flex;align-items:center;gap:4px;margin:0;font-size:11.5px;color:var(--text-dim)}.check input{width:auto}.chips{list-style:none;margin:0 0 7px;padding:0;display:flex;flex-wrap:wrap;gap:4px}.chip{display:inline-flex;align-items:center;gap:4px;padding:3px 7px;border-radius:999px;font-size:11px;font-family:var(--mono);background:var(--panel-2);border:1px solid var(--line)}.chip b{color:var(--accent)}.chip em{color:var(--text-faint);font-style:normal;font-size:10px}.chip-udp b{color:var(--warn)}.chip-vlan b{color:var(--violet)}.chip-x{background:none;border:none;color:var(--text-faint);cursor:pointer;font-size:13px;line-height:1;padding:0 1px}.chip-x:hover{color:var(--danger)}.inline-add{display:grid;grid-template-columns:46px 62px 1fr auto;gap:4px}.inline-add .num{text-align:center}.inline-add input,.inline-add select,.inline-add button{font-size:11px;padding:5px 6px}.props-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:10px;border-top:1px solid var(--line-soft)}.drawer-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#000000a8;display:flex;justify-content:flex-end}.drawer{width:min(620px,92vw);height:100%;display:flex;flex-direction:column;background:var(--panel);border-left:1px solid var(--line);animation:slide .18s ease-out}@keyframes slide{0%{transform:translate(24px);opacity:0}}.sink-strip{display:flex;gap:6px;flex-wrap:wrap;padding:9px 12px;border-bottom:1px solid var(--line-soft)}.drawer-body{flex:1;overflow-y:auto;padding:12px}.audit-list{list-style:none;margin:0;padding:0}.audit-row{padding:8px 10px;margin-bottom:5px;border-radius:6px;background:var(--panel-2);border-left:3px solid var(--line)}.audit-row.act-auth{border-left-color:var(--violet)}.audit-row.act-node{border-left-color:var(--accent)}.audit-row.act-edge{border-left-color:var(--ok)}.audit-row.act-diagram{border-left-color:var(--warn)}.audit-row.act-export{border-left-color:var(--text-faint)}.audit-main{display:flex;gap:8px;align-items:baseline;font-size:12px}.audit-main b{font-family:var(--mono);font-size:11.5px;color:var(--accent)}.audit-detail{color:var(--text-dim);font-size:11px}.audit-meta{font-size:10.5px;margin-top:3px;font-family:var(--mono)}.statusbar{height:22px;flex:none;display:flex;align-items:center;gap:14px;padding:0 12px;font-size:10.5px;color:var(--text-dim);background:var(--panel);border-top:1px solid var(--line)}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#1e2a3d;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#2b3b53}