:root {
  color-scheme: dark;
  --bg: #050b16;
  --nav: #07101d;
  --bg-strong: #040914;
  --panel: rgba(10, 24, 44, 0.88);
  --panel-2: rgba(12, 30, 55, 0.94);
  --panel-strong: var(--panel-2);
  --soft: rgba(13, 33, 62, 0.72);
  --line: rgba(78, 132, 202, 0.24);
  --line-strong: rgba(70, 142, 255, 0.46);
  --text: #eef6ff;
  --muted: #8ea4c0;
  --weak: #5e738f;
  --blue: #2e86ff;
  --cyan: #28d5f5;
  --teal: #16d7a0;
  --green: #31d77c;
  --amber: #ffbd45;
  --red: #ff586c;
  --purple: #8b6cff;
  --txt: #eaf3ff;
  --mut: #7e98c6;
  --ac: #16a34a;
  --ac2: #2563eb;
  --bad: #ff5a6a;
  --warn: #ffb13d;
  /* 语义色板(深色变体):模式/状态统一 token(--ac-*),内页经 --cool/--heat/... 复用;
     浅色 operations 页在 .ops-sample 覆盖为浅底值。制冷蓝·制热橙·除湿青·送风绿·自动紫·运行绿·关机灰·离线红 */
  --ac-cool: #2f8bff;
  --ac-heat: #ff8a3d;
  --ac-dry: #22d3ee;
  --ac-fan: #22c55e;
  --ac-auto: #a78bfa;
  --ac-run: #22c55e;
  --ac-off: #6b7a95;
  --ac-offline: #ff6b7d;
  --cool: var(--ac-cool);
  --heat: var(--ac-heat);
  --fan: var(--ac-fan);
  --dehum: var(--ac-dry);
  --auto: #19e6a0;
  --off: #ff5a6a;
  --on: var(--ac-run);
  --accent: var(--teal);
  --accent-blue: var(--blue);
  --danger: var(--red);
  --warning: var(--amber);
  --ink-inverse: #06101e;
  --brand-cyan: #69e6ff;
  --text-soft: #b9cbe0;
  --text-heading: #d3e2f4;
  --text-bar: #cde0f6;
  --text-button: #cfe2ff;
  --badge-amber-text: #ffd98a;
  --badge-red-text: #ff9aaa;
  --badge-green-text: #69eac5;
  --badge-blue-text: #9bc5ff;
  --surface-panel: rgba(13, 29, 52, 0.72);
  --surface-panel-strong: rgba(13, 29, 52, 0.76);
  --surface-panel-muted: rgba(13, 29, 52, 0.58);
  --surface-panel-deep: rgba(4, 11, 22, 0.34);
  --surface-panel-deeper: rgba(4, 11, 22, 0.44);
  --surface-input: rgba(4, 11, 22, 0.82);
  --surface-pill: rgba(13, 29, 52, 0.76);
  --surface-action: rgba(16, 37, 66, 0.68);
  --surface-nav: rgba(13, 29, 52, 0.52);
  --surface-track: rgba(144, 168, 196, 0.2);
  --surface-ring-core: rgba(13, 29, 52, 0.96);
  --surface-ring-core-strong: rgba(13, 29, 52, 0.98);
  --surface-chart: rgba(4, 11, 22, 0.28);
  --border-muted: rgba(144, 168, 196, 0.22);
  --border-muted-soft: rgba(144, 168, 196, 0.2);
  --border-muted-faint: rgba(144, 168, 196, 0.18);
  --border-muted-dashed: rgba(144, 168, 196, 0.44);
  --border-muted-dashed-strong: rgba(144, 168, 196, 0.48);
  --border-danger-subtle: rgba(255, 107, 125, 0.36);
  --border-blue-strong: rgba(47, 134, 255, 0.5);
  --border-accent-strong: rgba(39, 211, 162, 0.7);
  --wash-blue: rgba(47, 134, 255, 0.11);
  --wash-teal: rgba(39, 211, 162, 0.13);
  --wash-amber: rgba(255, 206, 106, 0.14);
  --wash-red: rgba(255, 107, 125, 0.14);
  --wash-purple: rgba(139, 108, 255, 0.14);
  --glow-blue: rgba(47, 134, 255, 0.45);
  --overlay-blue: rgba(47, 134, 255, 0.16);
  --overlay-blue-strong: rgba(47, 134, 255, 0.18);
  --overlay-blue-faint: rgba(47, 134, 255, 0.08);
  --overlay-accent: rgba(39, 211, 162, 0.14);
  --overlay-teal: rgba(39, 211, 162, 0.16);
  --overlay-amber: rgba(255, 206, 106, 0.16);
  --overlay-red: rgba(255, 107, 125, 0.16);
  --login-screen-background:
    linear-gradient(90deg, rgba(4, 9, 20, 0.94), rgba(8, 24, 45, 0.82)),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.026) 0 1px, transparent 1px 72px);
  --sidebar-background: linear-gradient(180deg, var(--bg-strong), #07162a);
  --main-background: linear-gradient(180deg, #081528, #0a1322);
  --brand-gradient: linear-gradient(135deg, var(--accent), var(--brand-cyan));
  --primary-gradient: linear-gradient(90deg, var(--accent), var(--accent-blue));
  --login-panel-background: linear-gradient(180deg, rgba(13, 29, 52, 0.98), rgba(6, 16, 31, 0.98));
  --title-bar-gradient: linear-gradient(180deg, var(--accent-blue), var(--accent));
  --bar-gradient: linear-gradient(180deg, var(--accent-blue), var(--accent));
  --quota-gradient: linear-gradient(90deg, var(--accent-blue), var(--accent));
  --combo-chart-background:
    linear-gradient(180deg, transparent, rgba(47, 134, 255, 0.08)),
    rgba(4, 11, 22, 0.28);
  --radius: 8px;
  --shadow: 0 18px 60px rgba(0, 0, 0, 0.34);
  --font: "Microsoft YaHei", "PingFang SC", "Segoe UI", Arial, sans-serif;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  overflow-x: hidden;
  color: var(--text);
  background: var(--bg);
  font-family: var(--font);
  font-size: 13px;
  line-height: 1.5;
}

body[data-shell="business"] {
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI Variable", "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei", Arial, sans-serif;
  --bg: #16233c;
  --bg-strong: #16233c;
  --line: #33486e;
  --text: #edf3fc;
  --text-bar: #d7e3f6;
  --text-soft: #c0cfe8;
  --muted: #9aaece;
  --weak: #7c8fb0;
  --blue: #3d8bff;
  --cyan: #27e0ff;
  --green: #19e6a0;
  --accent: var(--ac);
  --accent-blue: var(--ac2);
  --surface-panel: #21335a;
  --surface-panel-strong: #21335a;
  --surface-panel-muted: #1e2e51;
  --surface-panel-deep: #1b2b4b;
  --surface-panel-deeper: #192743;
  --surface-nav: rgba(27, 43, 75, 0.4);
  --surface-action: #263a63;
  --surface-input: #1b2b4b;
  --surface-pill: #263a63;
  --main-background: #16233c;
  --brand-gradient: linear-gradient(135deg, var(--ac), var(--ac2));
  --sidebar-background: linear-gradient(180deg, #1a2a49, #16233c);
  --shadow: 0 10px 24px rgba(5, 12, 26, 0.35);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Shared light foundation. Routes opt in through app.js LIGHT_ROUTES. */
body[data-shell="business"][data-skin="light"] {
  color-scheme: light;
  --bg: #f7f9fb;
  --bg-strong: #f2f5f9;
  --main-background: #f7f9fb;
  --panel: #ffffff;
  --panel-2: #f7f9fc;
  --panel-strong: #ffffff;
  --soft: #f5f8fb;
  --nav: #ffffff;
  --surface-panel: #ffffff;
  --surface-panel-strong: #ffffff;
  --surface-panel-muted: #f8fafc;
  --surface-panel-deep: #f5f8fb;
  --surface-panel-deeper: #f2f6fa;
  --surface-nav: rgba(255, 255, 255, 0.8);
  --surface-action: #f2f6fa;
  --surface-input: #ffffff;
  --surface-pill: #f2f6fa;
  --surface-track: #e8eef6;
  --surface-ring-core: #ffffff;
  --surface-ring-core-strong: #ffffff;
  --surface-chart: #ffffff;
  --line: rgba(15, 31, 56, 0.12);
  --line-strong: rgba(30, 99, 233, 0.45);
  --border-muted: rgba(15, 31, 56, 0.1);
  --border-muted-soft: rgba(15, 31, 56, 0.08);
  --border-muted-faint: rgba(15, 31, 56, 0.06);
  --border-muted-dashed: rgba(15, 31, 56, 0.18);
  --border-muted-dashed-strong: rgba(15, 31, 56, 0.22);
  --border-blue-strong: rgba(30, 99, 233, 0.45);
  --border-accent-strong: rgba(30, 99, 233, 0.55);
  --text: #0f1f38;
  --txt: #0f1f38;
  --text-heading: #0f1f38;
  --text-bar: #26364f;
  --text-soft: #3d4a63;
  --text-button: #26364f;
  --ink-inverse: #ffffff;
  --muted: #5a6880;
  --mut: #5a6880;
  --weak: #8a97ac;
  --blue: #1e63e9;
  --cyan: #0e93b8;
  --green: #16a34a;
  --teal: #16a34a;
  --amber: #d97706;
  --red: #d03b3b;
  --bad: #d03b3b;
  --warn: #d97706;
  --cool: #2f7fe6;
  --dehum: #0e93b8;
  --heat: #e8620f;
  --fan: #16a34a;
  --accent: #1e63e9;
  --accent-blue: #1e63e9;
  --ac: #1e63e9;
  --ac2: #2a78d6;
  --badge-amber-text: #a86603;
  --badge-red-text: #c0392f;
  --badge-green-text: #0b7a4b;
  --badge-blue-text: #24518f;
  --wash-blue: rgba(30, 99, 233, 0.07);
  --wash-teal: rgba(12, 163, 12, 0.08);
  --wash-amber: rgba(217, 126, 6, 0.09);
  --wash-red: rgba(208, 59, 59, 0.08);
  --wash-purple: rgba(109, 75, 216, 0.08);
  --border-danger-subtle: rgba(208, 59, 59, 0.3);
  --glow-blue: rgba(30, 99, 233, 0.25);
  --overlay-blue: rgba(30, 99, 233, 0.1);
  --overlay-blue-strong: rgba(30, 99, 233, 0.14);
  --overlay-blue-faint: rgba(30, 99, 233, 0.05);
  --overlay-accent: rgba(30, 99, 233, 0.08);
  --overlay-teal: rgba(12, 163, 12, 0.1);
  --overlay-amber: rgba(217, 126, 6, 0.1);
  --overlay-red: rgba(208, 59, 59, 0.1);
  --modal-backdrop: rgba(15, 31, 56, 0.42);
  --shadow-modal: 0 24px 64px rgba(15, 31, 56, 0.18);
  --shadow-popover: 0 18px 42px rgba(15, 31, 56, 0.16);
  --theme-green-ac: #15803d;
  --theme-green-ac2: #2563eb;
  --theme-cyan-ac: #0e7490;
  --theme-cyan-ac2: #2563eb;
  --theme-purple-ac: #6d4bd8;
  --theme-purple-ac2: #0e7490;
  --brand-gradient: linear-gradient(135deg, #1e63e9, #2a8cf0);
  --primary-gradient: linear-gradient(90deg, #1e63e9, #2a8cf0);
  --title-bar-gradient: linear-gradient(180deg, #1e63e9, #2a8cf0);
  --bar-gradient: linear-gradient(180deg, #5598e7, #2a78d6);
  --quota-gradient: linear-gradient(90deg, #1e63e9, #2a8cf0);
  --shadow: 0 1px 2px rgba(15, 31, 56, 0.05), 0 8px 24px rgba(15, 31, 56, 0.05);
  background: var(--bg);
  color: var(--text);
}

/* Login renders before a shell exists, so it owns an isolated light token set. */
#loginScreen {
  color-scheme: light;
  --bg: #f4f7fb;
  --bg-strong: #eef3f9;
  --panel: #ffffff;
  --panel-2: #f7faff;
  --soft: #edf4ff;
  --line: rgba(15, 31, 56, 0.14);
  --line-strong: rgba(30, 99, 233, 0.5);
  --text: #0f1f38;
  --txt: #0f1f38;
  --text-heading: #0f1f38;
  --text-soft: #3d4a63;
  --muted: #5a6880;
  --weak: #8a97ac;
  --accent: #1e63e9;
  --accent-blue: #2a8cf0;
  --blue: #1e63e9;
  --red: #c73535;
  --danger: #c73535;
  --ink-inverse: #ffffff;
  --surface-input: #ffffff;
  --surface-pill: rgba(255, 255, 255, 0.78);
  --brand-gradient: linear-gradient(145deg, #1e63e9, #2a8cf0);
  --primary-gradient: linear-gradient(90deg, #1e63e9, #2a8cf0);
  --login-screen-background:
    radial-gradient(circle at 14% 18%, rgba(42, 140, 240, 0.13), transparent 30%),
    linear-gradient(rgba(30, 99, 233, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(30, 99, 233, 0.045) 1px, transparent 1px),
    linear-gradient(135deg, #f8fbff, #eef5ff 56%, #f7faff);
  --login-panel-background: rgba(255, 255, 255, 0.96);
  --shadow: 0 24px 70px rgba(34, 76, 128, 0.15);
  --shadow-brand: 0 12px 28px rgba(30, 99, 233, 0.24);
  --shadow-pill: 0 8px 24px rgba(30, 99, 233, 0.06);
  --shadow-input-inset: inset 0 1px 2px rgba(15, 31, 56, 0.03);
  --focus-ring: 0 0 0 3px rgba(30, 99, 233, 0.12);
  --shadow-action: 0 12px 24px rgba(30, 99, 233, 0.2);
}

button,
input,
select {
  font: inherit;
}