:root{--bg:#f8f9fa;--card-bg:#fff;--border:#e9ecef;--accent:#007bff;--danger:#dc3545;--text-main:#212529;--text-dim:#6c757d;--line-color:#dee2e6}body{background-color:var(--bg);color:var(--text-main);justify-content:center;min-height:100vh;margin:0;padding-top:50px;padding-bottom:50px;font-family:Inter,sans-serif;display:flex}#app{justify-content:center;width:100%;margin:auto;display:flex}.dashboard{text-align:center;flex-direction:column;justify-content:center;width:95%;max-width:1100px;display:flex}h1{color:var(--text-main);margin-top:0;margin-bottom:50px;font-size:1.5rem;font-weight:600}.topology-container{flex-direction:column;align-items:center;gap:80px;display:flex;position:relative}.central-hub-wrapper{z-index:2;justify-content:center;display:flex}.central-hub{background:#fff;border:2px solid #f38020;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:100px;height:100px;padding:10px;transition:all .3s;display:flex;overflow:hidden;box-shadow:0 0 20px #f3802033}.central-hub span.hub-label{color:#f38020;letter-spacing:.5px;margin-top:5px;font-size:14px;font-weight:800}.middle-section-container{justify-content:center;align-items:center;gap:80px;width:100%;display:flex;position:relative}.zero-trust-client{background:#fff;border:1px solid #f38020!important;box-shadow:0 0 20px #f3802033!important}.zero-trust-client svg{width:25px;height:auto}.zero-trust-client .label{color:#05668d;font-weight:800}.path-zero-trust{stroke:#00b4d8;stroke-width:2px;fill:none;stroke-dasharray:5 5}.cf-logo-container{display:flex}.cf-logo-container svg{width:80px;height:auto}.node-row{z-index:2;flex-wrap:wrap;justify-content:center;gap:20px;width:100%;display:flex}.node{background:var(--card-bg);border:1px solid var(--border);z-index:2;border-radius:12px;flex:0 auto;align-items:center;gap:12px;min-width:120px;padding:10px 15px;transition:all .3s;display:flex;box-shadow:0 4px 6px #00000005}.node .icon-box{width:36px;height:36px;color:var(--text-dim);background:#f1f3f5;border-radius:8px;justify-content:center;align-items:center;display:flex}.nodes-border-group{z-index:3;background:#ffffff4d;border:2px dashed #cbd5e0;border-radius:20px;padding:15px;position:relative}.group-inner-label{color:#718096;letter-spacing:1.5px;text-transform:uppercase;white-space:nowrap;z-index:5;background:#f8f9fa;padding:0 10px;font-size:11px;font-weight:700;position:absolute;left:50%;transform:translate(-50%)}.node.online{border-color:var(--accent);box-shadow:0 0 15px #007bff26}.node.online .icon-box{color:var(--accent);background:#007bff1a}.node.offline{opacity:.7}.node.offline .icon-box{color:var(--danger)}.node-info{text-align:left}.node .label{color:var(--text-dim);text-transform:uppercase;margin-bottom:5px;font-size:10px;font-weight:600}.node .ip,.node .name{color:var(--text-main);font-size:13px;font-weight:600}.ip{font-family:monospace}.name{margin-bottom:5px}.top-label{top:-8px}.bottom-label{bottom:-7px}.lines-layer{pointer-events:none;z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}.data-line{fill:none;stroke:var(--line-color);stroke-width:2px}#flow-node-ZT,#flow-node-MESH,#flow-node-VPS124,#flow-node-VPS125,#flow-node-VPS126,#flow-node-VPS127,#flow-node-VPS128,#flow-node-VPS129{stroke:var(--accent)!important}#svg-layer{pointer-events:none;z-index:-1;width:100%;height:100%;position:absolute;top:0;left:0}.flow-dot{fill:var(--accent);filter:drop-shadow(0 0 3px var(--accent))}.flow-group{pointer-events:none}.data-flow{display:none!important}@keyframes flowAnim{0%{stroke-dashoffset:48px}to{stroke-dashoffset:0}}@media (width<=456px){.middle-section-container{gap:30px}}