/* ============ UI 5.0 极简 · 侧边栏工作台布局（彻底解决横向溢出） ============ */

/* —— 顶部导航：极简单行，logo + 标题 + 右侧账户 —— */
.topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 60 !important;
  height: 58px !important;
  min-height: 58px !important;
  padding: 0 20px !important;
  background: rgba(10,13,26,.94) !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  backdrop-filter: blur(12px) saturate(1.1) !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 !important;
  box-shadow: none !important;
}
.topbar::after { display: none !important; }
.brand { gap: 12px !important; flex: 0 0 auto !important; }
.topbar .brand .logo {
  width: 36px !important; height: 36px !important; min-width: 36px !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg,#7c5cfc,#8f6bff) !important;
  box-shadow: 0 4px 14px rgba(124,92,252,.32) !important;
  animation: none !important;
  font-size: 17px !important; font-weight: 700 !important;
}
.brand h1 { font-size: 16px !important; font-weight: 700 !important; letter-spacing: .2px !important; color: #f2f2f6 !important; margin: 0 !important; white-space: nowrap !important; }
.brand p { display: none !important; }

/* 账户切换：右侧（自然融合 · 极简低调） */
.topbar .account-switcher { margin-left: auto !important; flex: 0 0 auto !important; }
.as-trigger {
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  padding: 5px 10px 5px 5px !important;
  gap: 6px !important;
  box-shadow: none !important;
  transition: background .18s ease, border-color .18s ease !important;
}
.as-trigger:hover {
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: none !important;
}
.as-trigger.open {
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(255,255,255,.11) !important;
  box-shadow: none !important;
}
/* 徽章：柔和彩色圆点，去掉发光贴纸感 */
.as-badge {
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  color: #fff !important;
  flex-shrink: 0 !important;
}
.as-badge-a { background: linear-gradient(135deg, #6d5df6, #8f6bff) !important; }
.as-badge-e { background: linear-gradient(135deg, #56a6f5, #6d5df6) !important; }
.as-badge-c { background: linear-gradient(135deg, #a865f4, #c86bf0) !important; }
/* 文字：自然、不抢眼 */
.as-name {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #e8e8ef !important;
  white-space: nowrap !important;
}
.as-sub { display: none !important; }
/* 箭头：小巧精致的直角 chevron */
.as-arrow {
  width: 16px !important;
  height: 16px !important;
  margin-left: 2px !important;
  font-size: 0 !important;
  color: rgba(255,255,255,.55) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.as-arrow::before {
  content: "" !important;
  display: block !important;
  width: 6px !important;
  height: 6px !important;
  border-right: 1.6px solid currentColor !important;
  border-bottom: 1.6px solid currentColor !important;
  transform: rotate(45deg) translate(-1px,-1px) !important;
}
.as-trigger.open .as-arrow::before { transform: rotate(225deg) translate(-1px,-1px) !important; }
.topbar .key-status { display: none !important; }

/* 账户信息条恢复显示：余额统一显示在右侧；钱包徽章随黑金皮肤显示（见 skin-gold.css） */
.acct-bar {
  display: flex !important;
  margin: 14px 30px 8px 254px !important;
}
.wallet-chip { display: inline-flex !important; }
/* —— 体验版顶部横幅：卡片式折行，避免溢出 —— */
#trialBar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px 10px !important;
  margin: 8px 30px 10px 310px !important;
  padding: 10px 14px !important;
  font-size: 12.5px !important;
  color: #DCE1EA !important;
  background: linear-gradient(90deg, rgba(84,169,255,.16), rgba(255,209,102,.08)) !important;
  border: 1px solid rgba(124,92,252,.22) !important;
  border-radius: 12px !important;
  line-height: 1.5 !important;
}
#trialBar .trial-q {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: nowrap !important;
  padding: 3px 9px !important;
  border-radius: 8px !important;
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
}
#trialBar .trial-q b { color: #fff !important; font-weight: 700 !important; }
#trialBar .trial-q em { font-style: normal !important; }
#trialBar .trial-q .ico { width: 12px !important; height: 12px !important; flex: 0 0 auto !important; }
#trialBar .trial-head { background: rgba(255,209,102,.14) !important; border-color: rgba(255,209,102,.3) !important; }
#trialBar .trial-head b { color: #ffd166 !important; }
#trialBar .trial-qh { background: rgba(124,92,252,.16) !important; border-color: rgba(124,92,252,.32) !important; color: #d8ccff !important; font-weight: 700 !important; }
#trialBar .trial-ok em { color: #54A9FF !important; }
#trialBar .trial-zero em, #trialBar .trial-lock em { color: #ff6b6b !important; }
#trialBar .trial-off em { color: #f59e0b !important; }
#trialBar .trial-note { color: #93a4c4 !important; }
#trialBar .trial-toggle { cursor: pointer !important; background: rgba(84,169,255,.16) !important; border-color: rgba(84,169,255,.34) !important; color: #cfe2ff !important; }
#trialBar .trial-toggle:hover { background: rgba(84,169,255,.26) !important; }
#trialDetail {
  display: none;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin: -4px 30px 10px 310px;
  padding: 10px 14px;
  border-radius: 12px;
  background: rgba(255,255,255,.028);
  border: 1px solid rgba(255,255,255,.07);
  font-size: 12px;
}
#trialDetail.open { display: flex; }
#trialDetail .trial-detail-item {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 8px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.06);
  color: #cbd3e1; white-space: nowrap;
}
#trialDetail .trial-detail-item b { font-weight: 600; color: #e8ecf5; }
#trialDetail .trial-detail-item em { font-style: normal; }
#trialDetail .trial-detail-item.ok em { color: #54A9FF; }
#trialDetail .trial-detail-item.zero em { color: #ff6b6b; }
#trialDetail .trial-detail-item.lock { opacity: .55; }
#trialDetail .trial-detail-item.lock em { color: #8b93a5; }

/* —— tab 角标：剩余次数 / 锁定标记 —— */
.tab-btn .trial-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  margin-left: 6px !important;
  padding: 0 6px !important;
  height: 16px !important;
  border-radius: 6px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  letter-spacing: .2px !important;
}
.tab-btn .trial-badge.trial-ok { color: #66e39a !important; background: rgba(46,204,113,.16) !important; }
.tab-btn .trial-badge.trial-zero, .tab-btn .trial-badge.trial-lock { color: #ff6b6b !important; background: rgba(255,107,107,.16) !important; }
@media (max-width: 1024px) {
  #trialBar { margin: 8px 16px 10px 296px !important; }
}

/* —— 左侧边栏：功能导航，永久可见，无横向溢出 —— */
nav.tabs.sidebar {
  position: fixed !important;
  top: 58px !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 280px !important;
  min-width: 280px !important;
  margin: 0 !important;
  padding: 10px 12px 18px !important;
  background: rgba(12,15,28,.9) !important;
  border-right: 1px solid rgba(255,255,255,.06) !important;
  backdrop-filter: blur(12px) !important;
  /* 滚动迁移到内部 .sb-scroll：侧栏本身不再滚动，从而让 .sb-dock 在 flex 末尾固定底部 */
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  /* 修复「向上滑动跳顶」：.tabs 基类带 justify-content:center!important 会造成
     内容居中溢出（顶部内容被顶出视口、滚不回来），此处显式重置为 flex-start */
  justify-content: flex-start !important;
  align-content: flex-start !important;
  gap: 0 !important;  /* 间隙改由 .sb-scroll 内部控制，避免 sb-scroll 与 sb-dock 间多余间距 */
  flex-wrap: nowrap !important;
  z-index: 40 !important;
  scrollbar-width: thin !important;
  /* 【修复 2026-08-30】左侧功能显示不全：splash 移除 / motion.js 动画 / overflow-anchor
     会在 DOM 变化时把 sidebar 自动滚到非顶部位置，导致起号神器和内容工坊被滚出视口。
     显式关闭浏览器自动滚动锚定，让 sidebar 永远从顶部开始。 */
  overflow-anchor: none !important;
  scroll-padding-top: 0 !important;
  scroll-margin-top: 0 !important;
}
/* —— 侧栏滚动区（上方功能组）：唯一滚动容器，让下方 .sb-dock 固定底部不随滚动 —— */
nav.tabs.sidebar .sb-scroll {
  flex: 1 1 auto !important;
  min-height: 0 !important;  /* flex 子项可收缩，滚动才能生效 */
  overflow-y: auto !important;
  overflow-x: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 2px !important;
  scrollbar-width: thin !important;
  overflow-anchor: none !important;  /* 同 sidebar：禁止自动滚动锚定，永远从顶部开始 */
  scroll-padding-top: 0 !important;
}
nav.tabs.sidebar .sb-scroll::-webkit-scrollbar { width: 8px !important; }
nav.tabs.sidebar .sb-scroll::-webkit-scrollbar-thumb { background: rgba(255,255,255,.12) !important; border-radius: 8px !important; }

nav.tabs.sidebar .tab-group {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  flex-wrap: nowrap !important;
  margin: 0 !important;
  width: 100% !important;
}
nav.tabs.sidebar .tab-group + .tab-group { margin-top: 8px !important; padding-top: 8px !important; border-top: 1px solid rgba(255,255,255,.07) !important; }

/* —— 侧栏底部停靠区（管理工具）：flex 布局固定底部；卡片样式与上方功能组 .tab-group 完全一致 —— */
nav.tabs.sidebar .sb-dock {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  flex: 0 0 auto !important;   /* 不收缩、固定占位 → 永久钉在 flex 末尾（侧栏底部） */
  /* 卡片容器：与上方 .tab-group 同款（style.css 基础卡片：背景+边框+圆角+内边距） */
  margin: 8px 0 0 !important;  /* 与上方分组保持同样的 8px 组间距 */
  width: 100% !important;
  padding: 3px 9px !important;
  border-radius: 7px !important;
  background: rgba(84,169,255,.09) !important;
  border: 1px solid rgba(84,169,255,.16) !important;
}
nav.tabs.sidebar .sb-dock .tab-tools-label {
  padding: 4px 8px 5px !important;
  margin: 0 0 2px !important;
}

/* 分组标签 */
nav.tabs.sidebar .tab-group-label,
nav.tabs.sidebar .tab-tools-label {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  width: 100% !important;
  padding: 4px 8px 3px !important;
  margin: 0 0 2px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  color: #8a8a98 !important;
  text-transform: uppercase !important;
  justify-content: flex-start !important;
  border: none !important;
  background: none !important;
}
nav.tabs.sidebar .tab-tools-label::before,
nav.tabs.sidebar .tab-tools-label::after { display: none !important; }

/* 分组标签内的小图标（v2 分类改造：起号神器/内容工坊/爆款素材 各自配一线性图标） */
nav.tabs.sidebar .tab-group-label .tgl-ico {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  opacity: .78 !important;
  color: currentColor !important;
}

/* 侧边栏按钮：整行可点，图标 + 文字左对齐 */
nav.tabs.sidebar .tab-btn {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 7px 10px !important;
  margin: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  color: #9a9aa6 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  text-align: left !important;
  white-space: nowrap !important;
  transition: background .16s ease, color .16s ease !important;
  animation: none !important;
}
nav.tabs.sidebar .tab-btn .tb-ico { width: 18px !important; height: 18px !important; color: inherit !important; flex: 0 0 auto !important; }
nav.tabs.sidebar .tab-btn .tb-txt { line-height: 1.3 !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; max-width: 100% !important; text-align: left !important; overflow-wrap: break-word !important; }
nav.tabs.sidebar .tab-btn:hover { background: rgba(255,255,255,.06) !important; color: #fff !important; transform: none !important; box-shadow: none !important; }
nav.tabs.sidebar .tab-btn:hover .tb-ico { color: #e3d8ff !important; transform: none !important; }
nav.tabs.sidebar .tab-btn.active { background: rgba(124,92,252,.16) !important; border-color: rgba(124,92,252,.32) !important; color: #fff !important; }
nav.tabs.sidebar .tab-btn.active .tb-ico { color: #cdb7ff !important; }
nav.tabs.sidebar .tab-btn.active::after { display: none !important; }

/* —— 主内容区：让出侧边栏宽度 —— */
main, #keyBanner, #remoteBanner {
  margin-left: 280px !important;
}
/* 修复「全屏右侧空白」：移除 max-width:1280px 硬限制。原窗口宽 > 280(侧栏)+1280=1560px 时
   主内容被卡在 1280px、右侧大片空白。现让 main 填满侧栏以外全部宽度，内部 auto-fit 网格
   (.quick-cards) 会随宽度自动增列铺开，全屏/退出全屏均自适应、无空白。 */
main { padding: 26px 30px 60px !important; max-width: none !important; }
.footer { padding: 20px 30px 24px !important; }

/* 平板/窄屏：侧边栏收起成顶部快捷，避免挤压 */
@media (max-width: 1024px) {
  /* 【修复 2026-08-30 左侧功能显示不全】桌面 Electron 版（主窗口 minWidth=980）不存在
     真平板/手机场景。此断点原会把侧栏从左侧固定竖栏塌成「顶部流式块 + max-height:42vh」，
     触发条件：Windows DPI 缩放(125%→1024px / 150%→853px) 或窗口拖小。一旦触发，
     「爆款素材」「管理工具」组被 42vh 硬压裁掉，功能显示不全。
     现强制侧栏始终为左侧固定 280px 竖栏，与 ≥1025px 布局一致，超长内容靠 overflow-y:auto 承载。 */
  nav.tabs.sidebar {
    position: fixed !important;
    width: 280px !important;
    min-width: 280px !important;
    height: calc(100vh - 58px) !important;
    max-height: none !important;
    left: 0 !important;
    top: 58px !important;
    bottom: 0 !important;
    padding: 10px 12px 18px !important;
    border-right: 1px solid rgba(255,255,255,.06) !important;
    border-bottom: none !important;
    flex-direction: column !important;
  }
  main, #keyBanner, #remoteBanner { margin-left: 280px !important; }
  .acct-bar { margin: 14px 16px 8px !important; }
  main { padding: 18px 16px 56px !important; }
}


/* —— 顶部「下载更新」按钮：与账户切换同款自然低调 —— */
.topbar:has(.top-update-btn) .account-switcher { margin-left: 0 !important; }
.top-update-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  margin-left: auto !important;
  padding: 5px 11px 5px 6px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  background: rgba(255,255,255,.03) !important;
  box-shadow: none !important;
  color: #dfe3ef !important;
  white-space: nowrap !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background .18s ease, border-color .18s ease !important;
}
.top-update-btn:hover {
  background: rgba(255,255,255,.06) !important;
  border-color: rgba(255,255,255,.14) !important;
  box-shadow: none !important;
  transform: none !important;
}
.top-update-btn:active { transform: none !important; }
.top-update-btn:disabled { opacity: .55 !important; cursor: default !important; }
.top-update-btn .tub-ico {
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg, #6d5df6, #8f6bff) !important;
  box-shadow: none !important;
  color: #fff !important;
}
.top-update-btn .tub-txt { display: inline-flex !important; flex-direction: column !important; line-height: 1.2 !important; text-align: left !important; }
.top-update-btn .tub-txt b { font-size: 13px !important; font-weight: 600 !important; color: #e8e8ef !important; }
.top-update-btn .tub-txt .tub-ver { font-size: 10.5px !important; color: #9a9aa6 !important; font-weight: 500 !important; }

/* ===== 左上角修复：锁定视口，主区自滚动（彻底消除滚动错位） ===== */
html, body { height: 100% !important; overflow: hidden !important; }
main {
  height: calc(100vh - 58px) !important;
  overflow-y: auto !important;
  padding-bottom: 10px !important;
  display: flex !important;
  flex-direction: column !important;
}

#keyBanner, #remoteBanner {
  position: fixed !important;
  top: 58px !important;
  left: 280px !important;
  right: 0 !important;
  z-index: 39 !important;
  margin: 10px 28px 0 !important;
}
.footer {
  position: relative !important;
  z-index: 1 !important;
  margin: 0 !important;
  margin-top: auto !important;
  padding: 20px 30px 24px !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
}

@media (max-width: 1024px) {
  html, body { overflow: auto !important; }
  main { height: auto !important; }
  .footer, #keyBanner, #remoteBanner {
    position: static !important;
    left: 0 !important;
    margin: 0 !important;
  }
}

/* ===== 滚动条精修：细、暗、融入深色主题（去掉默认白色/粗糙滚动条） ===== */
::-webkit-scrollbar { width: 7px !important; height: 7px !important; }
::-webkit-scrollbar-track { background: transparent !important; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14) !important; border-radius: 8px !important; border: 1px solid transparent !important; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.24) !important; }
::-webkit-scrollbar-corner { background: transparent !important; }
html, body, * { scrollbar-width: thin !important; scrollbar-color: rgba(255,255,255,.18) transparent !important; }
main::-webkit-scrollbar { width: 7px !important; height: 7px !important; }
main::-webkit-scrollbar-track { background: transparent !important; }
main::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14) !important; border-radius: 8px !important; }
main::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.24) !important; }

@media (max-width: 1024px) {
  ::-webkit-scrollbar { width: 5px !important; height: 5px !important; }
}


/* ===== 生成记录：批量打包下载 ===== */
.records-toolbar {
  display: flex; align-items: center; gap: 12px; margin: 4px 0 12px; flex-wrap: wrap;
}
.rec-select-all-wrap {
  display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); cursor: pointer; user-select: none;
}
.records-toolbar .btn.small { white-space: nowrap; }
.rec-check {
  width: 16px; height: 16px; accent-color: var(--accent); cursor: pointer; flex-shrink: 0; margin-top: 3px;
}
.records-toolbar .hint { margin: 0 !important; font-size: 12px; }

/* ===== 排版精修：侧边栏文字不溢出 + 批量槽位文件框单行整齐 ===== */
nav.tabs.sidebar .tab-btn { overflow: visible !important; }
nav.tabs.sidebar .tab-btn .tb-txt { flex: 0 1 auto !important; min-width: 0 !important; max-width: 100% !important; }
.batch-slots .slot-files { flex-wrap: wrap !important; align-items: stretch !important; }
.batch-slots .slot-file-col { min-width: 170px !important; flex: 0 1 170px !important; }
.batch-slots .slot-file-pick { flex-wrap: nowrap !important; justify-content: flex-start !important; gap: 8px !important; min-width: 0 !important; }
.batch-slots .slot-file-pick .sfp-icon { flex: 0 0 auto !important; }
.batch-slots .slot-file-pick .sfp-text { white-space: nowrap !important; flex: 0 0 auto !important; min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.batch-slots .slot-file-pick .sfp-name { margin-left: auto !important; flex: 0 1 auto !important; min-width: 0 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.batch-slots .slot-check-wrap { flex-wrap: nowrap !important; }
.batch-slots .slot-check-wrap .slot-check-box { flex: 0 0 auto !important; }
.batch-slots { align-items: stretch !important; }
.batch-slot { display: flex !important; flex-direction: column !important; }

/* ============================================================
   SEMI 飞书深色风 · 平面克制重绘层（加载于 style.css 之后）
   —— 统一为字节系暗色规范：主色 #54A9FF / 背景 #16161A / 卡片 #232429
   ============================================================ */

/* 字体栈：Semi 官方 */
html, body, button, input, textarea, select {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* 页面背景：纯平面，去渐变光晕 */
body {
  background: #16161A !important;
  background-image: none !important;
  color: #F9F9F9 !important;
}
html, body { overflow: hidden !important; }

/* 隐藏装饰层：粒子星尘 / 鼠标光晕 / 点阵 / 光柱 */
#bg-canvas, #cursorGlow, .dot-grid, .beams, .beams *, .meteors, #cursorGlow * { display: none !important; }

/* ===== 启动屏：扁平 Semi ===== */
#splash { background: #16161A !important; }
#splash .splash-bg { display: none !important; }
#splash .splash-logo {
  background: #54A9FF !important;
  box-shadow: none !important;
  border-radius: 18px !important;
  color: #fff !important;
}
#splash .splash-title { color: #F9F9F9 !important; }
#splash .splash-sub { color: rgba(249,249,249,.6) !important; }
#splash .splash-loading span { background: #54A9FF !important; }
#splash .splash-tip { color: rgba(249,249,249,.6) !important; }

/* ===== 顶栏：深色底 + 细边框 ===== */
.topbar {
  background: rgba(22,22,26,.92) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  backdrop-filter: blur(14px) saturate(1.2) !important;
  box-shadow: none !important;
}
.topbar .brand .logo {
  background: #54A9FF !important;
  box-shadow: none !important;
  color: #fff !important;
  border-radius: 9px !important;
  animation: none !important;
}
.brand h1 { color: #F9F9F9 !important; }
.brand p { color: rgba(249,249,249,.6) !important; }

/* 密钥/账户状态 pill */
.key-status { color: #FFAE43 !important; background: rgba(255,174,67,.12) !important; border: 1px solid rgba(255,174,67,.28) !important; }
.key-status.ok { color: #5DC264 !important; background: rgba(93,194,100,.12) !important; border-color: rgba(93,194,100,.28) !important; }

/* 账户切换：半透明浅色填充，去掉渐变 */
.as-trigger {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
.as-trigger:hover { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.14) !important; }
.as-trigger.open { background: rgba(84,169,255,.14) !important; border-color: rgba(84,169,255,.3) !important; }
.as-badge-a { background: #54A9FF !important; }
.as-badge-e { background: #40B4F3 !important; }
.as-badge-c { background: #A05FF0 !important; }
.as-badge { color: #fff !important; }
.as-name { color: #F9F9F9 !important; }
.as-arrow::before { color: rgba(249,249,249,.55) !important; }

/* ===== 左侧边栏：深色卡片底 + 细边框 ===== */
nav.tabs.sidebar {
  background: rgba(28,28,33,.96) !important;
  border-right: 1px solid rgba(255,255,255,.07) !important;
}
nav.tabs.sidebar .tab-group-label,
nav.tabs.sidebar .tab-tools-label { color: rgba(249,249,249,.42) !important; }
nav.tabs.sidebar .tab-btn { color: rgba(249,249,249,.62) !important; border-radius: 7px !important; }
nav.tabs.sidebar .tab-btn:hover { background: rgba(255,255,255,.07) !important; color: #F9F9F9 !important; }
nav.tabs.sidebar .tab-btn:hover .tb-ico { color: #B7D9FF !important; }
nav.tabs.sidebar .tab-btn.active {
  background: rgba(84,169,255,.16) !important;
  border-color: rgba(84,169,255,.3) !important;
  color: #F9F9F9 !important;
}
nav.tabs.sidebar .tab-btn.active .tb-ico { color: #9CD0FF !important; }
nav.tabs.sidebar .tab-group + .tab-group { border-top: 1px solid rgba(255,255,255,.07) !important; }

/* ===== 卡片：平面 + 1px 边框 + 12px 圆角，去掉顶部高光/流光/悬浮阴影 ===== */
.card {
  background: #232429 !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.card::before { display: none !important; }
.card::after { display: none !important; }
.card:hover {
  transform: none !important;
  border-color: rgba(84,169,255,.28) !important;
  box-shadow: none !important;
}
.card h2 { color: #F9F9F9 !important; }
.card h2::before {
  background: #54A9FF !important;
  box-shadow: none !important;
  width: 3px !important;
  border-radius: 3px !important;
}
.card h2::after { background: linear-gradient(90deg, rgba(255,255,255,.12), transparent) !important; }

/* ===== 表单控件：浅色填充 + 细边框 + 6px 圆角 ===== */
.field-label { color: rgba(249,249,249,.66) !important; }
textarea, input[type=text], input[type=password], input[type=number], select, input[type=search] {
  background: rgba(255,255,255,.05) !important;
  color: #F9F9F9 !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
textarea::placeholder, input::placeholder { color: rgba(249,249,249,.4) !important; }
textarea:hover, input:hover, select:hover { border-color: rgba(255,255,255,.22) !important; }
textarea:focus, input:focus, select:focus {
  border-color: #54A9FF !important;
  box-shadow: 0 0 0 2px rgba(84,169,255,.28) !important;
  background: rgba(255,255,255,.06) !important;
}
input[type=range] { accent-color: #54A9FF !important; }
input[type=checkbox], .rec-check { accent-color: #54A9FF !important; }

/* ===== 按钮：平面主色 + 6px 圆角 ===== */
.btn { border-radius: 6px !important; font-weight: 600 !important; box-shadow: none !important; }
.btn.primary {
  background: #54A9FF !important;
  color: #fff !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
}
.btn.primary::after { display: none !important; }
.btn.primary:hover {
  background: #6CB5FF !important;
  transform: none !important;
  box-shadow: none !important;
}
.btn.primary:active { background: #4A9BEF !important; transform: none !important; }
.btn.primary:disabled { background: rgba(255,255,255,.12) !important; color: rgba(249,249,249,.4) !important; }
.btn.danger { background: rgba(252,114,90,.12) !important; color: #FC725A !important; border: 1px solid rgba(252,114,90,.3) !important; }
.btn.danger:hover { background: rgba(252,114,90,.2) !important; }
.btn.ghost, .btn.secondary {
  background: rgba(255,255,255,.06) !important; color: rgba(249,249,249,.85) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}
.btn.ghost:hover, .btn.secondary:hover { background: rgba(255,255,255,.1) !important; color: #F9F9F9 !important; }

/* ===== 上传区：细虚线边框，去浮动动画 ===== */
.dropzone {
  border: 1px dashed rgba(255,255,255,.22) !important;
  border-radius: 8px !important;
  background: rgba(255,255,255,.02) !important;
  box-shadow: none !important;
}
.dropzone:hover, .dropzone.drag {
  border-color: #54A9FF !important;
  background: rgba(84,169,255,.06) !important;
  box-shadow: none !important;
}
.dz-icon { animation: none !important; }
.dropzone:hover .dz-icon { transform: none !important; }
.dz-hint { color: rgba(249,249,249,.5) !important; }

/* 文件标签 */
.file-chip { background: #232429 !important; border: 1px solid rgba(255,255,255,.08) !important; border-radius: 8px !important; }
.file-chip span { color: rgba(249,249,249,.6) !important; }
.chip-remove { color: rgba(249,249,249,.55) !important; }

/* 提示词预设 */
.preset-btn {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: rgba(249,249,249,.62) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}
.preset-btn:hover, .preset-btn.active {
  background: rgba(84,169,255,.16) !important;
  border-color: #54A9FF !important;
  color: #F9F9F9 !important;
  box-shadow: none !important;
}

/* ===== 结果区：平面深色内嵌 ===== */
.result-box {
  background: #1C1C22 !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
.result-box .placeholder { color: rgba(249,249,249,.5) !important; border: 1px dashed rgba(255,255,255,.18) !important; border-radius: 8px !important; }
.result-box img { border-radius: 8px !important; box-shadow: none !important; }
.status-area { color: rgba(249,249,249,.6) !important; }
.hint { color: rgba(249,249,249,.52) !important; }
.status-error { color: #FC725A !important; }
.status-text { animation: none !important; }

/* 加载动画 */
.spinner { border-color: rgba(255,255,255,.16) !important; border-top-color: #54A9FF !important; }

/* 徽章/标签 */
.badge { border-radius: 6px !important; box-shadow: none !important; }
.tag { border-radius: 4px !important; }

/* 顶部「下载更新」按钮：扁平低调 */
.top-update-btn {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: #DFE3EF !important;
}
.top-update-btn:hover { background: rgba(255,255,255,.08) !important; border-color: rgba(255,255,255,.16) !important; box-shadow: none !important; }
.top-update-btn .tub-ico { background: #54A9FF !important; box-shadow: none !important; color: #fff !important; }
.top-update-btn .tub-txt b { color: #F9F9F9 !important; }
.top-update-btn .tub-txt .tub-ver { color: rgba(249,249,249,.5) !important; }

/* ===== footer ===== */
.footer { background: transparent !important; border-top: 1px solid rgba(255,255,255,.08) !important; color: rgba(249,249,249,.55) !important; }
.footer a { color: #54A9FF !important; }

/* ===== 生成记录表格/列表：扁平 ===== */
.records-toolbar .hint { color: rgba(249,249,249,.5) !important; }
.rec-sel-wrap { color: rgba(249,249,249,.62) !important; }

/* ===== 弹窗/下拉菜单：深色卡片 ===== */
.as-menu, .dropdown-menu, .popover {
  background: #232429 !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.35) !important;
}
.as-opt:hover { background: rgba(255,255,255,.07) !important; }
.as-opt.active { background: rgba(84,169,255,.14) !important; }

/* ===== 滚动条：细、暗灰、融入 ===== */
::-webkit-scrollbar { width: 7px !important; height: 7px !important; }
::-webkit-scrollbar-track { background: transparent !important; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14) !important; border-radius: 8px !important; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.24) !important; }
::-webkit-scrollbar-corner { background: transparent !important; }



/* 结果占位：纯平面，去渐变色 */
.result-box .placeholder { background: rgba(255,255,255,.02) !important; box-shadow: none !important; }
.result-box .placeholder::before { color: rgba(249,249,249,.4) !important; }


/* ============================================================
   AURORA 深色动效层 · 高级克制（深空navy + 蓝紫渐变 + 玻璃拟态）
   加载于 Semi 扁平层之后，压过：玻璃质感、渐变高光、细腻动效
   ============================================================ */

/* 字体 */
html, body, button, input, textarea, select {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* 页面：深空 navy + 静态多层辉光 */
body {
  background:
    radial-gradient(1200px 620px at 12% -8%, rgba(108,140,255,.16), transparent 58%),
    radial-gradient(1100px 560px at 92% 6%, rgba(160,95,240,.13), transparent 58%),
    radial-gradient(900px 520px at 50% 118%, rgba(56,214,240,.09), transparent 60%),
    #0A0E1A !important;
  background-attachment: fixed !important;
  color: #EAF0FF !important;
}

/* 隐藏旧粒子/光柱/点阵（仍用，只保留 Aurora 光球） */
#bg-canvas, #cursorGlow, .dot-grid, .beams .meteor { display: none !important; }

/* Aurora 光球：缓慢漂移，背景呼吸 */
.beams { position: fixed !important; inset: 0 !important; z-index: -2 !important; pointer-events: none !important; overflow: hidden !important; display: block !important; }
.beams .beam {
  position: absolute !important; display: block !important; border-radius: 50% !important;
  filter: blur(90px) !important; opacity: .34 !important; will-change: transform !important;
}
.beams .b1 { width: 520px; height: 520px; left: -6%; top: -14%; background: radial-gradient(circle, rgba(108,140,255,.7), transparent 65%); animation: auroraA 22s ease-in-out infinite; }
.beams .b2 { width: 460px; height: 460px; right: -8%; top: 2%; background: radial-gradient(circle, rgba(160,95,240,.65), transparent 65%); animation: auroraB 26s ease-in-out infinite; }
.beams .b3 { width: 520px; height: 520px; left: 38%; bottom: -22%; background: radial-gradient(circle, rgba(56,214,240,.55), transparent 65%); animation: auroraC 30s ease-in-out infinite; }
@keyframes auroraA { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(26px,20px) scale(1.06); } }
@keyframes auroraB { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-30px,14px) scale(1.08); } }
@keyframes auroraC { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(20px,-22px) scale(1.05); } }

/* ===== 顶栏：玻璃深空 ===== */
.topbar {
  background: rgba(12,17,32,.68) !important;
  border-bottom: 1px solid rgba(124,150,255,.14) !important;
  backdrop-filter: blur(16px) saturate(1.4) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.03) !important;
}
.topbar .brand .logo {
  background: linear-gradient(135deg, #6C8CFF, #A05FF0) !important;
  border-radius: 10px !important;
  box-shadow: 0 6px 16px rgba(108,140,255,.35) !important;
  animation: logoFloat 4.5s ease-in-out infinite !important;
  color: #fff !important;
}
@keyframes logoFloat { 0%,100% { transform: translateY(0); box-shadow: 0 6px 16px rgba(108,140,255,.32); } 50% { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(160,95,240,.42); } }
.brand h1 { color: #F2F4FF !important; }

/* 账户切换：玻璃 pill */
.as-trigger { background: rgba(255,255,255,.04) !important; border: 1px solid rgba(255,255,255,.1) !important; border-radius: 8px !important; box-shadow: none !important; }
.as-trigger:hover { background: rgba(108,140,255,.14) !important; border-color: rgba(108,140,255,.4) !important; }
.as-trigger.open { background: rgba(108,140,255,.18) !important; border-color: rgba(108,140,255,.5) !important; }
.as-badge-a { background: linear-gradient(135deg, #6C8CFF, #A05FF0) !important; box-shadow: 0 2px 8px rgba(108,140,255,.4) !important; }
.as-badge-e { background: linear-gradient(135deg, #38D6F0, #6C8CFF) !important; box-shadow: 0 2px 8px rgba(56,214,240,.4) !important; }
.as-badge-c { background: linear-gradient(135deg, #A05FF0, #C86BF0) !important; box-shadow: 0 2px 8px rgba(160,95,240,.4) !important; }
.as-name { color: #F2F4FF !important; }

/* 顶部「下载更新」按钮：玻璃 + 渐变图标 */
.top-update-btn { background: rgba(255,255,255,.04) !important; border: 1px solid rgba(255,255,255,.1) !important; border-radius: 8px !important; box-shadow: none !important; color: #DFE3F2 !important; }
.top-update-btn:hover { background: rgba(108,140,255,.14) !important; border-color: rgba(108,140,255,.4) !important; box-shadow: 0 4px 14px rgba(108,140,255,.2) !important; }
.top-update-btn .tub-ico { background: linear-gradient(135deg, #6C8CFF, #A05FF0) !important; box-shadow: 0 2px 8px rgba(108,140,255,.4) !important; color: #fff !important; animation: logoFloat 4.5s ease-in-out infinite !important; }

/* ===== 左侧边栏：玻璃深空 ===== */
nav.tabs.sidebar { background: rgba(12,17,32,.72) !important; border-right: 1px solid rgba(124,150,255,.12) !important; backdrop-filter: blur(14px) !important; }
nav.tabs.sidebar .tab-group-label, nav.tabs.sidebar .tab-tools-label { color: rgba(180,195,240,.42) !important; }
nav.tabs.sidebar .tab-btn { color: rgba(210,220,250,.62) !important; border-radius: 8px !important; transition: background .2s ease, color .2s ease, transform .2s ease !important; }
nav.tabs.sidebar .tab-btn:hover { background: rgba(108,140,255,.1) !important; color: #F2F4FF !important; transform: translateX(2px) !important; }
nav.tabs.sidebar .tab-btn.active {
  background: linear-gradient(90deg, rgba(108,140,255,.22), rgba(160,95,240,.14)) !important;
  border: 1px solid rgba(108,140,255,.42) !important;
  box-shadow: 0 4px 16px rgba(108,140,255,.18) !important;
  color: #F2F4FF !important;
}
nav.tabs.sidebar .tab-btn.active .tb-ico { color: #A8C6FF !important; }
nav.tabs.sidebar .tab-btn:hover .tb-ico { color: #B0CDFF !important; transform: scale(1.1) !important; }
nav.tabs.sidebar .tb-ico { transition: transform .2s ease, color .2s ease !important; }
nav.tabs.sidebar .tab-group + .tab-group { border-top: 1px solid rgba(124,150,255,.1) !important; }

/* ===== 卡片：玻璃渐变 + 悬浮抬升 + 顶部高光 ===== */
.card {
  background: linear-gradient(165deg, rgba(30,39,64,.9), rgba(18,24,42,.92)) !important;
  border: 1px solid rgba(124,150,255,.16) !important;
  border-radius: 14px !important;
  box-shadow: 0 10px 30px rgba(6,10,22,.35) !important;
  transition: transform .28s cubic-bezier(.22,.9,.3,1), border-color .28s ease, box-shadow .28s ease !important;
}
.card::before { display: block !important; content: "" !important; position: absolute !important; top: 0; left: 8%; right: 8%; height: 1px; border-radius: 3px; background: linear-gradient(90deg, transparent, rgba(150,180,255,.5), transparent) !important; }
.card::after { display: none !important; }
.card:hover { transform: translateY(-3px) !important; border-color: rgba(108,140,255,.38) !important; box-shadow: 0 18px 44px rgba(6,10,22,.5), 0 0 22px rgba(108,140,255,.12) !important; }
.card h2 { color: #F2F4FF !important; }
.card h2::before { background: linear-gradient(180deg, #6C8CFF, #A05FF0) !important; box-shadow: 0 0 10px rgba(108,140,255,.5) !important; width: 3px !important; }
.card h2::after { background: linear-gradient(90deg, rgba(124,150,255,.4), transparent) !important; }
.card-sub { border-top-color: rgba(124,150,255,.14) !important; }

/* ===== 表单：玻璃 + 蓝色聚焦光 ===== */
.field-label { color: #9FB2D8 !important; }
textarea, input[type=text], input[type=password], input[type=number], select, input[type=search] {
  background: rgba(255,255,255,.045) !important;
  color: #EAF0FF !important;
  border: 1px solid rgba(150,170,230,.2) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease !important;
}
textarea::placeholder, input::placeholder { color: rgba(170,185,220,.45) !important; }
textarea:hover, input:hover, select:hover { border-color: rgba(108,140,255,.36) !important; background: rgba(255,255,255,.06) !important; }
textarea:focus, input:focus, select:focus {
  border-color: #6C8CFF !important;
  box-shadow: 0 0 0 3px rgba(108,140,255,.22), 0 0 18px rgba(108,140,255,.16) !important;
  background: rgba(255,255,255,.06) !important;
}
input[type=range] { accent-color: #6C8CFF !important; }
input[type=checkbox], .rec-check { accent-color: #6C8CFF !important; }

/* ===== 按钮：渐变主色 + 柔和流光 + 悬浮抬升 ===== */
.btn { border-radius: 8px !important; font-weight: 600 !important; transition: transform .16s ease, box-shadow .16s ease, background .16s ease !important; }
.btn.primary {
  background: linear-gradient(135deg, #6C8CFF, #A05FF0) !important;
  color: #fff !important; border: 1px solid transparent !important;
  box-shadow: 0 6px 18px rgba(108,140,255,.3) !important;
}
.btn.primary::after { display: block !important; position: absolute !important; top: 0; left: -70%; width: 45%; height: 100%; content: "" !important; background: linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent); transform: skewX(-20deg) !important; transition: left .55s ease !important; }
.btn.primary:hover { background: linear-gradient(135deg, #7C9BFF, #B07CF5) !important; transform: translateY(-1px) !important; box-shadow: 0 10px 26px rgba(108,140,255,.42) !important; }
.btn.primary:hover::after { left: 130% !important; }
.btn.primary:active { transform: translateY(0) !important; box-shadow: 0 4px 14px rgba(108,140,255,.35) !important; }
.btn.primary:disabled { background: rgba(255,255,255,.12) !important; color: rgba(255,255,255,.4) !important; box-shadow: none !important; }
.btn.danger { background: rgba(255,107,122,.12) !important; color: #FF8A95 !important; border: 1px solid rgba(255,107,122,.32) !important; }
.btn.danger:hover { background: rgba(255,107,122,.22) !important; }
.btn.ghost, .btn.secondary { background: rgba(255,255,255,.05) !important; color: #E3E8F8 !important; border: 1px solid rgba(255,255,255,.12) !important; }
.btn.ghost:hover, .btn.secondary:hover { background: rgba(108,140,255,.14) !important; border-color: rgba(108,140,255,.4) !important; box-shadow: 0 4px 14px rgba(108,140,255,.18) !important; }

/* ===== 上传区：渐变虚线 + 悬浮辉光 ===== */
.dropzone { border: 1.5px dashed rgba(150,170,230,.34) !important; border-radius: 10px !important; background: rgba(255,255,255,.02) !important; transition: border-color .2s ease, background .2s ease, box-shadow .2s ease !important; }
.dropzone:hover, .dropzone.drag { border-color: #6C8CFF !important; background: rgba(108,140,255,.08) !important; box-shadow: 0 0 22px rgba(108,140,255,.12) inset !important; }
.dz-icon { animation: dzFloat 3s ease-in-out infinite !important; }
@keyframes dzFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
.dropzone:hover .dz-icon { transform: translateY(-5px) scale(1.08) !important; }
.dz-hint { color: rgba(170,185,220,.55) !important; }

/* 文件标签 */
.file-chip { background: rgba(23,29,46,.9) !important; border: 1px solid rgba(124,150,255,.16) !important; border-radius: 9px !important; }
.file-chip span { color: #A9B8DC !important; }

/* 提示词预设 */
.preset-btn { background: rgba(255,255,255,.04) !important; border: 1px solid rgba(255,255,255,.12) !important; color: rgba(200,212,240,.62) !important; border-radius: 999px !important; transition: .18s ease !important; }
.preset-btn:hover, .preset-btn.active { background: rgba(108,140,255,.16) !important; border-color: #6C8CFF !important; color: #F2F4FF !important; box-shadow: 0 0 12px rgba(108,140,255,.25) !important; }

/* ===== 结果区：玻璃内嵌 ===== */
.result-box { background: rgba(14,20,36,.65) !important; border: 1px solid rgba(124,150,255,.14) !important; border-radius: 10px !important; box-shadow: none !important; }
.result-box .placeholder { background: rgba(255,255,255,.02) !important; border: 1px dashed rgba(150,170,230,.28) !important; border-radius: 10px !important; color: #8B99BD !important; }
.result-box .placeholder::before { color: rgba(200,212,240,.4) !important; }
.result-box img, .result-box video { border-radius: 10px !important; box-shadow: 0 12px 30px rgba(0,0,0,.45) !important; animation: resultPop .45s cubic-bezier(.34,1.56,.64,1) !important; }
@keyframes resultPop { from { opacity: 0; transform: scale(.96); } to { opacity: 1; transform: scale(1); } }
.hint { color: rgba(170,185,220,.58) !important; }
.status-error { color: #FF8A95 !important; }

/* 加载：渐变圆环 */
.spinner { border-color: rgba(124,150,255,.16) !important; border-top-color: #6C8CFF !important; animation: spin .8s linear infinite !important; }

/* 面板进场：错落上浮 */
.panel.active { animation: panelIn .4s cubic-bezier(.22,.9,.3,1) !important; }
@keyframes panelIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.panel.active .card > * { animation: riseIn .45s cubic-bezier(.22,.9,.3,1) backwards !important; }
@keyframes riseIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.panel.active .card > *:nth-child(1) { animation-delay: .02s !important; }
.panel.active .card > *:nth-child(2) { animation-delay: .06s !important; }
.panel.active .card > *:nth-child(3) { animation-delay: .1s !important; }
.panel.active .card > *:nth-child(4) { animation-delay: .14s !important; }
.panel.active .card > *:nth-child(5) { animation-delay: .18s !important; }
.panel.active .card > *:nth-child(6) { animation-delay: .22s !important; }
.panel.active .card > *:nth-child(7) { animation-delay: .26s !important; }
.panel.active .card > *:nth-child(8) { animation-delay: .3s !important; }

/* 顶栏标题字/关键信息 */
.key-status { color: #FFC24B !important; background: rgba(255,194,75,.12) !important; border: 1px solid rgba(255,194,75,.3) !important; }
.key-status.ok { color: #3DD68C !important; background: rgba(61,214,140,.12) !important; border-color: rgba(61,214,140,.3) !important; }

/* ===== 弹窗/下拉：玻璃深空 ===== */
.as-menu, .dropdown-menu, .popover { background: rgba(23,29,46,.96) !important; border: 1px solid rgba(124,150,255,.18) !important; border-radius: 10px !important; box-shadow: 0 14px 40px rgba(0,0,0,.5), 0 0 20px rgba(108,140,255,.08) !important; backdrop-filter: blur(14px) !important; }
.as-opt:hover { background: rgba(108,140,255,.12) !important; }
.as-opt.active { background: rgba(108,140,255,.2) !important; }

/* ===== footer ===== */
.footer { background: transparent !important; border-top: 1px solid rgba(124,150,255,.12) !important; color: rgba(170,185,220,.55) !important; }
.footer a { color: #6C8CFF !important; }

/* ===== 启动屏：渐变 logo + 光晕 ===== */
#splash { background: radial-gradient(1000px 600px at 50% 20%, rgba(108,140,255,.16), transparent 60%), #0A0E1A !important; }
#splash .splash-bg { display: none !important; }
#splash .splash-logo { background: linear-gradient(135deg, #6C8CFF, #A05FF0) !important; box-shadow: 0 0 60px rgba(108,140,255,.55) !important; border-radius: 20px !important; animation: splashLogo .85s cubic-bezier(.34,1.56,.64,1) both !important; }
#splash .splash-title { color: #F2F4FF !important; }
#splash .splash-sub { color: #9FB2D8 !important; }
#splash .splash-loading span { background: linear-gradient(135deg, #6C8CFF, #A05FF0) !important; }
#splash .splash-tip { color: #9FB2D8 !important; }

/* ===== 滚动条：蓝紫渐变细条 ===== */
::-webkit-scrollbar { width: 7px !important; height: 7px !important; }
::-webkit-scrollbar-track { background: transparent !important; }
::-webkit-scrollbar-thumb { background: rgba(124,150,255,.28) !important; border-radius: 8px !important; }
::-webkit-scrollbar-thumb:hover { background: rgba(108,140,255,.5) !important; }
::-webkit-scrollbar-corner { background: transparent !important; }

/* ===== AURORA 批量槽位颜色精修 ===== */
.batch-slot { background: linear-gradient(165deg, rgba(30,38,66,.86), rgba(16,21,40,.94)) !important; border: 1px solid rgba(124,150,255,.24) !important; }
.batch-slot:hover { border-color: rgba(124,150,255,.52) !important; box-shadow: 0 14px 36px rgba(0,0,0,.45), 0 0 24px rgba(108,140,255,.18) !important; }
.slot-num { background: linear-gradient(135deg,#6C8CFF,#A05FF0) !important; box-shadow: 0 0 14px rgba(108,140,255,.5) !important; }
.batch-slot .field-label { color: #B7C4E8 !important; }
.batch-slot textarea.slot-field, .batch-slot .slot-text { background: rgba(13,18,34,.74) !important; border: 1px solid rgba(124,150,255,.26) !important; color: var(--text) !important; }
.batch-slot textarea.slot-field:focus { border-color: #6C8CFF !important; box-shadow: 0 0 0 3px rgba(108,140,255,.18) !important; }
.batch-slot textarea.slot-field::placeholder, .batch-slot .slot-text::placeholder { color: rgba(139,152,184,.75) !important; }
.slot-file-pick { background: rgba(13,18,34,.64) !important; border: 1.5px dashed rgba(124,150,255,.4) !important; }
.slot-file-pick:hover { border-color: #6C8CFF !important; background: rgba(108,140,255,.12) !important; box-shadow: 0 0 16px rgba(108,140,255,.16) !important; }
.sfp-text { color: #DCE4FB !important; }
.sfp-name.has { color: var(--green) !important; }
.slot-check-wrap { background: rgba(108,140,255,.1) !important; border: 1px solid rgba(124,150,255,.32) !important; color: #DCE4FB !important; }
.slot-check-wrap:hover { background: rgba(108,140,255,.2) !important; border-color: rgba(124,150,255,.58) !important; }
.slot-check-box { background: rgba(13,18,34,.74) !important; border: 2px solid rgba(124,150,255,.5) !important; }
.slot-check-wrap input:checked + .slot-check-box { background: linear-gradient(135deg,#6C8CFF,#A05FF0) !important; }
.slot-check-wrap input:checked ~ * { color: var(--green) !important; }
.slot-status.idle { background: rgba(139,152,184,.14) !important; color: #9AA8C8 !important; }

/* ===== AURORA 批量槽位「单独生成」按钮：玻璃蓝紫次按钮 ===== */
.batch-slot .slot-run {
  background: linear-gradient(135deg, rgba(108,140,255,.2), rgba(160,95,240,.22)) !important;
  color: #E6ECFF !important;
  border: 1px solid rgba(124,150,255,.4) !important;
  border-radius: 10px !important;
  backdrop-filter: blur(8px) !important;
  font-weight: 600 !important;
}
.batch-slot .slot-run:hover {
  background: linear-gradient(135deg, rgba(108,140,255,.34), rgba(160,95,240,.36)) !important;
  border-color: rgba(124,150,255,.66) !important;
  color: #F4F7FF !important;
  box-shadow: 0 10px 24px rgba(108,140,255,.25) !important;
  transform: translateY(-1px) !important;
}
.batch-slot .slot-run:disabled { opacity:.55 !important; cursor:not-allowed !important; }


/* ===== AURORA 图标素材替换：Lucide 线性图标 ===== */
.dz-icon svg.ic { width: 40px; height: 40px; color: var(--accent); filter: drop-shadow(0 4px 12px rgba(108,140,255,.4)); }
.h2-ico { width: 22px; height: 22px; color: var(--accent); vertical-align: -3px; margin-right: 8px; }
.result-box .placeholder::before {
  content: "" !important; display: block !important; width: 36px !important; height: 36px !important;
  margin: 0 auto 10px !important; opacity: .5 !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20class%3D%22lucide%20lucide-sparkles%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20%3E%20%3Cpath%20d%3D%22M11.017%202.814a1%201%200%200%201%201.966%200l1.051%205.558a2%202%200%200%200%201.594%201.594l5.558%201.051a1%201%200%200%201%200%201.966l-5.558%201.051a2%202%200%200%200-1.594%201.594l-1.051%205.558a1%201%200%200%201-1.966%200l-1.051-5.558a2%202%200%200%200-1.594-1.594l-5.558-1.051a1%201%200%200%201%200-1.966l5.558-1.051a2%202%200%200%200%201.594-1.594z%22%20%2F%3E%20%3Cpath%20d%3D%22M20%202v4%22%20%2F%3E%20%3Cpath%20d%3D%22M22%204h-4%22%20%2F%3E%20%3Ccircle%20cx%3D%224%22%20cy%3D%2220%22%20r%3D%222%22%20%2F%3E%20%3C%2Fsvg%3E") center/contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg%20class%3D%22lucide%20lucide-sparkles%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20%3E%20%3Cpath%20d%3D%22M11.017%202.814a1%201%200%200%201%201.966%200l1.051%205.558a2%202%200%200%200%201.594%201.594l5.558%201.051a1%201%200%200%201%200%201.966l-5.558%201.051a2%202%200%200%200-1.594%201.594l-1.051%205.558a1%201%200%200%201-1.966%200l-1.051-5.558a2%202%200%200%200-1.594-1.594l-5.558-1.051a1%201%200%200%201%200-1.966l5.558-1.051a2%202%200%200%200%201.594-1.594z%22%20%2F%3E%20%3Cpath%20d%3D%22M20%202v4%22%20%2F%3E%20%3Cpath%20d%3D%22M22%204h-4%22%20%2F%3E%20%3Ccircle%20cx%3D%224%22%20cy%3D%2220%22%20r%3D%222%22%20%2F%3E%20%3C%2Fsvg%3E") center/contain no-repeat !important;
  background-color: var(--accent) !important;
}


/* 按钮/标签内小图标 */
svg.ico { width: 15px; height: 15px; color: currentColor; vertical-align: -2px; margin-right: 5px; display: inline-block; flex-shrink: 0; }
button svg.ico, label svg.ico { vertical-align: -2px; }
p.hint svg.ico, .hint svg.ico { vertical-align: -2px; opacity: .9; }

/* ===== AURORA 图标素材替换-2：记录/帮助/钱包/转写对齐 ===== */
.record-icon svg.ico { width: 24px; height: 24px; margin-right: 0; vertical-align: middle; }
.help-q svg.ico, .help-a svg.ico { vertical-align: -3px; }
.wc-icon svg.ico, .vt-input-icon svg.ico, .vt-btn-ico svg.ico { margin-right: 4px; vertical-align: -2px; }
.settings-lock { color: var(--accent); }

/* ===== AI智能剪辑：复选框/BGM 行对齐精修 ===== */
.field-row.chk-row { align-items: center; }
.field-label.chk { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; margin: 0; }
.field-row.bgm-row .field-label { margin: 0; }
.field-row.bgm-row select, .field-row.bgm-row .btn.small { flex-shrink: 0; }

/* 左上角 logo 使用桌面应用图标 */
.topbar .brand .logo { overflow: hidden; }
.topbar .brand .logo img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; display: block; }


/* 下拉选项：强制深色可读 */
select, input, textarea { color-scheme: dark; }
select option { background: #16161c !important; color: #f4f4f5 !important; }

/* 全能参考视频：参考素材顺序徽标（图1/视频1/音频2） */
.file-chip .chip-index { flex: 0 0 auto !important; font-size: 12px; font-weight: 700; color: #fff !important; background: linear-gradient(135deg,#6371f5,#46c5ff); border-radius: 6px; padding: 2px 8px; line-height: 1.4; box-shadow: 0 2px 6px rgba(99,113,245,.35); }

/* ============================================================
   排版精修层 · 20260828（追加于 AURORA 层之后，最高优先级）
   目标：只动视觉，不动结构/逻辑；针对用户反馈的"别扭点"定向优化
   —— 账户条过高过空 / 标题过长挤压 / 侧边栏分组孤单 / 配色与焦点态
   ============================================================ */

/* —— ① 顶部账户条：压缩高度、信息聚拢、右端余额对齐 —— */
#acctBar.acct-bar {
  margin: 12px 30px 10px 254px !important;
  padding: 11px 18px !important;
  gap: 10px !important;
  height: auto !important;
  min-height: 0 !important;
  border-radius: 12px !important;
  background: linear-gradient(90deg, rgba(108,140,255,.10), rgba(160,95,240,.06)) !important;
  border: 1px solid rgba(124,150,255,.20) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  position: relative !important;
  z-index: 20 !important;
}
#acctBar .acct-txt {
  gap: 6px !important;
  font-size: 13.5px !important;
  color: #C9D4F5 !important;
  white-space: nowrap !important;
  flex: 0 0 auto !important;
}
#acctBar .acct-txt b { color: #EEF3FF !important; font-weight: 700 !important; }
#acctBar .acct-hint { font-size: 12px !important; color: #8B99BD !important; white-space: nowrap !important; }
#acctBar .acct-bal {
  margin-left: auto !important;
  padding: 6px 12px !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  gap: 9px !important;
  white-space: nowrap !important;
  flex: 0 0 auto !important;
}
#acctBar .acct-bal em { font-size: 13px !important; color: #EAF1FF !important; font-weight: 600 !important; font-variant-numeric: tabular-nums !important; }
#acctBar .acct-bal .ab-refresh {
  border-radius: 6px !important;
  font-size: 13px !important;
  opacity: .7 !important;
  transition: opacity .16s, background .16s !important;
}
#acctBar .acct-bal .ab-refresh:hover { opacity: 1 !important; background: rgba(255,255,255,.08) !important; }

/* —— ② 卡片标题：允许副标题折行，不再挤压右侧信息；加左竖条 —— */
.card h2 {
  display: flex !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  gap: .35em 9px !important;
  padding-left: 13px !important;
  font-size: 17px !important;
  line-height: 1.45 !important;
  min-height: 0 !important;
  white-space: normal !important;
  overflow: visible !important;
}
.card h2 .h2-ico { flex: 0 0 auto !important; align-self: center !important; }
.card .grid-2 > .col.result-col { align-self: start !important; }

/* —— ③ 侧边栏：恢复圆角、柔和 hover、分组间距规整 —— */
nav.tabs.sidebar .tab-btn {
  border-radius: 9px !important;
  margin: 0 !important;
  padding: 7px 12px !important;
}
nav.tabs.sidebar .tab-group + .tab-group {
  margin-top: 8px !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(124,150,255,.14) !important;
}
nav.tabs.sidebar .tab-group-label,
nav.tabs.sidebar .tab-tools-label {
  font-size: 11.5px !important;
  letter-spacing: 1.2px !important;
  color: rgba(180,195,240,.55) !important;
  padding: 4px 10px 3px !important;
  margin-bottom: 2px !important;
}
nav.tabs.sidebar .tab-btn.active .tb-ico { color: #A8C6FF !important; }

/* —— ④ 全局配色/焦点统一：柔和对齐 AURORA 蓝紫 —— */
:root {
  --t-accent-glow: rgba(108,140,255,.18);
}
.main-card, .card {
  border-radius: 14px !important;
}
.card h2::before {
  width: 3px !important;
  border-radius: 3px !important;
  background: linear-gradient(180deg, #6C8CFF, #A05FF0) !important;
}
/* 结果区：柔和内嵌卡片 */
.result-box .placeholder { background: rgba(255,255,255,.02) !important; }

/* —— ⑤ 聚焦态：清晰统一，提升键盘导航可感知性 —— */
:focus-visible {
  outline: 2px solid rgba(108,140,255,.55) !important;
  outline-offset: 2px !important;
}
input:focus, select:focus, textarea:focus {
  border-color: #6C8CFF !important;
  box-shadow: 0 0 0 3px rgba(108,140,255,.16) !important;
}

/* —— ⑥ 面板进入动画微调：仅主卡片淡入，避免凌乱错落 —— */
.panel.active .card > * { animation: none !important; }

/* ═══════════════════════════════════════════════════════
   排版精修层 II —— 针对「功能面板内部 / 顶栏 / 设置页 / 整体配色」
   在本文件末尾追加（最高级联），仅动视觉，不改任何逻辑。
   ═══════════════════════════════════════════════════════ */

/* —— ① 功能面板内部：表单更紧凑、分组分隔线统一 —— */
.card .col > .field-label {
  margin: 22px 0 10px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(124,150,255,.13) !important;
}
.card .col > .field-label:first-child {
  margin-top: 4px !important;
  padding-top: 0 !important;
  border-top: none !important;
}
.card .col > .field-label + .dropzone,
.card .col > .field-label + .prompt-presets,
.card .col > .field-label + textarea { margin-top: 2px !important; }
/* 首条 field-label 紧跟 dropzone 说明项时，避免分隔线出现 */
.card .col > .dropzone { margin-top: 8px !important; margin-bottom: 8px !important; }
.dz-inner { padding: 28px 20px !important; }
.dz-icon svg.ic { width: 36px !important; height: 36px !important; }

/* 表单项垂直节奏：label 上留白统一 4px，行间距规整 */
.card .col > textarea, .card .col > input, .card .col > select { margin-bottom: 12px !important; }
/* label 与下方控件 / 控件组间距 */
.card .col > .field-label { display: block; }
/* dropzone 之间的说明性 field-label 不额外加分隔线（①② 说明文字） */
.card .col .dropzone + .field-label { border-top: none !important; padding-top: 4px !important; }

/* —— ② field-row 内：等宽对齐、控件底部对齐（v4 加大列间距、加大控件最小宽度） —— */
.field-row { gap: 18px !important; row-gap: 14px !important; align-items: flex-end !important; }
.field-row .field-grow { min-width: 180px !important; flex: 1 1 180px !important; }
.field-row .field-grow > label.field-label,
.field-row .field-grow > .field-label { margin-bottom: 8px !important; }
/* 图生图「宽度/高度/分辨率/输出格式」四个控件一行放下：收紧最小宽 */
#panel-image-edit .field-row .field-grow { min-width: 140px !important; flex: 1 1 140px !important; }
/* 防止 4 个 select/number 挤在一行太窄：给它们独立一行时的舒适宽 */
.field-row .field-grow select, .field-row .field-grow input { width: 100% !important; min-width: 0 !important; }

/* —— ③ 批量槽位：更紧凑，编号醒目 —— */
.batch-slot { padding: 16px 18px !important; }
.batch-slot .slot-status { margin-top: 12px !important; }

/* —— ③b 批量槽位精修：编号弱化 + 勾选项提到顶部（模式选择） + 空文件引导清晰 —— */
/* 序号从抢眼的渐变大圆 + 光晕，弱化为克制的小铭牌 */
.batch-slot .slot-num {
  min-width: 22px !important; height: 22px !important; padding: 0 6px !important;
  font-size: 12px !important; font-weight: 700 !important;
  border-radius: 6px !important;
  background: rgba(124,150,255,.12) !important;
  color: #B7C4E8 !important;
  letter-spacing: .5px;
  box-shadow: none !important;
}
/* 勾选项（此处的"用上方音色"）提升为整槽位最顶部的模式卡片：清晰、不悬空 */
.batch-slot .slot-check-wrap.slot-check-top {
  margin: 0 0 12px 0 !important;
  padding: 11px 13px !important;
  gap: 10px !important;
  background: rgba(108,140,255,.10) !important;
  border: 1px solid rgba(124,150,255,.30) !important;
  border-radius: 11px !important;
}
.batch-slot .slot-check-wrap.slot-check-top:hover {
  background: rgba(108,140,255,.18) !important;
  border-color: rgba(124,150,255,.52) !important;
}
.batch-slot .slot-check-wrap.slot-check-top .slot-check-label {
  font-size: 12.5px !important; font-weight: 600 !important;
  color: #DCE4FB !important;
  line-height: 1.45 !important;
}
.batch-slot .slot-check-wrap.slot-check-top input:checked ~ .slot-check-label { color: #8BE9B6 !important; }
/* 顶部模式卡与文件区之间视觉分组 */
.batch-slot .slot-files { margin-top: 2px !important; }
/* 文件字段的 label 更聚焦，空态点击引导更直观 */
.batch-slot .slot-file-col .field-label { margin: 12px 0 7px !important; }
.batch-slot .slot-file-pick { min-height: 44px !important; padding: 10px 13px !important; }
.batch-slot .slot-file-pick .sfp-name { color: rgba(148,163,184,.85) !important; }
.batch-slot .slot-file-pick .sfp-name.has { color: #8BE9B6 !important; font-weight: 600 !important; }

/* —— ④ 顶栏账户条：信息聚拢，余额弱化为辅助态 —— */
#acctBar .acct-bal {
  padding: 5px 10px !important;
  background: rgba(255,255,255,.04) !important;
  border-radius: 8px !important;
  gap: 6px !important;
  font-size: 12.5px !important;
  color: rgba(200,212,240,.78) !important;
}
#acctBar .acct-bal .acct-bal-num { font-weight: 700 !important; color: #E8ECFF !important; }
#acctBar .acct-bal .refresh-btn { opacity: .55 !important; }

/* —— ⑤ 设置页：锁定态与表单态视觉统一，间距规整 —— */
.card.narrow { max-width: 720px !important; }
#settingsLock input#settingsPwd {
  max-width: 300px !important; margin: 16px auto !important;
  text-align: center !important; font-size: 15px !important;
  letter-spacing: 2px !important;
}
#settingsForm .field-label { margin-top: 20px !important; }
#settingsForm .field-label:first-child { margin-top: 4px !important; }
#cfgKeySelf { padding: 0 !important; }
/* 云端直连区：无首分隔线，更融合 */
#cloudConn { border-top: 1px solid rgba(124,150,255,.13) !important; padding-top: 14px !important; margin-top: 14px !important; }

/* —— ⑥ 整体配色：滚动条、自定义下拉等细节统一蓝紫 —— */
.btn.big { letter-spacing: .4px !important; }
/* 帮助浮钮更克制，避免抢占视觉 */
.help-fab { box-shadow: 0 6px 22px rgba(108,140,255,.32) !important; }