:root{color-scheme:dark;--bg:#071222;--sidebar:#081527;--panel:#0e223b;--panel2:#0b1d33;--panel3:#112744;--line:#203b59;--muted:#8fa6c3;--text:#e7f1ff;--blue:#2185ff;--violet:#9455f7;--teal:#0cd6b2;--green:#1ee48d;--red:#ff576f;--orange:#ffa92c;--edge:rgba(54,102,149,.28);--shadow:0 7px 26px rgba(0,0,0,.16);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-size:13px}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:#74bbff;text-decoration:none}a:hover{text-decoration:underline}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #76baff;outline-offset:2px}svg{display:inline-block;vertical-align:middle;flex-shrink:0}input,select,textarea{color:var(--text);background:#091a2f;border:1px solid var(--line);border-radius:8px;padding:10px 12px;min-width:0}textarea{width:100%;resize:vertical;min-height:85px}input::placeholder,textarea::placeholder{color:#7189a9}.boot{display:grid;place-items:center;height:100vh;text-align:center;font-size:25px;font-weight:800}.boot small{font-size:13px;color:var(--muted)}.muted{color:var(--muted)}.tiny{font-size:10px}.small{font-size:11px}.strong{font-weight:700}.inline{display:inline-flex;align-items:center;gap:5px}.positive{color:var(--green)}.negative{color:var(--red)}.warning{color:var(--orange)}.accent{color:#67b6ff}.violet{color:#be8dff}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.spaced{justify-content:space-between}.nowrap{white-space:nowrap}.empty{padding:28px 16px;text-align:center;color:#93a9c8}.empty svg{display:block;margin:0 auto 10px;color:#4776b3}.empty b{display:block;margin-bottom:5px;color:#dce9fa}.layout{display:flex;min-height:100vh;width:100%}.sidebar{width:202px;min-width:202px;background:linear-gradient(180deg,#0b1d35,#081526 70%);border-right:1px solid #1a3552;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;z-index:12}.brand{display:flex;gap:11px;align-items:center;padding:16px 14px;height:64px;font-weight:800;font-size:16px;line-height:1.14}.brand .logo{height:36px;width:36px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(125deg,#1453ca,#2852f5);box-shadow:0 0 20px #1645a644}.brand .logo svg{width:24px;height:24px}.sidebar-nav{padding:8px 7px;overflow:auto;flex:1}.nav{display:flex;align-items:center;gap:12px;border:0;background:transparent;color:#d0def1;text-align:left;width:100%;height:40px;padding:0 12px;border-radius:7px;margin:1px 0;font-size:12px;transition:.15s}.nav:hover{background:#153453}.nav.active{background:linear-gradient(110deg,#1b51c5,#1851a4);color:white;box-shadow:inset 0 0 0 1px #4c82f555}.nav svg{width:17px;height:17px}.nav-group{font-size:10px;color:#6e8aaf;letter-spacing:.08em;text-transform:uppercase;margin:17px 11px 5px}.side-info{margin:12px 11px;border:1px solid #1c3a59;border-radius:8px;padding:12px;background:#10263e}.side-info h4{margin:0 0 6px;color:#92caff}.side-info p{margin:5px 0;font-size:11px;color:#93abc9}.side-footer{padding:0 12px 14px;font-size:10px;color:#7894b5}.workspace{min-width:0;flex:1}.topbar{height:60px;border-bottom:1px solid #1b334e;background:linear-gradient(90deg,#0b1b31,#091a2e);display:flex;align-items:center;gap:12px;padding:0 15px 0 20px;position:sticky;top:0;z-index:10}.mobile-menu{display:none!important}.topbar-title{display:flex;align-items:center;gap:11px;min-width:270px}.icon-tile{width:42px;height:42px;border-radius:9px;display:grid;place-items:center;color:#60b2ff;background:linear-gradient(125deg,#0e3f81,#133671);border:1px solid #1a4275}.icon-tile svg{width:23px;height:23px}.topbar h1{font-size:21px;line-height:1.1;margin:0 0 3px;letter-spacing:-.025em}.topbar .subtitle{font-size:11px;color:#a6bed9}.topsearch{margin-left:auto;display:flex;align-items:center;gap:8px;min-width:220px;max-width:325px;width:27%;height:32px;background:#0b1c32;border:1px solid #29486b;border-radius:8px;padding:0 10px;color:#9db8da}.topsearch input{padding:0;border:0;background:none;width:100%;height:100%;font-size:11px}.topsearch input:focus{outline:0}.top-actions{display:flex;align-items:center;gap:10px;white-space:nowrap}.owner-tag{border:1px solid #795d21;background:#1c2031;color:#e9c36f;border-radius:8px;padding:7px;font-size:11px}.avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#315ad6,#8e40cf);display:grid;place-items:center;font-weight:800}.page{padding:12px 13px 24px;max-width:1800px;margin:auto}.grid{display:grid;gap:10px}.stats{grid-template-columns:repeat(6,minmax(0,1fr));margin-bottom:10px}.panel,.stat,.node-card,.tile,.subpanel{background:linear-gradient(145deg,#10243b,#0b1c30);border:1px solid var(--edge);border-radius:9px;box-shadow:var(--shadow);min-width:0}.panel{padding:10px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.panel-title{font-size:13px;font-weight:750;display:flex;gap:8px;align-items:center}.panel-subtitle{color:#9bb0c9;font-size:11px;margin-top:3px}.stat{min-height:86px;padding:13px;display:flex;align-items:flex-start;gap:11px}.stat-icon{width:43px;height:43px;display:grid;place-items:center;border-radius:10px;background:#123d86;color:#49a7ff;flex-shrink:0}.stat-icon.green{background:#12473d;color:var(--green)}.stat-icon.purple{background:#34306b;color:#b78aff}.stat-icon.orange{background:#4d302d;color:var(--orange)}.stat .label{font-size:11px;color:#d0dfef;margin-bottom:6px}.stat .value{font-size:21px;font-weight:800;line-height:1.1;color:#e8f5ff}.stat .value.green{color:var(--green)}.stat .value.red{color:var(--red)}.stat .desc{margin-top:6px;font-size:10px;color:#9eb2cd}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#7995ba;box-shadow:0 0 6px #294a66}.dot.green{background:var(--green);box-shadow:0 0 9px #11d98c7a}.dot.red{background:var(--red);box-shadow:0 0 9px #d6315d77}.dot.orange{background:var(--orange)}.dot.blue{background:#348eff}.badge{display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:4px 7px;border-radius:5px;font-size:10px;white-space:nowrap;border:1px solid #234a6a;background:#123151;color:#84c2ff}.badge.green{color:var(--green);background:#10392f;border-color:#1c604b}.badge.red{color:#ff647a;background:#3a1b30;border-color:#68334b}.badge.orange{color:#ffbc60;background:#3f2e20;border-color:#805b25}.badge.purple{color:#d1adff;background:#2b1d53;border-color:#5b35a0}.btn{color:#dcebff;border:1px solid #2e5276;background:#102c4c;padding:7px 10px;border-radius:7px;font-size:11px;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;min-height:30px}.btn:hover{background:#1a4168}.btn.primary{background:linear-gradient(125deg,#125ad2,#2065ef);color:white;border-color:#437ef1}.btn.primary:hover{filter:brightness(1.16)}.btn.danger{border-color:#884254;color:#ff97a6;background:#341d2b}.btn.small{padding:5px 8px;min-height:25px}.btn:disabled{opacity:.45;cursor:default}.meta-row{display:flex;gap:16px;align-items:center;font-size:11px;color:#9db3cb;flex-wrap:wrap}.meta-row .inline{white-space:nowrap}.section-row{display:grid;grid-template-columns:minmax(0,2.45fr) minmax(300px,1fr);gap:10px;margin-bottom:10px}.section-row.half{grid-template-columns:minmax(0,2fr) minmax(325px,1fr)}.section-row.bottom{grid-template-columns:repeat(2,minmax(0,1fr))}.nodes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(195px,1fr));gap:8px}.node-card{padding:10px;box-shadow:none;border-color:#1a3a59}.node-card:hover{border-color:#326baf;transform:translateY(-1px)}.node-header{display:flex;gap:8px;align-items:center;margin-bottom:9px}.node-ico{width:33px;height:33px;display:grid;place-items:center;border-radius:8px;background:#142f4d;color:#fe9b39}.node-header .node-title{flex:1;min-width:0}.node-title strong{font-size:12px;display:block}.node-title small{font-size:10px;color:#87b9ec;display:block;margin-top:3px}.node-desc{font-size:10px;color:#9daec7;line-height:1.35;min-height:16px}.metric{display:flex;align-items:center;gap:7px;margin:5px 0}.metric .metric-name{font-size:11px;width:44px;flex:0 0 44px}.bar{height:8px;min-width:30px;flex:1;background:#263d5a;border-radius:10px;overflow:hidden}.bar>span{display:block;height:100%;background:linear-gradient(90deg,#1474d1,#4296ff);border-radius:10px}.bar.purple>span{background:linear-gradient(90deg,#7542d7,#a265ee)}.bar.teal>span{background:linear-gradient(90deg,#08988c,#20d3ae)}.metric .metric-val{font-size:10px;min-width:30px;text-align:right}.metric .no-data{color:#6686aa;font-size:10px;text-align:right}.metric-wide{font-size:10px;color:#a2bcd7;display:flex;justify-content:space-between}.chartpanel{min-height:180px}.chart-frame{width:100%;height:147px;display:block}.chart-info{display:flex;gap:14px;flex-wrap:wrap;align-items:center;font-size:10px;color:#b9c6d8}.chart-info .inline{gap:4px}.data-table{width:100%;border-collapse:collapse;font-size:11px;text-align:left}.data-table th{color:#a9bdd8;background:#18304a;font-weight:500}.data-table th,.data-table td{padding:6px 8px;border-bottom:1px solid #1b344f;vertical-align:middle}.data-table tbody tr:hover{background:#122e4b}.data-table td{max-width:320px;word-break:break-word}.data-table .bar{width:88px;display:inline-block;flex:initial;margin-right:6px}.tablewrap{overflow:auto;border:1px solid #213a56;border-radius:7px}.tablewrap .data-table th,.tablewrap .data-table td{white-space:nowrap}.incident{display:flex;gap:9px;padding:8px 6px;border-bottom:1px solid #203850;font-size:11px}.incident:last-child{border-bottom:none}.inc-icon{width:29px;height:29px;border-radius:7px;display:grid;place-items:center;color:#ffb34f;background:#59362b}.inc-body{flex:1;min-width:0}.inc-body .muted{display:block;font-size:10px;margin-top:4px}.inc-time{font-size:10px;color:#aec1db}.pipeline{display:flex;gap:2px;justify-content:space-between;position:relative;margin:12px 0 5px}.pipeline:before{content:"";position:absolute;top:10px;left:6%;right:6%;height:2px;background:#2d4865}.pipestep{position:relative;z-index:1;min-width:0;width:15%;text-align:center;font-size:10px;color:#a8bbd5}.pipestep .num{margin:0 auto 6px;border-radius:50%;width:22px;height:22px;display:grid;place-items:center;background:#223b5b;border:1px solid #3c597b;color:#b1c7e6}.pipestep.done .num{background:#1476eb;color:white}.pipestep .caption{display:block;white-space:normal}.settings-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.theme-choice{border-radius:9px;padding:12px;border:1px solid #2b4a69;background:#0c2037;cursor:pointer;display:block;width:100%;text-align:left;color:var(--text)}.theme-choice.active{border:2px solid #188aff;padding:11px;box-shadow:0 0 0 2px #0a478d66}.theme-choice img{width:100%;display:block;border-radius:6px;aspect-ratio:16/9;object-fit:cover;object-position:top;border:1px solid #23486e;margin-top:12px}.theme-choice .choice-head{display:flex;align-items:center;gap:11px;font-size:16px;font-weight:800}.theme-choice .radio-circle{width:22px;height:22px;border:2px solid #44628d;border-radius:50%;display:grid;place-items:center}.theme-choice.active .radio-circle{border:7px solid #188aff;background:white}.formgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}.field{display:grid;gap:5px;color:#acbfda;font-size:11px;min-width:0}.field.full{grid-column:1/-1}.field input,.field select{width:100%}.actionline{display:flex;justify-content:flex-end;gap:8px;align-items:center;flex-wrap:wrap}.pill-tabs{display:flex;gap:4px;flex-wrap:wrap}.tab{padding:5px 9px;background:#122a46;border:1px solid #23466a;border-radius:6px;color:#9fbad9;font-size:10px}.tab.active{background:#1551ae;color:white;border-color:#277ff3}.form-error{color:#ff9aab;font-size:12px;margin:8px 0}.form-success{color:#46e7a7;font-size:12px;margin:8px 0}.modal-backdrop{position:fixed;inset:0;z-index:40;background:#020810cf;display:flex;align-items:center;justify-content:center;padding:20px}.modal{width:min(580px,100%);max-height:88vh;overflow-y:auto;background:linear-gradient(150deg,#132c47,#0a182d);border:1px solid #37618d;border-radius:12px;box-shadow:0 20px 80px #000b;padding:18px}.modal h2{margin:0 0 8px;font-size:19px}.modal p{color:#b0c4df;line-height:1.55}.overlay-close{float:right}.logs{color:#b8d7ef;background:#050f1d;border:1px solid #294867;border-radius:8px;font-size:11px;line-height:1.65;padding:12px;overflow:auto;max-height:380px;white-space:pre-wrap;overflow-wrap:anywhere}.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.row{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.space-between{justify-content:space-between}.card-hint{font-size:11px;color:#8faacb;line-height:1.5}.tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:7px}.topology-area{border:1px solid #1d426b;border-radius:10px;background:radial-gradient(ellipse at center,#102b4d99 0%,#06192e 75%),linear-gradient(#1b3a5933 1px,transparent 1px),linear-gradient(90deg,#1b3a5933 1px,transparent 1px);background-size:auto,24px 24px,24px 24px;min-height:470px;position:relative;overflow:hidden;padding:15px}.topology-layout{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(300px,.95fr);gap:10px}.topology-nodes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;position:relative;z-index:2}.topology-node{border:1px solid #217bdc;border-radius:10px;min-height:141px;padding:11px;background:#0b203b;border-bottom:3px solid #167bea;box-shadow:0 0 20px #0089ff1f;cursor:pointer}.topology-node.selected{box-shadow:0 0 0 2px #21b6ff,0 0 25px #188cfc66}.topology-node .node-title strong{font-size:13px}.topology-line{position:relative;height:80px;margin-top:0}.topology-line svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.topology-core{width:min(240px,70%);margin:0 auto 8px;border:2px solid #08a1ff;box-shadow:0 0 25px #075bdb60;background:linear-gradient(135deg,#071b35,#112c4a);border-radius:17px;padding:19px 15px;text-align:center;position:relative;z-index:2}.topology-core .cluster-label{font-size:19px;font-weight:900;letter-spacing:.04em}.topology-bottom{margin-top:16px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.topology-bottom .tile{padding:11px}.topology-sources{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:12px}.selected-detail{min-height:450px}.selected-detail .detail-title{font-size:16px;font-weight:800;margin:7px 0}.selected-detail .metric{margin:12px 0}.desktop-only{} .mobile-head{display:none}.linklist{display:flex;gap:8px;flex-wrap:wrap}.filters{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap}.filters .btn.active{border-color:#1b80ff;background:#124994}.fullspan{grid-column:1/-1}.note{padding:10px 12px;border-left:3px solid #217cf9;background:#102844;border-radius:5px;font-size:11px;color:#abc6e4}.warning-note{border-color:#fbad42;background:#392c1c}.pane-title{font-size:17px;margin:6px 0 13px}.login-shell{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 50% 20%,#173363,#071222 64%);padding:24px}.login-card{width:min(410px,100%);padding:28px;background:#0d223b;border:1px solid #305477;border-radius:18px;box-shadow:0 14px 60px #0008}.login-card h1{font-size:22px}.login-card .logo{margin-bottom:18px}.login-card .field{margin:14px 0}.login-card .btn{width:100%;margin-top:8px;height:40px}.login-card p{font-size:12px;color:#9db4d0;line-height:1.5}.kv{display:grid;grid-template-columns:minmax(95px,120px) 1fr;gap:8px 12px;font-size:11px;margin:12px 0;color:#bed3eb}.kv span:nth-child(odd){color:#819bbd}.error-banner{padding:10px 13px;border:1px solid #873c55;border-radius:8px;background:#331c30;color:#ff99ab;margin-bottom:12px}.success-banner{padding:10px 13px;border:1px solid #218a6c;border-radius:8px;background:#103b30;color:#4eecb8;margin-bottom:12px}.section-description{color:#a9bed9;font-size:11px;margin:0 0 10px;line-height:1.5}.preview-hint{margin-top:10px;font-size:11px;color:#a6bedb}.mobile-bottom{display:none}
@media(max-width:1300px){.stats{grid-template-columns:repeat(3,minmax(0,1fr))}.topbar-title{min-width:230px}.topsearch{width:25%}.node-card{min-height:155px}}
@media(max-width:1080px){.section-row,.section-row.half,.section-row.bottom,.topology-layout{grid-template-columns:1fr}.stats{grid-template-columns:repeat(3,minmax(0,1fr))}.topbar .subtitle{display:none}.topbar-title{min-width:210px}.topsearch{width:28%}.topology-area{min-height:450px}}
@media(max-width:760px){.sidebar{position:fixed;transform:translateX(-100%);transition:.2s;box-shadow:12px 0 35px #0006}.sidebar.open{transform:translateX(0)}.mobile-menu{display:inline-flex!important}.topbar{height:64px;padding:0 10px;gap:8px}.topbar-title{min-width:0;flex:1}.topbar h1{font-size:15px}.topbar-title .icon-tile{width:32px;height:32px}.topbar-title .icon-tile svg{width:19px}.topsearch{display:none}.top-actions{gap:6px}.top-actions .owner-tag,.top-actions .username{display:none}.top-actions .avatar{height:25px;width:25px}.page{padding:10px}.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.stat{padding:10px;min-height:78px;gap:8px}.stat .stat-icon{width:35px;height:35px}.stat .value{font-size:17px}.stat .label{font-size:10px}.stat .desc{font-size:9px}.nodes-grid{grid-template-columns:1fr}.node-card{min-height:0}.panel{padding:10px}.section-row{gap:8px}.settings-layout,.formgrid,.grid3,.grid2{grid-template-columns:1fr}.theme-choice .choice-head{font-size:14px}.topology-nodes{grid-template-columns:1fr;gap:8px}.topology-node{min-height:0}.topology-line{height:28px}.topology-area{min-height:0;padding:10px}.topology-bottom{grid-template-columns:repeat(2,minmax(0,1fr))}.topology-sources{grid-template-columns:1fr}.selected-detail{min-height:0}.meta-row{gap:8px}.panel-title{font-size:12px}.desktop-only{display:none}.mobile-head{display:block}.pipeline .caption{font-size:8px}.pipestep .num{width:20px;height:20px}.tablewrap{max-width:calc(100vw - 38px)}.mobile-bottom{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:11;background:#0a1e35;border-top:1px solid #23436a;justify-content:space-around;padding:7px 3px max(7px,env(safe-area-inset-bottom))}.mobile-bottom button{display:grid;gap:4px;place-items:center;border:0;background:transparent;color:#8fb0d4;font-size:9px;width:20%}.mobile-bottom button.active{color:#58a8ff}.mobile-bottom svg{width:19px;height:19px}.page{padding-bottom:82px}.topbar{position:sticky}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}