:root{--bg:#f5f6f2;--panel:#fff;--ink:#1c2a25;--muted:#738078;--line:#e4e9e2;--green:#296b4e;--mint:#edf5ee;--lime:#cfec8c;--red:#b74638;--amber:#9b6418;--sidebar:#192c25;--radius:14px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #729b47;outline-offset:3px}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}.skip{position:fixed;top:-60px;left:20px;z-index:99;padding:12px;background:white}.skip:focus{top:10px}
.sidebar{position:fixed;inset:0 auto 0 0;width:232px;background:var(--sidebar);color:#bdccc2;padding:33px 19px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:11px;color:#fff;font-size:26px;font-weight:750;letter-spacing:-1px;margin:0 12px 53px}.brand-symbol{display:grid;place-items:center;position:relative;width:39px;height:42px;background:var(--lime);color:#1a3022;border-radius:12px;font-size:35px;font-weight:800;line-height:1;padding-bottom:5px}.brand-symbol span{position:absolute;right:5px;top:10px}.brand-light{font-weight:350;color:#d2ded5}.brand small{display:block;font-size:8px;letter-spacing:2.4px;font-weight:600;color:#91aa98;margin-top:0}.nav-caption{font-size:9px;letter-spacing:1.8px;color:#7b9685;margin:0 15px 13px}.sidebar nav{display:grid;gap:6px}.sidebar nav a{display:flex;align-items:center;gap:13px;border-radius:9px;padding:12px 15px;font-size:13px;font-weight:500;transition:background .15s}.sidebar nav a:hover{background:#233b30}.sidebar nav a.active{background:var(--lime);color:#233720;font-weight:650}.sidebar nav b{margin-left:auto;font-size:10px;background:#ffffff21;border-radius:5px;padding:1px 6px}.sidebar nav a.active b{background:#abc568}.sidebar-bottom{margin-top:auto}.server-badge{padding:18px 12px;border-top:1px solid #ffffff13;display:flex;gap:10px;align-items:center;color:#d1dfd5;font-size:12px}.server-badge small{display:block;color:#8ba393;font-size:10px;margin-top:2px}.pulse,.tiny-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#99c879;flex-shrink:0}.logout{border:0;background:none;color:#93ab9b;display:flex;gap:12px;font-size:12px;margin:9px 10px}.logout svg{width:17px}.workspace{margin-left:232px}.topbar{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 38px;background:#fafbf8}.breadcrumb{font-size:12px;color:var(--muted)}.breadcrumb span{margin:0 11px;color:#b3bdb4}.breadcrumb strong{color:#3e5146;font-weight:500}.topbar-actions{display:flex;align-items:center;gap:17px}.freshness{font-size:11px;color:var(--muted)}.icon-button{border:1px solid var(--line);border-radius:8px;background:#fff;width:33px;height:33px;display:grid;place-items:center;color:#66766a}.icon-button svg{width:16px}.avatar{background:#e7ece1;border:1px solid #dfe5d8;border-radius:50%;height:33px;width:33px;display:grid;place-items:center;font-size:10px;font-weight:700}
main{max-width:1700px;margin:auto;padding:34px 38px 20px}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:29px;gap:20px}.eyebrow{font-size:9px;letter-spacing:1.8px;color:#7e8c7b;font-weight:650;margin-bottom:7px}h1{font-size:30px;letter-spacing:-1.1px;line-height:1.25;font-weight:650;margin:0 0 10px}.page-heading p{margin:0;color:var(--muted);font-size:12px}.heading-date{font-size:11px;color:#88917f;white-space:nowrap}h2{font-size:16px;letter-spacing:-.35px;margin:0;font-weight:650}h3{font-size:13px;margin:0;font-weight:650}p{margin:0}small{font-size:11px}.muted{color:var(--muted)}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:25px}.metric{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:19px 20px;min-height:146px}.metric-top{display:flex;align-items:center;justify-content:space-between;color:#68796c;font-size:11px}.metric-icon{width:29px;height:29px;display:grid;place-items:center;background:#f1f5ed;border-radius:8px;color:#5b765f}.metric-icon svg{width:16px}.metric-value{font-size:29px;letter-spacing:-1px;font-weight:650;margin:10px 0 6px;line-height:1.1}.metric-value small{font-size:14px;letter-spacing:0;color:#83907f;font-weight:400;margin-left:3px}.metric-note{font-size:10px;color:#7e8a7c}.metric-note.warning{color:var(--amber)}.meter{height:5px;background:#edf0e9;border-radius:9px;overflow:hidden;margin:12px 0 8px}.meter span{display:block;height:100%;background:#82ab69;border-radius:9px}.meter.warning span{background:#d9ab55}.meter.danger span{background:#cd7967}.main-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(270px,1fr);gap:23px;align-items:start}.panel{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:23px}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:21px 23px 16px;gap:12px}.panel-head p{color:var(--muted);font-size:11px;margin-top:4px}.text-link{color:#537657;font-size:11px;font-weight:600;white-space:nowrap;border:0;background:none;padding:0}.text-link:hover{text-decoration:underline}.count{font-size:10px;padding:2px 7px;border-radius:5px;background:#f0f3eb;color:#607657;margin-left:7px}.attention{padding:0 23px 8px}.alert-row{display:flex;gap:12px;padding:14px 0;border-top:1px solid #eef1e9;align-items:flex-start}.alert-symbol{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex-shrink:0;background:#fbf3e6;color:var(--amber)}.alert-symbol.critical{background:#faece8;color:var(--red)}.alert-symbol svg{width:16px}.alert-row h3{font-size:12px;margin:0 0 3px}.alert-row p{font-size:11px;color:var(--muted)}.alert-row .text-link{margin-left:auto;padding-top:6px}.empty{padding:25px;text-align:center;color:var(--muted);font-size:12px}.empty svg{display:block;margin:0 auto 10px;color:#86a877;width:27px;height:27px}.empty strong{color:#425c46;display:block;margin:5px 0}.status-banner{display:flex;align-items:center;gap:11px;background:#eef5e9;color:#456343;padding:15px 20px;border-radius:11px;margin-bottom:23px;border:1px solid #dfead7;font-size:12px}.status-banner.warning{background:#fbf5e9;color:#95671e;border-color:#eee2c8}.status-banner.critical{background:#faeeeb;color:#a54836;border-color:#edd9d2}.status-banner strong{font-weight:600}.status-banner small{color:inherit;opacity:.8}.project-list{width:100%;border-collapse:collapse;text-align:left}.project-list th{padding:9px 23px;font-size:9px;letter-spacing:.7px;text-transform:uppercase;color:#91a087;background:#fafbf7;font-weight:600;border-top:1px solid #edf0e7;border-bottom:1px solid #edf0e7}.project-list td{padding:13px 23px;border-bottom:1px solid #f0f2ec;font-size:11px;vertical-align:middle}.project-list tr:last-child td{border-bottom:0}.project-list tbody tr:hover{background:#fafbf7}.project-name{display:flex;gap:11px;align-items:center;border:0;background:none;text-align:left;padding:0;cursor:pointer;color:var(--ink)}.project-monogram{background:#eff2e8;border:1px solid #e6ebdf;width:32px;height:32px;flex-shrink:0;border-radius:9px;display:grid;place-items:center;color:#6b805a;font-size:11px;font-weight:650}.project-name strong{display:block;font-size:12px;font-weight:600}.project-name small{display:block;color:var(--muted);font-size:10px;margin-top:2px}.pill{display:inline-flex;align-items:center;gap:6px;font-size:10px;white-space:nowrap;padding:4px 8px;border-radius:6px;background:#edf5e9;color:#577a46;line-height:1.4}.pill::before{content:"";display:block;width:5px;height:5px;border-radius:50%;background:currentColor}.pill.down,.pill.critical{background:#faece7;color:#b35543}.pill.warning,.pill.warn{background:#fcf4e6;color:#a87a29}.pill.unknown,.pill.scheduled,.pill.stopped{background:#f0f2ed;color:#7a8574}.pill.info{background:#eef2f9;color:#607596}.numeric{font-variant-numeric:tabular-nums;color:#697767}.table-wrap{overflow:auto}.ring-wrap{display:flex;align-items:center;gap:25px;padding:17px 25px 22px}.ring{width:129px;height:129px;border-radius:50%;background:conic-gradient(#75985b calc(var(--used)*1%),#eff2e9 0);display:grid;place-items:center;flex-shrink:0;transform:rotate(-90deg)}.ring-center{width:104px;height:104px;background:white;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(90deg)}.ring-center strong{font-size:26px;letter-spacing:-1px;font-weight:600}.ring-center small{color:#8d9789;font-size:10px}.ring-legend{font-size:11px;color:#8a9583}.ring-legend strong{display:block;color:#374a3a;font-size:16px;font-weight:600;margin-top:4px}.ring-legend div+div{margin-top:15px}.storage-rows{padding:0 23px 18px}.storage-row{margin:14px 0}.storage-row-head{display:flex;justify-content:space-between;gap:12px;font-size:11px}.storage-row .meter{height:4px;margin:7px 0}.panel-foot{padding:12px 23px;border-top:1px solid var(--line);font-size:10px;color:var(--muted);display:flex;justify-content:space-between;gap:10px}.health-list{padding:0 23px 12px}.health-row{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid #f0f2ec;font-size:11px;gap:10px}.health-row:last-child{border:0}.health-row strong{font-weight:500}.health-row small{display:block;color:var(--muted);font-size:10px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.service-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px}.service-card>div:first-child{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.service-card h3{font-size:12px}.service-card .unit{font:10px ui-monospace,monospace;color:#84917e;margin:9px 0;overflow-wrap:anywhere}.service-card .service-meta{font-size:10px;color:var(--muted);margin-top:15px;display:flex;justify-content:space-between}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:18px;flex-wrap:wrap}.filters{display:flex;background:#e9ede3;padding:4px;border-radius:8px;gap:2px}.filter{border:0;background:none;color:#7e8b76;font-size:11px;padding:7px 12px;border-radius:6px}.filter.active{background:#fff;color:#345137;box-shadow:0 1px 3px #273a1a12}.search{position:relative;min-width:250px}.search svg{position:absolute;top:11px;left:12px;width:16px;color:#86967d}.search input{width:100%;background:#fff;border:1px solid #dfe5d9;padding:9px 12px 9px 36px;border-radius:8px;font-size:11px;outline-color:#75985b}select{border:1px solid var(--line);background:white;border-radius:7px;padding:8px;color:#57684e;font-size:12px}.storage-layout{display:grid;grid-template-columns:1fr 1.5fr;gap:23px}.button{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 14px;border:1px solid #dce4d4;background:#fff;color:#43623b;border-radius:7px;font-size:11px;font-weight:600}.button.primary{background:#274b36;color:#fff;border-color:#274b36}.button.danger{color:#a95142;border-color:#e8d8d2}.button svg{width:15px}.notice{background:#fff3da;border:1px solid #eadaad;border-radius:9px;padding:12px 16px;margin-bottom:20px;color:#8a6722;font-size:12px}.notice[hidden]{display:none}.loading-state{padding:90px 20px;text-align:center;color:var(--muted)}.loading-state h2{margin:17px 0 7px;color:var(--ink)}.loading-state p{font-size:12px}.spinner{display:inline-block;width:25px;height:25px;border:2px solid #dfe6d5;border-top-color:#60814e;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:18px 0 0;margin-top:30px;color:#99a28f;font-size:9px}.tiny-dot{width:5px;height:5px;margin-right:5px}.full-alerts{padding:0 22px 15px}.event{padding:14px 22px;border-top:1px solid var(--line)}.event-head{display:flex;gap:10px;align-items:center;margin-bottom:6px}.event-head time{margin-left:auto;color:var(--muted);font-size:10px}.event p{font-size:12px;overflow-wrap:anywhere}.event details{font-size:10px;color:#85917c;margin-top:8px}.event pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:10px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:23px}.ban-form{padding:0 23px 23px;display:flex;flex-wrap:wrap;gap:9px}.ban-form input{min-width:160px;flex:1;border:1px solid var(--line);border-radius:7px;padding:9px;font-size:12px}.subheading{font-size:13px;font-weight:600;margin:23px 0 13px}.subtle-note{font-size:11px;color:var(--muted);margin:13px 0 20px;line-height:1.65}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);padding:12px 20px;background:#263e2b;color:white;border-radius:9px;box-shadow:0 8px 30px #0002;font-size:12px;z-index:99;max-width:90vw}.toast[hidden]{display:none}dialog{padding:0;border:1px solid var(--line);border-radius:18px;width:min(660px,calc(100vw - 30px));max-height:90vh;box-shadow:0 30px 100px #10211738;background:var(--bg);color:var(--ink)}dialog::backdrop{background:#11201777;backdrop-filter:blur(3px)}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;padding:27px;background:white;border-bottom:1px solid var(--line)}.dialog-head h2{font-size:23px;margin:0 0 5px}.dialog-head p{font-size:12px;color:var(--muted)}.dialog-body{padding:24px 27px}.dialog-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}.dialog-stat{padding:14px;background:white;border:1px solid var(--line);border-radius:9px;font-size:11px;color:var(--muted)}.dialog-stat strong{display:block;font-size:19px;color:var(--ink);font-weight:600;margin-top:5px}.timeline{height:35px;display:flex;gap:2px;align-items:stretch;margin:14px 0 5px}.timeline span{background:#83a46b;min-width:2px;flex:1;border-radius:2px}.timeline .down{background:#c16b54}.timeline .warning{background:#d1aa5f}.timeline .unknown{background:#c8cdbf}.timeline-caption{font-size:9px;color:var(--muted);display:flex;justify-content:space-between}.refreshing svg{animation:spin 1s linear infinite}.section-note{font-size:10px;color:var(--muted);padding:0 23px 15px}
.login-page{background:#e9eee4;display:grid;place-items:center;min-height:100vh;padding:25px;background-image:radial-gradient(ellipse at 20% 20%,#dce7cd,transparent 60%)}.login-shell{display:grid;grid-template-columns:1.1fr 1fr;max-width:880px;width:100%;border-radius:22px;overflow:hidden;box-shadow:0 25px 70px #23331c16;border:1px solid #dde5d5;background:white}.login-intro{padding:50px 43px;background:var(--sidebar);color:white}.login-intro .brand{margin:0 0 90px}.login-intro h1{font-size:37px;line-height:1.15;margin-bottom:20px;color:#eef4e8}.login-intro p{font-size:13px;color:#a9bdac;line-height:1.8}.login-points{display:flex;gap:16px;font-size:10px;color:#c5d6b4;margin-top:32px}.login-points span{display:flex;align-items:center;gap:6px}.login-form{padding:70px 43px;display:flex;flex-direction:column;justify-content:center}.login-form h2{font-size:23px;margin-bottom:8px}.login-form p{font-size:12px;color:var(--muted);margin-bottom:30px}.login-form label{display:block;font-size:11px;color:#5c6b54;margin:0 0 8px}.login-form input{width:100%;padding:12px;border:1px solid #dae1d4;border-radius:8px;background:#fafbf8;margin-bottom:16px}.login-form .button{width:100%;padding:12px}.login-form .error{color:var(--red);min-height:32px;font-size:11px;margin:12px 0}.login-form small{font-size:10px;color:#91a087}
@media(min-width:1500px){main{padding:40px 48px}.metrics{gap:20px}.metric{padding:24px}.main-grid{grid-template-columns:2fr 1fr}}@media(max-width:1150px){.sidebar{width:202px;padding:30px 12px}.workspace{margin-left:202px}main{padding:28px 24px}.topbar{padding:0 24px}.main-grid{grid-template-columns:minmax(0,1.55fr) minmax(235px,1fr);gap:16px}.ring-wrap{padding:16px;gap:16px}.ring{width:105px;height:105px}.ring-center{width:83px;height:83px}.project-list td,.project-list th{padding-left:15px;padding-right:15px}.metric{padding:16px}.service-grid{grid-template-columns:repeat(2,1fr)}.heading-date{display:none}}
@media(max-width:900px){.main-grid{grid-template-columns:1fr}.overview-side{display:grid;grid-template-columns:1fr 1fr;gap:16px}.metrics{grid-template-columns:repeat(2,1fr)}.storage-layout{grid-template-columns:1fr}.two-col{grid-template-columns:1fr}.freshness{display:none}}
@media(max-width:650px){.sidebar{position:relative;width:100%;padding:14px 16px 10px;display:block}.brand{font-size:21px;margin:0 0 13px;gap:8px}.brand-symbol{width:30px;height:31px;border-radius:8px;font-size:28px}.brand small{font-size:7px}.brand-symbol span{top:6px}.nav-caption,.sidebar-bottom{display:none}.sidebar nav{display:flex;overflow-x:auto;gap:5px;margin:0 -7px;scrollbar-width:none}.sidebar nav a{padding:9px 10px;white-space:nowrap;font-size:10px;gap:6px}.sidebar nav a svg{width:14px;height:14px}.sidebar nav b{display:none}.workspace{margin:0}.topbar{height:53px;padding:0 18px}.breadcrumb{font-size:10px}.topbar-actions{gap:10px}.avatar{height:27px;width:27px;font-size:9px}main{padding:25px 16px 18px}.page-heading{margin-bottom:22px}h1{font-size:25px}.page-heading p{font-size:11px;max-width:300px;line-height:1.6}.metrics{gap:10px;margin-bottom:17px}.metric{padding:14px;min-height:139px}.metric-value{font-size:25px}.metric-top{font-size:10px}.metric-note{font-size:9px}.metric-icon{width:23px;height:23px}.main-grid{gap:0}.overview-side{grid-template-columns:1fr}.panel{margin-bottom:17px}.panel-head{padding:17px}.project-list th,.project-list td{padding:12px 14px}.project-list .desktop-col{display:none}.project-name small{max-width:145px;overflow:hidden;text-overflow:ellipsis}.pill{font-size:9px}.project-name strong{font-size:11px}.service-grid{grid-template-columns:1fr}.filters{max-width:100%;overflow:auto}.filter{padding:7px 9px;white-space:nowrap;font-size:10px}.search{width:100%}.toolbar{gap:10px}.ring-wrap{padding:18px 24px;gap:40px}.ring{width:125px;height:125px}.ring-center{width:101px;height:101px}.two-col{gap:0}.status-banner{font-size:11px;margin-bottom:17px;align-items:flex-start}.status-banner small{display:block}.heading-date{display:none}footer{font-size:8px;gap:15px}.dialog-stats{gap:6px}.dialog-stat{padding:10px;font-size:10px}.dialog-stat strong{font-size:16px}.dialog-head{padding:20px}.dialog-body{padding:20px}.login-shell{grid-template-columns:1fr;max-width:430px}.login-intro{padding:26px}.login-intro .brand{margin-bottom:30px}.login-intro h1{font-size:30px}.login-intro p,.login-points{display:none}.login-form{padding:30px}.login-form p{margin-bottom:22px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}