:root {
  /* 全局滚动条轨道背景（Webkit 浏览器，整站通用） */
  --scrollbar-track-bg: #2d3748; /* ::-webkit-scrollbar-track 背景 */
  /* 全局滚动条滑块背景（Webkit 浏览器，整站通用） */
  --scrollbar-thumb-bg: #4a5568; /* ::-webkit-scrollbar-thumb 背景 */
  /* 全局滚动条滑块 hover 背景（Webkit 浏览器，整站通用） */
  --scrollbar-thumb-hover-bg: #718096; /* ::-webkit-scrollbar-thumb:hover 背景 */

  /* 全局滚动条颜色（Firefox）：第一个为滑块，第二个为轨道（整站通用） */
  --firefox-scrollbar-thumb-color: #4a5568; /* scrollbar-color 滑块颜色 */
  --firefox-scrollbar-track-color: #2d3748; /* scrollbar-color 轨道颜色 */

  /* 左侧参数区与其他卡片的占位背景（深灰），用于 .placeholder-bg */
  --placeholder-bg-color: #1f2937; /* .placeholder-bg 背景色 */

  /* 模糊背景层（所有使用 .backdrop-blur-sm 的容器，在 Safari 下的覆盖层强度） */
  --safari-backdrop-overlay-strong: rgba(55,65,81,0.85); /* .safari-browser .backdrop-blur-sm */
  /* 模糊背景层回退（不支持 backdrop-filter 的浏览器，Safari 条件下） */
  --safari-backdrop-overlay: rgba(55,65,81,0.8);       /* @supports not (...) 的回退层 */
  /* 模糊背景层更浅覆盖（Safari 特定修复情形） */
  --safari-backdrop-overlay-light: rgba(55,65,81,0.6); /* Safari 特定修复 */

  /* 选择框箭头颜色（左侧参数区：模型选择 #model-select 与清晰度选择 #size-preset 的下拉箭头，Safari） */
  --safari-select-chevron-color: #cbd5e1; /* 两个选择框箭头线颜色 */
  /* 选择框右侧竖线颜色（左侧参数区：模型选择 #model-select 与清晰度选择 #size-preset，Safari） */
  --safari-select-divider-color: #cbd5e1; /* 两个选择框右侧分隔线颜色 */

  /* 删除按钮（左侧参数区各上传预览卡片右上角通用 .delete-btn） */
  --delete-btn-bg: #ef4444;            /* .delete-btn 按钮背景色（圆形 × 按钮） */
  --delete-btn-hover-bg: #dc2626;      /* .delete-btn:hover 悬停背景色 */
  --delete-btn-shadow: rgba(0,0,0,0.3);/* .delete-btn 阴影色 */
  --delete-btn-text-color: white;      /* .delete-btn 文本色（×） */
  --delete-btn-border-color: white;    /* .delete-btn 外边框色 */

  /* 比例 chip（左侧参数区尺寸模块内的 .ui-chip 通用样式） */
  --chip-bg: #4f46e5;                       /* .ui-chip 背景色（默认紫） */
  --chip-hover-bg: #6366f1;                 /* .ui-chip:hover 悬停背景色 */
  --chip-text-color: #fff;                   /* .ui-chip 文本颜色 */
  --chip-border-color: rgba(255,255,255,0.12); /* .ui-chip 边框色 */
  --chip-inner-shadow-color: rgba(0,0,0,0.2);  /* .ui-chip 内阴影色 */

  /* 比例图标（尺寸模块比例图标小方块 .ratio-icon） */
  --ratio-icon-bg: rgba(255,255,255,0.12);       /* .ratio-icon 背景色 */
  --ratio-icon-inner-border: rgba(255,255,255,0.8); /* .ratio-icon::after 内框边线色 */

  /* 宽高输入标签（左侧参数区尺寸模块 W/H 与单位 px） */
  --size-input-tag-color: #94a3b8;  /* .input-tag 左侧 W/H 标签颜色 */
  --size-input-unit-color: #94a3b8; /* .unit-tag 右侧单位 px 颜色 */
  --size-block-input-tag-color: #9aa0a6; /* #size-block 内专用 .input-tag 标签颜色 */

  /* 快捷比例按钮（左侧参数区尺寸模块 #ratio-group .ratio-btn.ui-chip） */
  --ratio-btn-bg: #4b5563;               /* 未选中背景（灰） */
  --ratio-btn-hover-bg: #6b7280;         /* 悬停背景 */
  --ratio-btn-active-bg: #4f46e5;        /* 选中背景（紫） */
  --ratio-btn-text-color: #fff;          /* 文本颜色 */
  --ratio-btn-border-color: rgba(255,255,255,0.08); /* 细边框颜色 */

  /* 左侧导航与卡片容器颜色变量 */
  --page-bg: #f7f7f8;                    /* 页面背景色 */
  --sidebar-bg: #ffffff;                 /* 左侧导航竖栏底色（白） */
  --sidebar-border: #e3e4e8;             /* 左侧导航竖栏右侧细分隔线 */
  --left-card-bg: #ffffff;               /* 左侧卡片背景色（白） */
  --left-card-border: #e3e4e8;           /* 左侧卡片边框色 */

  /* 功能按钮样式 */
  --function-btn-bg: #ffffff;            /* 默认背景：白 */
  --function-btn-text: #374151;          /* 默认文字：黑 */
  --function-btn-border: #ffffff;        /* 默认边框：白 */
  --function-btn-active-top: #d4e0ff;    /* 选中渐变顶部 */
  --function-btn-active-bottom: #ebf0ff; /* 选中渐变底部 */
  --function-btn-active-border: #8ba1e8; /* 选中边框 */
  --tab-inactive-bg: #efeff3;           /* 非选中 Tab 背景 */

  /* 汽车类背景融合悬浮提示箭头（#car-blend-hover-tip 容器伪元素） */
  --car-blend-tip-arrow-outline: #e3e4e8;         /* tip-down/up 外层箭头边色（浅灰） */
  --car-blend-tip-arrow-inner-down: #ffffff;      /* tip-down 内层面板色（浅色背景） */
  --car-blend-tip-arrow-outline-up: #e3e4e8;      /* tip-up 外层箭头边色（浅灰） */
  --car-blend-tip-arrow-inner-up: #ffffff;        /* tip-up 内层面板色（浅色背景） */

  /* 右侧备用模型结果条（#alt-results-strip）缩略图样式 */
  --alt-thumb-border: rgba(255,255,255,0.3);      /* 缩略图边框色 */
  --alt-thumb-bg: rgba(0,0,0,0.3);                 /* 缩略图背景色 */
  --alt-thumb-active-border: #6366f1;              /* 选中态边框色（紫） */
  --alt-thumb-active-shadow: rgba(99,102,241,0.4); /* 选中态外发光阴影 */

  /* 右侧批量生成结果列表（#logo-results-strip）缩略图样式 */
  --logo-thumb-border: #d6d6d6;     /* 缩略图边框色 */
  --logo-thumb-bg: #ffffff;                /* 缩略图背景色 */
  --logo-thumb-img-bg: #ffffff;           /* 缩略图内 img 的背景色（contain 时可见） */

  /* 缩略图右下角下载按钮（#logo-results-strip .dl-btn） */
  --logo-dl-btn-bg: rgba(31,41,55,0.85);          /* 按钮背景色（深灰半透明） */
  --logo-dl-btn-text: #fff;                        /* 按钮文字色 */
  --logo-dl-btn-border: rgba(255,255,255,0.25);   /* 按钮边框色 */
  --logo-dl-btn-hover-bg: #4f46e5;                 /* 按钮 hover 背景（紫） */

  /* 去水印批量结果（#remove-wm-results）缩略图样式 */
  --remove-wm-thumb-border: rgba(255,255,255,0.2); /* 缩略图边框色 */
  --remove-wm-thumb-bg: rgba(0,0,0,0.25);          /* 缩略图背景色 */
  --remove-wm-thumb-img-bg: rgba(0,0,0,0.15);      /* 缩略图内 img 背景色 */

  /* 主画布处理蒙层（#image-comparison-container 内的 #processing-overlay） */
  --processing-overlay-bg: rgba(31,41,55,0.88);    /* 深色蒙层背景 */

  /* 提示词输入框清除按钮（#prompt-container .prompt-clear-btn 左下角文字按钮） */
  --prompt-clear-btn-text: #fff;                   /* 清除按钮文字颜色 */

  /* 主加载器进度条（#loader-progress 与 #loader-progress-fill） */
  --loader-progress-bg: rgba(31,41,55,0.6);        /* 进度条容器背景 */
  --loader-progress-inset-shadow: rgba(79,70,229,0.15); /* 内阴影色（紫调） */
  --loader-progress-outline: rgba(255,255,255,0.06);    /* 外描边色（极浅白） */
  --loader-progress-fill-gradient: linear-gradient(90deg, #6366f1, #22d3ee, #6366f1); /* 填充渐变（紫-青-紫） */
  --loader-progress-fill-shadow-outer: rgba(99,102,241,0.6); /* 外发光阴影（紫） */
  --loader-progress-fill-shadow-inner: rgba(34,211,238,0.45); /* 内发光阴影（青） */
  --param-label-color: #9ca3af;
  --param-input-border-color: #4b5563;
  --param-input-bg: #111827;
  --param-input-text-color: #d1d5db;
  --range-track-bg: #374151;
  --range-thumb-bg: #2563eb;
  --range-thumb-border-color: #93c5fd;
  --focus-border-color: #4f46e5;
  --focus-shadow-color: rgba(79,70,229,0.25);

  /* 新功能徽标（功能按钮右侧 NEW 图标的底色） */
  --new-badge-bg: #ff4d4f; /* .function-btn .new-badge 背景色 */

  /* 功能分组标题颜色（“快捷工具/高级功能”） */
  --function-group-title-color: #808080; /* 左侧分组标题文字颜色 */
  --tabs-text-color: #111;              /* 顶部 Tabs 文本颜色 */

  /* 下拉框配色（模型选择与清晰度选择） */
  --select-border-color: #d6d6d6; /* 下拉框边框颜色 */
  --select-bg-top: #e7e7eb;       /* 下拉框背景渐变顶部颜色 */
  --select-bg-bottom: #efeff3;    /* 下拉框背景渐变底部颜色 */
}