:root{--background:#0f1216;--surface:#1a1c22;--surface-rgb:26, 28, 34;--surface-variant:#252830;--surface-container:#1e2024;--surface-container-high:#282a2f;--surface-container-highest:#333538;--primary:#a8c7fa;--primary-rgb:168, 199, 250;--primary-container:#a8c7fa1f;--on-primary:#0f1216;--secondary:#c3c7cf;--tertiary:#e8b9d5;--on-surface:#e2e2e9;--on-surface-variant:#c4c7d0;--outline:#44474f;--outline-variant:#44474f80;--nav-active-bg:#a8c7fa26;--scrim:#00000080;--status-up:#4ade80;--status-up-rgb:74, 222, 128;--status-degraded:#facc15;--status-degraded-rgb:250, 204, 21;--status-down:#f87171;--status-down-rgb:248, 113, 113;--status-maintenance:#a8c7fa;--status-maintenance-rgb:168, 199, 250;--status-nodata:#44474f;--motion-easing-standard:cubic-bezier(.2, 0, 0, 1);--motion-easing-emphasized:cubic-bezier(.2, 0, 0, 1);--motion-easing-emphasized-decelerate:cubic-bezier(.05, .7, .1, 1);--motion-easing-emphasized-accelerate:cubic-bezier(.3, 0, .8, .15);--motion-duration-short1:50ms;--motion-duration-short2:.1s;--motion-duration-short3:.15s;--motion-duration-short4:.2s;--motion-duration-medium1:.25s;--motion-duration-medium2:.3s;--motion-duration-medium3:.35s;--motion-duration-medium4:.4s;--motion-duration-long1:.45s;--motion-duration-long2:.5s;--motion-spring-squish:linear(0, .0446, .1613, .324, .5087, .6946, .8656, 1.0103, 1.1221, 1.1987, 1.2413, 1.2538, 1.2418, 1.2117, 1.1702, 1.1232, 1.0761, 1.0329, .9964, .9683, .9491, .9385, .9356, .9388, .9465, .9572, .9691, .981, .992, 1.0012, 1.0082, 1.013, 1.0156, 1.0163, 1.0155, 1.0135, 1.0108, 1.0077, 1.0047, 1.002, 1);--motion-spring-spatial:linear(0, .0128, .0469, .0969, .158, .2262, .2982, .3716, .4441, .5143, .5808, .6429, .7, .7518, .7983, .8394, .8754, .9064, .9329, .9552, .9736, .9886, 1.0006, 1.0099, 1.0169, 1.022, 1.0254, 1.0274, 1.0283, 1.0283, 1.0276, 1.0264, 1.0248, 1.0229, 1.0209, 1.0189, 1.0168, 1.0148, 1.0128, 1.011, 1);--motion-screen:var(--motion-duration-medium2);--motion-color:var(--motion-duration-long2);--motion-press:var(--motion-duration-short3);--motion-list:var(--motion-duration-medium3);--motion-shape:var(--motion-duration-medium3);--motion-squish:.625s;--list-stagger:35ms;--pulse-epoch:0s;--shape-corner-small:8px;--shape-corner-medium:12px;--shape-corner-large:16px;--shape-corner-extra-large:28px;--shape-corner-full:9999px}[data-theme=light]{--background:#f8fafc;--surface:#fff;--surface-rgb:255, 255, 255;--surface-variant:#e2e8f0;--surface-container:#f1f5f9;--surface-container-high:#e2e8f0;--surface-container-highest:#cbd5e1;--primary:#1d4ed8;--primary-rgb:29, 78, 216;--primary-container:#1d4ed81f;--on-primary:#fff;--secondary:#475569;--tertiary:#7c3aed;--on-surface:#0f172a;--on-surface-variant:#475569;--outline:#94a3b8;--outline-variant:#94a3b880;--nav-active-bg:#1d4ed81f;--scrim:#00000052;--status-up:#16a34a;--status-up-rgb:22, 163, 74;--status-degraded:#d97706;--status-degraded-rgb:217, 119, 6;--status-down:#dc2626;--status-down-rgb:220, 38, 38;--status-maintenance:#2563eb;--status-maintenance-rgb:37, 99, 235;--status-nodata:#94a3b8}*,:before,:after{box-sizing:border-box}html,body{background-color:var(--background);color:var(--on-surface);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;margin:0;padding:0;font-family:Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;transition:background-color .3s,color .3s;overflow-x:hidden}*{scrollbar-width:thin;scrollbar-color:var(--outline) transparent}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background-color:var(--outline);border-radius:var(--shape-corner-full)}::-webkit-scrollbar-thumb:hover{background-color:var(--on-surface-variant)}.container{max-width:1100px;margin:0 auto;padding:0 20px 80px}.card{background:linear-gradient(135deg, var(--surface) 0%, var(--surface-container) 100%);border-radius:var(--shape-corner-extra-large);border:1px solid var(--outline-variant);transition:background var(--motion-duration-medium2) var(--motion-easing-standard), transform var(--motion-duration-short4) var(--motion-easing-emphasized), box-shadow var(--motion-duration-medium2) var(--motion-easing-standard), border-color var(--motion-duration-medium2) var(--motion-easing-standard);overflow:hidden;box-shadow:0 2px 8px #0000001f,0 1px 2px #00000014}.card:hover{border-color:var(--outline);transform:translateY(-2px);box-shadow:0 4px 16px #00000029,0 2px 4px #0000001f}.card:active{transform:scale(.99)translateY(0);box-shadow:0 1px 4px #0000001a}[data-theme=light] .card{box-shadow:0 2px 8px #00000014,0 1px 2px #0000000f,inset 0 1px #fffc}[data-theme=light] .card:hover{box-shadow:0 6px 20px #0000001f,0 2px 6px #00000014,inset 0 1px #fffc}.btn-icon{background:var(--surface-container);border:1px solid var(--outline-variant);width:36px;height:36px;color:var(--on-surface-variant);cursor:pointer;transition:all var(--motion-duration-short4) var(--motion-easing-standard);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;padding:0;text-decoration:none;display:inline-flex}.btn-icon:hover{color:var(--primary);border-color:var(--primary);background:var(--primary-container);box-shadow:0 4px 12px rgba(var(--primary-rgb), .2);transform:translateY(-2px)}.btn-pill{border-radius:var(--shape-corner-full);border:1px solid var(--outline-variant);background:var(--surface-container-high);color:var(--on-surface);cursor:pointer;transition:background var(--motion-duration-short3) var(--motion-easing-standard), border-color var(--motion-duration-short3) var(--motion-easing-standard), transform var(--motion-duration-short2) var(--motion-easing-emphasized);align-items:center;gap:6px;padding:8px 14px;font-size:13px;font-weight:500;display:inline-flex}.btn-pill:hover{border-color:var(--outline)}.btn-pill:active{transform:scale(.95)}.btn-pill.active{color:var(--primary);border-color:var(--primary);background:var(--primary-container)}.status-pill{border-radius:var(--shape-corner-full);letter-spacing:.02em;white-space:nowrap;justify-content:center;align-items:center;gap:6px;padding:5px 12px;font-size:12px;font-weight:700;display:inline-flex}.status-pill.up{background:var(--status-up);color:#1a1c22}.status-pill.degraded{background:var(--status-degraded);color:#1a1c22}.status-pill.down{background:var(--status-down);color:#fff}.status-pill.maintenance{background:var(--status-maintenance);color:#1a1c22}[data-theme=light] .status-pill.up{color:#15803d;background:#dcfce7;border:1px solid #86efac}[data-theme=light] .status-pill.degraded{color:#a16207;background:#fef9c3;border:1px solid #fde047}[data-theme=light] .status-pill.down{color:#b91c1c;background:#fee2e2;border:1px solid #fca5a5}[data-theme=light] .status-pill.maintenance{color:#1d4ed8;background:#dbeafe;border:1px solid #93c5fd}.pulse-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px;display:inline-block;position:relative}.pulse-dot:before{content:"";transform-origin:50%;will-change:transform, opacity;border-radius:50%;animation:2.4s cubic-bezier(.16,1,.3,1) infinite pulseRing;position:absolute;inset:0}.pulse-dot:after{content:"";background:inherit;border-radius:50%;position:absolute;inset:0}.pulse-dot.up{background:var(--status-up);color:var(--status-up)}.pulse-dot.up:before{background:var(--status-up)}.pulse-dot.degraded{background:var(--status-degraded);color:var(--status-degraded)}.pulse-dot.degraded:before{background:var(--status-degraded);animation-duration:2.6s}.pulse-dot.down{background:var(--status-down);color:var(--status-down)}.pulse-dot.down:before{background:var(--status-down);animation-duration:1.6s}.pulse-dot.maintenance{background:var(--status-maintenance);color:var(--status-maintenance)}.pulse-dot.maintenance:before{background:var(--status-maintenance);animation-duration:3s}@keyframes pulseRing{0%{opacity:.6;transform:scale(1)}65%,to{opacity:0;transform:scale(2.8)}}@keyframes viewFadeIn{0%{opacity:0;transform:translateY(12px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}@keyframes pinFlash{0%{transform:scale(1)}40%{transform:scale(.96)}to{transform:scale(1)}}@keyframes pulseGlow{0%,to{box-shadow:0 0}50%{box-shadow:0 0 16px 3px}}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.45}}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn var(--motion-duration-medium2) var(--motion-easing-emphasized-decelerate)}.animate-view-fade-in{animation:viewFadeIn var(--motion-duration-medium3) var(--motion-easing-emphasized-decelerate) backwards}.animate-slide-up{animation:slideUp var(--motion-duration-medium3) var(--motion-easing-emphasized-decelerate)}.animate-scale-in{animation:scaleIn var(--motion-duration-medium2) var(--motion-easing-emphasized-decelerate)}.btn-pill,.btn-icon{transition:transform var(--motion-press) var(--motion-spring-squish), background-color var(--motion-press) var(--motion-easing-standard), border-color var(--motion-press) var(--motion-easing-standard), color var(--motion-press) var(--motion-easing-standard)}.btn-pill:active,.btn-icon:active{transform:scale(.95)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}
