:root{--bg-primary:#0a0e17;--bg-secondary:#111827;--bg-card:#1a1f2e;--text-primary:#e5e7eb;--text-secondary:#9ca3af;--accent:#3b82f6;--accent-hover:#2563eb;--success:#22c55e;--warning:#eab308;--danger:#ef4444;--border:#1f2937;--sidebar-width:220px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}.app-layout{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background:var(--bg-secondary);border-right:1px solid var(--border);flex-direction:column;padding:1.5rem 0;display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-brand{border-bottom:1px solid var(--border);align-items:center;gap:.5rem;padding:0 1.5rem 1.5rem;display:flex}.brand-icon{font-size:1.5rem}.brand-text{letter-spacing:.05em;font-size:1.25rem;font-weight:700}.sidebar-nav{flex-direction:column;padding:1rem 0;display:flex}.sidebar-nav a{color:var(--text-secondary);padding:.625rem 1.5rem;font-size:.875rem;text-decoration:none;transition:all .15s;display:block}.sidebar-nav a:hover{color:var(--text-primary);background:#ffffff0d}.sidebar-nav a.active{color:var(--accent);border-right:2px solid var(--accent);background:#3b82f61a}.main-content{margin-left:var(--sidebar-width);flex:1;padding:2rem}.page-title{margin-bottom:1.5rem;font-size:1.5rem;font-weight:600}.status-badge{text-transform:uppercase;border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;font-weight:600;display:inline-block}.status-badge.up{color:var(--success);background:#22c55e26}.status-badge.down{color:var(--danger);background:#ef444426}.status-badge.degraded{color:var(--warning);background:#eab30826}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:.5rem;padding:1.25rem}.service-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem;display:grid}table{border-collapse:collapse;width:100%}th,td{text-align:left;border-bottom:1px solid var(--border);padding:.75rem 1rem}th{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}td{font-size:.875rem}button{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:.375rem;padding:.5rem 1rem;font-size:.875rem;transition:background .15s}button:hover{background:var(--accent-hover)}button.danger{background:var(--danger)}button.danger:hover{background:#dc2626}.login-container{justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.login-form{background:var(--bg-card);border:1px solid var(--border);border-radius:.75rem;flex-direction:column;gap:1.25rem;width:100%;max-width:360px;padding:2.5rem;display:flex}.login-brand{text-align:center;flex-direction:column;align-items:center;gap:.5rem;margin-bottom:.5rem;display:flex}.login-form label{color:var(--text-secondary);flex-direction:column;gap:.375rem;font-size:.875rem;display:flex}.login-form input{background:var(--bg-primary);border:1px solid var(--border);color:var(--text-primary);border-radius:.375rem;outline:none;padding:.625rem .75rem;font-size:.875rem}.login-form input:focus{border-color:var(--accent)}.login-error{color:var(--danger);text-align:center;background:#ef44441a;border-radius:.375rem;padding:.5rem .75rem;font-size:.8rem}.sidebar-footer{border-top:1px solid var(--border);margin-top:auto;padding:1rem 1.5rem}.logout-btn{border:1px solid var(--border);width:100%;color:var(--text-secondary);background:0 0;padding:.375rem .75rem;font-size:.8rem}.logout-btn:hover{color:var(--danger);border-color:var(--danger);background:#ef44441a}.mobile-toggle{z-index:1001;background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);border-radius:.375rem;width:2.5rem;height:2.5rem;padding:0;font-size:1.25rem;line-height:1;display:none;position:fixed;top:.75rem;left:.75rem}@media (width<=768px){.mobile-toggle{display:block}.sidebar{z-index:1000;transition:transform .2s;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-overlay{z-index:999;background:#00000080;display:none;position:fixed;inset:0}.sidebar-overlay.open{display:block}.main-content{margin-left:0;padding:3.5rem 1rem 1rem}.page-title{font-size:1.25rem}.service-grid{grid-template-columns:1fr}.card{padding:1rem}table{-webkit-overflow-scrolling:touch;display:block;overflow-x:auto}th,td{white-space:nowrap;padding:.5rem .625rem;font-size:.8rem}}
