/* ==========================================================================
   主题引擎 themes.css（前端住户端）
   --------------------------------------------------------------------------
   1) :root               —— 默认主题（原始风格：原系统青绿 #49969a/#f2f6f7）
   2) [data-theme="..."]  —— 用户提供 40 套浅色主题（全变量推导，适配电脑+手机）
   3) 主题切换按钮 / 选择面板 UI
   ========================================================================== */

/* --------------------------------------------------------------------------
   1) 默认主题（原系统风格）—— 全局语义变量
   -------------------------------------------------------------------------- */
:root {
  --bg: #f2f6f7;
  --text: #333333;
  --text-muted: #666666;
  --card-bg: #ffffff;
  --card-border: #e0eaea;
  --card-shadow: 0 2px 10px rgba(0,0,0,0.04);
  --card-shadow-hover: 0 8px 24px rgba(0,0,0,0.10);
  --unit-bg: #f9fbfb;
  --unit-border: #dde7e7;
  --primary: #49969a;
  --primary-hover: #3b8488;
  --primary-shadow: 0 4px 12px -4px rgba(73,150,154,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(73,150,154,.45);
  --danger: #e53935;
  --danger-hover: #c62828;
  --danger-shadow: 0 4px 12px -4px rgba(229,57,53,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(229,57,53,.45);
  --state-on-bg: #e6f4f4;
  --state-on-color: #49969a;
  --state-on-border: #bcdede;
  --state-off-bg: #f1f5f5;
  --state-off-color: #666666;
  --state-off-border: #dde7e7;
  --badge-role-bg: #e6f4f4;
  --badge-role-color: #3b8488;
  --badge-role-border: #bcdede;
  --badge-on-bg: #e8f5e9;
  --badge-on-color: #2e7d32;
  --badge-on-border: #c8e6c9;
  --badge-off-bg: #ffebee;
  --badge-off-color: #e53935;
  --badge-off-border: #ffcdd2;
  --badge-pending-bg: #fff8e1;
  --badge-pending-color: #b45309;
  --badge-pending-border: #fde68a;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: rgba(255,255,255,0.15);
  --nav-hover-color: #ffffff;
  --nav-danger: #e53935;
  --nav-danger-hover-bg: #ffebee;
  --nav-danger-hover-color: #c62828;
  --pulse-on-color: rgba(73,150,154,.5);
  --pulse-off-color: rgba(229,57,53,.5);
  --sidebar-bg: #49969a;
  --sidebar-2: #3b8488;
  --sidebar-hover: rgba(255,255,255,0.15);
  --sidebar-active: rgba(255,255,255,0.15);
  --sidebar-text: #ffffff;
  --sidebar-sub: #d6e8e8;
  --sidebar-acc: #3b8488;
  --sidebar-border: rgba(255,255,255,0.15);
  --header-bg: #ffffff;
  --header-text: #444444;
  --header-border: #e0eaea;
  --login-bg: #e8f0f0;
  --login-title: #2d6c6f;
  --input-bg: #f9fbfb;
  --input-border: #dde7e7;
  --input-focus: #509da1;
  --btn-accent: #66CCFF;
  --log-bar-bg: #f9fbfb;
  --log-bar-text: #777777;
  --log-bar-border: #e0eaea;
  --notice-border: #f5a623;
  --primary-rgb: 73, 150, 154;
  --primary-soft: #e6f4f4;
  --on-primary: #ffffff;
  --success: #2e7d32;
  --success-hover: #286e2c;
  --success-soft: #e8f5e9;
  --on-success: #ffffff;
  --warning: #b45309;
  --warning-hover: #9e4908;
  --warning-soft: #fff8e1;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #3b8488;
  --info-hover: #347478;
  --info-soft: #e6f4f4;
  --on-info: #ffffff;
  --secondary: #666666;
  --secondary-hover: #5a5a5a;
  --secondary-soft: #f1f5f5;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #acaeae;
  --heading: var(--text);
  --border: var(--unit-border);
  --table-head-bg: var(--unit-bg);
  --table-border: #e8eeef;
  --table-stripe: #fbfcfc;
  --link: #49969a;
  --link-hover: #3b8488;
  --navbar-bg: #5ba0a4;
  --navbar-text: #42878b;
  --navbar-border: #89bbbd;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 2px 10px rgba(0,0,0,0.04);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.10);
  --gradient: linear-gradient(135deg, #49969a 0%, #3b8488 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* --------------------------------------------------------------------------
   2) 41 套主题（原始风格 + 用户 40 套）
   -------------------------------------------------------------------------- */

/* ★. 原始风格 */
[data-theme="original"] {
  --bg: #f2f6f7;
  --text: #333333;
  --text-muted: #666666;
  --card-bg: #ffffff;
  --card-border: #e0eaea;
  --card-shadow: 0 2px 10px rgba(0,0,0,0.04);
  --card-shadow-hover: 0 8px 24px rgba(0,0,0,0.10);
  --unit-bg: #f9fbfb;
  --unit-border: #dde7e7;
  --primary: #49969a;
  --primary-hover: #3b8488;
  --primary-shadow: 0 4px 12px -4px rgba(73,150,154,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(73,150,154,.45);
  --danger: #e53935;
  --danger-hover: #c62828;
  --danger-shadow: 0 4px 12px -4px rgba(229,57,53,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(229,57,53,.45);
  --state-on-bg: #e6f4f4;
  --state-on-color: #49969a;
  --state-on-border: #bcdede;
  --state-off-bg: #f1f5f5;
  --state-off-color: #666666;
  --state-off-border: #dde7e7;
  --badge-role-bg: #e6f4f4;
  --badge-role-color: #3b8488;
  --badge-role-border: #bcdede;
  --badge-on-bg: #e8f5e9;
  --badge-on-color: #2e7d32;
  --badge-on-border: #c8e6c9;
  --badge-off-bg: #ffebee;
  --badge-off-color: #e53935;
  --badge-off-border: #ffcdd2;
  --badge-pending-bg: #fff8e1;
  --badge-pending-color: #b45309;
  --badge-pending-border: #fde68a;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: rgba(255,255,255,0.15);
  --nav-hover-color: #ffffff;
  --nav-danger: #e53935;
  --nav-danger-hover-bg: #ffebee;
  --nav-danger-hover-color: #c62828;
  --pulse-on-color: rgba(73,150,154,.5);
  --pulse-off-color: rgba(229,57,53,.5);
  --sidebar-bg: #49969a;
  --sidebar-2: #3b8488;
  --sidebar-hover: rgba(255,255,255,0.15);
  --sidebar-active: rgba(255,255,255,0.15);
  --sidebar-text: #ffffff;
  --sidebar-sub: #d6e8e8;
  --sidebar-acc: #3b8488;
  --sidebar-border: rgba(255,255,255,0.15);
  --header-bg: #ffffff;
  --header-text: #444444;
  --header-border: #e0eaea;
  --login-bg: #e8f0f0;
  --login-title: #2d6c6f;
  --input-bg: #f9fbfb;
  --input-border: #dde7e7;
  --input-focus: #509da1;
  --btn-accent: #66CCFF;
  --log-bar-bg: #f9fbfb;
  --log-bar-text: #777777;
  --log-bar-border: #e0eaea;
  --notice-border: #f5a623;
  --primary-rgb: 73, 150, 154;
  --primary-soft: #e6f4f4;
  --on-primary: #ffffff;
  --success: #2e7d32;
  --success-hover: #286e2c;
  --success-soft: #e8f5e9;
  --on-success: #ffffff;
  --warning: #b45309;
  --warning-hover: #9e4908;
  --warning-soft: #fff8e1;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #3b8488;
  --info-hover: #347478;
  --info-soft: #e6f4f4;
  --on-info: #ffffff;
  --secondary: #666666;
  --secondary-hover: #5a5a5a;
  --secondary-soft: #f1f5f5;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #acaeae;
  --heading: var(--text);
  --border: var(--unit-border);
  --table-head-bg: var(--unit-bg);
  --table-border: #e8eeef;
  --table-stripe: #fbfcfc;
  --link: #49969a;
  --link-hover: #3b8488;
  --navbar-bg: #5ba0a4;
  --navbar-text: #42878b;
  --navbar-border: #89bbbd;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 2px 10px rgba(0,0,0,0.04);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.10);
  --gradient: linear-gradient(135deg, #49969a 0%, #3b8488 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 1. 天空蓝白（默认） */
[data-theme="sky"] {
  --bg: #f0f6fc;
  --text: #1a2b3c;
  --text-muted: #64748b;
  --card-bg: #ffffff;
  --card-border: #d8e8f5;
  --card-shadow: 0 1px 3px rgba(26,43,60,.04), 0 8px 24px -12px rgba(26,43,60,.08);
  --card-shadow-hover: 0 2px 6px rgba(26,43,60,.05), 0 12px 28px -12px rgba(26,43,60,.1);
  --unit-bg: #f7fbfe;
  --unit-border: #e0eefa;
  --primary: #0284c7;
  --primary-hover: #0369a1;
  --primary-shadow: 0 4px 12px -4px rgba(2,132,199,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(2,132,199,.45);
  --danger: #ea580c;
  --danger-hover: #c2410c;
  --danger-shadow: 0 4px 12px -4px rgba(234,88,12,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(234,88,12,.45);
  --state-on-bg: #f0f9ff;
  --state-on-color: #0284c7;
  --state-on-border: #bae6fd;
  --state-off-bg: #f1f5f9;
  --state-off-color: #64748b;
  --state-off-border: #e2e8f0;
  --badge-role-bg: #f0f9ff;
  --badge-role-color: #0284c7;
  --badge-role-border: #bae6fd;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff7ed;
  --badge-off-color: #ea580c;
  --badge-off-border: #fed7aa;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f1f5f9;
  --nav-hover-color: #0284c7;
  --nav-danger: #dc2626;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #b91c1c;
  --pulse-on-color: rgba(2,132,199,.5);
  --pulse-off-color: rgba(234,88,12,.5);
  --primary-rgb: 2, 132, 199;
  --primary-soft: #f0f9ff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #0284c7;
  --info-hover: #0274af;
  --info-soft: #f0f9ff;
  --on-info: #ffffff;
  --secondary: #64748b;
  --secondary-hover: #58667a;
  --secondary-soft: #f1f5f9;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #aab5c4;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(2, 132, 199, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #e8f2fb;
  --table-stripe: #fafcfe;
  --link: #0284c7;
  --link-hover: #0369a1;
  --sidebar-bg: #0a4066;
  --sidebar-2: #225375;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #315f7e;
  --sidebar-active: #2896cf;
  --sidebar-acc: #225375;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #1b90cd;
  --navbar-text: #0277b3;
  --navbar-border: #5bafdb;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(26,43,60,.04), 0 8px 24px -12px rgba(26,43,60,.08);
  --shadow-lg: 0 2px 6px rgba(26,43,60,.05), 0 12px 28px -12px rgba(26,43,60,.1);
  --gradient: linear-gradient(135deg, #0284c7 0%, #0369a1 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 2. 暖阳米白 */
[data-theme="warm"] {
  --bg: #faf8f5;
  --text: #3d3a35;
  --text-muted: #78716c;
  --card-bg: #ffffff;
  --card-border: #ede8e0;
  --card-shadow: 0 1px 3px rgba(61,58,53,.04), 0 8px 24px -12px rgba(61,58,53,.08);
  --card-shadow-hover: 0 2px 6px rgba(61,58,53,.05), 0 12px 28px -12px rgba(61,58,53,.1);
  --unit-bg: #fdfbf8;
  --unit-border: #f0e9df;
  --primary: #ea580c;
  --primary-hover: #c2410c;
  --primary-shadow: 0 4px 12px -4px rgba(234,88,12,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(234,88,12,.45);
  --danger: #b91c1c;
  --danger-hover: #991b1b;
  --danger-shadow: 0 4px 12px -4px rgba(185,28,28,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(185,28,28,.45);
  --state-on-bg: #fff7ed;
  --state-on-color: #c2410c;
  --state-on-border: #fed7aa;
  --state-off-bg: #f5f2ed;
  --state-off-color: #78716c;
  --state-off-border: #e7e1d8;
  --badge-role-bg: #fff7ed;
  --badge-role-color: #c2410c;
  --badge-role-border: #fed7aa;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #b91c1c;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #faf8f5;
  --nav-hover-color: #ea580c;
  --nav-danger: #b91c1c;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #991b1b;
  --pulse-on-color: rgba(234,88,12,.5);
  --pulse-off-color: rgba(185,28,28,.5);
  --primary-rgb: 234, 88, 12;
  --primary-soft: #fff7ed;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #c2410c;
  --info-hover: #ab390b;
  --info-soft: #fff7ed;
  --on-info: #ffffff;
  --secondary: #78716c;
  --secondary-hover: #6a635f;
  --secondary-soft: #f5f2ed;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b9b4b0;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(234, 88, 12, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f5f0ea;
  --table-stripe: #fefcfa;
  --link: #ea580c;
  --link-hover: #c2410c;
  --sidebar-bg: #62301f;
  --sidebar-2: #724535;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #7b5143;
  --sidebar-active: #ed7130;
  --sidebar-acc: #724535;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #ec6924;
  --navbar-text: #d34f0b;
  --navbar-border: #f19261;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(61,58,53,.04), 0 8px 24px -12px rgba(61,58,53,.08);
  --shadow-lg: 0 2px 6px rgba(61,58,53,.05), 0 12px 28px -12px rgba(61,58,53,.1);
  --gradient: linear-gradient(135deg, #ea580c 0%, #c2410c 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 3. 薄荷青绿 */
[data-theme="mint"] {
  --bg: #f0f7f5;
  --text: #1e3a34;
  --text-muted: #5f7a72;
  --card-bg: #ffffff;
  --card-border: #d8ebe5;
  --card-shadow: 0 1px 3px rgba(30,58,52,.04), 0 8px 24px -12px rgba(30,58,52,.08);
  --card-shadow-hover: 0 2px 6px rgba(30,58,52,.05), 0 12px 28px -12px rgba(30,58,52,.1);
  --unit-bg: #f7fbfa;
  --unit-border: #e0f0eb;
  --primary: #0d9488;
  --primary-hover: #0f766e;
  --primary-shadow: 0 4px 12px -4px rgba(13,148,136,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(13,148,136,.45);
  --danger: #e11d48;
  --danger-hover: #be123c;
  --danger-shadow: 0 4px 12px -4px rgba(225,29,72,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(225,29,72,.45);
  --state-on-bg: #f0fdfa;
  --state-on-color: #0d9488;
  --state-on-border: #99f6e4;
  --state-off-bg: #f1f5f4;
  --state-off-color: #64748b;
  --state-off-border: #e2e8e6;
  --badge-role-bg: #f0fdfa;
  --badge-role-color: #0d9488;
  --badge-role-border: #99f6e4;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #e11d48;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f0f7f5;
  --nav-hover-color: #0d9488;
  --nav-danger: #e11d48;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #be123c;
  --pulse-on-color: rgba(13,148,136,.5);
  --pulse-off-color: rgba(225,29,72,.5);
  --primary-rgb: 13, 148, 136;
  --primary-soft: #f0fdfa;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #0d9488;
  --info-hover: #0b8278;
  --info-soft: #f0fdfa;
  --on-info: #ffffff;
  --secondary: #5f7a72;
  --secondary-hover: #546b64;
  --secondary-soft: #f1f5f4;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #a8b8b4;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(13, 148, 136, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #e8f4f0;
  --table-stripe: #fafcfc;
  --link: #0d9488;
  --link-hover: #0f766e;
  --sidebar-bg: #0e464e;
  --sidebar-2: #265860;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #35646a;
  --sidebar-active: #31a49a;
  --sidebar-acc: #265860;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #259f94;
  --navbar-text: #0c857a;
  --navbar-border: #62b9b2;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(30,58,52,.04), 0 8px 24px -12px rgba(30,58,52,.08);
  --shadow-lg: 0 2px 6px rgba(30,58,52,.05), 0 12px 28px -12px rgba(30,58,52,.1);
  --gradient: linear-gradient(135deg, #0d9488 0%, #0f766e 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 4. 紫罗兰 */
[data-theme="violet"] {
  --bg: #f4f4fb;
  --text: #2e2a3d;
  --text-muted: #6b6780;
  --card-bg: #ffffff;
  --card-border: #e4e2f0;
  --card-shadow: 0 1px 3px rgba(46,42,61,.04), 0 8px 24px -12px rgba(46,42,61,.08);
  --card-shadow-hover: 0 2px 6px rgba(46,42,61,.05), 0 12px 28px -12px rgba(46,42,61,.1);
  --unit-bg: #fafaff;
  --unit-border: #ebe9f5;
  --primary: #7c3aed;
  --primary-hover: #6d28d9;
  --primary-shadow: 0 4px 12px -4px rgba(124,58,237,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(124,58,237,.45);
  --danger: #db2777;
  --danger-hover: #be185d;
  --danger-shadow: 0 4px 12px -4px rgba(219,39,119,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(219,39,119,.45);
  --state-on-bg: #f5f3ff;
  --state-on-color: #7c3aed;
  --state-on-border: #ddd6fe;
  --state-off-bg: #f4f4f8;
  --state-off-color: #64748b;
  --state-off-border: #e4e4ec;
  --badge-role-bg: #f5f3ff;
  --badge-role-color: #7c3aed;
  --badge-role-border: #ddd6fe;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fdf2f8;
  --badge-off-color: #db2777;
  --badge-off-border: #fbcfe8;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f4f4fb;
  --nav-hover-color: #7c3aed;
  --nav-danger: #db2777;
  --nav-danger-hover-bg: #fdf2f8;
  --nav-danger-hover-color: #be185d;
  --pulse-on-color: rgba(124,58,237,.5);
  --pulse-off-color: rgba(219,39,119,.5);
  --primary-rgb: 124, 58, 237;
  --primary-soft: #f5f3ff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #7c3aed;
  --info-hover: #6d33d1;
  --info-soft: #f5f3ff;
  --on-info: #ffffff;
  --secondary: #6b6780;
  --secondary-hover: #5e5b71;
  --secondary-soft: #f4f4f8;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b0aebe;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(124, 58, 237, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f0eef8;
  --table-stripe: #fcfcff;
  --link: #7c3aed;
  --link-hover: #6d28d9;
  --sidebar-bg: #382474;
  --sidebar-2: #4c3a82;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #58478a;
  --sidebar-active: #9058f0;
  --sidebar-acc: #4c3a82;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #894eef;
  --navbar-text: #7034d5;
  --navbar-border: #aa7ff3;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(46,42,61,.04), 0 8px 24px -12px rgba(46,42,61,.08);
  --shadow-lg: 0 2px 6px rgba(46,42,61,.05), 0 12px 28px -12px rgba(46,42,61,.1);
  --gradient: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 5. 商务灰蓝 */
[data-theme="corporate"] {
  --bg: #f5f6f8;
  --text: #1f2937;
  --text-muted: #6b7280;
  --card-bg: #ffffff;
  --card-border: #e3e6ea;
  --card-shadow: 0 1px 2px rgba(31,41,55,.04), 0 4px 12px -6px rgba(31,41,55,.06);
  --card-shadow-hover: 0 2px 4px rgba(31,41,55,.05), 0 8px 20px -8px rgba(31,41,55,.08);
  --unit-bg: #fafbfc;
  --unit-border: #eaedf0;
  --primary: #1e40af;
  --primary-hover: #1e3a8a;
  --primary-shadow: 0 2px 8px -2px rgba(30,64,175,.3);
  --primary-shadow-hover: 0 4px 14px -4px rgba(30,64,175,.4);
  --danger: #b91c1c;
  --danger-hover: #991b1b;
  --danger-shadow: 0 2px 8px -2px rgba(185,28,28,.3);
  --danger-shadow-hover: 0 4px 14px -4px rgba(185,28,28,.4);
  --state-on-bg: #eff6ff;
  --state-on-color: #1e40af;
  --state-on-border: #bfdbfe;
  --state-off-bg: #f3f4f6;
  --state-off-color: #6b7280;
  --state-off-border: #e5e7eb;
  --badge-role-bg: #eff6ff;
  --badge-role-color: #1e40af;
  --badge-role-border: #bfdbfe;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #b91c1c;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f3f4f6;
  --nav-hover-color: #1e40af;
  --nav-danger: #b91c1c;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #991b1b;
  --pulse-on-color: rgba(30,64,175,.5);
  --pulse-off-color: rgba(185,28,28,.5);
  --primary-rgb: 30, 64, 175;
  --primary-soft: #eff6ff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #1e40af;
  --info-hover: #1a389a;
  --info-soft: #eff6ff;
  --on-info: #ffffff;
  --secondary: #6b7280;
  --secondary-hover: #5e6471;
  --secondary-soft: #f3f4f6;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b0b4bc;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(30, 64, 175, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f0f2f4;
  --table-stripe: #fcfcfd;
  --link: #1e40af;
  --link-hover: #1e3a8a;
  --sidebar-bg: #15275d;
  --sidebar-2: #2c3d6d;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #3a4a77;
  --sidebar-active: #405dbb;
  --sidebar-acc: #2c3d6d;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #3453b7;
  --navbar-text: #1b3a9e;
  --navbar-border: #6d83cb;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 2px rgba(31,41,55,.04), 0 4px 12px -6px rgba(31,41,55,.06);
  --shadow-lg: 0 2px 4px rgba(31,41,55,.05), 0 8px 20px -8px rgba(31,41,55,.08);
  --gradient: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 6. 樱花粉 */
[data-theme="sakura"] {
  --bg: #fdf5f8;
  --text: #4a2c3a;
  --text-muted: #9d7086;
  --card-bg: #ffffff;
  --card-border: #f5dde8;
  --card-shadow: 0 1px 3px rgba(74,44,58,.04), 0 8px 24px -12px rgba(74,44,58,.08);
  --card-shadow-hover: 0 2px 6px rgba(74,44,58,.05), 0 12px 28px -12px rgba(74,44,58,.1);
  --unit-bg: #fefafc;
  --unit-border: #f9e6ef;
  --primary: #ec4899;
  --primary-hover: #db2777;
  --primary-shadow: 0 4px 12px -4px rgba(236,72,153,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(236,72,153,.45);
  --danger: #dc2626;
  --danger-hover: #b91c1c;
  --danger-shadow: 0 4px 12px -4px rgba(220,38,38,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(220,38,38,.45);
  --state-on-bg: #fdf2f8;
  --state-on-color: #ec4899;
  --state-on-border: #fbcfe8;
  --state-off-bg: #f8f4f6;
  --state-off-color: #9d7086;
  --state-off-border: #eedde5;
  --badge-role-bg: #fdf2f8;
  --badge-role-color: #ec4899;
  --badge-role-border: #fbcfe8;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #dc2626;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #fdf5f8;
  --nav-hover-color: #ec4899;
  --nav-danger: #dc2626;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #b91c1c;
  --pulse-on-color: rgba(236,72,153,.5);
  --pulse-off-color: rgba(220,38,38,.5);
  --primary-rgb: 236, 72, 153;
  --primary-soft: #fdf2f8;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #ec4899;
  --info-hover: #d03f87;
  --info-soft: #fdf2f8;
  --on-info: #ffffff;
  --secondary: #9d7086;
  --secondary-hover: #8a6376;
  --secondary-soft: #f8f4f6;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #cdb2bf;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(236, 72, 153, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #fbeef4;
  --table-stripe: #fefcfd;
  --link: #ec4899;
  --link-hover: #db2777;
  --sidebar-bg: #632a54;
  --sidebar-2: #733f65;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #7c4c6f;
  --sidebar-active: #ef63a8;
  --sidebar-acc: #733f65;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #ee5aa3;
  --navbar-text: #d4418a;
  --navbar-border: #f388bd;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(74,44,58,.04), 0 8px 24px -12px rgba(74,44,58,.08);
  --shadow-lg: 0 2px 6px rgba(74,44,58,.05), 0 12px 28px -12px rgba(74,44,58,.1);
  --gradient: linear-gradient(135deg, #ec4899 0%, #db2777 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 7. 青柠绿 */
[data-theme="lime"] {
  --bg: #f5faef;
  --text: #2d3a1e;
  --text-muted: #6b7d52;
  --card-bg: #ffffff;
  --card-border: #e3efd3;
  --card-shadow: 0 1px 3px rgba(45,58,30,.04), 0 8px 24px -12px rgba(45,58,30,.08);
  --card-shadow-hover: 0 2px 6px rgba(45,58,30,.05), 0 12px 28px -12px rgba(45,58,30,.1);
  --unit-bg: #fbfdf7;
  --unit-border: #eef5e0;
  --primary: #65a30d;
  --primary-hover: #4d7c0f;
  --primary-shadow: 0 4px 12px -4px rgba(101,163,13,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(101,163,13,.45);
  --danger: #ea580c;
  --danger-hover: #c2410c;
  --danger-shadow: 0 4px 12px -4px rgba(234,88,12,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(234,88,12,.45);
  --state-on-bg: #f7fee7;
  --state-on-color: #65a30d;
  --state-on-border: #d9f99d;
  --state-off-bg: #f4f6f0;
  --state-off-color: #6b7d52;
  --state-off-border: #e6ecdb;
  --badge-role-bg: #f7fee7;
  --badge-role-color: #65a30d;
  --badge-role-border: #d9f99d;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff7ed;
  --badge-off-color: #ea580c;
  --badge-off-border: #fed7aa;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f5faef;
  --nav-hover-color: #65a30d;
  --nav-danger: #ea580c;
  --nav-danger-hover-bg: #fff7ed;
  --nav-danger-hover-color: #c2410c;
  --pulse-on-color: rgba(101,163,13,.5);
  --pulse-off-color: rgba(234,88,12,.5);
  --primary-rgb: 101, 163, 13;
  --primary-soft: #f7fee7;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #65a30d;
  --info-hover: #598f0b;
  --info-soft: #f7fee7;
  --on-info: #ffffff;
  --secondary: #6b7d52;
  --secondary-hover: #5e6e48;
  --secondary-soft: #f4f6f0;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b0bca0;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(101, 163, 13, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f2f8e8;
  --table-stripe: #fcfefa;
  --link: #65a30d;
  --link-hover: #4d7c0f;
  --sidebar-bg: #304c1f;
  --sidebar-2: #455e35;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #516943;
  --sidebar-active: #7cb131;
  --sidebar-acc: #455e35;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #74ac25;
  --navbar-text: #5b930c;
  --navbar-border: #9bc362;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(45,58,30,.04), 0 8px 24px -12px rgba(45,58,30,.08);
  --shadow-lg: 0 2px 6px rgba(45,58,30,.05), 0 12px 28px -12px rgba(45,58,30,.1);
  --gradient: linear-gradient(135deg, #65a30d 0%, #4d7c0f 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 8. 海盐蓝绿 */
[data-theme="ocean"] {
  --bg: #eef6f9;
  --text: #1c3a47;
  --text-muted: #5a7a88;
  --card-bg: #ffffff;
  --card-border: #d5e7ee;
  --card-shadow: 0 1px 3px rgba(28,58,71,.04), 0 8px 24px -12px rgba(28,58,71,.08);
  --card-shadow-hover: 0 2px 6px rgba(28,58,71,.05), 0 12px 28px -12px rgba(28,58,71,.1);
  --unit-bg: #f6fbfc;
  --unit-border: #e0eef3;
  --primary: #0891b2;
  --primary-hover: #0e7490;
  --primary-shadow: 0 4px 12px -4px rgba(8,145,178,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(8,145,178,.45);
  --danger: #e11d48;
  --danger-hover: #be123c;
  --danger-shadow: 0 4px 12px -4px rgba(225,29,72,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(225,29,72,.45);
  --state-on-bg: #ecfeff;
  --state-on-color: #0891b2;
  --state-on-border: #a5f3fc;
  --state-off-bg: #f1f6f8;
  --state-off-color: #5a7a88;
  --state-off-border: #dfe9ee;
  --badge-role-bg: #ecfeff;
  --badge-role-color: #0891b2;
  --badge-role-border: #a5f3fc;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #e11d48;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #eef6f9;
  --nav-hover-color: #0891b2;
  --nav-danger: #e11d48;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #be123c;
  --pulse-on-color: rgba(8,145,178,.5);
  --pulse-off-color: rgba(225,29,72,.5);
  --primary-rgb: 8, 145, 178;
  --primary-soft: #ecfeff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #0891b2;
  --info-hover: #07809d;
  --info-soft: #ecfeff;
  --on-info: #ffffff;
  --secondary: #5a7a88;
  --secondary-hover: #4f6b78;
  --secondary-soft: #f1f6f8;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #a4b8c0;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(8, 145, 178, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #e7f2f6;
  --table-stripe: #f9fcfd;
  --link: #0891b2;
  --link-hover: #0e7490;
  --sidebar-bg: #0c455e;
  --sidebar-2: #24586e;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #336378;
  --sidebar-active: #2da2be;
  --sidebar-acc: #24586e;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #219cba;
  --navbar-text: #0782a0;
  --navbar-border: #5eb8cd;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(28,58,71,.04), 0 8px 24px -12px rgba(28,58,71,.08);
  --shadow-lg: 0 2px 6px rgba(28,58,71,.05), 0 12px 28px -12px rgba(28,58,71,.1);
  --gradient: linear-gradient(135deg, #0891b2 0%, #0e7490 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 9. 抹茶奶绿 */
[data-theme="matcha"] {
  --bg: #f2f7f0;
  --text: #2a3626;
  --text-muted: #6f7d68;
  --card-bg: #ffffff;
  --card-border: #dfe9db;
  --card-shadow: 0 1px 3px rgba(42,54,38,.04), 0 8px 24px -12px rgba(42,54,38,.08);
  --card-shadow-hover: 0 2px 6px rgba(42,54,38,.05), 0 12px 28px -12px rgba(42,54,38,.1);
  --unit-bg: #f9fcf8;
  --unit-border: #e9f1e5;
  --primary: #16a34a;
  --primary-hover: #15803d;
  --primary-shadow: 0 4px 12px -4px rgba(22,163,74,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(22,163,74,.45);
  --danger: #d97706;
  --danger-hover: #b45309;
  --danger-shadow: 0 4px 12px -4px rgba(217,119,6,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(217,119,6,.45);
  --state-on-bg: #f0fdf4;
  --state-on-color: #16a34a;
  --state-on-border: #bbf7d0;
  --state-off-bg: #f3f6f1;
  --state-off-color: #6f7d68;
  --state-off-border: #e2e9de;
  --badge-role-bg: #f0fdf4;
  --badge-role-color: #16a34a;
  --badge-role-border: #bbf7d0;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fffbeb;
  --badge-off-color: #d97706;
  --badge-off-border: #fde68a;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f2f7f0;
  --nav-hover-color: #16a34a;
  --nav-danger: #d97706;
  --nav-danger-hover-bg: #fffbeb;
  --nav-danger-hover-color: #b45309;
  --pulse-on-color: rgba(22,163,74,.5);
  --pulse-off-color: rgba(217,119,6,.5);
  --primary-rgb: 22, 163, 74;
  --primary-soft: #f0fdf4;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #16a34a;
  --info-hover: #138f41;
  --info-soft: #f0fdf4;
  --on-info: #ffffff;
  --secondary: #6f7d68;
  --secondary-hover: #626e5c;
  --secondary-soft: #f3f6f1;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b0baac;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(22, 163, 74, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #eef4ea;
  --table-stripe: #fbfdfa;
  --link: #16a34a;
  --link-hover: #15803d;
  --sidebar-bg: #124c36;
  --sidebar-2: #2a5e4a;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #386956;
  --sidebar-active: #39b165;
  --sidebar-acc: #2a5e4a;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #2dac5c;
  --navbar-text: #149343;
  --navbar-border: #68c389;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(42,54,38,.04), 0 8px 24px -12px rgba(42,54,38,.08);
  --shadow-lg: 0 2px 6px rgba(42,54,38,.05), 0 12px 28px -12px rgba(42,54,38,.1);
  --gradient: linear-gradient(135deg, #16a34a 0%, #15803d 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 10. 藕荷淡紫 */
[data-theme="lilac"] {
  --bg: #f7f3fa;
  --text: #3a2e47;
  --text-muted: #7d6b8c;
  --card-bg: #ffffff;
  --card-border: #e8ddf0;
  --card-shadow: 0 1px 3px rgba(58,46,71,.04), 0 8px 24px -12px rgba(58,46,71,.08);
  --card-shadow-hover: 0 2px 6px rgba(58,46,71,.05), 0 12px 28px -12px rgba(58,46,71,.1);
  --unit-bg: #fbf8fd;
  --unit-border: #f0e7f5;
  --primary: #a855f7;
  --primary-hover: #9333ea;
  --primary-shadow: 0 4px 12px -4px rgba(168,85,247,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(168,85,247,.45);
  --danger: #e11d48;
  --danger-hover: #be123c;
  --danger-shadow: 0 4px 12px -4px rgba(225,29,72,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(225,29,72,.45);
  --state-on-bg: #faf5ff;
  --state-on-color: #a855f7;
  --state-on-border: #e9d5ff;
  --state-off-bg: #f5f2f7;
  --state-off-color: #7d6b8c;
  --state-off-border: #e9e0ef;
  --badge-role-bg: #faf5ff;
  --badge-role-color: #a855f7;
  --badge-role-border: #e9d5ff;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #e11d48;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f7f3fa;
  --nav-hover-color: #a855f7;
  --nav-danger: #e11d48;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #be123c;
  --pulse-on-color: rgba(168,85,247,.5);
  --pulse-off-color: rgba(225,29,72,.5);
  --primary-rgb: 168, 85, 247;
  --primary-soft: #faf5ff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #a855f7;
  --info-hover: #944bd9;
  --info-soft: #faf5ff;
  --on-info: #ffffff;
  --secondary: #7d6b8c;
  --secondary-hover: #6e5e7b;
  --secondary-soft: #f5f2f7;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #baafc3;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(168, 85, 247, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f4edf8;
  --table-stripe: #fcfafe;
  --link: #a855f7;
  --link-hover: #9333ea;
  --sidebar-bg: #492f78;
  --sidebar-2: #5b4486;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #66508e;
  --sidebar-active: #b56ef8;
  --sidebar-acc: #5b4486;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #b166f8;
  --navbar-text: #974cde;
  --navbar-border: #c690fa;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(58,46,71,.04), 0 8px 24px -12px rgba(58,46,71,.08);
  --shadow-lg: 0 2px 6px rgba(58,46,71,.05), 0 12px 28px -12px rgba(58,46,71,.1);
  --gradient: linear-gradient(135deg, #a855f7 0%, #9333ea 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 11. 蜜桃橘 */
[data-theme="peach"] {
  --bg: #fef6f0;
  --text: #4a3128;
  --text-muted: #a17b6a;
  --card-bg: #ffffff;
  --card-border: #f8e0d0;
  --card-shadow: 0 1px 3px rgba(74,49,40,.04), 0 8px 24px -12px rgba(74,49,40,.08);
  --card-shadow-hover: 0 2px 6px rgba(74,49,40,.05), 0 12px 28px -12px rgba(74,49,40,.1);
  --unit-bg: #fffaf6;
  --unit-border: #faeadd;
  --primary: #f97316;
  --primary-hover: #ea580c;
  --primary-shadow: 0 4px 12px -4px rgba(249,115,22,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(249,115,22,.45);
  --danger: #dc2626;
  --danger-hover: #b91c1c;
  --danger-shadow: 0 4px 12px -4px rgba(220,38,38,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(220,38,38,.45);
  --state-on-bg: #fff7ed;
  --state-on-color: #f97316;
  --state-on-border: #fed7aa;
  --state-off-bg: #faf5f1;
  --state-off-color: #a17b6a;
  --state-off-border: #f0e2d8;
  --badge-role-bg: #fff7ed;
  --badge-role-color: #ea580c;
  --badge-role-border: #fed7aa;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #dc2626;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #fef6f0;
  --nav-hover-color: #f97316;
  --nav-danger: #dc2626;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #b91c1c;
  --pulse-on-color: rgba(249,115,22,.5);
  --pulse-off-color: rgba(220,38,38,.5);
  --primary-rgb: 249, 115, 22;
  --primary-soft: #fff7ed;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #ea580c;
  --info-hover: #ce4d0b;
  --info-soft: #fff7ed;
  --on-info: #ffffff;
  --secondary: #a17b6a;
  --secondary-hover: #8e6c5d;
  --secondary-soft: #faf5f1;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #d0b8ad;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(249, 115, 22, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #fcf0e6;
  --table-stripe: #fffcf9;
  --link: #f97316;
  --link-hover: #ea580c;
  --sidebar-bg: #683a22;
  --sidebar-2: #774e38;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #805a45;
  --sidebar-active: #fa8839;
  --sidebar-acc: #774e38;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #fa812d;
  --navbar-text: #e06814;
  --navbar-border: #fba468;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(74,49,40,.04), 0 8px 24px -12px rgba(74,49,40,.08);
  --shadow-lg: 0 2px 6px rgba(74,49,40,.05), 0 12px 28px -12px rgba(74,49,40,.1);
  --gradient: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 12. 雾霾蓝 */
[data-theme="haze"] {
  --bg: #f0f3f7;
  --text: #2c3544;
  --text-muted: #6e7a8c;
  --card-bg: #ffffff;
  --card-border: #dde3ea;
  --card-shadow: 0 1px 3px rgba(44,53,68,.04), 0 8px 24px -12px rgba(44,53,68,.08);
  --card-shadow-hover: 0 2px 6px rgba(44,53,68,.05), 0 12px 28px -12px rgba(44,53,68,.1);
  --unit-bg: #f7f9fc;
  --unit-border: #e4e9f0;
  --primary: #64748b;
  --primary-hover: #475569;
  --primary-shadow: 0 4px 12px -4px rgba(100,116,139,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(100,116,139,.45);
  --danger: #e11d48;
  --danger-hover: #be123c;
  --danger-shadow: 0 4px 12px -4px rgba(225,29,72,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(225,29,72,.45);
  --state-on-bg: #f1f5f9;
  --state-on-color: #475569;
  --state-on-border: #cbd5e1;
  --state-off-bg: #f4f6f9;
  --state-off-color: #6e7a8c;
  --state-off-border: #e0e5eb;
  --badge-role-bg: #f1f5f9;
  --badge-role-color: #475569;
  --badge-role-border: #cbd5e1;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #e11d48;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f0f3f7;
  --nav-hover-color: #475569;
  --nav-danger: #e11d48;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #be123c;
  --pulse-on-color: rgba(100,116,139,.5);
  --pulse-off-color: rgba(225,29,72,.5);
  --primary-rgb: 100, 116, 139;
  --primary-soft: #f1f5f9;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #475569;
  --info-hover: #3e4b5c;
  --info-soft: #f1f5f9;
  --on-info: #ffffff;
  --secondary: #6e7a8c;
  --secondary-hover: #616b7b;
  --secondary-soft: #f4f6f9;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #afb6c2;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(100, 116, 139, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #eaeef4;
  --table-stripe: #fafbfd;
  --link: #64748b;
  --link-hover: #475569;
  --sidebar-bg: #2f3a4f;
  --sidebar-2: #444e61;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #505a6b;
  --sidebar-active: #7b899c;
  --sidebar-acc: #444e61;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #748297;
  --navbar-text: #5a687d;
  --navbar-border: #9aa5b4;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(44,53,68,.04), 0 8px 24px -12px rgba(44,53,68,.08);
  --shadow-lg: 0 2px 6px rgba(44,53,68,.05), 0 12px 28px -12px rgba(44,53,68,.1);
  --gradient: linear-gradient(135deg, #64748b 0%, #475569 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 13. 玫瑰茶 */
[data-theme="rose"] {
  --bg: #fbf4f4;
  --text: #46302e;
  --text-muted: #947370;
  --card-bg: #ffffff;
  --card-border: #f2dcdc;
  --card-shadow: 0 1px 3px rgba(70,48,46,.04), 0 8px 24px -12px rgba(70,48,46,.08);
  --card-shadow-hover: 0 2px 6px rgba(70,48,46,.05), 0 12px 28px -12px rgba(70,48,46,.1);
  --unit-bg: #fdf8f8;
  --unit-border: #f7e6e6;
  --primary: #e11d48;
  --primary-hover: #be123c;
  --primary-shadow: 0 4px 12px -4px rgba(225,29,72,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(225,29,72,.45);
  --danger: #b91c1c;
  --danger-hover: #991b1b;
  --danger-shadow: 0 4px 12px -4px rgba(185,28,28,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(185,28,28,.45);
  --state-on-bg: #fff1f2;
  --state-on-color: #e11d48;
  --state-on-border: #fecdd3;
  --state-off-bg: #f9f2f2;
  --state-off-color: #947370;
  --state-off-border: #eedede;
  --badge-role-bg: #fff1f2;
  --badge-role-color: #e11d48;
  --badge-role-border: #fecdd3;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #b91c1c;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #fbf4f4;
  --nav-hover-color: #e11d48;
  --nav-danger: #b91c1c;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #991b1b;
  --pulse-on-color: rgba(225,29,72,.5);
  --pulse-off-color: rgba(185,28,28,.5);
  --primary-rgb: 225, 29, 72;
  --primary-soft: #fff1f2;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #e11d48;
  --info-hover: #c61a3f;
  --info-soft: #fff1f2;
  --on-info: #ffffff;
  --secondary: #947370;
  --secondary-hover: #826563;
  --secondary-soft: #f9f2f2;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #c8b4b2;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(225, 29, 72, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f9eded;
  --table-stripe: #fefafa;
  --link: #e11d48;
  --link-hover: #be123c;
  --sidebar-bg: #5f1935;
  --sidebar-2: #6f3049;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #793e55;
  --sidebar-active: #e63f63;
  --sidebar-acc: #6f3049;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #e4345a;
  --navbar-text: #ca1a41;
  --navbar-border: #ec6c88;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(70,48,46,.04), 0 8px 24px -12px rgba(70,48,46,.08);
  --shadow-lg: 0 2px 6px rgba(70,48,46,.05), 0 12px 28px -12px rgba(70,48,46,.1);
  --gradient: linear-gradient(135deg, #e11d48 0%, #be123c 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 14. 青瓷蓝 */
[data-theme="celadon"] {
  --bg: #eef7f6;
  --text: #1e3b39;
  --text-muted: #5d827e;
  --card-bg: #ffffff;
  --card-border: #d3e9e6;
  --card-shadow: 0 1px 3px rgba(30,59,57,.04), 0 8px 24px -12px rgba(30,59,57,.08);
  --card-shadow-hover: 0 2px 6px rgba(30,59,57,.05), 0 12px 28px -12px rgba(30,59,57,.1);
  --unit-bg: #f5fbfa;
  --unit-border: #e0f0ee;
  --primary: #14b8a6;
  --primary-hover: #0d9488;
  --primary-shadow: 0 4px 12px -4px rgba(20,184,166,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(20,184,166,.45);
  --danger: #e11d48;
  --danger-hover: #be123c;
  --danger-shadow: 0 4px 12px -4px rgba(225,29,72,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(225,29,72,.45);
  --state-on-bg: #f0fdfa;
  --state-on-color: #14b8a6;
  --state-on-border: #99f6e4;
  --state-off-bg: #f1f7f6;
  --state-off-color: #5d827e;
  --state-off-border: #dfeae8;
  --badge-role-bg: #f0fdfa;
  --badge-role-color: #0d9488;
  --badge-role-border: #99f6e4;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #e11d48;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #eef7f6;
  --nav-hover-color: #14b8a6;
  --nav-danger: #e11d48;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #be123c;
  --pulse-on-color: rgba(20,184,166,.5);
  --pulse-off-color: rgba(225,29,72,.5);
  --primary-rgb: 20, 184, 166;
  --primary-soft: #f0fdfa;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #0d9488;
  --info-hover: #0b8278;
  --info-soft: #f0fdfa;
  --on-info: #ffffff;
  --secondary: #5d827e;
  --secondary-hover: #52726f;
  --secondary-soft: #f1f7f6;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #a6bcba;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(20, 184, 166, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #e7f4f2;
  --table-stripe: #f8fcfc;
  --link: #14b8a6;
  --link-hover: #0d9488;
  --sidebar-bg: #115459;
  --sidebar-2: #29656a;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #376f74;
  --sidebar-active: #37c3b3;
  --sidebar-acc: #29656a;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #2cbfaf;
  --navbar-text: #12a695;
  --navbar-border: #66d1c5;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(30,59,57,.04), 0 8px 24px -12px rgba(30,59,57,.08);
  --shadow-lg: 0 2px 6px rgba(30,59,57,.05), 0 12px 28px -12px rgba(30,59,57,.1);
  --gradient: linear-gradient(135deg, #14b8a6 0%, #0d9488 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 15. 燕麦奶 */
[data-theme="oat"] {
  --bg: #f7f4ee;
  --text: #3d3729;
  --text-muted: #857b66;
  --card-bg: #ffffff;
  --card-border: #ebe4d6;
  --card-shadow: 0 1px 3px rgba(61,55,41,.04), 0 8px 24px -12px rgba(61,55,41,.08);
  --card-shadow-hover: 0 2px 6px rgba(61,55,41,.05), 0 12px 28px -12px rgba(61,55,41,.1);
  --unit-bg: #fbf9f5;
  --unit-border: #f1ebe0;
  --primary: #a16207;
  --primary-hover: #854d0e;
  --primary-shadow: 0 4px 12px -4px rgba(161,98,7,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(161,98,7,.45);
  --danger: #dc2626;
  --danger-hover: #b91c1c;
  --danger-shadow: 0 4px 12px -4px rgba(220,38,38,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(220,38,38,.45);
  --state-on-bg: #fefce8;
  --state-on-color: #a16207;
  --state-on-border: #fef08a;
  --state-off-bg: #f5f2ec;
  --state-off-color: #857b66;
  --state-off-border: #e8e2d5;
  --badge-role-bg: #fefce8;
  --badge-role-color: #a16207;
  --badge-role-border: #fef08a;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #dc2626;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f7f4ee;
  --nav-hover-color: #a16207;
  --nav-danger: #dc2626;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #b91c1c;
  --pulse-on-color: rgba(161,98,7,.5);
  --pulse-off-color: rgba(220,38,38,.5);
  --primary-rgb: 161, 98, 7;
  --primary-soft: #fefce8;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #a16207;
  --info-hover: #8e5606;
  --info-soft: #fefce8;
  --on-info: #ffffff;
  --secondary: #857b66;
  --secondary-hover: #756c5a;
  --secondary-soft: #f5f2ec;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #beb8aa;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(161, 98, 7, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f4f0e7;
  --table-stripe: #fcfbf8;
  --link: #a16207;
  --link-hover: #854d0e;
  --sidebar-bg: #46341d;
  --sidebar-2: #584834;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #645441;
  --sidebar-active: #af7a2c;
  --sidebar-acc: #584834;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #aa7220;
  --navbar-text: #915806;
  --navbar-border: #c2995e;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(61,55,41,.04), 0 8px 24px -12px rgba(61,55,41,.08);
  --shadow-lg: 0 2px 6px rgba(61,55,41,.05), 0 12px 28px -12px rgba(61,55,41,.1);
  --gradient: linear-gradient(135deg, #a16207 0%, #854d0e 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 16. 静谧湖蓝 */
[data-theme="lagoon"] {
  --bg: #eef4f8;
  --text: #1f3a4a;
  --text-muted: #5f7d8e;
  --card-bg: #ffffff;
  --card-border: #d5e4ee;
  --card-shadow: 0 1px 3px rgba(31,58,74,.04), 0 8px 24px -12px rgba(31,58,74,.08);
  --card-shadow-hover: 0 2px 6px rgba(31,58,74,.05), 0 12px 28px -12px rgba(31,58,74,.1);
  --unit-bg: #f6fafc;
  --unit-border: #e0ecf3;
  --primary: #0369a1;
  --primary-hover: #075985;
  --primary-shadow: 0 4px 12px -4px rgba(3,105,161,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(3,105,161,.45);
  --danger: #e11d48;
  --danger-hover: #be123c;
  --danger-shadow: 0 4px 12px -4px rgba(225,29,72,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(225,29,72,.45);
  --state-on-bg: #eff6ff;
  --state-on-color: #0369a1;
  --state-on-border: #bfdbfe;
  --state-off-bg: #f1f5f8;
  --state-off-color: #5f7d8e;
  --state-off-border: #dfe7ee;
  --badge-role-bg: #eff6ff;
  --badge-role-color: #0369a1;
  --badge-role-border: #bfdbfe;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #e11d48;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #eef4f8;
  --nav-hover-color: #0369a1;
  --nav-danger: #e11d48;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #be123c;
  --pulse-on-color: rgba(3,105,161,.5);
  --pulse-off-color: rgba(225,29,72,.5);
  --primary-rgb: 3, 105, 161;
  --primary-soft: #eff6ff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #0369a1;
  --info-hover: #035c8e;
  --info-soft: #eff6ff;
  --on-info: #ffffff;
  --secondary: #5f7d8e;
  --secondary-hover: #546e7d;
  --secondary-soft: #f1f5f8;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #a6b8c3;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(3, 105, 161, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #e7f0f6;
  --table-stripe: #f9fcfd;
  --link: #0369a1;
  --link-hover: #075985;
  --sidebar-bg: #0a3657;
  --sidebar-2: #224a68;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #315672;
  --sidebar-active: #2980af;
  --sidebar-acc: #224a68;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #1c78aa;
  --navbar-text: #035e91;
  --navbar-border: #5b9ec2;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(31,58,74,.04), 0 8px 24px -12px rgba(31,58,74,.08);
  --shadow-lg: 0 2px 6px rgba(31,58,74,.05), 0 12px 28px -12px rgba(31,58,74,.1);
  --gradient: linear-gradient(135deg, #0369a1 0%, #075985 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 17. 香芋紫 */
[data-theme="taro"] {
  --bg: #f6f2f8;
  --text: #3b2e47;
  --text-muted: #7e6b8a;
  --card-bg: #ffffff;
  --card-border: #e8ddef;
  --card-shadow: 0 1px 3px rgba(59,46,71,.04), 0 8px 24px -12px rgba(59,46,71,.08);
  --card-shadow-hover: 0 2px 6px rgba(59,46,71,.05), 0 12px 28px -12px rgba(59,46,71,.1);
  --unit-bg: #faf7fc;
  --unit-border: #f0e8f5;
  --primary: #9333ea;
  --primary-hover: #7e22ce;
  --primary-shadow: 0 4px 12px -4px rgba(147,51,234,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(147,51,234,.45);
  --danger: #e11d48;
  --danger-hover: #be123c;
  --danger-shadow: 0 4px 12px -4px rgba(225,29,72,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(225,29,72,.45);
  --state-on-bg: #faf5ff;
  --state-on-color: #9333ea;
  --state-on-border: #e9d5ff;
  --state-off-bg: #f4f1f6;
  --state-off-color: #7e6b8a;
  --state-off-border: #e8e0ee;
  --badge-role-bg: #faf5ff;
  --badge-role-color: #9333ea;
  --badge-role-border: #e9d5ff;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #e11d48;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f6f2f8;
  --nav-hover-color: #9333ea;
  --nav-danger: #e11d48;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #be123c;
  --pulse-on-color: rgba(147,51,234,.5);
  --pulse-off-color: rgba(225,29,72,.5);
  --primary-rgb: 147, 51, 234;
  --primary-soft: #faf5ff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #9333ea;
  --info-hover: #812dce;
  --info-soft: #faf5ff;
  --on-info: #ffffff;
  --secondary: #7e6b8a;
  --secondary-hover: #6f5e79;
  --secondary-soft: #f4f1f6;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #baaec1;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(147, 51, 234, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f3edf6;
  --table-stripe: #fcfafd;
  --link: #9333ea;
  --link-hover: #7e22ce;
  --sidebar-bg: #412273;
  --sidebar-2: #543881;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #5f4589;
  --sidebar-active: #a352ed;
  --sidebar-acc: #543881;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #9e47ec;
  --navbar-text: #842ed3;
  --navbar-border: #b97af1;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(59,46,71,.04), 0 8px 24px -12px rgba(59,46,71,.08);
  --shadow-lg: 0 2px 6px rgba(59,46,71,.05), 0 12px 28px -12px rgba(59,46,71,.1);
  --gradient: linear-gradient(135deg, #9333ea 0%, #7e22ce 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 18. 杏仁奶油 */
[data-theme="almond"] {
  --bg: #fbf7f0;
  --text: #403a30;
  --text-muted: #8a8070;
  --card-bg: #ffffff;
  --card-border: #efe6d6;
  --card-shadow: 0 1px 3px rgba(64,58,48,.04), 0 8px 24px -12px rgba(64,58,48,.08);
  --card-shadow-hover: 0 2px 6px rgba(64,58,48,.05), 0 12px 28px -12px rgba(64,58,48,.1);
  --unit-bg: #fdfaf4;
  --unit-border: #f4ecdd;
  --primary: #ca8a04;
  --primary-hover: #a16207;
  --primary-shadow: 0 4px 12px -4px rgba(202,138,4,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(202,138,4,.45);
  --danger: #dc2626;
  --danger-hover: #b91c1c;
  --danger-shadow: 0 4px 12px -4px rgba(220,38,38,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(220,38,38,.45);
  --state-on-bg: #fefce8;
  --state-on-color: #ca8a04;
  --state-on-border: #fef08a;
  --state-off-bg: #f7f3ea;
  --state-off-color: #8a8070;
  --state-off-border: #ece4d5;
  --badge-role-bg: #fefce8;
  --badge-role-color: #a16207;
  --badge-role-border: #fef08a;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #dc2626;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #fbf7f0;
  --nav-hover-color: #ca8a04;
  --nav-danger: #dc2626;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #b91c1c;
  --pulse-on-color: rgba(202,138,4,.5);
  --pulse-off-color: rgba(220,38,38,.5);
  --primary-rgb: 202, 138, 4;
  --primary-soft: #fefce8;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #a16207;
  --info-hover: #8e5606;
  --info-soft: #fefce8;
  --on-info: #ffffff;
  --secondary: #8a8070;
  --secondary-hover: #797163;
  --secondary-soft: #f7f3ea;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #c2bcb0;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(202, 138, 4, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f8f2e6;
  --table-stripe: #fefcf8;
  --link: #ca8a04;
  --link-hover: #a16207;
  --sidebar-bg: #56431c;
  --sidebar-2: #675633;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #716140;
  --sidebar-active: #d29c2a;
  --sidebar-acc: #675633;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #cf961d;
  --navbar-text: #b67c04;
  --navbar-border: #ddb35c;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(64,58,48,.04), 0 8px 24px -12px rgba(64,58,48,.08);
  --shadow-lg: 0 2px 6px rgba(64,58,48,.05), 0 12px 28px -12px rgba(64,58,48,.1);
  --gradient: linear-gradient(135deg, #ca8a04 0%, #a16207 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 19. 灰岩 */
[data-theme="slate"] {
  --bg: #f2f4f6;
  --text: #2b3441;
  --text-muted: #6b7684;
  --card-bg: #ffffff;
  --card-border: #dfe4ea;
  --card-shadow: 0 1px 3px rgba(43,52,65,.04), 0 8px 24px -12px rgba(43,52,65,.08);
  --card-shadow-hover: 0 2px 6px rgba(43,52,65,.05), 0 12px 28px -12px rgba(43,52,65,.1);
  --unit-bg: #f8fafc;
  --unit-border: #e8ecf0;
  --primary: #334155;
  --primary-hover: #1e293b;
  --primary-shadow: 0 4px 12px -4px rgba(51,65,85,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(51,65,85,.45);
  --danger: #dc2626;
  --danger-hover: #b91c1c;
  --danger-shadow: 0 4px 12px -4px rgba(220,38,38,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(220,38,38,.45);
  --state-on-bg: #f1f5f9;
  --state-on-color: #334155;
  --state-on-border: #cbd5e1;
  --state-off-bg: #f4f6f8;
  --state-off-color: #6b7684;
  --state-off-border: #e1e6eb;
  --badge-role-bg: #f1f5f9;
  --badge-role-color: #334155;
  --badge-role-border: #cbd5e1;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #dc2626;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f2f4f6;
  --nav-hover-color: #334155;
  --nav-danger: #dc2626;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #b91c1c;
  --pulse-on-color: rgba(51,65,85,.5);
  --pulse-off-color: rgba(220,38,38,.5);
  --primary-rgb: 51, 65, 85;
  --primary-soft: #f1f5f9;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #334155;
  --info-hover: #2d394b;
  --info-soft: #f1f5f9;
  --on-info: #ffffff;
  --secondary: #6b7684;
  --secondary-hover: #5e6874;
  --secondary-soft: #f4f6f8;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #aeb5bd;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(51, 65, 85, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #edf0f3;
  --table-stripe: #fafcfd;
  --link: #334155;
  --link-hover: #1e293b;
  --sidebar-bg: #1d273a;
  --sidebar-2: #343d4e;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #414a5a;
  --sidebar-active: #525e6e;
  --sidebar-acc: #343d4e;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #475466;
  --navbar-text: #2e3a4c;
  --navbar-border: #7a8490;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(43,52,65,.04), 0 8px 24px -12px rgba(43,52,65,.08);
  --shadow-lg: 0 2px 6px rgba(43,52,65,.05), 0 12px 28px -12px rgba(43,52,65,.1);
  --gradient: linear-gradient(135deg, #334155 0%, #1e293b 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 20. 珊瑚粉 */
[data-theme="coral"] {
  --bg: #fdf5f2;
  --text: #4a2f2a;
  --text-muted: #a07768;
  --card-bg: #ffffff;
  --card-border: #f6ddd3;
  --card-shadow: 0 1px 3px rgba(74,47,42,.04), 0 8px 24px -12px rgba(74,47,42,.08);
  --card-shadow-hover: 0 2px 6px rgba(74,47,42,.05), 0 12px 28px -12px rgba(74,47,42,.1);
  --unit-bg: #fefaf8;
  --unit-border: #fae8e0;
  --primary: #f43f5e;
  --primary-hover: #e11d48;
  --primary-shadow: 0 4px 12px -4px rgba(244,63,94,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(244,63,94,.45);
  --danger: #b91c1c;
  --danger-hover: #991b1b;
  --danger-shadow: 0 4px 12px -4px rgba(185,28,28,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(185,28,28,.45);
  --state-on-bg: #fff1f2;
  --state-on-color: #f43f5e;
  --state-on-border: #fecdd3;
  --state-off-bg: #f9f2ef;
  --state-off-color: #a07768;
  --state-off-border: #f0e0d8;
  --badge-role-bg: #fff1f2;
  --badge-role-color: #f43f5e;
  --badge-role-border: #fecdd3;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #b91c1c;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #fdf5f2;
  --nav-hover-color: #f43f5e;
  --nav-danger: #b91c1c;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #991b1b;
  --pulse-on-color: rgba(244,63,94,.5);
  --pulse-off-color: rgba(185,28,28,.5);
  --primary-rgb: 244, 63, 94;
  --primary-soft: #fff1f2;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #f43f5e;
  --info-hover: #d73753;
  --info-soft: #fff1f2;
  --on-info: #ffffff;
  --secondary: #a07768;
  --secondary-hover: #8d695c;
  --secondary-soft: #f9f2ef;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #ceb6ad;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(244, 63, 94, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #fceee9;
  --table-stripe: #fefcfa;
  --link: #f43f5e;
  --link-hover: #e11d48;
  --sidebar-bg: #66263e;
  --sidebar-2: #753c51;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #7e495d;
  --sidebar-active: #f65c76;
  --sidebar-acc: #753c51;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #f5526e;
  --navbar-text: #dc3955;
  --navbar-border: #f88296;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(74,47,42,.04), 0 8px 24px -12px rgba(74,47,42,.08);
  --shadow-lg: 0 2px 6px rgba(74,47,42,.05), 0 12px 28px -12px rgba(74,47,42,.1);
  --gradient: linear-gradient(135deg, #f43f5e 0%, #e11d48 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 21. 薰衣草 */
[data-theme="lavender"] {
  --bg: #f4f1fa;
  --text: #352d4a;
  --text-muted: #756892;
  --card-bg: #ffffff;
  --card-border: #e5dff2;
  --card-shadow: 0 1px 3px rgba(53,45,74,.04), 0 8px 24px -12px rgba(53,45,74,.08);
  --card-shadow-hover: 0 2px 6px rgba(53,45,74,.05), 0 12px 28px -12px rgba(53,45,74,.1);
  --unit-bg: #f9f7fd;
  --unit-border: #ece7f5;
  --primary: #8b5cf6;
  --primary-hover: #7c3aed;
  --primary-shadow: 0 4px 12px -4px rgba(139,92,246,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(139,92,246,.45);
  --danger: #e11d48;
  --danger-hover: #be123c;
  --danger-shadow: 0 4px 12px -4px rgba(225,29,72,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(225,29,72,.45);
  --state-on-bg: #f5f3ff;
  --state-on-color: #8b5cf6;
  --state-on-border: #ddd6fe;
  --state-off-bg: #f2eff7;
  --state-off-color: #756892;
  --state-off-border: #e5def0;
  --badge-role-bg: #f5f3ff;
  --badge-role-color: #8b5cf6;
  --badge-role-border: #ddd6fe;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #e11d48;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f4f1fa;
  --nav-hover-color: #8b5cf6;
  --nav-danger: #e11d48;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #be123c;
  --pulse-on-color: rgba(139,92,246,.5);
  --pulse-off-color: rgba(225,29,72,.5);
  --primary-rgb: 139, 92, 246;
  --primary-soft: #f5f3ff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #8b5cf6;
  --info-hover: #7a51d8;
  --info-soft: #f5f3ff;
  --on-info: #ffffff;
  --secondary: #756892;
  --secondary-hover: #675c80;
  --secondary-soft: #f2eff7;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b4acc6;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(139, 92, 246, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f0ecf8;
  --table-stripe: #fbfafe;
  --link: #8b5cf6;
  --link-hover: #7c3aed;
  --sidebar-bg: #3e3178;
  --sidebar-2: #514686;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #5d528e;
  --sidebar-active: #9c74f7;
  --sidebar-acc: #514686;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #976cf7;
  --navbar-text: #7d53dd;
  --navbar-border: #b495f9;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(53,45,74,.04), 0 8px 24px -12px rgba(53,45,74,.08);
  --shadow-lg: 0 2px 6px rgba(53,45,74,.05), 0 12px 28px -12px rgba(53,45,74,.1);
  --gradient: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 22. 柚木棕 */
[data-theme="teak"] {
  --bg: #f7f2ea;
  --text: #3d3226;
  --text-muted: #85745c;
  --card-bg: #ffffff;
  --card-border: #ebe0ce;
  --card-shadow: 0 1px 3px rgba(61,50,38,.04), 0 8px 24px -12px rgba(61,50,38,.08);
  --card-shadow-hover: 0 2px 6px rgba(61,50,38,.05), 0 12px 28px -12px rgba(61,50,38,.1);
  --unit-bg: #fbf8f2;
  --unit-border: #f1e8d8;
  --primary: #b45309;
  --primary-hover: #92400e;
  --primary-shadow: 0 4px 12px -4px rgba(180,83,9,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(180,83,9,.45);
  --danger: #dc2626;
  --danger-hover: #b91c1c;
  --danger-shadow: 0 4px 12px -4px rgba(220,38,38,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(220,38,38,.45);
  --state-on-bg: #fffbeb;
  --state-on-color: #b45309;
  --state-on-border: #fde68a;
  --state-off-bg: #f5f0e8;
  --state-off-color: #85745c;
  --state-off-border: #ebe2d3;
  --badge-role-bg: #fffbeb;
  --badge-role-color: #92400e;
  --badge-role-border: #fde68a;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #dc2626;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f7f2ea;
  --nav-hover-color: #b45309;
  --nav-danger: #dc2626;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #b91c1c;
  --pulse-on-color: rgba(180,83,9,.5);
  --pulse-off-color: rgba(220,38,38,.5);
  --primary-rgb: 180, 83, 9;
  --primary-soft: #fffbeb;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #92400e;
  --info-hover: #80380c;
  --info-soft: #fffbeb;
  --on-info: #ffffff;
  --secondary: #85745c;
  --secondary-hover: #756651;
  --secondary-soft: #f5f0e8;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #beb3a3;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(180, 83, 9, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f4ede1;
  --table-stripe: #fcfaf7;
  --link: #b45309;
  --link-hover: #92400e;
  --sidebar-bg: #4e2e1d;
  --sidebar-2: #604334;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #6a4f41;
  --sidebar-active: #bf6d2e;
  --sidebar-acc: #604334;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #bc6422;
  --navbar-text: #a24b08;
  --navbar-border: #ce8f5f;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(61,50,38,.04), 0 8px 24px -12px rgba(61,50,38,.08);
  --shadow-lg: 0 2px 6px rgba(61,50,38,.05), 0 12px 28px -12px rgba(61,50,38,.1);
  --gradient: linear-gradient(135deg, #b45309 0%, #92400e 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 23. 冰晶蓝 */
[data-theme="ice"] {
  --bg: #f0f7fb;
  --text: #1d3a4d;
  --text-muted: #6489a0;
  --card-bg: #ffffff;
  --card-border: #d5e8f2;
  --card-shadow: 0 1px 3px rgba(29,58,77,.04), 0 8px 24px -12px rgba(29,58,77,.08);
  --card-shadow-hover: 0 2px 6px rgba(29,58,77,.05), 0 12px 28px -12px rgba(29,58,77,.1);
  --unit-bg: #f5fbfe;
  --unit-border: #dfeff7;
  --primary: #0ea5e9;
  --primary-hover: #0284c7;
  --primary-shadow: 0 4px 12px -4px rgba(14,165,233,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(14,165,233,.45);
  --danger: #f43f5e;
  --danger-hover: #e11d48;
  --danger-shadow: 0 4px 12px -4px rgba(244,63,94,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(244,63,94,.45);
  --state-on-bg: #f0f9ff;
  --state-on-color: #0ea5e9;
  --state-on-border: #bae6fd;
  --state-off-bg: #f0f5f9;
  --state-off-color: #6489a0;
  --state-off-border: #dceae8;
  --badge-role-bg: #f0f9ff;
  --badge-role-color: #0ea5e9;
  --badge-role-border: #bae6fd;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #f43f5e;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f0f7fb;
  --nav-hover-color: #0ea5e9;
  --nav-danger: #f43f5e;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #e11d48;
  --pulse-on-color: rgba(14,165,233,.5);
  --pulse-off-color: rgba(244,63,94,.5);
  --primary-rgb: 14, 165, 233;
  --primary-soft: #f0f9ff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #0ea5e9;
  --info-hover: #0c91cd;
  --info-soft: #f0f9ff;
  --on-info: #ffffff;
  --secondary: #6489a0;
  --secondary-hover: #58798d;
  --secondary-soft: #f0f5f9;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #aac0ce;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(14, 165, 233, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #e8f3f9;
  --table-stripe: #f8fcfe;
  --link: #0ea5e9;
  --link-hover: #0284c7;
  --sidebar-bg: #0f4d73;
  --sidebar-2: #275f81;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #356989;
  --sidebar-active: #32b2ec;
  --sidebar-acc: #275f81;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #26aeeb;
  --navbar-text: #0d94d2;
  --navbar-border: #62c4f1;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(29,58,77,.04), 0 8px 24px -12px rgba(29,58,77,.08);
  --shadow-lg: 0 2px 6px rgba(29,58,77,.05), 0 12px 28px -12px rgba(29,58,77,.1);
  --gradient: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 24. 柿子橙 */
[data-theme="persimmon"] {
  --bg: #fef4ee;
  --text: #4a2a1c;
  --text-muted: #a26a50;
  --card-bg: #ffffff;
  --card-border: #f6dccd;
  --card-shadow: 0 1px 3px rgba(74,42,28,.04), 0 8px 24px -12px rgba(74,42,28,.08);
  --card-shadow-hover: 0 2px 6px rgba(74,42,28,.05), 0 12px 28px -12px rgba(74,42,28,.1);
  --unit-bg: #fff9f5;
  --unit-border: #fae5d8;
  --primary: #ea580c;
  --primary-hover: #c2410c;
  --primary-shadow: 0 4px 12px -4px rgba(234,88,12,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(234,88,12,.45);
  --danger: #b91c1c;
  --danger-hover: #991b1b;
  --danger-shadow: 0 4px 12px -4px rgba(185,28,28,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(185,28,28,.45);
  --state-on-bg: #fff7ed;
  --state-on-color: #ea580c;
  --state-on-border: #fed7aa;
  --state-off-bg: #f8f2ec;
  --state-off-color: #a26a50;
  --state-off-border: #f0e0d2;
  --badge-role-bg: #fff7ed;
  --badge-role-color: #c2410c;
  --badge-role-border: #fed7aa;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #b91c1c;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #fef4ee;
  --nav-hover-color: #ea580c;
  --nav-danger: #b91c1c;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #991b1b;
  --pulse-on-color: rgba(234,88,12,.5);
  --pulse-off-color: rgba(185,28,28,.5);
  --primary-rgb: 234, 88, 12;
  --primary-soft: #fff7ed;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #c2410c;
  --info-hover: #ab390b;
  --info-soft: #fff7ed;
  --on-info: #ffffff;
  --secondary: #a26a50;
  --secondary-hover: #8f5d46;
  --secondary-soft: #f8f2ec;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #d0af9f;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(234, 88, 12, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #fcece3;
  --table-stripe: #fffbf8;
  --link: #ea580c;
  --link-hover: #c2410c;
  --sidebar-bg: #62301f;
  --sidebar-2: #724535;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #7b5143;
  --sidebar-active: #ed7130;
  --sidebar-acc: #724535;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #ec6924;
  --navbar-text: #d34f0b;
  --navbar-border: #f19261;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(74,42,28,.04), 0 8px 24px -12px rgba(74,42,28,.08);
  --shadow-lg: 0 2px 6px rgba(74,42,28,.05), 0 12px 28px -12px rgba(74,42,28,.1);
  --gradient: linear-gradient(135deg, #ea580c 0%, #c2410c 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 25. 葡萄紫 */
[data-theme="grape"] {
  --bg: #f5eef8;
  --text: #35204a;
  --text-muted: #7a5c94;
  --card-bg: #ffffff;
  --card-border: #e8d8f2;
  --card-shadow: 0 1px 3px rgba(53,32,74,.04), 0 8px 24px -12px rgba(53,32,74,.08);
  --card-shadow-hover: 0 2px 6px rgba(53,32,74,.05), 0 12px 28px -12px rgba(53,32,74,.1);
  --unit-bg: #faf4fc;
  --unit-border: #f0e1f7;
  --primary: #a21caf;
  --primary-hover: #86198f;
  --primary-shadow: 0 4px 12px -4px rgba(162,28,175,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(162,28,175,.45);
  --danger: #dc2626;
  --danger-hover: #b91c1c;
  --danger-shadow: 0 4px 12px -4px rgba(220,38,38,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(220,38,38,.45);
  --state-on-bg: #fdf4ff;
  --state-on-color: #a21caf;
  --state-on-border: #f5d0fe;
  --state-off-bg: #f2ecf5;
  --state-off-color: #7a5c94;
  --state-off-border: #e8dcf0;
  --badge-role-bg: #fdf4ff;
  --badge-role-color: #a21caf;
  --badge-role-border: #f5d0fe;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #dc2626;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f5eef8;
  --nav-hover-color: #a21caf;
  --nav-danger: #dc2626;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #b91c1c;
  --pulse-on-color: rgba(162,28,175,.5);
  --pulse-off-color: rgba(220,38,38,.5);
  --primary-rgb: 162, 28, 175;
  --primary-soft: #fdf4ff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #a21caf;
  --info-hover: #8f199a;
  --info-soft: #fdf4ff;
  --on-info: #ffffff;
  --secondary: #7a5c94;
  --secondary-hover: #6b5182;
  --secondary-soft: #f2ecf5;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b8a5c6;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(162, 28, 175, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f2e8f8;
  --table-stripe: #fcf8fd;
  --link: #a21caf;
  --link-hover: #86198f;
  --sidebar-bg: #47195d;
  --sidebar-2: #59306d;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #643e77;
  --sidebar-active: #b03ebb;
  --sidebar-acc: #59306d;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #ab33b7;
  --navbar-text: #92199e;
  --navbar-border: #c36bcb;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(53,32,74,.04), 0 8px 24px -12px rgba(53,32,74,.08);
  --shadow-lg: 0 2px 6px rgba(53,32,74,.05), 0 12px 28px -12px rgba(53,32,74,.1);
  --gradient: linear-gradient(135deg, #a21caf 0%, #86198f 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 26. 松石绿 */
[data-theme="turquoise"] {
  --bg: #ecf8f7;
  --text: #17403d;
  --text-muted: #56908a;
  --card-bg: #ffffff;
  --card-border: #cfeae7;
  --card-shadow: 0 1px 3px rgba(23,64,61,.04), 0 8px 24px -12px rgba(23,64,61,.08);
  --card-shadow-hover: 0 2px 6px rgba(23,64,61,.05), 0 12px 28px -12px rgba(23,64,61,.1);
  --unit-bg: #f4fbfa;
  --unit-border: #dcf0ee;
  --primary: #0d9488;
  --primary-hover: #0f766e;
  --primary-shadow: 0 4px 12px -4px rgba(13,148,136,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(13,148,136,.45);
  --danger: #f97316;
  --danger-hover: #ea580c;
  --danger-shadow: 0 4px 12px -4px rgba(249,115,22,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(249,115,22,.45);
  --state-on-bg: #f0fdfa;
  --state-on-color: #0d9488;
  --state-on-border: #99f6e4;
  --state-off-bg: #eff5f4;
  --state-off-color: #56908a;
  --state-off-border: #dcebe9;
  --badge-role-bg: #f0fdfa;
  --badge-role-color: #0d9488;
  --badge-role-border: #99f6e4;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff7ed;
  --badge-off-color: #f97316;
  --badge-off-border: #fed7aa;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #ecf8f7;
  --nav-hover-color: #0d9488;
  --nav-danger: #f97316;
  --nav-danger-hover-bg: #fff7ed;
  --nav-danger-hover-color: #ea580c;
  --pulse-on-color: rgba(13,148,136,.5);
  --pulse-off-color: rgba(249,115,22,.5);
  --primary-rgb: 13, 148, 136;
  --primary-soft: #f0fdfa;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #0d9488;
  --info-hover: #0b8278;
  --info-soft: #f0fdfa;
  --on-info: #ffffff;
  --secondary: #56908a;
  --secondary-hover: #4c7f79;
  --secondary-soft: #eff5f4;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #a1c4c0;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(13, 148, 136, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #e4f4f2;
  --table-stripe: #f8fcfc;
  --link: #0d9488;
  --link-hover: #0f766e;
  --sidebar-bg: #0e464e;
  --sidebar-2: #265860;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #35646a;
  --sidebar-active: #31a49a;
  --sidebar-acc: #265860;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #259f94;
  --navbar-text: #0c857a;
  --navbar-border: #62b9b2;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(23,64,61,.04), 0 8px 24px -12px rgba(23,64,61,.08);
  --shadow-lg: 0 2px 6px rgba(23,64,61,.05), 0 12px 28px -12px rgba(23,64,61,.1);
  --gradient: linear-gradient(135deg, #0d9488 0%, #0f766e 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 27. 奶茶棕 */
[data-theme="milk-tea"] {
  --bg: #f6f1ea;
  --text: #3d2f24;
  --text-muted: #8a7462;
  --card-bg: #ffffff;
  --card-border: #eae1d5;
  --card-shadow: 0 1px 3px rgba(61,47,36,.04), 0 8px 24px -12px rgba(61,47,36,.08);
  --card-shadow-hover: 0 2px 6px rgba(61,47,36,.05), 0 12px 28px -12px rgba(61,47,36,.1);
  --unit-bg: #faf6f1;
  --unit-border: #f0e8dd;
  --primary: #a16207;
  --primary-hover: #854d0e;
  --primary-shadow: 0 4px 12px -4px rgba(161,98,7,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(161,98,7,.45);
  --danger: #dc2626;
  --danger-hover: #b91c1c;
  --danger-shadow: 0 4px 12px -4px rgba(220,38,38,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(220,38,38,.45);
  --state-on-bg: #fefce8;
  --state-on-color: #a16207;
  --state-on-border: #fef08a;
  --state-off-bg: #f2ede5;
  --state-off-color: #8a7462;
  --state-off-border: #e7dccd;
  --badge-role-bg: #fefce8;
  --badge-role-color: #a16207;
  --badge-role-border: #fef08a;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fef2f2;
  --badge-off-color: #dc2626;
  --badge-off-border: #fecaca;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f6f1ea;
  --nav-hover-color: #a16207;
  --nav-danger: #dc2626;
  --nav-danger-hover-bg: #fef2f2;
  --nav-danger-hover-color: #b91c1c;
  --pulse-on-color: rgba(161,98,7,.5);
  --pulse-off-color: rgba(220,38,38,.5);
  --primary-rgb: 161, 98, 7;
  --primary-soft: #fefce8;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #a16207;
  --info-hover: #8e5606;
  --info-soft: #fefce8;
  --on-info: #ffffff;
  --secondary: #8a7462;
  --secondary-hover: #796656;
  --secondary-soft: #f2ede5;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #c0b2a6;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(161, 98, 7, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f3ece4;
  --table-stripe: #fcf9f6;
  --link: #a16207;
  --link-hover: #854d0e;
  --sidebar-bg: #46341d;
  --sidebar-2: #584834;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #645441;
  --sidebar-active: #af7a2c;
  --sidebar-acc: #584834;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #aa7220;
  --navbar-text: #915806;
  --navbar-border: #c2995e;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(61,47,36,.04), 0 8px 24px -12px rgba(61,47,36,.08);
  --shadow-lg: 0 2px 6px rgba(61,47,36,.05), 0 12px 28px -12px rgba(61,47,36,.1);
  --gradient: linear-gradient(135deg, #a16207 0%, #854d0e 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 28. 雾紫灰 */
[data-theme="mauve"] {
  --bg: #f5f3f7;
  --text: #37304a;
  --text-muted: #7d7492;
  --card-bg: #ffffff;
  --card-border: #e7e3ed;
  --card-shadow: 0 1px 3px rgba(55,48,74,.04), 0 8px 24px -12px rgba(55,48,74,.08);
  --card-shadow-hover: 0 2px 6px rgba(55,48,74,.05), 0 12px 28px -12px rgba(55,48,74,.1);
  --unit-bg: #faf9fc;
  --unit-border: #eeeaf3;
  --primary: #7e6ea8;
  --primary-hover: #6b5b93;
  --primary-shadow: 0 4px 12px -4px rgba(126,110,168,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(126,110,168,.45);
  --danger: #c026d3;
  --danger-hover: #a21caf;
  --danger-shadow: 0 4px 12px -4px rgba(192,38,211,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(192,38,211,.45);
  --state-on-bg: #f5f3ff;
  --state-on-color: #7e6ea8;
  --state-on-border: #ddd6fe;
  --state-off-bg: #f2f0f5;
  --state-off-color: #7d7492;
  --state-off-border: #e5e1eb;
  --badge-role-bg: #f5f3ff;
  --badge-role-color: #7e6ea8;
  --badge-role-border: #ddd6fe;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fdf4ff;
  --badge-off-color: #c026d3;
  --badge-off-border: #f5d0fe;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f5f3f7;
  --nav-hover-color: #7e6ea8;
  --nav-danger: #c026d3;
  --nav-danger-hover-bg: #fdf4ff;
  --nav-danger-hover-color: #a21caf;
  --pulse-on-color: rgba(126,110,168,.5);
  --pulse-off-color: rgba(192,38,211,.5);
  --primary-rgb: 126, 110, 168;
  --primary-soft: #f5f3ff;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #7e6ea8;
  --info-hover: #6f6194;
  --info-soft: #f5f3ff;
  --on-info: #ffffff;
  --secondary: #7d7492;
  --secondary-hover: #6e6680;
  --secondary-soft: #f2f0f5;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b9b4c4;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(126, 110, 168, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f2eef5;
  --table-stripe: #fcfbfd;
  --link: #7e6ea8;
  --link-hover: #6b5b93;
  --sidebar-bg: #39385a;
  --sidebar-2: #4d4c6a;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #595874;
  --sidebar-active: #9184b5;
  --sidebar-acc: #4d4c6a;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #8b7cb1;
  --navbar-text: #716397;
  --navbar-border: #aba1c6;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(55,48,74,.04), 0 8px 24px -12px rgba(55,48,74,.08);
  --shadow-lg: 0 2px 6px rgba(55,48,74,.05), 0 12px 28px -12px rgba(55,48,74,.1);
  --gradient: linear-gradient(135deg, #7e6ea8 0%, #6b5b93 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 29. 极简白灰 */
[data-theme="mono"] {
  --bg: #fafafa;
  --text: #1c1c1e;
  --text-muted: #737373;
  --card-bg: #ffffff;
  --card-border: #e8e8e8;
  --card-shadow: 0 1px 3px rgba(28,28,30,.04), 0 8px 24px -12px rgba(28,28,30,.06);
  --card-shadow-hover: 0 2px 6px rgba(28,28,30,.05), 0 12px 28px -12px rgba(28,28,30,.08);
  --unit-bg: #f7f7f7;
  --unit-border: #ededed;
  --primary: #171717;
  --primary-hover: #000000;
  --primary-shadow: 0 4px 12px -4px rgba(23,23,23,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(23,23,23,.45);
  --danger: #e11d48;
  --danger-hover: #be123c;
  --danger-shadow: 0 4px 12px -4px rgba(225,29,72,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(225,29,72,.45);
  --state-on-bg: #f5f5f5;
  --state-on-color: #171717;
  --state-on-border: #d4d4d4;
  --state-off-bg: #f5f5f5;
  --state-off-color: #737373;
  --state-off-border: #e5e5e5;
  --badge-role-bg: #f5f5f5;
  --badge-role-color: #171717;
  --badge-role-border: #d4d4d4;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #e11d48;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #f5f5f5;
  --nav-hover-color: #171717;
  --nav-danger: #e11d48;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #be123c;
  --pulse-on-color: rgba(23,23,23,.5);
  --pulse-off-color: rgba(225,29,72,.5);
  --primary-rgb: 23, 23, 23;
  --primary-soft: #f5f5f5;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #171717;
  --info-hover: #141414;
  --info-soft: #f5f5f5;
  --on-info: #ffffff;
  --secondary: #737373;
  --secondary-hover: #656565;
  --secondary-soft: #f5f5f5;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b6b6b6;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(23, 23, 23, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f4f4f4;
  --table-stripe: #fafafa;
  --link: #171717;
  --link-hover: #000000;
  --sidebar-bg: #121723;
  --sidebar-2: #2a2e39;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #383c46;
  --sidebar-active: #3a3a3a;
  --sidebar-acc: #2a2e39;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #2e2e2e;
  --navbar-text: #151515;
  --navbar-border: #686868;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(28,28,30,.04), 0 8px 24px -12px rgba(28,28,30,.06);
  --shadow-lg: 0 2px 6px rgba(28,28,30,.05), 0 12px 28px -12px rgba(28,28,30,.08);
  --gradient: linear-gradient(135deg, #171717 0%, #000000 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 30. 藕粉 */
[data-theme="blush"] {
  --bg: #fbf4f6;
  --text: #432e37;
  --text-muted: #94737f;
  --card-bg: #ffffff;
  --card-border: #f3dfe5;
  --card-shadow: 0 1px 3px rgba(67,46,55,.04), 0 8px 24px -12px rgba(67,46,55,.08);
  --card-shadow-hover: 0 2px 6px rgba(67,46,55,.05), 0 12px 28px -12px rgba(67,46,55,.1);
  --unit-bg: #fdf8f9;
  --unit-border: #f8e8ed;
  --primary: #d97706;
  --primary-hover: #b45309;
  --primary-shadow: 0 4px 12px -4px rgba(217,119,6,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(217,119,6,.45);
  --danger: #be123c;
  --danger-hover: #9f1239;
  --danger-shadow: 0 4px 12px -4px rgba(190,18,60,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(190,18,60,.45);
  --state-on-bg: #fffbeb;
  --state-on-color: #d97706;
  --state-on-border: #fde68a;
  --state-off-bg: #f8f2f4;
  --state-off-color: #94737f;
  --state-off-border: #eee0e6;
  --badge-role-bg: #fffbeb;
  --badge-role-color: #b45309;
  --badge-role-border: #fde68a;
  --badge-on-bg: #f0fdf4;
  --badge-on-color: #15803d;
  --badge-on-border: #bbf7d0;
  --badge-off-bg: #fff1f2;
  --badge-off-color: #be123c;
  --badge-off-border: #fecdd3;
  --badge-pending-bg: #fffbeb;
  --badge-pending-color: #d97706;
  --badge-pending-border: #fef3c7;
  --badge-lv-bg: #fff7ed;
  --badge-lv-color: #ea580c;
  --badge-lv-border: #ffedd5;
  --badge-danger-bg: #fef2f2;
  --badge-danger-color: #dc2626;
  --badge-danger-border: #fee2e2;
  --nav-hover-bg: #fbf4f6;
  --nav-hover-color: #d97706;
  --nav-danger: #be123c;
  --nav-danger-hover-bg: #fff1f2;
  --nav-danger-hover-color: #9f1239;
  --pulse-on-color: rgba(217,119,6,.5);
  --pulse-off-color: rgba(190,18,60,.5);
  --primary-rgb: 217, 119, 6;
  --primary-soft: #fffbeb;
  --on-primary: #ffffff;
  --success: #15803d;
  --success-hover: #127136;
  --success-soft: #f0fdf4;
  --on-success: #ffffff;
  --warning: #d97706;
  --warning-hover: #bf6905;
  --warning-soft: #fffbeb;
  --on-warning: #ffffff;
  --danger-soft: #fef2f2;
  --on-danger: #ffffff;
  --info: #b45309;
  --info-hover: #9e4908;
  --info-soft: #fffbeb;
  --on-info: #ffffff;
  --secondary: #94737f;
  --secondary-hover: #826570;
  --secondary-soft: #f8f2f4;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #c8b4ba;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(217, 119, 6, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #faeef2;
  --table-stripe: #fefafb;
  --link: #d97706;
  --link-hover: #b45309;
  --sidebar-bg: #5c3b1c;
  --sidebar-2: #6c4f33;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #765a40;
  --sidebar-active: #df8b2b;
  --sidebar-acc: #6c4f33;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #dd851f;
  --navbar-text: #c36b05;
  --navbar-border: #e6a75d;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(67,46,55,.04), 0 8px 24px -12px rgba(67,46,55,.08);
  --shadow-lg: 0 2px 6px rgba(67,46,55,.05), 0 12px 28px -12px rgba(67,46,55,.1);
  --gradient: linear-gradient(135deg, #d97706 0%, #b45309 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 31. 莫兰迪灰蓝 */
[data-theme="morandi-blue"] {
  --bg: #f0f2f4;
  --text: #2f3a44;
  --text-muted: #6d7a86;
  --card-bg: #ffffff;
  --card-border: #dfe4e9;
  --card-shadow: 0 1px 3px rgba(47,58,68,.04), 0 8px 24px -12px rgba(47,58,68,.08);
  --card-shadow-hover: 0 2px 6px rgba(47,58,68,.05), 0 12px 28px -12px rgba(47,58,68,.1);
  --unit-bg: #f7f9fb;
  --unit-border: #e6ecf0;
  --primary: #6b8aa6;
  --primary-hover: #587a97;
  --primary-shadow: 0 4px 12px -4px rgba(107,138,166,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(107,138,166,.45);
  --danger: #c27070;
  --danger-hover: #ac5c5c;
  --danger-shadow: 0 4px 12px -4px rgba(194,112,112,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(194,112,112,.45);
  --state-on-bg: #f0f4f8;
  --state-on-color: #587a97;
  --state-on-border: #d6e2ec;
  --state-off-bg: #f2f4f6;
  --state-off-color: #6d7a86;
  --state-off-border: #e3e8ec;
  --badge-role-bg: #f0f4f8;
  --badge-role-color: #587a97;
  --badge-role-border: #d6e2ec;
  --badge-on-bg: #f1f6f2;
  --badge-on-color: #5f8a6f;
  --badge-on-border: #d6e6da;
  --badge-off-bg: #f8f1f1;
  --badge-off-color: #a96363;
  --badge-off-border: #ecdbdb;
  --badge-pending-bg: #f8f4ea;
  --badge-pending-color: #b08a4a;
  --badge-pending-border: #ecdfc2;
  --badge-lv-bg: #f8f1ea;
  --badge-lv-color: #b57a52;
  --badge-lv-border: #ecddcf;
  --badge-danger-bg: #f8f1f1;
  --badge-danger-color: #b45c5c;
  --badge-danger-border: #ecd8d8;
  --nav-hover-bg: #f0f2f4;
  --nav-hover-color: #587a97;
  --nav-danger: #c27070;
  --nav-danger-hover-bg: #f8f1f1;
  --nav-danger-hover-color: #ac5c5c;
  --pulse-on-color: rgba(107,138,166,.5);
  --pulse-off-color: rgba(194,112,112,.5);
  --primary-rgb: 107, 138, 166;
  --primary-soft: #f0f4f8;
  --on-primary: #ffffff;
  --success: #5f8a6f;
  --success-hover: #547962;
  --success-soft: #f1f6f2;
  --on-success: #ffffff;
  --warning: #b08a4a;
  --warning-hover: #9b7941;
  --warning-soft: #f8f4ea;
  --on-warning: #ffffff;
  --danger-soft: #f8f1f1;
  --on-danger: #ffffff;
  --info: #587a97;
  --info-hover: #4d6b85;
  --info-soft: #f0f4f8;
  --on-info: #ffffff;
  --secondary: #6d7a86;
  --secondary-hover: #606b76;
  --secondary-soft: #f2f4f6;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #aeb6bd;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(107, 138, 166, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #ebeff2;
  --table-stripe: #fafbfc;
  --link: #6b8aa6;
  --link-hover: #587a97;
  --sidebar-bg: #324359;
  --sidebar-2: #46566a;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #536174;
  --sidebar-active: #819cb3;
  --sidebar-acc: #46566a;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #7a96af;
  --navbar-text: #607c95;
  --navbar-border: #9fb3c5;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(47,58,68,.04), 0 8px 24px -12px rgba(47,58,68,.08);
  --shadow-lg: 0 2px 6px rgba(47,58,68,.05), 0 12px 28px -12px rgba(47,58,68,.1);
  --gradient: linear-gradient(135deg, #6b8aa6 0%, #587a97 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 32. 素雅豆沙 */
[data-theme="bean-paste"] {
  --bg: #f6f2f2;
  --text: #453437;
  --text-muted: #8b7478;
  --card-bg: #ffffff;
  --card-border: #ebe1e2;
  --card-shadow: 0 1px 3px rgba(69,52,55,.04), 0 8px 24px -12px rgba(69,52,55,.08);
  --card-shadow-hover: 0 2px 6px rgba(69,52,55,.05), 0 12px 28px -12px rgba(69,52,55,.1);
  --unit-bg: #faf7f7;
  --unit-border: #f0e6e7;
  --primary: #9d6d76;
  --primary-hover: #875a63;
  --primary-shadow: 0 4px 12px -4px rgba(157,109,118,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(157,109,118,.45);
  --danger: #b46a6a;
  --danger-hover: #9d5959;
  --danger-shadow: 0 4px 12px -4px rgba(180,106,106,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(180,106,106,.45);
  --state-on-bg: #f5eff1;
  --state-on-color: #875a63;
  --state-on-border: #e5d4d8;
  --state-off-bg: #f3f0f1;
  --state-off-color: #8b7478;
  --state-off-border: #e6dfe1;
  --badge-role-bg: #f5eff1;
  --badge-role-color: #875a63;
  --badge-role-border: #e5d4d8;
  --badge-on-bg: #f1f5f0;
  --badge-on-color: #61825f;
  --badge-on-border: #d8e4d7;
  --badge-off-bg: #f8f1f1;
  --badge-off-color: #a96363;
  --badge-off-border: #ecdbdb;
  --badge-pending-bg: #f8f4ea;
  --badge-pending-color: #b08a4a;
  --badge-pending-border: #ecdfc2;
  --badge-lv-bg: #f8f1ea;
  --badge-lv-color: #b57a52;
  --badge-lv-border: #ecddcf;
  --badge-danger-bg: #f8f1f1;
  --badge-danger-color: #b45c5c;
  --badge-danger-border: #ecd8d8;
  --nav-hover-bg: #f6f2f2;
  --nav-hover-color: #9d6d76;
  --nav-danger: #b46a6a;
  --nav-danger-hover-bg: #f8f1f1;
  --nav-danger-hover-color: #9d5959;
  --pulse-on-color: rgba(157,109,118,.5);
  --pulse-off-color: rgba(180,106,106,.5);
  --primary-rgb: 157, 109, 118;
  --primary-soft: #f5eff1;
  --on-primary: #ffffff;
  --success: #61825f;
  --success-hover: #557254;
  --success-soft: #f1f5f0;
  --on-success: #ffffff;
  --warning: #b08a4a;
  --warning-hover: #9b7941;
  --warning-soft: #f8f4ea;
  --on-warning: #ffffff;
  --danger-soft: #f8f1f1;
  --on-danger: #ffffff;
  --info: #875a63;
  --info-hover: #774f57;
  --info-soft: #f5eff1;
  --on-info: #ffffff;
  --secondary: #8b7478;
  --secondary-hover: #7a666a;
  --secondary-soft: #f3f0f1;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #c0b3b5;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(157, 109, 118, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f3ecec;
  --table-stripe: #fcfafa;
  --link: #9d6d76;
  --link-hover: #875a63;
  --sidebar-bg: #453847;
  --sidebar-2: #584c59;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #635864;
  --sidebar-active: #ac838b;
  --sidebar-acc: #584c59;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #a77c84;
  --navbar-text: #8d626a;
  --navbar-border: #bfa0a6;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(69,52,55,.04), 0 8px 24px -12px rgba(69,52,55,.08);
  --shadow-lg: 0 2px 6px rgba(69,52,55,.05), 0 12px 28px -12px rgba(69,52,55,.1);
  --gradient: linear-gradient(135deg, #9d6d76 0%, #875a63 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 33. 淡绿苔藓 */
[data-theme="moss"] {
  --bg: #f2f5f1;
  --text: #313a2e;
  --text-muted: #74816c;
  --card-bg: #ffffff;
  --card-border: #e1e8de;
  --card-shadow: 0 1px 3px rgba(49,58,46,.04), 0 8px 24px -12px rgba(49,58,46,.08);
  --card-shadow-hover: 0 2px 6px rgba(49,58,46,.05), 0 12px 28px -12px rgba(49,58,46,.1);
  --unit-bg: #f8faf7;
  --unit-border: #e9efe6;
  --primary: #7d9b6a;
  --primary-hover: #688554;
  --primary-shadow: 0 4px 12px -4px rgba(125,155,106,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(125,155,106,.45);
  --danger: #c08a6a;
  --danger-hover: #a87252;
  --danger-shadow: 0 4px 12px -4px rgba(192,138,106,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(192,138,106,.45);
  --state-on-bg: #f0f5ee;
  --state-on-color: #688554;
  --state-on-border: #d9e5d4;
  --state-off-bg: #f1f4ef;
  --state-off-color: #74816c;
  --state-off-border: #e3e9e0;
  --badge-role-bg: #f0f5ee;
  --badge-role-color: #688554;
  --badge-role-border: #d9e5d4;
  --badge-on-bg: #f1f6f2;
  --badge-on-color: #5f8a6f;
  --badge-on-border: #d6e6da;
  --badge-off-bg: #f8f1ea;
  --badge-off-color: #a87450;
  --badge-off-border: #ecdfcf;
  --badge-pending-bg: #f8f4ea;
  --badge-pending-color: #b08a4a;
  --badge-pending-border: #ecdfc2;
  --badge-lv-bg: #f8f1ea;
  --badge-lv-color: #b57a52;
  --badge-lv-border: #ecddcf;
  --badge-danger-bg: #f8f1f1;
  --badge-danger-color: #b45c5c;
  --badge-danger-border: #ecd8d8;
  --nav-hover-bg: #f2f5f1;
  --nav-hover-color: #7d9b6a;
  --nav-danger: #c08a6a;
  --nav-danger-hover-bg: #f8f1ea;
  --nav-danger-hover-color: #a87252;
  --pulse-on-color: rgba(125,155,106,.5);
  --pulse-off-color: rgba(192,138,106,.5);
  --primary-rgb: 125, 155, 106;
  --primary-soft: #f0f5ee;
  --on-primary: #ffffff;
  --success: #5f8a6f;
  --success-hover: #547962;
  --success-soft: #f1f6f2;
  --on-success: #ffffff;
  --warning: #b08a4a;
  --warning-hover: #9b7941;
  --warning-soft: #f8f4ea;
  --on-warning: #ffffff;
  --danger-soft: #f8f1f1;
  --on-danger: #ffffff;
  --info: #688554;
  --info-hover: #5c754a;
  --info-soft: #f0f5ee;
  --on-info: #ffffff;
  --secondary: #74816c;
  --secondary-hover: #66725f;
  --secondary-soft: #f1f4ef;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b3bbae;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(125, 155, 106, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #eef2ec;
  --table-stripe: #fafcfa;
  --link: #7d9b6a;
  --link-hover: #688554;
  --sidebar-bg: #394942;
  --sidebar-2: #4d5b55;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #596660;
  --sidebar-active: #90aa80;
  --sidebar-acc: #4d5b55;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #8aa579;
  --navbar-text: #708c5f;
  --navbar-border: #aabe9e;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(49,58,46,.04), 0 8px 24px -12px rgba(49,58,46,.08);
  --shadow-lg: 0 2px 6px rgba(49,58,46,.05), 0 12px 28px -12px rgba(49,58,46,.1);
  --gradient: linear-gradient(135deg, #7d9b6a 0%, #688554 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 34. 暖砂米 */
[data-theme="sand"] {
  --bg: #f7f4ee;
  --text: #3f382c;
  --text-muted: #887f6e;
  --card-bg: #ffffff;
  --card-border: #ece5d8;
  --card-shadow: 0 1px 3px rgba(63,56,44,.04), 0 8px 24px -12px rgba(63,56,44,.08);
  --card-shadow-hover: 0 2px 6px rgba(63,56,44,.05), 0 12px 28px -12px rgba(63,56,44,.1);
  --unit-bg: #fbf9f4;
  --unit-border: #f2ebde;
  --primary: #a38b5c;
  --primary-hover: #8d7548;
  --primary-shadow: 0 4px 12px -4px rgba(163,139,92,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(163,139,92,.45);
  --danger: #b57a63;
  --danger-hover: #9d624c;
  --danger-shadow: 0 4px 12px -4px rgba(181,122,99,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(181,122,99,.45);
  --state-on-bg: #f5f1e8;
  --state-on-color: #8d7548;
  --state-on-border: #e7dcc4;
  --state-off-bg: #f3f1eb;
  --state-off-color: #887f6e;
  --state-off-border: #e8e2d6;
  --badge-role-bg: #f5f1e8;
  --badge-role-color: #8d7548;
  --badge-role-border: #e7dcc4;
  --badge-on-bg: #f1f5f0;
  --badge-on-color: #61825f;
  --badge-on-border: #d8e4d7;
  --badge-off-bg: #f8f1f1;
  --badge-off-color: #a96363;
  --badge-off-border: #ecdbdb;
  --badge-pending-bg: #f8f4ea;
  --badge-pending-color: #b08a4a;
  --badge-pending-border: #ecdfc2;
  --badge-lv-bg: #f8f1ea;
  --badge-lv-color: #b57a52;
  --badge-lv-border: #ecddcf;
  --badge-danger-bg: #f8f1f1;
  --badge-danger-color: #b45c5c;
  --badge-danger-border: #ecd8d8;
  --nav-hover-bg: #f7f4ee;
  --nav-hover-color: #a38b5c;
  --nav-danger: #b57a63;
  --nav-danger-hover-bg: #f8f1f1;
  --nav-danger-hover-color: #9d624c;
  --pulse-on-color: rgba(163,139,92,.5);
  --pulse-off-color: rgba(181,122,99,.5);
  --primary-rgb: 163, 139, 92;
  --primary-soft: #f5f1e8;
  --on-primary: #ffffff;
  --success: #61825f;
  --success-hover: #557254;
  --success-soft: #f1f5f0;
  --on-success: #ffffff;
  --warning: #b08a4a;
  --warning-hover: #9b7941;
  --warning-soft: #f8f4ea;
  --on-warning: #ffffff;
  --danger-soft: #f8f1f1;
  --on-danger: #ffffff;
  --info: #8d7548;
  --info-hover: #7c673f;
  --info-soft: #f5f1e8;
  --on-info: #ffffff;
  --secondary: #887f6e;
  --secondary-hover: #787061;
  --secondary-soft: #f3f1eb;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #c0baae;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(163, 139, 92, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f4f0e6;
  --table-stripe: #fcfbf8;
  --link: #a38b5c;
  --link-hover: #8d7548;
  --sidebar-bg: #47433d;
  --sidebar-2: #595650;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #64615c;
  --sidebar-active: #b19c74;
  --sidebar-acc: #595650;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #ac976c;
  --navbar-text: #937d53;
  --navbar-border: #c3b495;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(63,56,44,.04), 0 8px 24px -12px rgba(63,56,44,.08);
  --shadow-lg: 0 2px 6px rgba(63,56,44,.05), 0 12px 28px -12px rgba(63,56,44,.1);
  --gradient: linear-gradient(135deg, #a38b5c 0%, #8d7548 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 35. 静谧青灰 */
[data-theme="mist-teal"] {
  --bg: #f0f4f3;
  --text: #2e3c3a;
  --text-muted: #6d7f7c;
  --card-bg: #ffffff;
  --card-border: #dfe8e6;
  --card-shadow: 0 1px 3px rgba(46,60,58,.04), 0 8px 24px -12px rgba(46,60,58,.08);
  --card-shadow-hover: 0 2px 6px rgba(46,60,58,.05), 0 12px 28px -12px rgba(46,60,58,.1);
  --unit-bg: #f7faf9;
  --unit-border: #e7efed;
  --primary: #6f938c;
  --primary-hover: #5c7d76;
  --primary-shadow: 0 4px 12px -4px rgba(111,147,140,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(111,147,140,.45);
  --danger: #b87e7e;
  --danger-hover: #a36565;
  --danger-shadow: 0 4px 12px -4px rgba(184,126,126,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(184,126,126,.45);
  --state-on-bg: #eff4f2;
  --state-on-color: #5c7d76;
  --state-on-border: #d5e2df;
  --state-off-bg: #f0f3f2;
  --state-off-color: #6d7f7c;
  --state-off-border: #e2e9e7;
  --badge-role-bg: #eff4f2;
  --badge-role-color: #5c7d76;
  --badge-role-border: #d5e2df;
  --badge-on-bg: #f1f6f2;
  --badge-on-color: #5f8a6f;
  --badge-on-border: #d6e6da;
  --badge-off-bg: #f8f1f1;
  --badge-off-color: #a96363;
  --badge-off-border: #ecdbdb;
  --badge-pending-bg: #f8f4ea;
  --badge-pending-color: #b08a4a;
  --badge-pending-border: #ecdfc2;
  --badge-lv-bg: #f8f1ea;
  --badge-lv-color: #b57a52;
  --badge-lv-border: #ecddcf;
  --badge-danger-bg: #f8f1f1;
  --badge-danger-color: #b45c5c;
  --badge-danger-border: #ecd8d8;
  --nav-hover-bg: #f0f4f3;
  --nav-hover-color: #6f938c;
  --nav-danger: #b87e7e;
  --nav-danger-hover-bg: #f8f1f1;
  --nav-danger-hover-color: #a36565;
  --pulse-on-color: rgba(111,147,140,.5);
  --pulse-off-color: rgba(184,126,126,.5);
  --primary-rgb: 111, 147, 140;
  --primary-soft: #eff4f2;
  --on-primary: #ffffff;
  --success: #5f8a6f;
  --success-hover: #547962;
  --success-soft: #f1f6f2;
  --on-success: #ffffff;
  --warning: #b08a4a;
  --warning-hover: #9b7941;
  --warning-soft: #f8f4ea;
  --on-warning: #ffffff;
  --danger-soft: #f8f1f1;
  --on-danger: #ffffff;
  --info: #5c7d76;
  --info-hover: #516e68;
  --info-soft: #eff4f2;
  --on-info: #ffffff;
  --secondary: #6d7f7c;
  --secondary-hover: #60706d;
  --secondary-soft: #f0f3f2;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #aebab8;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(111, 147, 140, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #ecf2f0;
  --table-stripe: #fafcfb;
  --link: #6f938c;
  --link-hover: #5c7d76;
  --sidebar-bg: #33464f;
  --sidebar-2: #475861;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #54646b;
  --sidebar-active: #85a39d;
  --sidebar-acc: #475861;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #7d9e98;
  --navbar-text: #64847e;
  --navbar-border: #a1b9b4;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(46,60,58,.04), 0 8px 24px -12px rgba(46,60,58,.08);
  --shadow-lg: 0 2px 6px rgba(46,60,58,.05), 0 12px 28px -12px rgba(46,60,58,.1);
  --gradient: linear-gradient(135deg, #6f938c 0%, #5c7d76 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 36. 淡雾藕荷 */
[data-theme="mist-lilac"] {
  --bg: #f4f1f5;
  --text: #37303e;
  --text-muted: #7d7286;
  --card-bg: #ffffff;
  --card-border: #e6e0ea;
  --card-shadow: 0 1px 3px rgba(55,48,62,.04), 0 8px 24px -12px rgba(55,48,62,.08);
  --card-shadow-hover: 0 2px 6px rgba(55,48,62,.05), 0 12px 28px -12px rgba(55,48,62,.1);
  --unit-bg: #faf8fb;
  --unit-border: #eee9f1;
  --primary: #8d7aa3;
  --primary-hover: #78668f;
  --primary-shadow: 0 4px 12px -4px rgba(141,122,163,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(141,122,163,.45);
  --danger: #b87e8a;
  --danger-hover: #a36571;
  --danger-shadow: 0 4px 12px -4px rgba(184,126,138,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(184,126,138,.45);
  --state-on-bg: #f3eff5;
  --state-on-color: #78668f;
  --state-on-border: #ded4e6;
  --state-off-bg: #f2f0f3;
  --state-off-color: #7d7286;
  --state-off-border: #e5e0e8;
  --badge-role-bg: #f3eff5;
  --badge-role-color: #78668f;
  --badge-role-border: #ded4e6;
  --badge-on-bg: #f1f6f2;
  --badge-on-color: #5f8a6f;
  --badge-on-border: #d6e6da;
  --badge-off-bg: #f8f1f1;
  --badge-off-color: #a96363;
  --badge-off-border: #ecdbdb;
  --badge-pending-bg: #f8f4ea;
  --badge-pending-color: #b08a4a;
  --badge-pending-border: #ecdfc2;
  --badge-lv-bg: #f8f1ea;
  --badge-lv-color: #b57a52;
  --badge-lv-border: #ecddcf;
  --badge-danger-bg: #f8f1f1;
  --badge-danger-color: #b45c5c;
  --badge-danger-border: #ecd8d8;
  --nav-hover-bg: #f4f1f5;
  --nav-hover-color: #8d7aa3;
  --nav-danger: #b87e8a;
  --nav-danger-hover-bg: #f8f1f1;
  --nav-danger-hover-color: #a36571;
  --pulse-on-color: rgba(141,122,163,.5);
  --pulse-off-color: rgba(184,126,138,.5);
  --primary-rgb: 141, 122, 163;
  --primary-soft: #f3eff5;
  --on-primary: #ffffff;
  --success: #5f8a6f;
  --success-hover: #547962;
  --success-soft: #f1f6f2;
  --on-success: #ffffff;
  --warning: #b08a4a;
  --warning-hover: #9b7941;
  --warning-soft: #f8f4ea;
  --on-warning: #ffffff;
  --danger-soft: #f8f1f1;
  --on-danger: #ffffff;
  --info: #78668f;
  --info-hover: #6a5a7e;
  --info-soft: #f3eff5;
  --on-info: #ffffff;
  --secondary: #7d7286;
  --secondary-hover: #6e6476;
  --secondary-soft: #f2f0f3;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #b8b2be;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(141, 122, 163, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f1edf3;
  --table-stripe: #fcfafc;
  --link: #8d7aa3;
  --link-hover: #78668f;
  --sidebar-bg: #3f3d58;
  --sidebar-2: #525069;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #5e5c73;
  --sidebar-active: #9e8eb1;
  --sidebar-acc: #525069;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #9887ac;
  --navbar-text: #7f6e93;
  --navbar-border: #b5a9c3;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(55,48,62,.04), 0 8px 24px -12px rgba(55,48,62,.08);
  --shadow-lg: 0 2px 6px rgba(55,48,62,.05), 0 12px 28px -12px rgba(55,48,62,.1);
  --gradient: linear-gradient(135deg, #8d7aa3 0%, #78668f 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 37. 柔和米杏 */
[data-theme="apricot"] {
  --bg: #f8f4f0;
  --text: #40372e;
  --text-muted: #8a7d70;
  --card-bg: #ffffff;
  --card-border: #ede5db;
  --card-shadow: 0 1px 3px rgba(64,55,46,.04), 0 8px 24px -12px rgba(64,55,46,.08);
  --card-shadow-hover: 0 2px 6px rgba(64,55,46,.05), 0 12px 28px -12px rgba(64,55,46,.1);
  --unit-bg: #fbf8f4;
  --unit-border: #f2ebe1;
  --primary: #a8886b;
  --primary-hover: #8f7154;
  --primary-shadow: 0 4px 12px -4px rgba(168,136,107,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(168,136,107,.45);
  --danger: #b77c6a;
  --danger-hover: #9f6453;
  --danger-shadow: 0 4px 12px -4px rgba(183,124,106,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(183,124,106,.45);
  --state-on-bg: #f5f0ea;
  --state-on-color: #8f7154;
  --state-on-border: #e6dbcd;
  --state-off-bg: #f3f0ec;
  --state-off-color: #8a7d70;
  --state-off-border: #e8e1d7;
  --badge-role-bg: #f5f0ea;
  --badge-role-color: #8f7154;
  --badge-role-border: #e6dbcd;
  --badge-on-bg: #f1f6f2;
  --badge-on-color: #5f8a6f;
  --badge-on-border: #d6e6da;
  --badge-off-bg: #f8f1f1;
  --badge-off-color: #a96363;
  --badge-off-border: #ecdbdb;
  --badge-pending-bg: #f8f4ea;
  --badge-pending-color: #b08a4a;
  --badge-pending-border: #ecdfc2;
  --badge-lv-bg: #f8f1ea;
  --badge-lv-color: #b57a52;
  --badge-lv-border: #ecddcf;
  --badge-danger-bg: #f8f1f1;
  --badge-danger-color: #b45c5c;
  --badge-danger-border: #ecd8d8;
  --nav-hover-bg: #f8f4f0;
  --nav-hover-color: #a8886b;
  --nav-danger: #b77c6a;
  --nav-danger-hover-bg: #f8f1f1;
  --nav-danger-hover-color: #9f6453;
  --pulse-on-color: rgba(168,136,107,.5);
  --pulse-off-color: rgba(183,124,106,.5);
  --primary-rgb: 168, 136, 107;
  --primary-soft: #f5f0ea;
  --on-primary: #ffffff;
  --success: #5f8a6f;
  --success-hover: #547962;
  --success-soft: #f1f6f2;
  --on-success: #ffffff;
  --warning: #b08a4a;
  --warning-hover: #9b7941;
  --warning-soft: #f8f4ea;
  --on-warning: #ffffff;
  --danger-soft: #f8f1f1;
  --on-danger: #ffffff;
  --info: #8f7154;
  --info-hover: #7e634a;
  --info-soft: #f5f0ea;
  --on-info: #ffffff;
  --secondary: #8a7d70;
  --secondary-hover: #796e63;
  --secondary-soft: #f3f0ec;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #c1b8b0;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(168, 136, 107, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f5f0e8;
  --table-stripe: #fcfaf8;
  --link: #a8886b;
  --link-hover: #8f7154;
  --sidebar-bg: #494243;
  --sidebar-2: #5b5556;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #666061;
  --sidebar-active: #b59a81;
  --sidebar-acc: #5b5556;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #b1947a;
  --navbar-text: #977a60;
  --navbar-border: #c6b29f;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(64,55,46,.04), 0 8px 24px -12px rgba(64,55,46,.08);
  --shadow-lg: 0 2px 6px rgba(64,55,46,.05), 0 12px 28px -12px rgba(64,55,46,.1);
  --gradient: linear-gradient(135deg, #a8886b 0%, #8f7154 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 38. 淡影湖蓝 */
[data-theme="mist-blue"] {
  --bg: #eef3f6;
  --text: #2c3a44;
  --text-muted: #6b7c88;
  --card-bg: #ffffff;
  --card-border: #dde6eb;
  --card-shadow: 0 1px 3px rgba(44,58,68,.04), 0 8px 24px -12px rgba(44,58,68,.08);
  --card-shadow-hover: 0 2px 6px rgba(44,58,68,.05), 0 12px 28px -12px rgba(44,58,68,.1);
  --unit-bg: #f6fafb;
  --unit-border: #e4eef2;
  --primary: #6f8fa3;
  --primary-hover: #5a7a8e;
  --primary-shadow: 0 4px 12px -4px rgba(111,143,163,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(111,143,163,.45);
  --danger: #b87d7d;
  --danger-hover: #a36565;
  --danger-shadow: 0 4px 12px -4px rgba(184,125,125,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(184,125,125,.45);
  --state-on-bg: #eff4f7;
  --state-on-color: #5a7a8e;
  --state-on-border: #d5e2e9;
  --state-off-bg: #f0f4f6;
  --state-off-color: #6b7c88;
  --state-off-border: #e2e9ed;
  --badge-role-bg: #eff4f7;
  --badge-role-color: #5a7a8e;
  --badge-role-border: #d5e2e9;
  --badge-on-bg: #f1f6f2;
  --badge-on-color: #5f8a6f;
  --badge-on-border: #d6e6da;
  --badge-off-bg: #f8f1f1;
  --badge-off-color: #a96363;
  --badge-off-border: #ecdbdb;
  --badge-pending-bg: #f8f4ea;
  --badge-pending-color: #b08a4a;
  --badge-pending-border: #ecdfc2;
  --badge-lv-bg: #f8f1ea;
  --badge-lv-color: #b57a52;
  --badge-lv-border: #ecddcf;
  --badge-danger-bg: #f8f1f1;
  --badge-danger-color: #b45c5c;
  --badge-danger-border: #ecd8d8;
  --nav-hover-bg: #eef3f6;
  --nav-hover-color: #6f8fa3;
  --nav-danger: #b87d7d;
  --nav-danger-hover-bg: #f8f1f1;
  --nav-danger-hover-color: #a36565;
  --pulse-on-color: rgba(111,143,163,.5);
  --pulse-off-color: rgba(184,125,125,.5);
  --primary-rgb: 111, 143, 163;
  --primary-soft: #eff4f7;
  --on-primary: #ffffff;
  --success: #5f8a6f;
  --success-hover: #547962;
  --success-soft: #f1f6f2;
  --on-success: #ffffff;
  --warning: #b08a4a;
  --warning-hover: #9b7941;
  --warning-soft: #f8f4ea;
  --on-warning: #ffffff;
  --danger-soft: #f8f1f1;
  --on-danger: #ffffff;
  --info: #5a7a8e;
  --info-hover: #4f6b7d;
  --info-soft: #eff4f7;
  --on-info: #ffffff;
  --secondary: #6b7c88;
  --secondary-hover: #5e6d78;
  --secondary-soft: #f0f4f6;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #acb8bf;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(111, 143, 163, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #e9f0f4;
  --table-stripe: #f9fcfc;
  --link: #6f8fa3;
  --link-hover: #5a7a8e;
  --sidebar-bg: #334558;
  --sidebar-2: #475869;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #546373;
  --sidebar-active: #85a0b1;
  --sidebar-acc: #475869;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #7d9aac;
  --navbar-text: #648193;
  --navbar-border: #a1b6c3;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(44,58,68,.04), 0 8px 24px -12px rgba(44,58,68,.08);
  --shadow-lg: 0 2px 6px rgba(44,58,68,.05), 0 12px 28px -12px rgba(44,58,68,.1);
  --gradient: linear-gradient(135deg, #6f8fa3 0%, #5a7a8e 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 39. 柔和玫瑰灰 */
[data-theme="dusty-rose"] {
  --bg: #f6f1f2;
  --text: #453439;
  --text-muted: #8c757b;
  --card-bg: #ffffff;
  --card-border: #ece1e4;
  --card-shadow: 0 1px 3px rgba(69,52,57,.04), 0 8px 24px -12px rgba(69,52,57,.08);
  --card-shadow-hover: 0 2px 6px rgba(69,52,57,.05), 0 12px 28px -12px rgba(69,52,57,.1);
  --unit-bg: #fbf7f8;
  --unit-border: #f2e8eb;
  --primary: #a3788a;
  --primary-hover: #8d6476;
  --primary-shadow: 0 4px 12px -4px rgba(163,120,138,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(163,120,138,.45);
  --danger: #b4737a;
  --danger-hover: #9c5c63;
  --danger-shadow: 0 4px 12px -4px rgba(180,115,122,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(180,115,122,.45);
  --state-on-bg: #f4edf0;
  --state-on-color: #8d6476;
  --state-on-border: #e4d5db;
  --state-off-bg: #f3f0f1;
  --state-off-color: #8c757b;
  --state-off-border: #e8e0e2;
  --badge-role-bg: #f4edf0;
  --badge-role-color: #8d6476;
  --badge-role-border: #e4d5db;
  --badge-on-bg: #f1f6f2;
  --badge-on-color: #5f8a6f;
  --badge-on-border: #d6e6da;
  --badge-off-bg: #f8f1f1;
  --badge-off-color: #a96363;
  --badge-off-border: #ecdbdb;
  --badge-pending-bg: #f8f4ea;
  --badge-pending-color: #b08a4a;
  --badge-pending-border: #ecdfc2;
  --badge-lv-bg: #f8f1ea;
  --badge-lv-color: #b57a52;
  --badge-lv-border: #ecddcf;
  --badge-danger-bg: #f8f1f1;
  --badge-danger-color: #b45c5c;
  --badge-danger-border: #ecd8d8;
  --nav-hover-bg: #f6f1f2;
  --nav-hover-color: #a3788a;
  --nav-danger: #b4737a;
  --nav-danger-hover-bg: #f8f1f1;
  --nav-danger-hover-color: #9c5c63;
  --pulse-on-color: rgba(163,120,138,.5);
  --pulse-off-color: rgba(180,115,122,.5);
  --primary-rgb: 163, 120, 138;
  --primary-soft: #f4edf0;
  --on-primary: #ffffff;
  --success: #5f8a6f;
  --success-hover: #547962;
  --success-soft: #f1f6f2;
  --on-success: #ffffff;
  --warning: #b08a4a;
  --warning-hover: #9b7941;
  --warning-soft: #f8f4ea;
  --on-warning: #ffffff;
  --danger-soft: #f8f1f1;
  --on-danger: #ffffff;
  --info: #8d6476;
  --info-hover: #7c5868;
  --info-soft: #f4edf0;
  --on-info: #ffffff;
  --secondary: #8c757b;
  --secondary-hover: #7b676c;
  --secondary-soft: #f3f0f1;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #c1b3b6;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(163, 120, 138, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #f4ecee;
  --table-stripe: #fcfafa;
  --link: #a3788a;
  --link-hover: #8d6476;
  --sidebar-bg: #473c4e;
  --sidebar-2: #595060;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #645b6a;
  --sidebar-active: #b18c9c;
  --sidebar-acc: #595060;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #ac8696;
  --navbar-text: #936c7c;
  --navbar-border: #c3a7b3;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(69,52,57,.04), 0 8px 24px -12px rgba(69,52,57,.08);
  --shadow-lg: 0 2px 6px rgba(69,52,57,.05), 0 12px 28px -12px rgba(69,52,57,.1);
  --gradient: linear-gradient(135deg, #a3788a 0%, #8d6476 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* 40. 朦胧青蓝 */
[data-theme="hazy-teal"] {
  --bg: #eff4f4;
  --text: #2c3b3b;
  --text-muted: #6b7d7d;
  --card-bg: #ffffff;
  --card-border: #dee8e8;
  --card-shadow: 0 1px 3px rgba(44,59,59,.04), 0 8px 24px -12px rgba(44,59,59,.08);
  --card-shadow-hover: 0 2px 6px rgba(44,59,59,.05), 0 12px 28px -12px rgba(44,59,59,.1);
  --unit-bg: #f6fbfb;
  --unit-border: #e4eeee;
  --primary: #6f9295;
  --primary-hover: #5a7d80;
  --primary-shadow: 0 4px 12px -4px rgba(111,146,149,.35);
  --primary-shadow-hover: 0 6px 18px -6px rgba(111,146,149,.45);
  --danger: #b87d84;
  --danger-hover: #a3656c;
  --danger-shadow: 0 4px 12px -4px rgba(184,125,132,.35);
  --danger-shadow-hover: 0 6px 18px -6px rgba(184,125,132,.45);
  --state-on-bg: #eff4f4;
  --state-on-color: #5a7d80;
  --state-on-border: #d5e2e3;
  --state-off-bg: #f0f4f4;
  --state-off-color: #6b7d7d;
  --state-off-border: #e2e9e9;
  --badge-role-bg: #eff4f4;
  --badge-role-color: #5a7d80;
  --badge-role-border: #d5e2e3;
  --badge-on-bg: #f1f6f2;
  --badge-on-color: #5f8a6f;
  --badge-on-border: #d6e6da;
  --badge-off-bg: #f8f1f2;
  --badge-off-color: #a9636a;
  --badge-off-border: #ecdbdd;
  --badge-pending-bg: #f8f4ea;
  --badge-pending-color: #b08a4a;
  --badge-pending-border: #ecdfc2;
  --badge-lv-bg: #f8f1ea;
  --badge-lv-color: #b57a52;
  --badge-lv-border: #ecddcf;
  --badge-danger-bg: #f8f1f1;
  --badge-danger-color: #b45c5c;
  --badge-danger-border: #ecd8d8;
  --nav-hover-bg: #eff4f4;
  --nav-hover-color: #6f9295;
  --nav-danger: #b87d84;
  --nav-danger-hover-bg: #f8f1f2;
  --nav-danger-hover-color: #a3656c;
  --pulse-on-color: rgba(111,146,149,.5);
  --pulse-off-color: rgba(184,125,132,.5);
  --primary-rgb: 111, 146, 149;
  --primary-soft: #eff4f4;
  --on-primary: #ffffff;
  --success: #5f8a6f;
  --success-hover: #547962;
  --success-soft: #f1f6f2;
  --on-success: #ffffff;
  --warning: #b08a4a;
  --warning-hover: #9b7941;
  --warning-soft: #f8f4ea;
  --on-warning: #ffffff;
  --danger-soft: #f8f1f1;
  --on-danger: #ffffff;
  --info: #5a7d80;
  --info-hover: #4f6e71;
  --info-soft: #eff4f4;
  --on-info: #ffffff;
  --secondary: #6b7d7d;
  --secondary-hover: #5e6e6e;
  --secondary-soft: #f0f4f4;
  --on-secondary: #ffffff;
  --bg-soft: var(--unit-bg);
  --text-2: var(--text-muted);
  --text-3: #adb8b8;
  --heading: var(--text);
  --border: var(--unit-border);
  --input-bg: #ffffff;
  --input-border: var(--unit-border);
  --input-focus: rgba(111, 146, 149, 0.18);
  --table-head-bg: var(--unit-bg);
  --table-border: #eaf1f1;
  --table-stripe: #f9fcfc;
  --link: #6f9295;
  --link-hover: #5a7d80;
  --sidebar-bg: #334653;
  --sidebar-2: #475864;
  --sidebar-text: #e2e8f0;
  --sidebar-sub: #94a3b8;
  --sidebar-hover: #54646f;
  --sidebar-active: #85a2a5;
  --sidebar-acc: #475864;
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --header-bg: #ffffff;
  --header-text: var(--text);
  --header-border: var(--border);
  --navbar-bg: #7d9da0;
  --navbar-text: #648386;
  --navbar-border: #a1b8ba;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 3px rgba(44,59,59,.04), 0 8px 24px -12px rgba(44,59,59,.08);
  --shadow-lg: 0 2px 6px rgba(44,59,59,.05), 0 12px 28px -12px rgba(44,59,59,.1);
  --gradient: linear-gradient(135deg, #6f9295 0%, #5a7d80 100%);
  --btn-radius: 8px;
  --mask-bg: rgba(0, 0, 0, 0.5);
  --gray: var(--text-2);
  --light: var(--bg-soft);
  --primary-light: var(--primary-soft);
  --success-light: var(--success-soft);
  --warning-light: var(--warning-soft);
  --danger-light: var(--danger-soft);
  --info-light: var(--info-soft);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --body: var(--bg);
  --card: var(--card-bg);
}

/* --------------------------------------------------------------------------
   3) 主题切换按钮 + 选择面板
   -------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------
   3) 主题切换按钮 + 选择面板
   -------------------------------------------------------------------------- */
.theme-switch-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  flex-shrink: 0;
  background: transparent;
  color: var(--sidebar-text);
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 18px;
  cursor: pointer;
  transition: all 0.2s ease;
  position: relative;
}
.theme-switch-btn:hover {
  background: var(--sidebar-hover);
  transform: translateY(-1px);
}

/* 登录页等无侧栏页面使用悬浮按钮 */
.theme-switch-btn.float {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 99999;
  background: transparent;
  color: var(--primary);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}
.theme-switch-btn.float:hover {
  color: var(--primary);
  background: var(--primary-soft);
}

/* 面板遮罩 */
.theme-panel-mask {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 99998;
  opacity: 0;
  visibility: hidden;
  transition: 0.25s;
}
.theme-panel-mask.show {
  opacity: 1;
  visibility: visible;
}

/* 面板本体 */
.theme-panel {
  position: fixed;
  top: 60px;
  right: 16px;
  z-index: 99999;
  width: 340px;
  max-width: calc(100vw - 24px);
  max-height: calc(100vh - 90px);
  overflow-y: auto;
  background: var(--card-bg);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.18);
  padding: 16px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px) scale(0.98);
  transition: 0.25s;
  transform-origin: top right;
}
.theme-panel.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.theme-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}
.theme-panel-header h4 {
  margin: 0;
  font-size: 15px;
  color: var(--text);
  display: flex;
  align-items: center;
  gap: 8px;
}
.theme-panel-close {
  background: none;
  border: none;
  font-size: 18px;
  color: var(--text-2);
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 6px;
  transition: 0.2s;
}
.theme-panel-close:hover {
  background: var(--bg-soft);
  color: var(--danger);
}

.theme-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.theme-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1.5px solid var(--border);
  border-radius: 10px;
  background: var(--card-bg);
  cursor: pointer;
  transition: 0.2s;
  text-align: left;
  width: 100%;
}
.theme-item:hover {
  border-color: var(--primary);
  transform: translateY(-1px);
  box-shadow: var(--shadow);
}
.theme-item.active {
  border-color: var(--primary);
  background: var(--primary-soft);
  box-shadow: 0 0 0 1px var(--primary) inset;
}
.theme-swatches {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex-shrink: 0;
}
.theme-swatches .sw-row {
  display: flex;
  gap: 3px;
}
.theme-swatches .sw {
  width: 14px;
  height: 14px;
  border-radius: 4px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  display: inline-block;
}
.theme-item .t-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  line-height: 1.3;
}
.theme-item .t-desc {
  font-size: 11px;
  color: var(--text-3);
  line-height: 1.3;
}
.theme-item .t-check {
  margin-left: auto;
  font-size: 15px;
  color: var(--primary);
  opacity: 0;
}
.theme-item.active .t-check {
  opacity: 1;
}

/* 移动端：面板改为底部弹出 */
@media (max-width: 640px) {
  .theme-panel {
    top: auto;
    left: 8px;
    right: 8px;
    bottom: 8px;
    width: auto;
    max-height: 70vh;
    transform: translateY(20px);
    border-radius: 16px;
  }
  .theme-panel.show {
    transform: translateY(0);
  }
  .theme-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}