:root{--bg-base: #0a0a0a;--bg-surface: #141414;--bg-elevated: #1c1c1c;--bg-hover: #242424;--bg-inset: rgba(0,0,0,.25);--overlay: rgba(0, 0, 0, .6);--text-primary: #e8e8e8;--text-secondary: #a0a0a0;--text-muted: #6a6a6a;--text-inverse: #0a0a0a;--border-base: #2a2a2a;--border-strong: #3a3a3a;--border-focus: #4ec9b0;--brand: #4ec9b0;--brand-dim: #3a9683;--brand-bg: rgba(78, 201, 176, .1);--brand-bg-strong: rgba(78, 201, 176, .13);--brand-bg-faint: rgba(78, 201, 176, .06);--brand-border: #2e5d54;--status-on: #4ec9b0;--state-ok: #4ade80;--state-warn: #facc15;--state-error: #ef4444;--state-info: #60a5fa;--state-ok-bg: rgba(74, 222, 128, .1);--state-warn-bg: rgba(250, 204, 21, .1);--state-error-bg: rgba(239, 68, 68, .1);--state-info-bg: rgba(96, 165, 250, .1);--state-ok-fill: #4ade801a;--state-ok-border: #4ade8055;--state-warn-fill: #facc151a;--state-warn-border: #facc1555;--state-error-fill: #ef44441a;--state-error-border: #ef444455;--state-info-fill: #60a5fa1a;--state-info-border: #60a5fa55;--state-error-border-strong: #ef444466;--loss: #f85149;--loss-border: rgba(248,81,73,.5);--tone-ok: #3fb950;--tone-ok-fill: #3fb9501a;--tone-ok-border: #3fb95055;--tone-fail: #f85149;--tone-fail-fill: #f851491a;--tone-fail-border: #f8514955;--tone-warn: #d29922;--tone-warn-fill: #d299221a;--tone-warn-border: #d2992255;--tone-run: #58a6ff;--tone-run-fill: #58a6ff1a;--tone-run-border: #58a6ff55;--tone-muted: #8b949e;--tone-muted-fill: #8b949e1a;--tone-muted-border: #8b949e55;--tone-starting: #39c5cf;--tone-starting-fill: #39c5cf1a;--tone-starting-border: #39c5cf55;--tone-clearing: #bc8cff;--tone-clearing-fill: #bc8cff1a;--tone-clearing-border: #bc8cff55;--tone-restarting: #e3b341;--tone-restarting-fill: #e3b3411a;--tone-restarting-border: #e3b34155;--tone-chaos: #f0883e;--tone-chaos-fill: #f0883e1a;--tone-chaos-border: #f0883e55;--font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;--topbar-height: 56px;--top-strip-height: 36px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 10px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px}:root[data-theme]{--brand-bg: color-mix(in srgb, var(--brand) 10%, transparent);--brand-bg-strong: color-mix(in srgb, var(--brand) 13%, transparent);--brand-bg-faint: color-mix(in srgb, var(--brand) 6%, transparent);--brand-border: color-mix(in srgb, var(--brand) 40%, transparent);--state-ok-bg: color-mix(in srgb, var(--state-ok) 10%, transparent);--state-warn-bg: color-mix(in srgb, var(--state-warn) 10%, transparent);--state-error-bg: color-mix(in srgb, var(--state-error) 10%, transparent);--state-info-bg: color-mix(in srgb, var(--state-info) 10%, transparent);--state-ok-fill: color-mix(in srgb, var(--state-ok) 10.2%, transparent);--state-ok-border: color-mix(in srgb, var(--state-ok) 33.3%, transparent);--state-warn-fill: color-mix(in srgb, var(--state-warn) 10.2%, transparent);--state-warn-border: color-mix(in srgb, var(--state-warn) 33.3%, transparent);--state-error-fill: color-mix(in srgb, var(--state-error) 10.2%, transparent);--state-error-border: color-mix(in srgb, var(--state-error) 33.3%, transparent);--state-info-fill: color-mix(in srgb, var(--state-info) 10.2%, transparent);--state-info-border: color-mix(in srgb, var(--state-info) 33.3%, transparent);--state-error-border-strong: color-mix(in srgb, var(--state-error) 40%, transparent);--loss-border: color-mix(in srgb, var(--loss) 50%, transparent);--tone-ok-fill: color-mix(in srgb, var(--tone-ok) 10.2%, transparent);--tone-ok-border: color-mix(in srgb, var(--tone-ok) 33.3%, transparent);--tone-fail-fill: color-mix(in srgb, var(--tone-fail) 10.2%, transparent);--tone-fail-border: color-mix(in srgb, var(--tone-fail) 33.3%, transparent);--tone-warn-fill: color-mix(in srgb, var(--tone-warn) 10.2%, transparent);--tone-warn-border: color-mix(in srgb, var(--tone-warn) 33.3%, transparent);--tone-run-fill: color-mix(in srgb, var(--tone-run) 10.2%, transparent);--tone-run-border: color-mix(in srgb, var(--tone-run) 33.3%, transparent);--tone-muted-fill: color-mix(in srgb, var(--tone-muted) 10.2%, transparent);--tone-muted-border: color-mix(in srgb, var(--tone-muted) 33.3%, transparent);--tone-starting-fill: color-mix(in srgb, var(--tone-starting) 10.2%, transparent);--tone-starting-border: color-mix(in srgb, var(--tone-starting) 33.3%, transparent);--tone-clearing-fill: color-mix(in srgb, var(--tone-clearing) 10.2%, transparent);--tone-clearing-border: color-mix(in srgb, var(--tone-clearing) 33.3%, transparent);--tone-restarting-fill: color-mix(in srgb, var(--tone-restarting) 10.2%, transparent);--tone-restarting-border: color-mix(in srgb, var(--tone-restarting) 33.3%, transparent);--tone-chaos-fill: color-mix(in srgb, var(--tone-chaos) 10.2%, transparent);--tone-chaos-border: color-mix(in srgb, var(--tone-chaos) 33.3%, transparent);--status-on: var(--tone-ok)}:root[data-theme=hydra-light]{color-scheme:light;--bg-base: #f4f4f4;--bg-surface: #ffffff;--bg-elevated: #ededed;--bg-hover: #e2e2e2;--bg-inset: rgba(0,0,0,.12);--overlay: rgba(0, 0, 0, .4);--text-primary: #1a1a1a;--text-secondary: #4d4d4d;--text-muted: #6a6a6a;--text-inverse: #ffffff;--border-base: #dcdcdc;--border-strong: #c4c4c4;--border-focus: #297a6a;--brand: #256f60;--brand-dim: #216356;--brand-border: #9fd3c6;--state-ok: #137337;--state-warn: #925907;--state-error: #c41f1f;--state-info: #1557e6;--loss: #cf222e;--tone-ok: #177232;--tone-fail: #c2202b;--tone-warn: #8b5d00;--tone-run: #0862cb;--tone-muted: #5e656e;--tone-starting: #0d6d87;--tone-clearing: #763fdc;--tone-restarting: #8b5d00;--tone-chaos: #ad4600}:root[data-theme=github-dark]{color-scheme:dark;--bg-base: #0d1117;--bg-surface: #161b22;--bg-elevated: #21262d;--bg-hover: #30363d;--bg-inset: rgba(1,4,9,.3);--overlay: rgba(1,4,9,.8);--text-primary: #e6edf3;--text-secondary: #b1bac4;--text-muted: #8b949e;--text-inverse: #0d1117;--border-base: #30363d;--border-strong: #484f58;--border-focus: #2f81f7;--brand: #4c93f8;--brand-dim: #388bfd;--brand-bg: rgba(56,139,253,.15);--brand-border: rgba(56,139,253,.4);--state-ok: #3fb950;--state-warn: #e3b341;--state-error: #f85149;--state-info: #2dd4bf;--state-ok-bg: rgba(46,160,67,.15);--state-warn-bg: rgba(187,128,9,.15);--state-error-bg: rgba(248, 81, 73, .1);--state-info-bg: color-mix(in srgb, var(--state-info) 15%, transparent);--loss: #f85149;--tone-ok: #3fb950;--tone-fail: #f85149;--tone-warn: #d29922;--tone-run: #2dd4bf;--tone-muted: #8b949e;--tone-starting: #22d3ee;--tone-clearing: #bc8cff;--tone-restarting: #e3b341;--tone-chaos: #f0883e}:root[data-theme=github-light]{color-scheme:light;--bg-base: #ffffff;--bg-surface: #f6f8fa;--bg-elevated: #eaeef2;--bg-hover: #d8dee4;--bg-inset: rgba(27,31,36,.15);--overlay: rgba(27,31,36,.5);--text-primary: #1f2328;--text-secondary: #57606a;--text-muted: #656d76;--text-inverse: #ffffff;--border-base: #d0d7de;--border-strong: #afb8c1;--border-focus: #0969da;--brand: #0860c6;--brand-dim: #0550ae;--brand-bg: #ddf4ff;--brand-border: rgba(84,174,255,.4);--state-ok: #187733;--state-warn: #8b5d00;--state-error: #c6212c;--state-info: #0e716a;--state-ok-bg: #dafbe1;--state-warn-bg: #fff8c5;--state-error-bg: #ffebe9;--loss: #cf222e;--tone-ok: #187733;--tone-fail: #c6212c;--tone-warn: #8b5d00;--tone-run: #0e716a;--tone-muted: #636a73;--tone-starting: #0e708b;--tone-clearing: #7c47dd;--tone-restarting: #8b5d00;--tone-chaos: #ad4600}:root[data-theme^=catppuccin-]{--brand-bg: color-mix(in srgb, var(--brand) 15%, transparent);--brand-bg-strong: color-mix(in srgb, var(--brand) 20%, transparent);--brand-bg-faint: color-mix(in srgb, var(--brand) 8%, transparent);--state-ok-bg: color-mix(in srgb, var(--state-ok) 15%, transparent);--state-warn-bg: color-mix(in srgb, var(--state-warn) 15%, transparent);--state-error-bg: color-mix(in srgb, var(--state-error) 15%, transparent);--state-info-bg: color-mix(in srgb, var(--state-info) 15%, transparent)}:root[data-theme=catppuccin-latte]{color-scheme:light;--bg-base: #e6e9ef;--bg-surface: #eff1f5;--bg-elevated: #e6e9ef;--bg-hover: #dce0e8;--bg-inset: rgba(76, 79, 105, .18);--overlay: rgba(76, 79, 105, .45);--text-primary: #4c4f69;--text-secondary: #5c5f77;--text-muted: #6c6f85;--text-inverse: #eff1f5;--border-base: #bcc0cc;--border-strong: #acb0be;--border-focus: #8534ef;--brand: #7418ed;--brand-dim: #6d2bc4;--state-ok: #2b6c1d;--state-warn: #845411;--state-error: #ba0e33;--state-info: #0951e0;--loss: #cd0f38;--state-ok-bg: rgba(64, 160, 43, .12);--state-warn-bg: rgba(223, 142, 29, .15);--state-error-bg: rgba(210, 15, 57, .1);--state-info-bg: rgba(30, 102, 245, .1);--brand-bg: color-mix(in srgb, var(--brand) 10%, transparent);--brand-bg-strong: color-mix(in srgb, var(--brand) 13%, transparent);--tone-ok: #2b6c1d;--tone-fail: #ba0e33;--tone-warn: #845411;--tone-run: #0951e0;--tone-muted: #5c5f77;--tone-starting: #11686c;--tone-clearing: #ac1b85;--tone-restarting: #845411;--tone-chaos: #a33c01}:root[data-theme=catppuccin-frappe]{color-scheme:dark;--bg-base: #232634;--bg-surface: #292c3c;--bg-elevated: #303446;--bg-hover: #414559;--bg-inset: rgba(35, 38, 52, .3);--overlay: rgba(35, 38, 52, .7);--text-primary: #c6d0f5;--text-secondary: #b5bfe2;--text-muted: #949cbb;--text-inverse: #303446;--border-base: #51576d;--border-strong: #626880;--border-focus: #ca9ee6;--brand: #d1aae9;--brand-dim: #c9a8e9;--state-ok: #a6d189;--state-warn: #e5c890;--state-error: #ea9395;--state-info: #8caaee;--loss: #e78284;--tone-ok: #a6d189;--tone-fail: #e88688;--tone-warn: #e5c890;--tone-run: #8caaee;--tone-muted: #9aa2bf;--tone-starting: #81c8be;--tone-clearing: #f4b8e4;--tone-restarting: #e5c890;--tone-chaos: #ef9f76}:root[data-theme=catppuccin-macchiato]{color-scheme:dark;--bg-base: #1e2030;--bg-surface: #24273a;--bg-elevated: #363a4f;--bg-hover: #494d64;--bg-inset: rgba(24, 25, 38, .3);--overlay: rgba(24, 25, 38, .7);--text-primary: #cad3f5;--text-secondary: #b8c0e0;--text-muted: #939ab7;--text-inverse: #24273a;--border-base: #494d64;--border-strong: #5b6078;--border-focus: #c6a0f6;--brand: #c6a0f6;--brand-dim: #a285cd;--state-ok: #a6da95;--state-warn: #eed49f;--state-error: #ed8796;--state-info: #8aadf4;--loss: #ed8796;--tone-ok: #a6da95;--tone-fail: #ed8796;--tone-warn: #eed49f;--tone-run: #8aadf4;--tone-muted: #969db9;--tone-starting: #8bd5ca;--tone-clearing: #f5bde6;--tone-restarting: #eed49f;--tone-chaos: #f5a97f}:root[data-theme=catppuccin-mocha]{color-scheme:dark;--bg-base: #181825;--bg-surface: #1e1e2e;--bg-elevated: #313244;--bg-hover: #45475a;--bg-inset: rgba(17, 17, 27, .3);--overlay: rgba(17, 17, 27, .7);--text-primary: #cdd6f4;--text-secondary: #bac2de;--text-muted: #9399b2;--text-inverse: #1e1e2e;--border-base: #45475a;--border-strong: #585b70;--border-focus: #cba6f7;--brand: #cba6f7;--brand-dim: #a588cb;--state-ok: #a6e3a1;--state-warn: #f9e2af;--state-error: #f38ba8;--state-info: #89b4fa;--loss: #f38ba8;--tone-ok: #a6e3a1;--tone-fail: #f38ba8;--tone-warn: #f9e2af;--tone-run: #89b4fa;--tone-muted: #9399b2;--tone-starting: #94e2d5;--tone-clearing: #f5c2e7;--tone-restarting: #f9e2af;--tone-chaos: #fab387}:root[data-theme=arista-dark]{color-scheme:dark;--bg-base: #0a111a;--bg-surface: #111a27;--bg-elevated: #18222f;--bg-hover: #212c3b;--bg-inset: rgba(0,0,0,.25);--overlay: rgba(0, 0, 0, .6);--text-primary: #e6ecf3;--text-secondary: #a3b1c2;--text-muted: #8593a5;--text-inverse: #0a111a;--border-base: #2a3646;--border-strong: #384557;--border-focus: #5487b8;--brand: #6d99c2;--brand-dim: #739cc4;--brand-border: #2f5478;--brand-bg: color-mix(in srgb, var(--brand) 15%, transparent);--state-ok: #4ade80;--state-warn: #facc15;--state-error: #f05252;--state-info: #2dd4bf;--loss: #f85149;--tone-ok: #3fb950;--tone-fail: #f85149;--tone-warn: #d29922;--tone-run: #2dd4bf;--tone-muted: #8b949e;--tone-starting: #22d3ee;--tone-clearing: #bc8cff;--tone-restarting: #e3b341;--tone-chaos: #f0883e}:root[data-theme=arista-light]{color-scheme:light;--bg-base: #ececec;--bg-surface: #ffffff;--bg-elevated: #f5f5f5;--bg-hover: #e6e6e6;--bg-inset: rgba(0,0,0,.12);--overlay: rgba(0, 0, 0, .4);--text-primary: #1c2733;--text-secondary: #555e64;--text-muted: #66707a;--text-inverse: #ffffff;--border-base: #cccccc;--border-strong: #999999;--border-focus: #5487b8;--brand: #16325b;--brand-dim: #184a7d;--brand-border: #5487b8;--brand-bg: rgba(22, 50, 91, .08);--brand-bg-strong: rgba(22, 50, 91, .12);--brand-bg-faint: rgba(22, 50, 91, .05);--state-ok: #136e35;--state-warn: #885306;--state-error: #bd0000;--state-info: #0e6d66;--loss: #cc0000;--tone-ok: #136e35;--tone-fail: #bd0000;--tone-warn: #9b4808;--tone-run: #0e6d66;--tone-muted: #58616b;--tone-starting: #0d6982;--tone-clearing: #732cec;--tone-restarting: #885306;--tone-chaos: #aa390b}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;background:var(--bg-base);color:var(--text-primary);font-family:var(--font-sans);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh}body{overflow-y:scroll}a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}button{font-family:inherit;font-size:inherit;background:var(--bg-elevated);color:var(--text-primary);border:1px solid var(--border-base);border-radius:var(--radius-md);padding:var(--space-2) var(--space-4);cursor:pointer;transition:background .1s,border-color .1s}button:hover:not(:disabled){background:var(--bg-hover);border-color:var(--border-strong)}button:disabled{opacity:.5;cursor:not-allowed}button.btn-primary{background:var(--brand);color:var(--text-inverse);border-color:var(--brand);font-weight:500}button.btn-primary:hover:not(:disabled){background:var(--brand-dim);border-color:var(--brand-dim)}button.btn-ghost{background:transparent;border-color:transparent}button.btn-ghost:hover:not(:disabled){background:var(--bg-hover)}button.btn-outline{background:transparent;border-color:var(--border-base)}button.btn-outline:hover:not(:disabled){background:var(--bg-hover);border-color:var(--border-focus)}button.btn-danger{background:transparent;color:var(--state-error);border-color:var(--state-error)}button.btn-danger:hover:not(:disabled){background:var(--state-error-bg)}input,select,textarea{font-family:inherit;font-size:inherit;background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-base);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);width:100%;outline:none;transition:border-color .1s}input:focus,select:focus,textarea:focus{border-color:var(--border-focus)}input::placeholder{color:var(--text-muted)}label{display:block;font-size:12px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-2)}.card{background:var(--bg-surface);border:1px solid var(--border-base);border-radius:var(--radius-lg);padding:var(--space-5)}.mono{font-family:var(--font-mono)}.muted{color:var(--text-muted)}.subtle{color:var(--text-secondary)}.error-text{color:var(--state-error)}.top-strip{height:var(--top-strip-height);background:var(--bg-base);border-bottom:1px solid var(--border-base);display:flex;align-items:center;justify-content:flex-end;padding:0 var(--space-5);font-family:var(--font-mono);font-size:12px;color:var(--text-secondary);gap:var(--space-5)}.top-strip-metric{display:inline-flex;align-items:center;gap:var(--space-2)}.top-strip-metric-label{color:var(--text-muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em}.top-strip-metric-value{color:var(--text-primary)}.topbar{min-height:var(--topbar-height);height:auto;background:var(--bg-surface);border-bottom:1px solid var(--border-base);display:flex;flex-wrap:wrap;align-items:center;padding:0 var(--space-5)}.topbar-brand{font-size:18px;font-weight:300;letter-spacing:.15em;color:var(--brand);margin-right:var(--space-6)}.nav-tabs{display:flex;gap:var(--space-1);flex:1}.nav-tab{background:transparent;border:none;color:var(--text-secondary);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);cursor:pointer;font-size:14px;white-space:nowrap;transition:background .1s,color .1s}.nav-tab:hover{background:var(--bg-hover);color:var(--text-primary)}.nav-tab.active{background:var(--brand-bg);color:var(--brand)}.user-widget{display:flex;align-items:center;gap:var(--space-3);margin-left:auto;flex-shrink:0;white-space:nowrap;font-size:13px;color:var(--text-secondary)}.user-widget-name{color:var(--text-primary);font-weight:500}.user-widget-role{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);background:var(--bg-elevated);padding:2px 6px;border-radius:var(--radius-sm)}select.theme-picker{width:auto;padding:2px var(--space-2);font-size:12px;background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border-base);border-radius:var(--radius-sm)}select.theme-picker:focus{border-color:var(--border-focus)}.page{padding:var(--space-6) var(--space-5);max-width:1400px;margin:0 auto}.page-header{margin-bottom:var(--space-6)}.page-title{font-size:24px;font-weight:400;margin:0;color:var(--text-primary)}.page-subtitle{color:var(--text-secondary);margin-top:var(--space-2)}.empty-state{text-align:center;padding:var(--space-7) var(--space-5);color:var(--text-muted)}.empty-state-title{font-size:16px;color:var(--text-secondary);margin-bottom:var(--space-2)}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-5)}.login-card{width:100%;max-width:380px;background:var(--bg-surface);border:1px solid var(--border-base);border-radius:var(--radius-lg);padding:var(--space-6)}.login-brand{text-align:center;margin-bottom:var(--space-6)}.login-brand-title{font-size:32px;font-weight:300;letter-spacing:.2em;color:var(--brand);margin:0}.login-brand-subtitle{color:var(--text-muted);font-size:12px;letter-spacing:.05em;margin-top:var(--space-2)}.login-field{margin-bottom:var(--space-4)}.login-error{background:var(--state-error-bg);color:var(--state-error);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);margin-bottom:var(--space-4);font-size:13px}.login-info{background:var(--state-info-bg);color:var(--state-info);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);margin-bottom:var(--space-4);font-size:13px}.login-bootstrap-hint{margin-top:var(--space-5);padding-top:var(--space-5);border-top:1px solid var(--border-base);font-size:12px;color:var(--text-muted);text-align:center}@keyframes pulse{0%,to{opacity:1}50%{opacity:.45}}