:root {
 --bg: #F4F6F7;
 --surface: #FFFFFF;
 --surface-muted: #F9FAFB;
 --border: #E2E6EA;
 --border-strong: #D0D6DD;
 --text-1: #1A2330;
 --text-2: #6B7785;
 --text-3: #9AA3AD;
 --accent: #0E7584;
 --accent-soft: #E6F3F5;
 --accent-rgb: 14, 117, 132;
 --online: #2F9B57;
 --warning: #E9A820;
 --offline: #D64545;
 --unknown: #9AA3AD;
 --bg-base: var(--bg);
 --surface-1: var(--surface);
 --surface-2: var(--surface-muted);
 --surface-3: #EEF1F4;
 --accent-strong: #0C6875;
 --success: var(--online);
 --danger: var(--offline);
 --ring: 0 0 0 3px rgba(var(--accent-rgb), .14);
 --shadow-1: 0 1px 2px rgba(26, 35, 48, .04), 0 8px 24px -16px rgba(26, 35, 48, .18);
 --shadow-2: 0 12px 32px -18px rgba(26, 35, 48, .28);
 --mono: "JetBrains Mono", ui-monospace, monospace;
 --sans: "Geist Variable", "Geist", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
 --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px;
 --radius-card: 8px; --radius-control: 8px; --radius-badge: 999px;
 --topbar-h: 52px; --rail-w: 52px;
 --module-w: 248px; --detail-w: 340px;
 --z-modal: 50; --z-toast: 70;
 --zoom: 1;
 --ease: cubic-bezier(.16, 1, .3, 1);
}
html.dark {
 --bg: #0F1419;
 --surface: #161C24;
 --surface-muted: #1C2430;
 --border: #2A3444;
 --border-strong: #3A4658;
 --text-1: #E8EEF6;
 --text-2: #8B9BB0;
 --text-3: #61738A;
 --accent: #3DB8C5;
 --accent-soft: rgba(61, 184, 197, .14);
 --accent-rgb: 61, 184, 197;
 --accent-strong: #3DB8C5;
 --online: #3DDC84;
 --warning: #FFB020;
 --offline: #F44336;
 --bg-base: var(--bg);
 --surface-1: var(--surface);
 --surface-2: var(--surface-muted);
 --surface-3: #223047;
}
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
 font-family: var(--sans);
 font-size: 13px;
 line-height: 20px;
 color: var(--text-1);
 background: var(--bg);
 zoom: var(--zoom);
 -webkit-font-smoothing: antialiased;
}
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; }
.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.sr-only {
 position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
 overflow: hidden; clip: rect(0,0,0,0); border: 0;
}
.hidden, .is-hidden { display: none !important; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb {
 background: var(--surface-3); border-radius: 4px;
 border: 2px solid transparent; background-clip: padding-box;
}
::-webkit-scrollbar-track { background: transparent; }