:root{font-family:Inter,"Segoe UI",system-ui,-apple-system,sans-serif;color:#e6ecf4;background:#0b1018;font-size:14px;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}a{color:#8ab5ff}button:disabled{opacity:.45;cursor:not-allowed}[hidden]{display:none!important}.muted{color:#8795a8}.accent{color:#5dd6af}.eyebrow{font-size:10px;letter-spacing:2.2px;color:#5edab7;font-weight:800}.brand{font-weight:800;font-size:21px;letter-spacing:-1px;display:flex;align-items:center;gap:12px;padding:2px}.brand-icon{display:grid;place-items:center;width:35px;height:35px;background:#184b46;border:1px solid #2e7269;border-radius:10px;color:#7bffe0;font-size:23px}.login-screen{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 70% 25%,#142a39 0%,#0b1018 45%);padding:24px}.login-card{width:min(440px,100%);padding:40px;background:#121a25;border:1px solid #2a3645;border-radius:20px;box-shadow:0 20px 70px #0006}.login-card h1{font-size:31px;letter-spacing:-1.2px;margin:24px 0 8px}.login-card>.muted{line-height:1.6}.login-card .eyebrow{margin-top:35px}.login-foot{margin-top:27px;border-top:1px solid #2b3848;padding-top:20px;color:#748197;font-size:11px;display:flex;justify-content:space-between}.vstack{display:grid;gap:17px;margin-top:28px}label{display:grid;gap:8px;font-size:12px;font-weight:600;color:#aab7c8}input,select{background:#0d151f;color:#edf2f8;border:1px solid #334253;border-radius:9px;padding:12px 13px;width:100%;outline:none;min-width:0}input:focus,select:focus{border-color:#39c6a4;box-shadow:0 0 0 3px #39c6a41c}.btn{background:#192533;border:1px solid #324253;color:#d8e4f0;border-radius:9px;padding:10px 14px;font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:10px}.btn:hover{background:#233447}.btn.primary{background:#21b894;color:#05291f;border-color:#21b894}.btn.primary:hover{background:#55d8b6}.btn.danger{color:#ffacb3;border-color:#6d3b46}.btn.small{padding:6px 10px;font-size:12px}.btn.subtle{background:transparent;border:1px solid #2c3949}.btn.wide{width:100%;justify-content:space-between}.error{color:#ff9ba5;background:#4d2530;padding:10px;border-radius:8px}.app-shell{display:flex;min-height:100vh}.sidebar{width:253px;background:#101824;border-right:1px solid #243242;display:flex;flex-direction:column;flex-shrink:0;position:sticky;top:0;height:100vh;padding:25px 14px}.sidebar>.brand{margin:0 8px 30px}.workspace{border:1px solid #2b3b4a;background:#192431;border-radius:10px;padding:10px;display:flex;align-items:center;gap:10px;margin-bottom:24px}.workspace-icon{background:#305a59;color:#8df5df;border-radius:8px;width:33px;height:33px;display:grid;place-items:center;font-weight:800}.workspace strong,.workspace span{display:block}.workspace strong{font-size:12px}.workspace span{color:#8090a3;font-size:10px;margin-top:4px}.workspace-chevron{margin-left:auto!important;font-size:17px!important}.sidebar-title{font-size:10px;letter-spacing:1.7px;font-weight:750;color:#65768c;padding:19px 12px 9px}.sidebar nav{overflow-y:auto;scrollbar-width:thin}.nav-link{display:flex;align-items:center;gap:13px;width:100%;background:transparent;border:0;color:#98a9bb;text-align:left;border-radius:9px;padding:11px 13px;margin:2px 0;font-weight:620}.nav-link span{font-size:18px;width:20px;text-align:center}.nav-link:hover{background:#1b2a37;color:#fff}.nav-link.active{color:#77efd0;background:#1a3a3b}.nav-badge{margin-left:auto;background:#39c2a4;color:#092a20;border-radius:20px;font-size:10px;padding:2px 7px}.sidebar-bottom{margin-top:auto;padding:16px 7px 0}.online-indicator{color:#90a3b7;font-size:11px;margin-bottom:19px}.online-indicator i{display:inline-block;width:7px;height:7px;background:#3ddb9c;border-radius:50%;margin-right:7px;box-shadow:0 0 10px #3ddb9c}.main{min-width:0;flex:1;display:flex;flex-direction:column}.topbar{height:68px;border-bottom:1px solid #202d3b;display:flex;align-items:center;justify-content:space-between;padding:0 38px}.breadcrumb{color:#617287;font-size:11px;letter-spacing:1px;font-weight:700}.breadcrumb span{padding:0 10px}.breadcrumb strong{color:#cad5e2;letter-spacing:0;font-size:12px}.top-right{display:flex;align-items:center;gap:15px}.user-id{color:#a7b6c9;font-size:12px}.avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#2b5554;color:#92f6d8;font-weight:750}.content{width:min(1230px,100%);margin:0 auto;padding:35px 38px 60px;flex:1}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:30px}.page-heading h1{font-size:29px;margin:8px 0 6px;letter-spacing:-.8px}.page-heading p{margin:0}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.card{padding:21px;background:#131f2c;border:1px solid #2a3848;border-radius:12px}.metric-label{color:#8d9eb3;font-size:12px}.metric-value{font-size:31px;font-weight:780;letter-spacing:-1px;margin:13px 0 3px}.metric-note{color:#57cca9;font-size:11px}.panel{border:1px solid #293849;border-radius:13px;background:#121c29;overflow:hidden;margin-top:22px}.panel-header{padding:21px 22px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #273545;gap:12px}.panel-header h2{font-size:15px;margin:0}.panel-header span{font-size:11px;color:#889aaf}.tablewrap{width:100%;overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left}th{background:#172432;color:#8397ad;font-size:10px;text-transform:uppercase;letter-spacing:1px;padding:14px 19px}td{font-size:12px;color:#ccd8e6;padding:14px 19px;border-top:1px solid #253241}td .sub{display:block;color:#728399;font-size:11px;margin-top:3px}td .actions{display:flex;gap:7px}.tag{display:inline-flex;align-items:center;gap:5px;color:#adb9c9;background:#243242;border:1px solid #334357;padding:5px 9px;border-radius:6px;font-size:10px}.tag.green{color:#70e6bc;background:#183d3b;border-color:#235a50}.tag.amber{color:#f2c77d;background:#493923;border-color:#72552c}.tag.red{color:#f5a1ae;background:#492a36;border-color:#6f3c4c}.empty{padding:34px;text-align:center;color:#8a9bad}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px}.notice{padding:15px;border:1px solid #3b544e;background:#17302d;border-radius:10px;color:#a5d9cb;line-height:1.7;font-size:12px}.notice.warn{background:#382b20;border-color:#6a4c2a;color:#f6cfa1}.section-stack{display:grid;gap:16px}.footer{color:#708299;font-size:11px;border-top:1px solid #243141;padding:20px 38px;display:flex;justify-content:space-between;gap:12px}.footer span{color:#7d91a7}dialog{border:1px solid #344456;border-radius:15px;background:#151f2c;color:#e8eef6;max-width:490px;width:calc(100% - 32px);padding:24px;box-shadow:0 30px 80px #000b}dialog::backdrop{background:#060a11bd}.dialog-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.dialog-header h2{margin:0;font-size:20px}.dialog-header button{border:0;background:transparent;color:#9daebe;font-size:17px}.dialog-form{display:grid;gap:16px}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:7px}.toast{position:fixed;bottom:23px;right:25px;background:#174e42;color:#aeffdf;padding:13px 18px;border-radius:9px;box-shadow:0 6px 30px #0008;border:1px solid #2f8c73;z-index:10}.toast.bad{background:#542d36;color:#ffd7dc;border-color:#a54c60}.split-title{font-size:15px;margin:22px 0 10px}.smalltext{font-size:12px;color:#93a5b9}.icon-button{background:none;border:0;color:#8da2b8;font-size:17px;padding:8px}#menu-toggle{display:none}@media(max-width:1050px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.sidebar{width:220px}.content{padding:28px 22px}}@media(max-width:770px){#menu-toggle{display:block}.sidebar{position:fixed;left:-260px;z-index:5;transition:left .2s;width:253px}.app-shell.menu-open .sidebar{left:0}.topbar{padding:0 16px}.content{padding:25px 16px 50px}.two-cols{grid-template-columns:1fr}.footer{padding:20px 16px;flex-wrap:wrap}.user-id{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.page-heading{align-items:flex-start}.cards{gap:10px}.card{padding:15px}.metric-value{font-size:26px}}

/* v0.3 visual system: updated navigation, dashboard and responsive spacing */
:root{--bg:#0a111b;--surface:#101c29;--line:#253647;--muted:#93a8b9;--accent:#59d9b4;background:var(--bg);color:#e7f2f6}
body{background:var(--bg)}.app-shell{background:#0b141f}.sidebar{width:255px;background:#0e1825;padding:27px 13px;border-color:#223243}.sidebar>.brand{margin:0 13px 29px;font-size:20px;letter-spacing:-.8px}.brand-icon{background:#19564f;color:#89ffe0;border:1px solid #2f8e7b;box-shadow:0 0 26px #2fc7a015}.workspace{background:#152434;border:1px solid #2b4656;padding:13px;margin:0 6px 20px;border-radius:13px}.workspace-icon{background:linear-gradient(140deg,#235f5c,#183849);width:37px;height:37px;border:1px solid #3a796e}.workspace strong{font-size:12.5px}.workspace span{font-size:10px}.sidebar-title{color:#61778b;font-size:9px;letter-spacing:1.9px;padding:21px 14px 9px}.nav-link{font-weight:575;font-size:12.5px;padding:12px 13px;gap:14px;transition:background .16s,color .16s}.nav-link span{width:21px;height:20px;display:grid;place-items:center}.nav-link span svg{width:18px;height:18px}.nav-link.active{background:linear-gradient(90deg,#195347,#183834);color:#a2f4d8;box-shadow:inset 3px 0 #53d5ae}.nav-link:hover{background:#1b2c3a}.online-indicator{border:1px solid #2a4548;border-radius:9px;background:#152b30;padding:11px 9px;color:#a7d4cd}.sidebar-bottom{padding:12px 8px 0}.topbar{height:74px;border-color:#223445;padding:0 42px}.breadcrumb{letter-spacing:1.2px}.breadcrumb strong{color:#e1edf2}.avatar{border:1px solid #4d8b7a}.content{width:min(1400px,100%);padding:31px 43px 60px}.page-heading{margin-bottom:23px}.page-heading h1{font-size:30px;letter-spacing:-1px;margin-top:10px}.page-heading p{color:#829aaa}.eyebrow{font-size:9px;letter-spacing:2.5px}.footer{border-color:#233546;background:#0c1723}.btn{border-radius:10px;font-size:12px}.btn.primary{background:#46cda6;border-color:#46cda6;color:#062d25}.btn.primary:hover{background:#6ce0bd}.btn.subtle{border-color:#345063;color:#bcd6df}.cards{gap:15px}.metric-card{min-height:165px;padding:21px 22px;background:linear-gradient(145deg,#142433,#101d2b);border-color:#294052;border-radius:15px}.metric-card:hover{border-color:#3b685e}.metric-header{display:flex;align-items:center;justify-content:space-between;gap:9px}.metric-label{font-size:12px;color:#a6bcca;font-weight:580}.metric-symbol{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:#1e3c50;color:#8ed9f9;font-size:19px}.metric-symbol.teal{background:#164a43;color:#70ddba}.metric-symbol.violet{background:#303651;color:#b7b8f7}.metric-symbol.amber{background:#463a29;color:#f4c789}.metric-value{font-size:35px;font-weight:780;color:#f4fafb;margin:16px 0 7px;line-height:1.05}.metric-note{font-size:11px;color:#829bad}.dashboard-hero{display:flex;position:relative;overflow:hidden;justify-content:space-between;align-items:stretch;min-height:224px;border-radius:18px;border:1px solid #2e5d63;background:radial-gradient(circle at 77% 48%,#1b615866,#12384524 30%,transparent 55%),linear-gradient(112deg,#173943,#102331 76%);margin:0 0 31px;padding:32px 39px}.hero-copy{position:relative;z-index:1;max-width:640px}.hero-eyebrow{display:flex;align-items:center;gap:8px;color:#86eecb;font-size:10px;font-weight:750;letter-spacing:1.7px}.signal-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#6ceebc;box-shadow:0 0 14px #6ceebc}.dashboard-hero h2{font-size:clamp(25px,2.5vw,34px);font-weight:780;letter-spacing:-1.2px;margin:17px 0 10px;color:#f6fdff}.dashboard-hero h2 em{font-style:normal;color:#75e7c4}.dashboard-hero p{color:#a9c5ce;font-size:12px;max-width:440px;line-height:1.8;margin:0}.hero-cta{display:flex;gap:11px;margin-top:23px}.hero-cta .btn{padding:11px 16px}.hero-ghost{background:#1a3948;border:1px solid #426b74;color:#c8e3e7}.hero-ghost:hover{background:#285363}.hero-visual{width:286px;min-width:230px;position:relative;display:grid;place-items:center}.topology{position:relative;width:210px;height:158px;display:grid;place-items:center}.topology-ring{position:absolute;border:1px dashed #69cfb14d;border-radius:50%;pointer-events:none}.topology-ring.r1{width:138px;height:138px}.topology-ring.r2{width:204px;height:204px;opacity:.5}.topology-core{width:68px;height:68px;border:1px solid #70d9bb;border-radius:19px;display:grid;place-items:center;background:linear-gradient(150deg,#277165,#153a49);font-size:40px;color:#a8ffe7;box-shadow:0 0 60px #1bc39c44;z-index:1}.node{position:absolute;z-index:2;display:grid;place-items:center;border:1px solid #3f847f;border-radius:11px;background:#173e46;width:38px;height:38px;color:#93f6d9;font-size:22px}.node.n1{left:0;top:24px}.node.n2{right:0;top:15px}.node.n3{left:4px;bottom:0}.node.n4{right:12px;bottom:0}.visual-label{position:absolute;bottom:-2px;white-space:nowrap;color:#6faca7;letter-spacing:1px;font-size:8px}.visual-label i{color:#68d6ad;font-style:normal;margin:0 5px}.section-row{display:flex;justify-content:space-between;align-items:center;margin:0 1px 16px}.section-row h2{font-size:17px;margin:0 0 6px;letter-spacing:-.3px}.section-row p{font-size:11px;margin:0;color:#8299aa}.section-hint{color:#607a8c;letter-spacing:1.2px;font-size:9px;font-weight:700}.dashboard-lower{display:grid;grid-template-columns:minmax(0,1.47fr) minmax(285px,1fr);gap:18px;margin-top:22px}.dashboard-lower .panel{margin-top:0;border-color:#293e4f;border-radius:15px;background:#111f2d;min-width:0}.panel{background:#101d2a;border-color:#2b3d4b;border-radius:14px}.panel-header{padding:21px 22px;background:#132332}.panel-header h2{font-size:14px;letter-spacing:-.2px}.panel-header p{font-size:11px;color:#7796aa;margin:7px 0 0}.panel-header .text-link{border:0;background:transparent;color:#77dcbd;font-size:11px;font-weight:600;white-space:nowrap}.subtle-icon{font-size:22px!important;color:#5ec7a9!important}.dashboard-lower th{background:#122231;padding:13px 21px}.dashboard-lower td{padding:17px 21px;color:#abbfcb}.dashboard-lower .target{color:#d7e8ef;font-weight:620}.target-dot{display:inline-block;width:7px;height:7px;background:#51cba8;border-radius:50%;margin-right:11px;box-shadow:0 0 8px #2ca57c55}.control-body{padding:22px}.control-note{display:flex;gap:13px;background:#163735;border:1px solid #28574f;border-radius:11px;padding:16px;margin-bottom:15px}.control-mark{background:#275f54;color:#99f4d6;display:grid;place-items:center;width:29px;height:29px;border-radius:9px;flex-shrink:0;font-size:15px}.control-note strong{color:#a8f2d9;font-size:12px}.control-note p{color:#a2bdba;font-size:11px;line-height:1.6;margin:7px 0 0}.control-stat{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#9cb1c2;padding:15px 3px;border-bottom:1px solid #273c4b}.control-stat strong{font-size:15px;color:#effaff}.control-link{width:100%;display:flex;align-items:center;justify-content:space-between;background:transparent;border:1px solid #385667;color:#87ddc6;font-weight:630;border-radius:10px;padding:13px;margin-top:20px;font-size:11px}.control-link:hover{background:#1e3845}.tag{border-radius:16px}.section-stack{gap:19px}
@media(max-width:1130px){.hero-visual{width:200px;min-width:180px}.dashboard-hero{padding:27px}.dashboard-lower{grid-template-columns:1fr 1fr}.content{padding:29px 25px}.sidebar{width:223px}.section-hint{display:none}}@media(max-width:870px){.dashboard-lower{grid-template-columns:1fr}.hero-visual{min-width:140px;width:150px}.topology{transform:scale(.75)}.visual-label{display:none}.dashboard-hero{padding:24px}.dashboard-hero h2{font-size:26px}}@media(max-width:770px){.sidebar{width:255px;left:-270px}.topbar{padding:0 19px;height:64px}.content{padding:23px 16px 45px}.dashboard-hero{min-height:auto}.hero-visual{display:none}.section-row h2{font-size:15px}.metric-card{min-height:145px;padding:17px}.metric-value{font-size:30px}.hero-cta{flex-wrap:wrap}.dashboard-hero h2{font-size:27px}.dashboard-lower{grid-template-columns:1fr}.footer{padding:18px}.page-heading h1{font-size:27px}}@media(max-width:450px){.cards{gap:9px}.metric-card{padding:13px;min-height:135px}.metric-value{font-size:27px}.metric-symbol{width:29px;height:29px;font-size:15px}.metric-label{font-size:10px}.metric-note{font-size:10px}.dashboard-hero{padding:20px}.dashboard-hero h2{font-size:24px}}

.hero-visual .visual-label{display:none}

.update-upload-form{padding:16px;max-width:620px}