:root{--color-bg: #0b1020;--color-bg-soft: #141b34;--color-surface: #11182b;--color-surface-2: #1a2440;--color-border: #2a375e;--color-primary: #4f8cff;--color-primary-strong: #7bb0ff;--color-success: #2ac769;--color-warning: #f5b400;--color-danger: #ef4444;--color-text: #edf2ff;--color-text-muted: #9cb0db;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--radius-sm: 10px;--radius-md: 14px;--radius-lg: 18px;--shadow-card: 0 12px 28px rgba(0, 0, 0, .25);--sidebar-width: 260px;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--color-text);background:linear-gradient(180deg,#09101d,#0d1325 40%,#121c33)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{min-height:100vh}button,input,select{font:inherit}.app-shell{display:grid;grid-template-columns:var(--sidebar-width) 1fr;min-height:100vh}.sidebar{padding:var(--space-6);background:#0c1324f2;border-right:1px solid var(--color-border)}.sidebar__logo{font-size:1.4rem;font-weight:700;margin-bottom:var(--space-6)}.sidebar__section{margin-bottom:var(--space-6)}.sidebar__label{color:var(--color-text-muted);font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--space-2)}.sidebar__menu{list-style:none;padding:0;margin:0;display:grid;gap:var(--space-2)}.sidebar__menu button{width:100%;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);border:1px solid transparent;background:transparent;color:var(--color-text);text-align:left;cursor:pointer}.sidebar__menu button.active,.sidebar__menu button:hover{background:var(--color-surface-2);border-color:var(--color-border)}.main{display:grid;grid-template-rows:auto 1fr}.topbar{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--color-border);background:#0d1325d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:sticky;top:0}.page{padding:var(--space-6)}.page-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--space-4)}.card{background:#11182be6;border:1px solid var(--color-border);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:var(--space-5)}.card.span-12{grid-column:span 12}.card.span-8{grid-column:span 8}.card.span-4{grid-column:span 4}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}.field{display:grid;gap:var(--space-2)}.field label{color:var(--color-text-muted);font-size:.92rem}.field input,.field select{width:100%;border-radius:var(--radius-md);border:1px solid var(--color-border);background:#0b1223;color:var(--color-text);padding:12px 14px}.button-row{display:flex;gap:var(--space-3);align-items:center}.btn{border:1px solid transparent;border-radius:var(--radius-md);padding:12px 16px;cursor:pointer}.btn-primary{background:var(--color-primary);color:#fff}.btn-secondary{background:transparent;border-color:var(--color-border);color:var(--color-text)}.badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;font-size:.85rem;border:1px solid var(--color-border);color:var(--color-text-muted)}.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{padding:12px;border-bottom:1px solid rgba(156,176,219,.15);text-align:left}.toolbar{display:flex;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-4)}.state-box{display:grid;place-items:center;gap:var(--space-3);min-height:240px;text-align:center}.auth-page{min-height:100vh;display:grid;place-items:center;padding:var(--space-6)}.auth-card{width:min(460px,100%)}.small{color:var(--color-text-muted);font-size:.9rem}@media (max-width: 960px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.form-grid,.page-grid{grid-template-columns:1fr}.card.span-12,.card.span-8,.card.span-4{grid-column:span 1}}.status-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:6px 10px;min-width:88px;font-size:.82rem;border:1px solid var(--color-border)}.status-pill--up{color:var(--color-success);border-color:#2ac76973;background:#2ac76914}.status-pill--down{color:var(--color-danger);border-color:#ef444473;background:#ef444414}.status-pill--degraded{color:var(--color-warning);border-color:#f5b40073;background:#f5b40014}.status-pill--unknown{color:var(--color-text-muted);border-color:var(--color-border);background:#9cb0db14}
