: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;
  --cool: #2f8bff;
  --heat: #ff8a3d;
  --fan: #22c55e;
  --dehum: #22d3ee;
  --auto: #19e6a0;
  --off: #ff5a6a;
  --on: #22c55e;
  --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);
}

body[data-shell="business"] {
  --bg: #050a14;
  --bg-strong: #050a14;
  --line: rgba(70, 140, 235, 0.2);
  --text: #eaf3ff;
  --text-bar: #cfe0ff;
  --text-soft: #b9c9e8;
  --muted: #7e98c6;
  --weak: #6c809f;
  --blue: #2f8bff;
  --cyan: #27e0ff;
  --green: #19e6a0;
  --accent: var(--ac);
  --accent-blue: var(--ac2);
  --surface-panel: rgba(20, 42, 80, 0.5);
  --surface-panel-strong: rgba(20, 42, 80, 0.5);
  --surface-panel-muted: rgba(20, 42, 80, 0.42);
  --surface-panel-deep: rgba(10, 20, 40, 0.5);
  --surface-panel-deeper: rgba(8, 16, 32, 0.55);
  --surface-nav: rgba(8, 16, 32, 0.24);
  --surface-action: #12203c;
  --surface-input: #0b1626;
  --surface-pill: rgba(20, 42, 80, 0.5);
  --main-background: #050a14;
  --brand-gradient: linear-gradient(135deg, var(--ac), var(--ac2));
  --sidebar-background:
    radial-gradient(180px 160px at 35px 24px, rgba(39, 224, 255, 0.08), transparent 70%),
    linear-gradient(180deg, #0b1326, #080e1c);
  --shadow: 0 0 18px rgba(20, 70, 150, 0.12), inset 0 1px 0 rgba(120, 180, 255, 0.12);
}

button,
input,
select {
  font: inherit;
}