:root{--bg-primary:#090d16;--bg-secondary:#0f1626;--bg-glass:#0f1626b3;--border-color:#33415580;--border-glow:#8b5cf633;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--purple-fill:#a78bfa;--purple-glow:#a78bfa66;--status-healthy:#10b981;--status-healthy-bg:#10b9811a;--status-healthy-border:#10b9814d;--status-degraded:#f59e0b;--status-degraded-bg:#f59e0b1a;--status-degraded-border:#f59e0b4d;--status-critical:#ef4444;--status-critical-bg:#ef44441a;--status-critical-border:#ef44444d;--status-down:#dc2626;--status-down-bg:#dc262626;--status-down-border:#dc262666;--status-locked:#475569;--status-locked-bg:#4755691a;--status-locked-border:#47556933;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"Fira Code", "JetBrains Mono", monospace;--transition-fast:.15s ease;--transition-normal:.25s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--text-primary);font-family:var(--font-sans);min-height:100vh;overflow-x:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}#app{min-height:100vh;display:flex}.sidebar{background-color:var(--bg-secondary);border-right:1px solid var(--border-color);z-index:10;flex-direction:column;width:260px;padding:24px 16px;display:flex;position:fixed;top:0;bottom:0;left:0}.main-content{flex:1;min-height:100vh;margin-left:260px;padding:40px;position:relative}.logo{font-family:var(--font-mono);color:var(--text-primary);align-items:center;gap:8px;margin-bottom:36px;padding-left:8px;font-size:1.15rem;font-weight:600;display:flex}.logo span{color:var(--purple-fill)}.page-title{margin-bottom:8px;font-size:2rem;font-weight:700}.page-subtitle{color:var(--text-secondary);margin-bottom:32px;font-size:.95rem}.nav-menu{flex-direction:column;gap:6px;list-style:none;display:flex}.nav-item a{color:var(--text-secondary);transition:var(--transition-fast);border-radius:8px;align-items:center;gap:12px;padding:12px 16px;font-size:.95rem;font-weight:500;text-decoration:none;display:flex}.nav-item a:hover{color:var(--text-primary);background-color:#ffffff08}.nav-item.active a{color:var(--text-primary);background-color:#a78bfa1a;border:1px solid #a78bfa33;box-shadow:0 0 12px #a78bfa0d}.nav-footer{border-top:1px solid var(--border-color);margin-top:auto;padding-top:24px}.btn{cursor:pointer;transition:var(--transition-fast);font-size:.9rem;font-weight:500;font-family:var(--font-sans);border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:10px 18px;text-decoration:none;display:inline-flex}.btn-primary{background-color:var(--purple-fill);color:var(--bg-primary);font-weight:600}.btn-primary:hover:not(:disabled){opacity:.9;box-shadow:0 0 15px var(--purple-glow)}.btn-secondary{color:var(--text-primary);border-color:var(--border-color);background-color:#ffffff0d}.btn-secondary:hover:not(:disabled){background-color:#ffffff14}.btn-danger{background-color:var(--status-critical-bg);color:var(--status-critical);border-color:var(--status-critical-border)}.btn-danger:hover:not(:disabled){background-color:#ef444433}.btn:disabled{opacity:.4;cursor:not-allowed}.dashboard-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;margin-bottom:40px;display:grid}.stats-grid{grid-template-columns:repeat(4,1fr);gap:24px;margin-bottom:32px;display:grid}@media (width<=1200px){.stats-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){.stats-grid{grid-template-columns:1fr}}.card{background-color:var(--bg-secondary);border:1px solid var(--border-color);transition:var(--transition-normal);border-radius:12px;padding:24px;position:relative;box-shadow:0 4px 20px #0003}.card-interactive:hover{border-color:#a78bfa66;transform:translateY(-2px);box-shadow:0 8px 30px #a78bfa14}.card-title{text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);margin-bottom:12px;font-size:.85rem;font-weight:600}.card-value{font-size:1.8rem;font-weight:700;font-family:var(--font-mono)}.badge{font-size:.75rem;font-weight:600;font-family:var(--font-mono);border:1px solid #0000;border-radius:6px;align-items:center;padding:4px 8px;display:inline-flex}.badge-HEALTHY{background-color:var(--status-healthy-bg);color:var(--status-healthy);border-color:var(--status-healthy-border)}.badge-DEGRADED{background-color:var(--status-degraded-bg);color:var(--status-degraded);border-color:var(--status-degraded-border)}.badge-CRITICAL{background-color:var(--status-critical-bg);color:var(--status-critical);border-color:var(--status-critical-border)}.badge-DOWN{background-color:var(--status-down-bg);color:var(--status-down);border-color:var(--status-down-border)}.badge-LOCKED{background-color:var(--status-locked-bg);color:var(--status-locked);border-color:var(--status-locked-border)}.health-bar-container{border:1px solid var(--border-color);background-color:#ffffff0d;border-radius:4px;width:100%;height:8px;margin-top:8px;overflow:hidden}.health-bar-fill{height:100%;transition:width .5s cubic-bezier(.4,0,.2,1)}.fill-HEALTHY{background-color:var(--status-healthy);box-shadow:0 0 8px #10b98180}.fill-DEGRADED{background-color:var(--status-degraded);box-shadow:0 0 8px #f59e0b80}.fill-CRITICAL{background-color:var(--status-critical);box-shadow:0 0 8px #ef444480}.fill-DOWN{background-color:var(--status-down);box-shadow:0 0 8px #dc262680}.fill-LOCKED{background-color:var(--status-locked)}.table-container{border:1px solid var(--border-color);border-radius:8px;margin-bottom:24px;overflow-x:auto}table{border-collapse:collapse;text-align:left;width:100%;font-size:.9rem}th,td{border-bottom:1px solid var(--border-color);padding:16px}th{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;background-color:#ffffff05;font-size:.75rem;font-weight:600}tr:last-child td{border-bottom:none}.form-group{margin-bottom:20px}.form-label{color:var(--text-secondary);margin-bottom:8px;font-size:.85rem;font-weight:600;display:block}.form-control{border:1px solid var(--border-color);width:100%;color:var(--text-primary);font-family:var(--font-sans);transition:var(--transition-fast);background-color:#0003;border-radius:8px;padding:12px;font-size:.95rem}.form-control:focus{border-color:var(--purple-fill);box-shadow:0 0 8px var(--border-glow);outline:none}textarea.form-control{resize:vertical;min-height:120px}.form-help{color:var(--text-muted);margin-top:6px;font-size:.8rem}.form-checkbox-label{cursor:pointer;align-items:center;gap:8px;font-size:.9rem;display:inline-flex}.alert{border:1px solid #0000;border-radius:8px;margin-bottom:24px;padding:16px;font-size:.95rem;line-height:1.5}.alert-danger{background-color:var(--status-critical-bg);border-color:var(--status-critical-border);color:var(--status-critical)}.alert-warning{background-color:var(--status-degraded-bg);border-color:var(--status-degraded-border);color:var(--status-degraded)}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background-color:#000c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;width:100%;max-width:600px;padding:32px;box-shadow:0 10px 40px #00000080}.sparkline-svg{width:100%;height:40px;stroke:var(--purple-fill);stroke-width:2px;fill:none;stroke-linecap:round;stroke-linejoin:round}.timeline{flex-direction:column;gap:32px;padding-left:20px;display:flex;position:relative}.timeline:before{content:"";background-color:var(--border-color);width:2px;position:absolute;top:0;bottom:0;left:4px}.timeline-step{position:relative}.timeline-step:before{content:"";background-color:var(--bg-primary);border:2px solid var(--border-color);border-radius:50%;width:10px;height:10px;position:absolute;top:6px;left:-20px}.timeline-step.active:before{background-color:var(--purple-fill);border-color:var(--purple-fill);box-shadow:0 0 10px var(--purple-glow)}.timeline-step.passed:before{background-color:var(--status-healthy);border-color:var(--status-healthy)}.timeline-step-content{padding-left:12px}.spinner{border:3px solid #ffffff1a;border-top-color:var(--purple-fill);border-radius:50%;width:40px;height:40px;margin:40px auto;animation:1s ease-in-out infinite spin}@keyframes spin{to{transform:rotate(360deg)}}