/* 工作台外观设置：默认深色，浅色模式只覆盖颜色层级，不改变布局与交互。 */
:root {
  /* Design tokens：组件只消费语义颜色，主题切换仅替换这一层。 */
  --theme-bg: #0D0D0D;
  --theme-surface: #141414;
  --theme-surface-raised: #191919;
  --theme-surface-muted: #1A1A1A;
  --theme-surface-subtle: #202020;
  --theme-border: #2A2A2A;
  --theme-border-strong: #333333;
  --theme-divider: #2A2A2A;
  --theme-text: #E8E8E8;
  --theme-text-secondary: #A1A1AA;
  --theme-text-muted: #71717A;
  --theme-text-inverse: #FFFFFF;
  --theme-hover: rgba(255,255,255,.06);
  --theme-hover-strong: rgba(255,255,255,.10);
  --theme-selected: rgba(108,92,231,.14);
  --theme-selected-strong: rgba(108,92,231,.24);
  --theme-card: #141414;
  --theme-card-muted: #181818;
  --theme-input: #101010;
  --theme-overlay: rgba(0,0,0,.66);
  --theme-danger: #F87171;
  --theme-danger-soft: rgba(239,68,68,.10);
  --theme-success: #34D399;
  --theme-shadow: 0 18px 42px rgba(0,0,0,.42);
  --theme-scrollbar: #333333;
  --text-primary: #E8E8E8;
  --text-secondary: #A1A1AA;
  --text-dim: #71717A;
  --bg-dark: var(--theme-bg);
  --bg-card: var(--theme-surface);
  --border-color: var(--theme-border);
  --text-main: var(--theme-text);
  --text-muted: var(--theme-text-muted);
}

.workbench-settings {
  position: relative;
}

.workbench-settings-trigger {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  color: var(--text-muted);
  background: transparent;
  border: 1px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  transition: color .16s ease, background-color .16s ease, border-color .16s ease;
}

.workbench-settings-trigger iconify-icon {
  font-size: 22px;
}

.workbench-settings-trigger:hover,
.workbench-settings-trigger[aria-expanded="true"] {
  color: var(--text-main);
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.08);
}

.workbench-settings-trigger:focus-visible,
.theme-option:focus-visible {
  outline: 2px solid var(--brand-purple);
  outline-offset: 2px;
}

.settings-popover {
  position: absolute;
  z-index: 120;
  bottom: 48px;
  left: 0;
  width: 224px;
  padding: 8px;
  background: #191919;
  border: 1px solid #303030;
  border-radius: 12px;
  box-shadow: 0 16px 36px rgba(0,0,0,.36);
}

.settings-popover__header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 9px 10px;
  color: var(--text-main);
  font-size: 13px;
  font-weight: 600;
}

.settings-popover__header iconify-icon {
  color: var(--brand-purple);
  font-size: 16px;
}

.settings-popover__label {
  padding: 6px 9px 5px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 500;
}

.theme-options {
  display: grid;
  gap: 3px;
}

.theme-option {
  width: 100%;
  min-height: 36px;
  display: grid;
  grid-template-columns: 22px 1fr 16px;
  align-items: center;
  gap: 7px;
  padding: 0 9px;
  color: var(--text-muted);
  text-align: left;
  font-size: 13px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  transition: color .16s ease, background-color .16s ease, border-color .16s ease;
}

.theme-option__icon {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  border-radius: 6px;
  background: rgba(255,255,255,.05);
}

.theme-option__icon iconify-icon {
  font-size: 14px;
}

.theme-option__check {
  visibility: hidden;
  color: var(--brand-purple);
  font-size: 16px;
}

.theme-option:hover {
  color: var(--text-main);
  background: rgba(255,255,255,.06);
}

.theme-option.is-active {
  color: #EDE9FE;
  background: rgba(108,92,231,.14);
  border-color: rgba(108,92,231,.34);
}

.theme-option.is-active .theme-option__icon {
  color: #C4B5FD;
  background: rgba(108,92,231,.18);
}

.theme-option.is-active .theme-option__check {
  visibility: visible;
}

html[data-theme="light"] {
  --theme-bg: #F6F7FB;
  --theme-surface: #FFFFFF;
  --theme-surface-raised: #FFFFFF;
  --theme-surface-muted: #F4F6FA;
  --theme-surface-subtle: #EEF1F6;
  --theme-border: #DEE4EE;
  --theme-border-strong: #D4DCE8;
  --theme-divider: #E6EAF1;
  --theme-text: #202431;
  --theme-text-secondary: #596173;
  --theme-text-muted: #707786;
  --theme-text-inverse: #FFFFFF;
  --theme-hover: #F3F5FA;
  --theme-hover-strong: #EDEFF5;
  --theme-selected: #EEEAFF;
  --theme-selected-strong: #E4DFFF;
  --theme-card: #FFFFFF;
  --theme-card-muted: #F8FAFD;
  --theme-input: #FFFFFF;
  --theme-overlay: rgba(32,36,49,.42);
  --theme-danger: #D24D57;
  --theme-danger-soft: #FCEEEF;
  --theme-success: #12A66A;
  --theme-shadow: 0 18px 42px rgba(33,42,61,.14);
  --theme-scrollbar: #C8CEDA;
  --bg-dark: var(--theme-bg);
  --bg-card: var(--theme-surface);
  --border-color: var(--theme-border);
  --text-main: var(--theme-text);
  --text-muted: var(--theme-text-muted);
  --text-primary: var(--theme-text);
  --text-secondary: var(--theme-text-secondary);
  --text-dim: #858C9B;
}

html[data-theme="light"],
html[data-theme="light"] body {
  background: #F6F7FB;
  color: var(--text-main);
}

/* 页面骨架：背景、工作表面、次级表面分层，避免整页同一灰度。 */
html[data-theme="light"] header {
  background-color: #FFFFFF !important;
  border-color: #E3E7EF !important;
  box-shadow: 0 1px 0 rgba(31, 41, 55, .02);
}

html[data-theme="light"] aside {
  background-color: #FBFCFE !important;
  border-color: #E3E7EF !important;
}

html[data-theme="light"] main,
html[data-theme="light"] .workbench-page {
  background-color: #F6F7FB !important;
}

html[data-theme="light"] [class*="bg-[#0D0D0D]"],
html[data-theme="light"] [class*="bg-[#111]"],
html[data-theme="light"] [class*="bg-[#111111]"] {
  background-color: #F6F7FB !important;
}

html[data-theme="light"] [class*="bg-[#141414]"],
html[data-theme="light"] [class*="bg-[#151515]"],
html[data-theme="light"] [class*="bg-[#181818]"],
html[data-theme="light"] [class*="bg-[#191919]"],
html[data-theme="light"] [class*="bg-[#1A1A1A]"],
html[data-theme="light"] [class*="bg-[#1F1F1F]"],
html[data-theme="light"] [class*="bg-gray-800"] {
  background-color: #FFFFFF !important;
}

html[data-theme="light"] [class*="bg-[#252525]"],
html[data-theme="light"] [class*="bg-[#2A2A2A]"],
html[data-theme="light"] [class*="bg-[#303030]"] {
  background-color: #EEF1F6 !important;
}

html[data-theme="light"] [class*="border-[#2A2A2A]"],
html[data-theme="light"] [class*="border-[#303030]"],
html[data-theme="light"] [class*="border-[#333]"] {
  border-color: var(--border-color) !important;
}

html[data-theme="light"] [class*="text-white"] {
  color: var(--text-main) !important;
}

html[data-theme="light"] [class*="text-gray-400"],
html[data-theme="light"] [class*="text-gray-500"],
html[data-theme="light"] [class*="text-gray-600"] {
  color: var(--text-muted) !important;
}

html[data-theme="light"] [class*="bg-[#6C5CE7]"],
html[data-theme="light"] [class*="bg-[var(--brand-purple)]"] {
  color: #FFFFFF !important;
  background-color: var(--brand-purple) !important;
}

/* 工作台主体容器 */
html[data-theme="light"] #upper-container,
html[data-theme="light"] #lower-container {
  background: #FFFFFF;
  border-color: #DFE4ED !important;
  box-shadow: 0 1px 2px rgba(36, 45, 66, .04);
}

html[data-theme="light"] #dimension-area,
html[data-theme="light"] #repo-edit-area,
html[data-theme="light"] #lower-repo-edit-area {
  background: #FFFFFF;
}

html[data-theme="light"] #repo-tree-area {
  background: #FBFCFE;
  border-color: #E3E7EF !important;
}

html[data-theme="light"] #repo-edit-area > .flex-1,
html[data-theme="light"] #lower-repo-edit-area > :first-child {
  border-color: #E5E9F0 !important;
}

html[data-theme="light"] #lower-repo-edit-area > :first-child,
html[data-theme="light"] #cn-editor > :first-child,
html[data-theme="light"] #en-editor > :first-child {
  background: #FCFDFF !important;
}

html[data-theme="light"] #editors-container {
  background: #F7F8FB;
}

html[data-theme="light"] #cn-editor,
html[data-theme="light"] #en-editor {
  background: #FFFFFF !important;
  border-color: #E0E5EE !important;
  box-shadow: 0 1px 2px rgba(36, 45, 66, .025);
}

html[data-theme="light"] #prompt-preview-container {
  background: #FAFBFD !important;
  border-color: #E0E5EE !important;
}

/* 维度与标签：未选中是独立白色胶囊，选中态保持品牌紫色与白字。 */
html[data-theme="light"] #dimensions-list > div {
  background: #F8FAFC !important;
  border: 0 !important;
}

html[data-theme="light"] .tag-capsule {
  background: #FFFFFF !important;
  color: #3E4657 !important;
  border-color: #DEE4ED !important;
  box-shadow: 0 1px 1px rgba(28, 39, 62, .02);
}

html[data-theme="light"] .tag-capsule:hover {
  border-color: #A99DF6 !important;
  background: #F8F6FF !important;
}

html[data-theme="light"] .tag-capsule.active,
html[data-theme="light"] .tag-capsule.active:hover {
  color: #FFFFFF !important;
  background: var(--brand-purple) !important;
  border-color: var(--brand-purple) !important;
  box-shadow: 0 2px 5px rgba(108, 92, 231, .22);
}

html[data-theme="light"] .tag-capsule.active .tag-label-text,
html[data-theme="light"] .tag-capsule.active iconify-icon {
  color: #FFFFFF !important;
}

html[data-theme="light"] .dim-add-tag-btn,
html[data-theme="light"] .dim-add-dim-btn {
  color: #7A8496 !important;
  background: #F8FAFC !important;
  border-color: #DCE3ED !important;
}

html[data-theme="light"] .dim-add-tag-btn:hover,
html[data-theme="light"] .dim-add-dim-btn:hover {
  color: var(--brand-purple) !important;
  background: #F7F5FF !important;
  border-color: #AEA4F5 !important;
}

/* 当前组合、文件树和提示词卡片 */
html[data-theme="light"] #combinations-list > .group {
  border-radius: 7px;
}

html[data-theme="light"] #combinations-list > .group:hover {
  background: #F6F7FB;
}

html[data-theme="light"] .file-tree-item {
  color: #4B5567;
}

html[data-theme="light"] .file-tree-item:hover {
  background: #F2F4F8 !important;
}

html[data-theme="light"] .file-tree-item.active:not(.custom-tree-row) {
  color: #4537B8;
  background: #EEEBFF !important;
}

html[data-theme="light"] .custom-tree-row.is-selected .custom-tree-surface,
html[data-theme="light"] .custom-tree-row.selected .custom-tree-surface {
  background: #EEEBFF !important;
}

html[data-theme="light"] #cn-editor .group.flex.overflow-hidden.rounded-lg,
html[data-theme="light"] #en-editor .group.flex.overflow-hidden.rounded-lg {
  background: #F8FAFD !important;
  border: 1px solid #E7EBF2;
  box-shadow: 0 1px 2px rgba(36, 45, 66, .025);
}

html[data-theme="light"] #cn-editor .group.flex.overflow-hidden.rounded-lg:hover,
html[data-theme="light"] #en-editor .group.flex.overflow-hidden.rounded-lg:hover {
  border-color: #D4CCFF;
  background: #FBFAFF !important;
}

html[data-theme="light"] #cn-editor .rounded-full[class*="bg-[#2A2A2A]"],
html[data-theme="light"] #en-editor .rounded-full[class*="bg-[#2A2A2A]"] {
  background: #EEF1F6 !important;
  border-color: #DCE2EB !important;
  color: #727B8B !important;
}

/* 仓库工具条、搜索和分段切换器 */
html[data-theme="light"] .repo-kind-switcher,
html[data-theme="light"] .repo-warehouse-nav,
html[data-theme="light"] #repo-search-input {
  background: #F4F6FA !important;
  border-color: #E0E5ED !important;
}

html[data-theme="light"] .repo-kind-switcher__button.active {
  color: #4638B9 !important;
  background: #FFFFFF !important;
  box-shadow: 0 1px 2px rgba(38, 46, 66, .08);
}

html[data-theme="light"] #repo-search-input {
  color: #273043 !important;
}

html[data-theme="light"] #repo-search-input::placeholder,
html[data-theme="light"] .repo-search-icon {
  color: #99A2B1 !important;
  opacity: .76;
}

html[data-theme="light"] #lower-repo-edit-area > :first-child .flex[class*="bg-[#1A1A1A]"],
html[data-theme="light"] #repo-edit-area .flex[class*="bg-[#1A1A1A]"] {
  background: #F1F3F7 !important;
}

html[data-theme="light"] #lower-repo-edit-area > :first-child .flex[class*="bg-[#1A1A1A]"] [class*="bg-[#2A2A2A]"],
html[data-theme="light"] #repo-edit-area .flex[class*="bg-[#1A1A1A]"] [class*="bg-[#2A2A2A]"] {
  background: #FFFFFF !important;
  color: #30394A !important;
  box-shadow: 0 1px 2px rgba(38, 46, 66, .07);
}

html[data-theme="light"] .project-dropdown-menu,
html[data-theme="light"] .repo-action-popover,
html[data-theme="light"] .repository-form-dialog,
html[data-theme="light"] .delete-dialog,
html[data-theme="light"] .ai-modal,
html[data-theme="light"] .ai-variant-modal,
html[data-theme="light"] .ai-config-modal,
html[data-theme="light"] .tutorial-drawer,
html[data-theme="light"] .auth-user-menu,
html[data-theme="light"] .settings-popover {
  background: #FFFFFF !important;
  border-color: var(--border-color) !important;
  box-shadow: 0 18px 42px rgba(33,42,61,.14);
}

html[data-theme="light"] .repo-action-popover {
  min-width: 160px;
  padding: 8px;
  border-color: #D9E0EB !important;
  background: #FFFFFF !important;
  box-shadow: 0 16px 36px rgba(33, 42, 61, .12);
}

html[data-theme="light"] .repo-action-popover__item {
  min-height: 36px;
  padding: 8px 12px;
  border-radius: 8px;
  color: #465060;
  font-size: 12px;
  line-height: 1.2;
}

html[data-theme="light"] .repo-action-popover__item:hover {
  color: #202431;
  background: #F3F5FA;
}

html[data-theme="light"] .repo-action-popover__item.danger {
  color: #D24D57;
}

html[data-theme="light"] .repo-action-popover__item.danger:hover {
  color: #C73845;
  background: #FCEEEF;
}

html[data-theme="light"] .repo-action-popover__divider {
  margin: 6px 6px;
  background: #E7ECF4;
}

html[data-theme="light"] .repo-action-popover iconify-icon,
html[data-theme="light"] .repo-action-popover svg {
  color: inherit !important;
  fill: currentColor !important;
}

html[data-theme="light"] .repository-form-control,
html[data-theme="light"] .repo-kind-switcher,
html[data-theme="light"] .repo-warehouse-nav,
html[data-theme="light"] .custom-tree-surface,
html[data-theme="light"] .ai-result-item,
html[data-theme="light"] .ai-config-form-panel,
html[data-theme="light"] .tutorial-content .component-card {
  background: #FFFFFF !important;
  border-color: var(--border-color) !important;
}

html[data-theme="light"] .repo-kind-switcher__button.active,
html[data-theme="light"] .custom-tree-row:hover .custom-tree-surface,
html[data-theme="light"] .theme-option:hover,
html[data-theme="light"] .workbench-settings-trigger:hover,
html[data-theme="light"] .workbench-settings-trigger[aria-expanded="true"] {
  background: #F0EFFB !important;
}

html[data-theme="light"] .custom-scrollbar::-webkit-scrollbar-thumb {
  background: #C8CEDA;
}

html[data-theme="light"] .workbench-settings-trigger:hover,
html[data-theme="light"] .workbench-settings-trigger[aria-expanded="true"] {
  border-color: #D8DCE6;
}

html[data-theme="light"] .theme-option.is-active {
  color: #4938B8;
  background: #F0EDFF !important;
  border-color: #CFC7FF;
}

html[data-theme="light"] .theme-option__icon {
  background: #F0F2F7;
}

html[data-theme="light"] .theme-option.is-active .theme-option__icon {
  color: #5A47D5;
  background: #E4DFFF;
}

/* ===== 浅色模式：工作台关键交互组件 ===== */
html[data-theme="light"] .project-label {
  color: #748094 !important;
}

html[data-theme="light"] .project-dropdown-trigger {
  background: #FFFFFF !important;
  border: 1px solid #DDE3EE;
  box-shadow: 0 1px 2px rgba(36, 45, 66, .04);
}

html[data-theme="light"] .project-dropdown-trigger:hover {
  background: #F7F8FF !important;
  border-color: #CEC6FF;
}

html[data-theme="light"] .project-dropdown-trigger:active {
  background: #F1EEFF !important;
}

html[data-theme="light"] .current-project-name {
  color: #202431 !important;
}

html[data-theme="light"] .dropdown-arrow path {
  stroke: #8A93A7 !important;
}

html[data-theme="light"] .project-dropdown-trigger:hover .dropdown-arrow path {
  stroke: var(--brand-purple) !important;
}

html[data-theme="light"] #ai-brainstorm-btn,
html[data-theme="light"] #ai-variant-btn {
  color: var(--brand-purple) !important;
  /* 与深色模式保持同样的“有底色按钮”层级，浅色下使用低饱和紫色底 */
  background: #F0EDFF !important;
  border-color: rgba(108, 92, 231, .24) !important;
  box-shadow: 0 1px 2px rgba(36, 45, 66, .04);
}

html[data-theme="light"] #ai-brainstorm-btn:hover,
html[data-theme="light"] #ai-variant-btn:hover {
  background: #F6F3FF !important;
  border-color: rgba(108, 92, 231, .34) !important;
}

html[data-theme="light"] #ai-brainstorm-btn:active,
html[data-theme="light"] #ai-variant-btn:active {
  background: #EEE9FF !important;
}

html[data-theme="light"] #ai-brainstorm-btn iconify-icon,
html[data-theme="light"] #ai-variant-btn iconify-icon {
  color: inherit !important;
}

html[data-theme="light"] .repo-create-trigger {
  color: var(--brand-purple) !important;
}

html[data-theme="light"] .repo-create-trigger:hover,
html[data-theme="light"] .repo-create-trigger:focus-visible,
html[data-theme="light"] .repo-create-trigger[aria-expanded="true"] {
  color: #4E3FD0 !important;
  background: #F6F3FF !important;
}

html[data-theme="light"] .repo-warehouse-nav::before {
  background: linear-gradient(90deg, #F6F7FB 30%, rgba(246, 247, 251, 0));
}

html[data-theme="light"] .repo-warehouse-nav::after {
  background: linear-gradient(270deg, #F6F7FB 30%, rgba(246, 247, 251, 0));
}

html[data-theme="light"] .repo-warehouse-arrow {
  color: #667085;
}

html[data-theme="light"] .repo-warehouse-arrow:hover {
  color: var(--brand-purple);
}

html[data-theme="light"] .repo-kind-switcher__button {
  color: #637084;
}

html[data-theme="light"] .repo-kind-switcher__button:hover:not(:disabled) {
  color: #202431;
  background: rgba(255, 255, 255, .8);
}

html[data-theme="light"] .repo-kind-switcher__button.active {
  color: #4B3BD4 !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(108, 92, 231, .12);
  box-shadow: 0 1px 2px rgba(36, 45, 66, .05);
}

html[data-theme="light"] .repo-kind-switcher {
  padding: 3px;
  gap: 3px;
  background: #F2F4F9 !important;
  border: 1px solid #DFE4EE !important;
}

html[data-theme="light"] #repo-search-input {
  background: #FFFFFF !important;
  border-color: #DEE4EE !important;
  box-shadow: 0 1px 2px rgba(36, 45, 66, .03);
}

html[data-theme="light"] #repo-search-input:hover {
  border-color: #CFC7FF !important;
}

html[data-theme="light"] #repo-search-input:focus {
  border-color: var(--brand-purple) !important;
  box-shadow: 0 0 0 3px rgba(108, 92, 231, .08);
}

html[data-theme="light"] #repo-search-input::placeholder,
html[data-theme="light"] .repo-search-icon {
  color: #98A2B3 !important;
}

html[data-theme="light"] .repo-search-icon {
  opacity: 1;
}

html[data-theme="light"] .file-tree-item {
  color: #465060 !important;
  border-radius: 8px;
}

html[data-theme="light"] .file-tree-item:hover {
  background: #F4F6FA !important;
  color: #263042 !important;
}

html[data-theme="light"] .file-tree-item.active:not(.custom-tree-row) {
  color: #4B3BD4 !important;
  background: #EEEAFF !important;
}

html[data-theme="light"] .custom-tree-surface {
  border-radius: 8px;
}

html[data-theme="light"] .custom-tree-row {
  background: transparent !important;
}

html[data-theme="light"] .custom-tree-row:hover {
  background: transparent !important;
}

html[data-theme="light"] .custom-tree-row:hover .custom-tree-surface {
  background: #F4F6FA;
}

html[data-theme="light"] .custom-tree-row.active .custom-tree-surface,
html[data-theme="light"] .custom-tree-row.is-selected .custom-tree-surface,
html[data-theme="light"] .custom-tree-row.selected .custom-tree-surface {
  background: #EEEAFF !important;
  border: 1px solid rgba(108, 92, 231, .18);
}

html[data-theme="light"] .custom-tree-action {
  color: #7A8496;
}

html[data-theme="light"] .custom-tree-action:hover {
  color: #202431;
  background: #EDEFF5;
}

/* =====================================================================
   Theme normalization
   ---------------------------------------------------------------------
   这一层只负责颜色、阴影和交互反馈；尺寸、排版、布局及 JS 行为保持
   main.css 原样。所有公共组件通过语义 token 自动跟随主题。
   ===================================================================== */
:root {
  --theme-focus-ring: rgba(108,92,231,.24);
}

html[data-theme="light"] {
  --theme-focus-ring: rgba(108,92,231,.18);
}

html[data-theme="light"] body,
html[data-theme="light"] html,
html[data-theme="light"] .workbench-page,
html[data-theme="light"] main {
  background-color: var(--theme-bg) !important;
  color: var(--theme-text) !important;
}

html[data-theme="light"] header,
html[data-theme="light"] aside,
html[data-theme="light"] #upper-container,
html[data-theme="light"] #lower-container,
html[data-theme="light"] #dimension-area,
html[data-theme="light"] #repo-edit-area,
html[data-theme="light"] #lower-repo-edit-area,
html[data-theme="light"] #editors-container,
html[data-theme="light"] #cn-editor,
html[data-theme="light"] #en-editor,
html[data-theme="light"] #prompt-preview-container,
html[data-theme="light"] #repo-tree-area {
  border-color: var(--theme-border) !important;
}

html[data-theme="light"] header,
html[data-theme="light"] aside,
html[data-theme="light"] #upper-container,
html[data-theme="light"] #lower-container,
html[data-theme="light"] #dimension-area,
html[data-theme="light"] #repo-edit-area,
html[data-theme="light"] #lower-repo-edit-area,
html[data-theme="light"] #cn-editor,
html[data-theme="light"] #en-editor {
  background-color: var(--theme-surface) !important;
}

html[data-theme="light"] #repo-tree-area,
html[data-theme="light"] #editors-container,
html[data-theme="light"] #prompt-preview-container {
  background-color: var(--theme-surface-muted) !important;
}

html[data-theme="light"] .border-t,
html[data-theme="light"] .border-b,
html[data-theme="light"] .border-l,
html[data-theme="light"] .border-r,
html[data-theme="light"] hr {
  border-color: var(--theme-divider) !important;
}

html[data-theme="light"] .custom-scrollbar::-webkit-scrollbar-thumb {
  background: var(--theme-scrollbar) !important;
}
html[data-theme="light"] .custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: var(--theme-border-strong) !important;
}

/* 文本与图标的统一层级 */
html[data-theme="light"] .text-white,
html[data-theme="light"] [class*="text-white"] { color: var(--theme-text) !important; }
html[data-theme="light"] .text-gray-300,
html[data-theme="light"] .text-gray-400,
html[data-theme="light"] .text-gray-500,
html[data-theme="light"] .text-gray-600,
html[data-theme="light"] [class*="text-gray-"] { color: var(--theme-text-secondary) !important; }
html[data-theme="light"] .text-red-400,
html[data-theme="light"] .text-red-500 { color: var(--theme-danger) !important; }
html[data-theme="light"] iconify-icon { color: inherit; }

/* 输入框、搜索、下拉 */
html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select,
html[data-theme="light"] .repository-form-control,
html[data-theme="light"] .ai-modal-textarea,
html[data-theme="light"] #repo-search-input {
  color: var(--theme-text) !important;
  background-color: var(--theme-input) !important;
  border-color: var(--theme-border) !important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder,
html[data-theme="light"] .ai-modal-textarea::placeholder,
html[data-theme="light"] #repo-search-input::placeholder {
  color: var(--theme-text-muted) !important;
  opacity: .72;
}
html[data-theme="light"] input:focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] .repository-form-control:focus,
html[data-theme="light"] #repo-search-input:focus {
  border-color: var(--brand-purple) !important;
  box-shadow: 0 0 0 3px var(--theme-focus-ring) !important;
}

/* Button / pill states: 品牌紫保持 #6C5CE7 */
html[data-theme="light"] button:not(.template-btn-primary):not(.ai-btn-primary):not(.ai-variant-generate-btn):not(.ai-variant-apply-btn) {
  color: var(--theme-text-secondary);
}
html[data-theme="light"] button:not(:disabled):hover {
  background-color: var(--theme-hover);
}
html[data-theme="light"] button:focus-visible {
  outline: 2px solid var(--brand-purple);
  outline-offset: 2px;
}
html[data-theme="light"] .tag-capsule,
html[data-theme="light"] .ai-chip,
html[data-theme="light"] .ai-variant-count-btn,
html[data-theme="light"] .ai-variant-tag-item,
html[data-theme="light"] .ai-variant-result-item {
  color: var(--theme-text-secondary) !important;
  background: var(--theme-card-muted) !important;
  border-color: var(--theme-border) !important;
}
html[data-theme="light"] .tag-capsule:hover,
html[data-theme="light"] .ai-chip:hover,
html[data-theme="light"] .ai-variant-count-btn:hover,
html[data-theme="light"] .ai-variant-tag-item:hover,
html[data-theme="light"] .ai-variant-result-item:hover {
  color: var(--theme-text) !important;
  background: var(--theme-hover) !important;
  border-color: var(--brand-purple) !important;
}
html[data-theme="light"] .tag-capsule.active,
html[data-theme="light"] .ai-chip.selected,
html[data-theme="light"] .ai-variant-count-btn.active,
html[data-theme="light"] .ai-variant-tag-item.selected,
html[data-theme="light"] .ai-variant-result-item.selected {
  color: var(--theme-text-inverse) !important;
  background: var(--brand-purple) !important;
  border-color: var(--brand-purple) !important;
}
html[data-theme="light"] .template-btn-primary,
html[data-theme="light"] .ai-btn-primary,
html[data-theme="light"] .ai-variant-generate-btn,
html[data-theme="light"] .ai-variant-apply-btn {
  color: #FFFFFF !important;
  background: var(--brand-purple) !important;
}
html[data-theme="light"] .template-btn-primary:hover,
html[data-theme="light"] .ai-btn-primary:hover,
html[data-theme="light"] .ai-variant-generate-btn:hover,
html[data-theme="light"] .ai-variant-apply-btn:hover {
  background: #5A4ED1 !important;
}

/* 项目区、组合区、预览区、仓库工具条 */
html[data-theme="light"] .project-dropdown-menu,
html[data-theme="light"] .repo-action-popover,
html[data-theme="light"] .context-menu,
html[data-theme="light"] .settings-popover,
html[data-theme="light"] .auth-user-menu,
html[data-theme="light"] .repository-form-dialog,
html[data-theme="light"] .delete-dialog,
html[data-theme="light"] .welcome-modal,
html[data-theme="light"] .ai-modal,
html[data-theme="light"] .ai-config-modal,
html[data-theme="light"] .ai-variant-modal,
html[data-theme="light"] .tutorial-drawer,
html[data-theme="light"] .template-library-overlay > div {
  color: var(--theme-text) !important;
  background: var(--theme-surface) !important;
  border-color: var(--theme-border) !important;
  box-shadow: var(--theme-shadow) !important;
}
html[data-theme="light"] .context-menu-item:hover,
html[data-theme="light"] .repo-action-popover__item:hover,
html[data-theme="light"] .theme-option:hover,
html[data-theme="light"] .auth-user-menu button:hover,
html[data-theme="light"] .project-dropdown-menu button:hover {
  color: var(--theme-text) !important;
  background: var(--theme-hover) !important;
}
html[data-theme="light"] .context-menu-item.text-red-400,
html[data-theme="light"] .repo-action-popover__item.danger {
  color: var(--theme-danger) !important;
}
html[data-theme="light"] .context-menu-item.text-red-400:hover,
html[data-theme="light"] .repo-action-popover__item.danger:hover {
  background: var(--theme-danger-soft) !important;
}

html[data-theme="light"] .auth-user-email {
  color: #30394A;
}

html[data-theme="light"] .auth-menu-divider {
  background: #E4E8F0;
}

html[data-theme="light"] .auth-plan-badge {
  border-color: #DCE2EC;
  background: #F3F5F8;
  color: #5A6474;
}

html[data-theme="light"] .auth-plan-badge--active {
  border-color: #D8D2FF;
  background: #F0EEFF;
  color: #5A4ED1;
}

html[data-theme="light"] .auth-plan-badge--expired {
  border-color: #FFD5D8;
  background: #FFF1F2;
  color: #D24D57;
}

html[data-theme="light"] .auth-subscription-action {
  border-color: #D9E0EB;
  background: #FFFFFF;
  color: #465060;
}

html[data-theme="light"] .auth-subscription-action:hover {
  border-color: #B9B0FF;
  background: #F0EEFF !important;
  color: #5A4ED1 !important;
}

html[data-theme="light"] .auth-subscription-action--primary,
html[data-theme="light"] .auth-subscription-action--primary:hover {
  border-color: transparent;
  background: var(--brand-purple) !important;
  color: #FFFFFF !important;
}

html[data-theme="light"] .auth-user-logout,
html[data-theme="light"] .auth-user-logout:hover {
  background: #FFF1F2 !important;
  color: #D24D57 !important;
}
html[data-theme="light"] .context-menu,
html[data-theme="light"] .repo-action-popover { border-radius: 10px; }

/* 项目下拉：关闭时保持轻量，打开时才显示边界反馈；两种主题共用同一交互状态 */
.project-dropdown-trigger {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.project-dropdown-trigger:hover {
  background: var(--theme-hover) !important;
}

.project-dropdown-trigger:active,
#project-dropdown-container:has(#project-dropdown-menu:not(.hidden)) .project-dropdown-trigger {
  /* 使用内描边而不是 border，避免打开菜单时改变触发器高度、把项目区整体向下推 */
  box-shadow: inset 0 0 0 1px var(--theme-border-strong) !important;
  background: var(--theme-surface-subtle) !important;
}

#project-dropdown-menu {
  background: var(--theme-surface) !important;
  border-color: var(--theme-border) !important;
}

/* 菜单项常态透明，仅在悬停或当前项目状态下提供背景反馈 */
#project-list > div {
  background: transparent !important;
}

#project-list > div:hover {
  background: var(--theme-hover) !important;
}

#project-list > div[class*="bg-[#2A2A2A]"] {
  background: var(--theme-selected) !important;
}

html[data-theme="light"] .project-dropdown-trigger:active,
html[data-theme="light"] #project-dropdown-container:has(#project-dropdown-menu:not(.hidden)) .project-dropdown-trigger {
  color: var(--theme-text) !important;
}

/* 中英文提示词卡片：取消外框，使用更沉稳的底色区分内容层级 */
#aiBrainstormModal.ai-modal-overlay {
  /* 与 AI 变体遮罩一致：打开时立即出现，避免背景比弹窗慢半拍 */
  animation: none !important;
}

#cn-editor .prompt-text-item > .group.flex.overflow-hidden.rounded-lg,
#en-editor .prompt-text-item > .group.flex.overflow-hidden.rounded-lg {
  border: 0 !important;
  box-shadow: none !important;
  background: #171B24 !important;
}

#cn-editor .prompt-text-item > .group.flex.overflow-hidden.rounded-lg:hover,
#en-editor .prompt-text-item > .group.flex.overflow-hidden.rounded-lg:hover {
  border: 0 !important;
  background: #1D2430 !important;
}

html[data-theme="light"] #cn-editor .prompt-text-item > .group.flex.overflow-hidden.rounded-lg,
html[data-theme="light"] #en-editor .prompt-text-item > .group.flex.overflow-hidden.rounded-lg {
  background: #E9EDF4 !important;
}

html[data-theme="light"] #cn-editor .prompt-text-item > .group.flex.overflow-hidden.rounded-lg:hover,
html[data-theme="light"] #en-editor .prompt-text-item > .group.flex.overflow-hidden.rounded-lg:hover {
  background: #E1E6F0 !important;
}

/* 覆盖层只调整颜色，不改变层级和交互 */
html[data-theme="light"] .repository-form-overlay,
html[data-theme="light"] .ai-config-overlay,
html[data-theme="light"] .ai-modal-overlay,
html[data-theme="light"] .ai-variant-modal-overlay,
html[data-theme="light"] .delete-overlay,
html[data-theme="light"] .tutorial-overlay,
html[data-theme="light"] #template-library-overlay {
  background: var(--theme-overlay) !important;
}

/* 弹窗 / 抽屉内的表面、分割线、辅助文字 */
html[data-theme="light"] .ai-config-header,
html[data-theme="light"] .ai-config-footer,
html[data-theme="light"] .ai-variant-modal-footer,
html[data-theme="light"] .tutorial-drawer-header,
html[data-theme="light"] .tutorial-toc,
html[data-theme="light"] .ai-variant-count-area,
html[data-theme="light"] .ai-variant-combo-header {
  border-color: var(--theme-divider) !important;
}
html[data-theme="light"] .ai-config-header,
html[data-theme="light"] .ai-config-footer,
html[data-theme="light"] .ai-variant-modal-footer,
html[data-theme="light"] .tutorial-drawer-header,
html[data-theme="light"] .tutorial-content {
  background: var(--theme-surface) !important;
}
html[data-theme="light"] .tutorial-toc { background: var(--theme-surface-muted) !important; }
html[data-theme="light"] .tutorial-toc-item:hover { background: var(--theme-hover) !important; color: var(--theme-text) !important; }
html[data-theme="light"] .tutorial-toc-item.active { background: var(--theme-selected) !important; color: var(--theme-text) !important; border-left-color: var(--brand-purple) !important; }
html[data-theme="light"] .tutorial-content .component-card,
html[data-theme="light"] .ai-config-form-panel,
html[data-theme="light"] .ai-variant-combo-card { background: var(--theme-card-muted) !important; border-color: var(--theme-border) !important; }
html[data-theme="light"] .tutorial-drawer-header h2,
html[data-theme="light"] .tutorial-content h3,
html[data-theme="light"] .tutorial-content h4,
html[data-theme="light"] .ai-variant-modal-title,
html[data-theme="light"] .delete-dialog h3 { color: var(--theme-text) !important; }
html[data-theme="light"] .tutorial-toc-section-title,
html[data-theme="light"] .tutorial-toc-item,
html[data-theme="light"] .ai-variant-hint,
html[data-theme="light"] .ai-variant-result-count,
html[data-theme="light"] .delete-dialog p { color: var(--theme-text-muted) !important; }

/* 文件树、分类区、编辑卡片 */
html[data-theme="light"] .file-tree-item,
html[data-theme="light"] .custom-tree-surface { color: var(--theme-text-secondary) !important; }
html[data-theme="light"] .file-tree-item:hover,
html[data-theme="light"] .custom-tree-row:hover .custom-tree-surface { background: var(--theme-hover) !important; }
html[data-theme="light"] .file-tree-item.active:not(.custom-tree-row),
html[data-theme="light"] .custom-tree-row.active .custom-tree-surface,
html[data-theme="light"] .custom-tree-row.is-selected .custom-tree-surface,
html[data-theme="light"] .custom-tree-row.selected .custom-tree-surface { background: var(--theme-selected) !important; color: #4B3BD4 !important; border-color: rgba(108,92,231,.18) !important; }
html[data-theme="light"] #cn-editor .group.flex.overflow-hidden.rounded-lg,
html[data-theme="light"] #en-editor .group.flex.overflow-hidden.rounded-lg { background: var(--theme-card-muted) !important; border-color: var(--theme-border) !important; }
html[data-theme="light"] #cn-editor .group.flex.overflow-hidden.rounded-lg:hover,
html[data-theme="light"] #en-editor .group.flex.overflow-hidden.rounded-lg:hover { background: var(--theme-hover) !important; border-color: var(--brand-purple) !important; }
html[data-theme="light"] #combinations-list > .group:hover { background: var(--theme-hover) !important; }

/* 仓库切换器、仓库名横向导航、箭头与渐隐 */
html[data-theme="light"] .repo-kind-switcher,
html[data-theme="light"] .repo-warehouse-nav { background: var(--theme-surface-muted) !important; border-color: var(--theme-border) !important; }
html[data-theme="light"] .repo-kind-switcher__button { color: var(--theme-text-muted) !important; }
html[data-theme="light"] .repo-kind-switcher__button:hover:not(:disabled) { color: var(--theme-text) !important; background: var(--theme-hover) !important; }
html[data-theme="light"] .repo-kind-switcher__button.active { color: #4B3BD4 !important; background: var(--theme-surface) !important; border-color: rgba(108,92,231,.16) !important; }
html[data-theme="light"] .repo-warehouse-tab { color: var(--theme-text-muted) !important; }
html[data-theme="light"] .repo-warehouse-tab:hover,
html[data-theme="light"] .repo-warehouse-tab.active { color: var(--brand-purple) !important; }
html[data-theme="light"] .repo-warehouse-nav::before { background: linear-gradient(90deg, var(--theme-surface-muted) 30%, transparent) !important; }
html[data-theme="light"] .repo-warehouse-nav::after { background: linear-gradient(270deg, var(--theme-surface-muted) 30%, transparent) !important; }
html[data-theme="light"] .repo-warehouse-arrow { color: var(--theme-text-muted) !important; }
html[data-theme="light"] .repo-warehouse-arrow:hover,
html[data-theme="light"] .repo-create-trigger:hover { color: var(--brand-purple) !important; }

/* 滑块、复选、单选控件统一反馈 */
html[data-theme="light"] input[type="range"] { accent-color: var(--brand-purple); }
html[data-theme="light"] .ai-config-range::-webkit-slider-runnable-track,
html[data-theme="light"] .ai-variant-slider { background: var(--theme-border-strong) !important; }
html[data-theme="light"] .ai-config-range::-webkit-slider-thumb,
html[data-theme="light"] .ai-variant-slider::-webkit-slider-thumb { background: var(--brand-purple) !important; border-color: var(--theme-surface) !important; }
html[data-theme="light"] .ai-variant-tag-item .variant-check,
html[data-theme="light"] .ai-variant-result-item .result-check { border-color: var(--theme-border-strong) !important; }

/* 欢迎弹窗保留品牌渐变，仅把遮罩与文字层级纳入 token */
html[data-theme="light"] .welcome-modal { box-shadow: var(--theme-shadow) !important; }

/* 浅色模式的禁用态：降低对比度但保留可读性 */
html[data-theme="light"] button:disabled,
html[data-theme="light"] input:disabled,
html[data-theme="light"] select:disabled { color: #A0A8B6 !important; background-color: #F1F3F7 !important; border-color: #E2E7EF !important; }

/* 发散 / 变体 / 配置弹窗内部状态：确保弹窗切换到浅色后没有残留深色块。 */
html[data-theme="light"] .ai-modal-status-bar,
html[data-theme="light"] .ai-result-item,
html[data-theme="light"] .ai-basis-option,
html[data-theme="light"] .ai-mode-option,
html[data-theme="light"] .ai-variant-project-bar,
html[data-theme="light"] .ai-variant-count-area,
html[data-theme="light"] .ai-variant-result-area,
html[data-theme="light"] .ai-variant-result-item,
html[data-theme="light"] .ai-variant-tag-item,
html[data-theme="light"] .ai-config-model-panel,
html[data-theme="light"] .ai-config-form-panel {
  background: var(--theme-card-muted) !important;
  border-color: var(--theme-border) !important;
  color: var(--theme-text-secondary) !important;
}

html[data-theme="light"] .ai-result-item:hover,
html[data-theme="light"] .ai-basis-option:hover,
html[data-theme="light"] .ai-mode-option:hover,
html[data-theme="light"] .ai-variant-result-item:hover,
html[data-theme="light"] .ai-variant-tag-item:hover {
  background: var(--theme-hover) !important;
  border-color: var(--brand-purple) !important;
}

html[data-theme="light"] .ai-result-item.selected,
html[data-theme="light"] .ai-variant-result-item.selected,
html[data-theme="light"] .ai-variant-tag-item.selected,
html[data-theme="light"] .ai-mode-option input[type="radio"]:checked + .ai-mode-radio {
  background: var(--theme-selected) !important;
  border-color: var(--brand-purple) !important;
}

html[data-theme="light"] .ai-result-tag,
html[data-theme="light"] .ai-variant-tag,
html[data-theme="light"] .ai-variant-result-tag {
  color: var(--theme-text-secondary) !important;
  background: var(--theme-surface) !important;
  border-color: var(--theme-border-strong) !important;
}
html[data-theme="light"] .ai-result-tag.active,
html[data-theme="light"] .ai-variant-tag.active,
html[data-theme="light"] .ai-variant-result-tag.active {
  color: var(--brand-purple) !important;
  background: var(--theme-selected) !important;
  border-color: var(--brand-purple) !important;
}
html[data-theme="light"] .ai-result-row-checkbox,
html[data-theme="light"] .ai-variant-result-checkbox,
html[data-theme="light"] .ai-variant-tag-checkbox {
  border-color: var(--theme-border-strong) !important;
  background: var(--theme-surface) !important;
  color: var(--theme-text-inverse) !important;
}
html[data-theme="light"] .ai-result-row-checkbox.checked,
html[data-theme="light"] .ai-variant-result-checkbox.checked,
html[data-theme="light"] .ai-variant-tag-checkbox.checked {
  border-color: var(--brand-purple) !important;
  background: var(--brand-purple) !important;
}
html[data-theme="light"] .ai-result-dim-label,
html[data-theme="light"] .ai-variant-dim-label,
html[data-theme="light"] .ai-variant-result-dim-label {
  color: #4B3BD4 !important;
  background: var(--theme-selected) !important;
}
html[data-theme="light"] .ai-status-divider,
html[data-theme="light"] .ai-results-section-header,
html[data-theme="light"] .ai-variant-result-header {
  border-color: var(--theme-divider) !important;
  background: transparent !important;
}
html[data-theme="light"] .ai-results-heading,
html[data-theme="light"] .ai-results-section-header .section-title,
html[data-theme="light"] .ai-results-section-header .section-count,
html[data-theme="light"] .ai-variant-result-title,
html[data-theme="light"] .ai-variant-result-count,
html[data-theme="light"] .ai-status-item strong {
  color: var(--theme-text) !important;
}
html[data-theme="light"] .ai-status-item,
html[data-theme="light"] .ai-apply-mode-label,
html[data-theme="light"] .ai-mode-text,
html[data-theme="light"] .ai-variant-hint,
html[data-theme="light"] .ai-variant-empty,
html[data-theme="light"] .ai-config-current,
html[data-theme="light"] .ai-config-help {
  color: var(--theme-text-secondary) !important;
}
html[data-theme="light"] .ai-mode-desc {
  color: var(--theme-text-secondary) !important;
  background: var(--theme-surface-raised) !important;
  border-color: var(--theme-border) !important;
  box-shadow: var(--theme-shadow) !important;
}
html[data-theme="light"] .ai-replace-warning {
  color: var(--theme-danger) !important;
  background: var(--theme-danger-soft) !important;
  border-color: color-mix(in srgb, var(--theme-danger) 35%, transparent) !important;
}
html[data-theme="light"] .ai-config-model-option,
html[data-theme="light"] .ai-config-current strong,
html[data-theme="light"] .ai-config-range-value {
  color: var(--theme-text) !important;
}
html[data-theme="light"] .ai-config-model-option:hover,
html[data-theme="light"] .ai-config-model-option.active {
  color: #4B3BD4 !important;
  background: var(--theme-selected) !important;
  border-color: rgba(108,92,231,.28) !important;
}
html[data-theme="light"] .ai-config-footer,
html[data-theme="light"] .ai-variant-modal-footer {
  background: var(--theme-surface) !important;
  border-color: var(--theme-divider) !important;
}

/* 弹窗头部与关闭控件也消费同一套语义 token，避免浅色模式残留深色 utility。 */
html[data-theme="light"] .ai-modal-header,
html[data-theme="light"] .ai-variant-modal-header,
html[data-theme="light"] .ai-config-header {
  background: var(--theme-surface) !important;
  border-color: var(--theme-divider) !important;
  color: var(--theme-text) !important;
}
html[data-theme="light"] .ai-modal-close-btn,
html[data-theme="light"] .ai-variant-close-btn,
html[data-theme="light"] .ai-config-close-btn {
  color: var(--theme-text-muted) !important;
  background: transparent !important;
}
html[data-theme="light"] .ai-modal-close-btn:hover,
html[data-theme="light"] .ai-variant-close-btn:hover,
html[data-theme="light"] .ai-config-close-btn:hover {
  color: var(--theme-text) !important;
  background: var(--theme-hover) !important;
}

/* 模板库、确认删除和通用上下文菜单 */
html[data-theme="light"] #template-library-overlay > div,
html[data-theme="light"] #confirm-modal > div,
html[data-theme="light"] #ctx-menu,
html[data-theme="light"] .context-menu {
  background: var(--theme-surface) !important;
  border-color: var(--theme-border) !important;
  color: var(--theme-text) !important;
  box-shadow: var(--theme-shadow) !important;
}
html[data-theme="light"] #template-library-overlay .border-b,
html[data-theme="light"] #template-library-overlay .border-t,
html[data-theme="light"] #confirm-modal .border-b,
html[data-theme="light"] #confirm-modal .border-t {
  border-color: var(--theme-divider) !important;
}
html[data-theme="light"] #template-category-filters,
html[data-theme="light"] #template-category-filters button:not([data-category="all"]):hover {
  background: var(--theme-surface-muted) !important;
}
html[data-theme="light"] #template-category-filters button[data-category="all"],
html[data-theme="light"] #template-category-filters button.active {
  color: var(--theme-text) !important;
  background: var(--theme-surface-subtle) !important;
}
html[data-theme="light"] .context-menu-item:hover,
html[data-theme="light"] .template-card:hover {
  background: var(--theme-hover) !important;
}
html[data-theme="light"] .context-menu-item,
html[data-theme="light"] .template-card,
html[data-theme="light"] #template-empty-state {
  color: var(--theme-text-secondary) !important;
}

/* 教程抽屉与设置菜单：沿用深色版布局，仅切换表面、边界和文字层级。 */
html[data-theme="light"] .tutorial-overlay,
html[data-theme="light"] .ai-modal-overlay,
html[data-theme="light"] .ai-config-overlay,
html[data-theme="light"] .ai-variant-modal-overlay,
html[data-theme="light"] #template-library-overlay,
html[data-theme="light"] #confirm-modal {
  background: var(--theme-overlay) !important;
}
html[data-theme="light"] .tutorial-drawer,
html[data-theme="light"] .tutorial-drawer-header,
html[data-theme="light"] .tutorial-content {
  background: var(--theme-surface) !important;
  border-color: var(--theme-divider) !important;
  color: var(--theme-text) !important;
  box-shadow: var(--theme-shadow) !important;
}
html[data-theme="light"] .tutorial-toc {
  background: var(--theme-surface-muted) !important;
  border-color: var(--theme-divider) !important;
}
html[data-theme="light"] .tutorial-toc-section-title,
html[data-theme="light"] .tutorial-toc-item {
  color: var(--theme-text-muted) !important;
}
html[data-theme="light"] .tutorial-toc-item:hover {
  color: var(--theme-text) !important;
  background: var(--theme-hover) !important;
}
html[data-theme="light"] .tutorial-toc-item.active {
  color: #4B3BD4 !important;
  background: var(--theme-selected) !important;
  border-left-color: var(--brand-purple) !important;
}
html[data-theme="light"] .tutorial-content h3,
html[data-theme="light"] .tutorial-drawer-header h2 {
  color: var(--theme-text) !important;
}
html[data-theme="light"] .tutorial-content p,
html[data-theme="light"] .tutorial-content li,
html[data-theme="light"] .tutorial-content .component-card {
  color: var(--theme-text-secondary) !important;
}

/* 右键菜单和输入控件的最终层级，避免被旧的深色 utility 覆盖。 */
html[data-theme="light"] .context-menu-item,
html[data-theme="light"] .repo-action-popover__item {
  color: var(--theme-text-secondary) !important;
}
html[data-theme="light"] .context-menu-item:hover,
html[data-theme="light"] .repo-action-popover__item:hover {
  color: var(--theme-text) !important;
  background: var(--theme-hover) !important;
}

/* 工作台浅色模式的状态收口：沿用现有组件，仅修正颜色与边界层级。 */
html[data-theme="light"] #save-current-combination-btn:not(:disabled),
html[data-theme="light"] #save-combination-btn:not(:disabled) {
  color: #fff !important;
  background: var(--brand-purple) !important;
}
html[data-theme="light"] #save-current-combination-btn:hover:not(:disabled),
html[data-theme="light"] #save-combination-btn:hover:not(:disabled) {
  background: #5A4ED1 !important;
}

/* 主操作禁用态仍保留品牌紫识别，避免被通用 disabled 规则冲成近白色 */
html[data-theme="light"] #save-current-combination-btn:disabled,
html[data-theme="light"] #save-combination-btn:disabled {
  color: #FFFFFF !important;
  background: #8B7FE5 !important;
  border-color: #B8AEF2 !important;
}

/* 文本分类：常态为浅色胶囊，选中态保持品牌紫底白字。 */
html[data-theme="light"] .text-tag-wrapper {
  color: var(--theme-text-secondary) !important;
  background: var(--theme-card-muted) !important;
  border-color: var(--theme-border) !important;
}
html[data-theme="light"] .text-tag-wrapper:hover {
  color: var(--theme-text) !important;
  background: var(--theme-hover) !important;
}
html[data-theme="light"] .text-tag-wrapper.text-tag-active {
  color: #fff !important;
  background: var(--brand-purple) !important;
  border-color: var(--brand-purple) !important;
}

/* 颜色分类选中态保留与深色版一致的外围虚线提示。 */
html[data-theme="light"] .color-tag-active::after {
  border-color: var(--brand-purple) !important;
}

/* 文件树常态不铺底，仅在 hover/选中时显示反馈。 */
html[data-theme="light"] .file-tree-item:not(:hover):not(.active),
html[data-theme="light"] .custom-tree-row:not(:hover):not(.active):not(.is-selected):not(.selected),
html[data-theme="light"] .custom-tree-row:not(:hover):not(.active):not(.is-selected):not(.selected) .custom-tree-surface {
  background: transparent !important;
}

/* 仓库切换器选中项使用深色文字，保持浅色控件的对比度。 */
html[data-theme="light"] .repo-kind-switcher__button.active {
  color: var(--theme-text) !important;
}

/* 统一工作区主要容器的 1px 边框，避免浅色版局部出现 2px 重边。 */
html #upper-container,
html #lower-container {
  border-width: 1px !important;
}

/* 浅色模式：文件树使用纯白工作面；搜索框取消描边，保持与仓库工具栏一致。 */
html[data-theme="light"] #repo-tree-area {
  background-color: #FFFFFF !important;
}

html[data-theme="light"] #repo-search-input,
html[data-theme="light"] #repo-search-input:hover,
html[data-theme="light"] #repo-search-input:focus {
  border-width: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-theme="light"] #repo-edit-area,
html[data-theme="light"] #upper-container,
html[data-theme="light"] #lower-container,
html[data-theme="light"] #prompt-preview-container,
html[data-theme="light"] #cn-editor,
html[data-theme="light"] #en-editor {
  border-width: 1px !important;
  border-style: solid !important;
  border-color: var(--theme-border) !important;
}

/* 仓库切换器与中英文切换器使用同一套无描边分段控件视觉。 */
html[data-theme="light"] .repo-kind-switcher {
  border: 0 !important;
  background: var(--theme-surface-muted) !important;
}
html[data-theme="light"] .repo-kind-switcher__button.active {
  border: 0 !important;
  box-shadow: none !important;
  color: var(--theme-text) !important;
  background: var(--theme-surface) !important;
}

/* 三个分段切换器统一为同一套控件：内边距 2px、无描边、按钮无额外间隙。 */
.segmented-switcher {
  padding: 2px !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
}

html:not([data-theme="light"]) .segmented-switcher {
  background: #1A1A1A !important;
}

html[data-theme="light"] .segmented-switcher {
  background: var(--theme-surface-muted) !important;
}

.segmented-switcher > button {
  border: 0 !important;
}

/* 维度行与主题无关，统一取消外描边，避免浅色模式出现额外边框。 */
#dimensions-list > div.flex.items-center:not(.dim-add-dim-btn) {
  border: 0 !important;
}

/* 项目仓库切换器与右侧视图切换器对齐：同样的内边距、圆角和选中层级 */
.repo-kind-switcher {
  display: flex !important;
  padding: 2px !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--theme-surface-muted) !important;
}

.repo-kind-switcher__button {
  flex: 1 1 0 !important;
  height: auto !important;
  min-height: 28px !important;
  padding: 4px 12px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: var(--theme-text-muted) !important;
}

.repo-kind-switcher__button:hover:not(:disabled) {
  color: var(--theme-text) !important;
  background: var(--theme-hover) !important;
}

html:not([data-theme="light"]) .repo-kind-switcher__button.active {
  color: #FFFFFF !important;
  background: #2A2A2A !important;
}

html[data-theme="light"] .repo-kind-switcher__button.active {
  color: var(--theme-text) !important;
  background: var(--theme-surface) !important;
}

/* 仓库切换器 Hover 仅反馈文字颜色，不铺设背景；选中态仍保留自身背景。 */
.repo-kind-switcher__button:hover:not(:disabled):not(.active) {
  background: transparent !important;
}

html:not([data-theme="light"]) .repo-kind-switcher__button:hover:not(:disabled).active {
  background: #2A2A2A !important;
}

html[data-theme="light"] .repo-kind-switcher__button:hover:not(:disabled).active {
  background: var(--theme-surface) !important;
}

/* 浅色模式的工作区背景分层：外层使用工作台底色，仅保留与深色模式
   对应的标签行、预览框和中英文编辑框背景。 */
html[data-theme="light"] #dimension-area,
html[data-theme="light"] #repo-edit-area,
html[data-theme="light"] #lower-repo-edit-area,
html[data-theme="light"] #editors-container {
  background: transparent !important;
}

html[data-theme="light"] #dimensions-list > div:not(.dim-add-dim-btn),
html[data-theme="light"] #prompt-preview-container,
html[data-theme="light"] #cn-editor,
html[data-theme="light"] #en-editor {
  background: var(--theme-card-muted) !important;
}

html[data-theme="light"] #cn-editor > :first-child,
html[data-theme="light"] #en-editor > :first-child {
  background: var(--theme-hover) !important;
  border-color: var(--theme-divider) !important;
}

html[data-theme="light"] #cn-content,
html[data-theme="light"] #en-content {
  background: var(--theme-card) !important;
}

/* 浅色模式收尾：把工作台核心控件再压一层，确保项目名、AI 按钮和仓库控件在最终渲染里稳定可读。 */
html[data-theme="light"] .project-selector {
  min-width: 0;
}

html[data-theme="light"] .project-label {
  color: #7E8798 !important;
}

html[data-theme="light"] .project-dropdown-trigger {
  min-height: 40px;
  padding: 0 12px;
  color: var(--theme-text) !important;
  background: #FFFFFF !important;
  border: 1px solid #DCE3EE !important;
  box-shadow: 0 1px 2px rgba(36, 45, 66, .05) !important;
}

html[data-theme="light"] .project-dropdown-trigger:hover {
  background: #F8FAFF !important;
  border-color: #CFC7FF !important;
}

html[data-theme="light"] .current-project-name {
  color: #1F2430 !important;
  font-weight: 600;
}

html[data-theme="light"] #ai-brainstorm-btn,
html[data-theme="light"] #ai-variant-btn {
  background: linear-gradient(180deg, #F6F2FF 0%, #EFE9FF 100%) !important;
  color: #5A46D5 !important;
  border: 1px solid rgba(108, 92, 231, .18) !important;
  box-shadow: 0 1px 2px rgba(36, 45, 66, .04) !important;
}

html[data-theme="light"] #ai-brainstorm-btn:hover,
html[data-theme="light"] #ai-variant-btn:hover {
  background: linear-gradient(180deg, #FAF8FF 0%, #F3EEFF 100%) !important;
  border-color: rgba(108, 92, 231, .28) !important;
}

html[data-theme="light"] #ai-brainstorm-btn:active,
html[data-theme="light"] #ai-variant-btn:active {
  background: #EAE4FF !important;
}

html[data-theme="light"] .repo-kind-switcher {
  background: #EEF2F8 !important;
  border: 1px solid #DDE4EE !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75);
}

html[data-theme="light"] .repo-kind-switcher__button {
  color: #647085 !important;
}

html[data-theme="light"] .repo-kind-switcher__button:hover:not(:disabled) {
  color: #202431 !important;
  background: rgba(255, 255, 255, .86) !important;
}

html[data-theme="light"] .repo-kind-switcher__button.active {
  color: #4B3BD4 !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(108, 92, 231, .14) !important;
  box-shadow: 0 1px 2px rgba(36, 45, 66, .06) !important;
}

html[data-theme="light"] .repo-warehouse-nav {
  background: #FFFFFF !important;
  border-color: #E0E5ED !important;
}

html[data-theme="light"] .repo-warehouse-arrow {
  color: #7B8496 !important;
}

html[data-theme="light"] .repo-warehouse-arrow:hover {
  color: var(--brand-purple) !important;
}

html[data-theme="light"] #repo-search-input {
  background: #FFFFFF !important;
  border: 1px solid #DEE4EE !important;
  box-shadow: 0 1px 2px rgba(36, 45, 66, .03) !important;
}

html[data-theme="light"] #repo-search-input:hover {
  border-color: #CFC7FF !important;
}

html[data-theme="light"] #repo-search-input:focus {
  border-color: var(--brand-purple) !important;
  box-shadow: 0 0 0 3px rgba(108, 92, 231, .08) !important;
}

html[data-theme="light"] .file-tree-item {
  color: #4B5567 !important;
}

html[data-theme="light"] .file-tree-item:hover {
  background: #F4F6FA !important;
  color: #202431 !important;
}

html[data-theme="light"] .file-tree-item.active:not(.custom-tree-row) {
  background: #EEE9FF !important;
  color: #4B3BD4 !important;
}

html[data-theme="light"] .custom-tree-surface {
  color: #4B5567 !important;
}

html[data-theme="light"] .custom-tree-row:hover .custom-tree-surface {
  background: #F4F6FA !important;
}

html[data-theme="light"] .custom-tree-row.active .custom-tree-surface,
html[data-theme="light"] .custom-tree-row.is-selected .custom-tree-surface,
html[data-theme="light"] .custom-tree-row.selected .custom-tree-surface {
  background: #EEE9FF !important;
  color: #4B3BD4 !important;
  border-color: rgba(108, 92, 231, .18) !important;
}