:root{--up: #22c55e;--up-soft: rgba(34, 197, 94, .14);--degraded: #f59e0b;--degraded-soft: rgba(245, 158, 11, .14);--down: #ef4444;--down-soft: rgba(239, 68, 68, .14);--pending: #64748b;--pending-soft: rgba(100, 116, 139, .16);--radius: 14px;--radius-sm: 9px;--maxw: 1080px;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}[data-theme=dark]{--bg: #0b0f17;--bg-grad: radial-gradient(1200px 600px at 50% -10%, #131a2a 0%, #0b0f17 55%);--panel: #121826;--panel-2: #161e2e;--border: #232b3d;--text: #e6ebf4;--text-dim: #8a94a8;--text-faint: #5a6477;--shadow: 0 8px 30px rgba(0, 0, 0, .35)}[data-theme=light]{--bg: #f4f6fb;--bg-grad: radial-gradient(1200px 600px at 50% -10%, #ffffff 0%, #eef1f7 55%);--panel: #ffffff;--panel-2: #f7f9fc;--border: #e3e8f0;--text: #131722;--text-dim: #5a6478;--text-faint: #98a1b3;--shadow: 0 8px 30px rgba(20, 30, 60, .08)}*{box-sizing:border-box}body{margin:0;background:var(--bg);background-image:var(--bg-grad);background-attachment:fixed;color:var(--text);-webkit-font-smoothing:antialiased}h1,h2,h3{margin:0;font-weight:650;letter-spacing:-.01em}p{margin:0}.topbar{max-width:var(--maxw);margin:0 auto;padding:26px 22px 10px;display:flex;align-items:center;justify-content:space-between}.topbar__brand{display:flex;align-items:center;gap:14px}.brandmark{width:38px;height:38px;flex:none;display:block}.topbar h1{font-size:20px}.topbar p{color:var(--text-dim);font-size:13.5px;margin-top:2px}.logo{width:34px;height:34px;border-radius:10px;flex:none;background:var(--pending-soft);position:relative;box-shadow:inset 0 0 0 1px var(--border)}.logo:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:12px;height:12px;border-radius:50%;background:var(--pending)}.logo--up{background:var(--up-soft)}.logo--up:after{background:var(--up);box-shadow:0 0 12px var(--up)}.logo--degraded{background:var(--degraded-soft)}.logo--degraded:after{background:var(--degraded);box-shadow:0 0 12px var(--degraded)}.logo--down{background:var(--down-soft)}.logo--down:after{background:var(--down);box-shadow:0 0 12px var(--down)}.topbar__actions{display:flex;gap:8px}.themebtn{width:38px;height:38px;border-radius:10px;border:1px solid var(--border);background:var(--panel);color:var(--text);font-size:16px;cursor:pointer;transition:background .15s,transform .1s;display:inline-flex;align-items:center;justify-content:center}.themebtn:hover{background:var(--panel-2)}.themebtn:active{transform:scale(.94)}.login{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:24px}.login__card{width:100%;max-width:380px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:30px 28px;display:flex;flex-direction:column;gap:16px}.login__brand{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:8px;text-align:center}.login__logo{width:100%;max-width:260px;height:auto;display:block;background:#fff;padding:16px 20px;border-radius:14px;box-sizing:border-box;box-shadow:0 1px #ffffff0a}.login__hint{color:var(--text-dim);font-size:12.5px}.field{display:flex;flex-direction:column;gap:6px}.field span{font-size:12.5px;color:var(--text-dim);font-weight:500}.field input{height:42px;padding:0 13px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--panel-2);color:var(--text);font-size:14.5px;outline:none;transition:border-color .15s,box-shadow .15s}.field input:focus{border-color:var(--up);box-shadow:0 0 0 3px var(--up-soft)}.login__btn{height:44px;margin-top:4px;border:none;border-radius:var(--radius-sm);background:var(--up);color:#04150a;font-size:14.5px;font-weight:650;cursor:pointer;transition:filter .15s,transform .1s}.login__btn:hover{filter:brightness(1.06)}.login__btn:active{transform:scale(.99)}.login__btn:disabled{opacity:.65;cursor:default}.login__error{font-size:12.5px;color:var(--down);background:var(--down-soft);border:1px solid var(--down-soft);padding:9px 12px;border-radius:var(--radius-sm)}.login__foot{color:var(--text-faint);font-size:11.5px;letter-spacing:.04em}.container{max-width:var(--maxw);margin:0 auto;padding:14px 22px 40px}.banner{display:flex;align-items:center;gap:16px;padding:20px 22px;margin-bottom:26px;border-radius:var(--radius);border:1px solid var(--border);background:var(--panel);box-shadow:var(--shadow);position:relative;overflow:hidden}.banner:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--pending)}.banner--up:before{background:var(--up)}.banner--degraded:before{background:var(--degraded)}.banner--down:before{background:var(--down)}.banner__icon{width:14px;height:14px;border-radius:50%;background:var(--pending);flex:none}.banner--up .banner__icon{background:var(--up);box-shadow:0 0 0 6px var(--up-soft)}.banner--degraded .banner__icon{background:var(--degraded);box-shadow:0 0 0 6px var(--degraded-soft)}.banner--down .banner__icon{background:var(--down);box-shadow:0 0 0 6px var(--down-soft)}.banner__text h2{font-size:18px}.banner__text p{color:var(--text-dim);font-size:13.5px;margin-top:3px}.banner__err{margin-left:auto;font-size:12.5px;color:var(--down);background:var(--down-soft);padding:6px 10px;border-radius:8px}.group{margin-bottom:26px}.group__title{font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-faint);margin:0 4px 10px}.group__items{border:1px solid var(--border);border-radius:var(--radius);background:var(--panel);overflow:hidden;box-shadow:var(--shadow)}.monitor{display:grid;grid-template-columns:minmax(170px,1.4fr) minmax(150px,1.6fr) auto auto auto;align-items:center;gap:18px;padding:14px 18px;border-top:1px solid var(--border);transition:background .15s}.monitor:first-child{border-top:none}.monitor:hover{background:var(--panel-2)}.monitor__main{display:flex;align-items:center;gap:12px;min-width:0}.dot{width:10px;height:10px;border-radius:50%;flex:none;background:var(--pending)}.dot--up{background:var(--up);box-shadow:0 0 8px var(--up)}.dot--degraded{background:var(--degraded);box-shadow:0 0 8px var(--degraded)}.dot--down{background:var(--down);box-shadow:0 0 8px var(--down)}.dot--pending{animation:pulse 1.4s infinite}@keyframes pulse{0%,to{opacity:.4}50%{opacity:1}}.monitor__id{min-width:0}.monitor__name{font-weight:600;font-size:14.5px;display:flex;align-items:center;gap:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.badge{font-size:9.5px;font-weight:700;letter-spacing:.05em;color:var(--text-dim);background:var(--panel-2);border:1px solid var(--border);border-radius:5px;padding:1px 5px}.monitor__target{font-size:12px;color:var(--text-faint);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.monitor__heartbeat{min-width:0}.monitor__msg{font-size:11.5px;color:var(--text-dim);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.heartbeat{display:flex;gap:2px;align-items:flex-end;height:22px}.beat{flex:1;min-width:2px;max-width:6px;height:100%;border-radius:2px;background:var(--pending-soft)}.beat--up{background:var(--up);opacity:.85}.beat--down{background:var(--down)}.beat--empty{background:var(--border);opacity:.4}.monitor__spark{display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--up)}.spark{display:block;opacity:.85}.monitor__latency{font-size:11.5px;color:var(--text-dim);font-variant-numeric:tabular-nums}.monitor__stats{display:flex;gap:16px}.stat{text-align:right}.stat__val{display:block;font-size:13.5px;font-weight:650;font-variant-numeric:tabular-nums}.stat__lbl{display:block;font-size:10px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.05em}.monitor__state{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:4px}.statepill{font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:999px;color:var(--pending);background:var(--pending-soft)}.statepill--up{color:var(--up);background:var(--up-soft)}.statepill--degraded{color:var(--degraded);background:var(--degraded-soft)}.statepill--down{color:var(--down);background:var(--down-soft)}.monitor__checked{font-size:10.5px;color:var(--text-faint)}.foot{max-width:var(--maxw);margin:0 auto;padding:8px 22px 40px;display:flex;gap:10px;flex-wrap:wrap;color:var(--text-faint);font-size:12px}.loading{text-align:center;color:var(--text-dim);padding:60px 0}@media (max-width: 820px){.monitor{grid-template-columns:1fr auto;grid-template-areas:"main state" "heartbeat heartbeat" "stats spark";gap:10px}.monitor__main{grid-area:main}.monitor__state{grid-area:state}.monitor__heartbeat{grid-area:heartbeat}.monitor__stats{grid-area:stats}.monitor__spark{grid-area:spark;flex-direction:row;align-items:center;gap:8px;justify-content:flex-end}}