/* Default TanStack/shadcn console tokens. */
:root { --background:#f6f5f9!important; --foreground:#252238!important; --card:#fff!important; --card-foreground:#252238!important; --popover:#fff!important; --popover-foreground:#252238!important; --primary:#7055d8!important; --primary-foreground:#fff!important; --secondary:#eeecf4!important; --secondary-foreground:#252238!important; --muted:#eeecf4!important; --muted-foreground:#6b667c!important; --accent:#e9e3fa!important; --accent-foreground:#252238!important; --border:#dedbe8!important; --input:#c6c0d7!important; --ring:#7055d8!important; }
[data-slot='sidebar']{background-color:#eeecf4!important;border-color:#dedbe8!important}
[data-slot='sidebar-menu-button'][data-active='true'],[data-slot='sidebar-menu-button']:hover{background-color:#e9e3fa!important;color:#7055d8!important}
[data-slot='button'][data-variant='default'],button.bg-primary,a.bg-primary{background-color:#7055d8!important;color:#fff!important}
[data-slot='button'][data-variant='default']:hover,button.bg-primary:hover,a.bg-primary:hover{background-color:#5842b5!important}
/* ChimeraHub violet console theme overlay, v1 */
/* ============================================================
   ChimeraHub 控制台主题叠加层 (chimera-console.css) — v4 (Semi Design · 普鲁士墨蓝)
   线上控制台 = new-api classic 前端(Semi Design / @douyinfe semi-ui)。
   由 Caddy(replace-response) 注入 <link> 加载; 纯 CSS、零改源码、不影响同步。
   原理: Semi 主色/链接/悬停/聚焦派生自 --semi-blue-0~9 色阶
        (--semi-color-primary = rgba(var(--semi-blue-5),1)), 覆盖该色阶即统一换肤。
   设计: 宣纸浅色为主(默认浅色, 由注入 JS 设置) + 普鲁士墨蓝, 与新版官网/Studio 的
        「宣纸 + 水墨」同源。玻璃感卡片 / 墨蓝主按钮 / 动态墨线 / 墨蓝滚动条。
        (2026-07 从「暗色 + 香槟金」整体迁移到「浅色 + 普鲁士墨蓝」)
   ============================================================ */

/* ---- 1. 普鲁士墨蓝色阶 (亮色模式: 由浅到深, 保证白底对比) ---- */
:root,
body,
:host,
body[theme-mode='dark'] .semi-always-light {
  --semi-blue-0: 239, 243, 248 !important;
  --semi-blue-1: 219, 228, 239 !important;
  --semi-blue-2: 187, 205, 226 !important;
  --semi-blue-3: 147, 174, 205 !important;
  --semi-blue-4: 95, 129, 172 !important;
  --semi-blue-5: 44, 74, 114 !important;
  --semi-blue-6: 30, 58, 95 !important;
  --semi-blue-7: 22, 46, 76 !important;
  --semi-blue-8: 16, 35, 61 !important;
  --semi-blue-9: 11, 25, 43 !important;
}

/* ---- 1a. 宣纸页面底 (2026-07: 浅色模式背景与官网/Studio 同源宣纸 #ffffff) ---- */
/* 覆盖 Semi 背景色阶 + 页面/布局容器底色; 卡片保留玻璃感(见下 .semi-card)。
   仅浅色模式(body 非 dark); 暗色模式保持 Semi 原深底不动。
   双保险: 同时覆盖 --semi-color-bg-* 通道值与 body/容器实际底色, 兼容 Semi 不同取值方式。 */
body:not([theme-mode='dark']),
:root:not([theme-mode='dark']) {
  --semi-color-bg-0: 242, 241, 239 !important; /* #f6f5f9 灰宣主底 (2026-07-20 弃米黄) */
  --semi-color-bg-1: 236, 234, 230 !important; /* #eeecf4 */
  --semi-color-bg-2: 233, 231, 227 !important; /* #e9e3fa */
  --semi-color-bg-3: 222, 219, 213 !important; /* #dedbe8 */
}
/* 仅 classic(Semi) 前端生效: default 前端 body 无 theme-mode 属性,
   裸 :not 会误命中并盖掉暖黑底(2026-07-20 上线审计发现), 用 :has(.semi-layout) 限定 */
body:not([theme-mode='dark']):has(.semi-layout) {
  background-color: #f6f5f9 !important;
}
body:not([theme-mode='dark']) .semi-layout,
body:not([theme-mode='dark']) .semi-layout-content,
body:not([theme-mode='dark']) .semi-layout-sider,
body:not([theme-mode='dark']) .semi-layout-header {
  background-color: transparent !important;
}

/* ---- 1b. 普鲁士墨蓝色阶 (暗色模式: 更亮更雅, Semi 中 6/7 更亮) ---- */
body[theme-mode='dark'],
:host([theme-mode='dark']),
body .semi-always-dark {
  --semi-blue-0: 18, 26, 38 !important;
  --semi-blue-1: 24, 36, 54 !important;
  --semi-blue-2: 33, 52, 78 !important;
  --semi-blue-3: 46, 74, 112 !important;
  --semi-blue-4: 74, 108, 156 !important;
  --semi-blue-5: 120, 156, 200 !important;
  --semi-blue-6: 150, 182, 220 !important;
  --semi-blue-7: 180, 205, 234 !important;
  --semi-blue-8: 210, 226, 244 !important;
  --semi-blue-9: 234, 243, 251 !important;
}

/* ---- 2. 各处封面横幅蒙版(模型广场/个人中心/充值/邀请): 蓝绿 -> 普鲁士墨蓝 ---- */
/* 源码统一用 rgba(var(--palette-primary-darkerChannel) / 80%), 通道值【必须空格分隔】
   才能与 / alpha 语法合法(逗号 + /alpha 是非法 CSS, 会让整条蒙版失效→横幅变白→白字标签看不清)。
   墨蓝压到中深档, 保证横幅上的白色文字(用户名/超管/ID 标签)有足够对比。 */
[style*='palette-primary-darkerChannel'] {
  --palette-primary-darkerChannel: 30 58 95 !important;
}
body[theme-mode='dark'] [style*='palette-primary-darkerChannel'] {
  --palette-primary-darkerChannel: 22 46 76 !important;
}
/* 双保险: 封面横幅(深色蒙版)上的白字标签加细微暗描边, 任何底色都清晰可读 */
.semi-card-cover [class*='semi-tag'] {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
}

/* ---- 3. 主按钮: 墨蓝渐变 + 微光 + 悬停流光扫过 (uiverse 风) ---- */
.semi-button-primary {
  background-image: linear-gradient(135deg, #806be0 0%, #7055d8 52%, #5842b5 100%) !important;
  color: #ffffff !important;
  border: none !important;
  position: relative;
  overflow: hidden;
  font-weight: 600;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.14) inset,
    0 6px 18px -6px rgba(30, 58, 95, 0.5);
}
.semi-button-primary:hover {
  filter: brightness(1.08);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.2) inset,
    0 10px 28px -6px rgba(30, 58, 95, 0.72) !important;
}
.semi-button-primary::after {
  content: '';
  position: absolute;
  top: 0;
  left: -130%;
  width: 55%;
  height: 100%;
  background: linear-gradient(110deg, transparent, rgba(255, 255, 255, 0.32), transparent);
  transform: skewX(-18deg);
  transition: left 0.55s ease;
  pointer-events: none;
}
.semi-button-primary:hover::after {
  left: 150%;
}

/* ---- 4. 卡片: 墨蓝边微光 + 悬浮抬升 (暗色更深阴影) ---- */
.semi-card {
  border: 1px solid rgba(30, 58, 95, 0.16) !important;
  box-shadow: 0 6px 22px -14px rgba(0, 0, 0, 0.3);
}
body[theme-mode='dark'] .semi-card {
  border: 1px solid rgba(150, 182, 220, 0.14) !important;
  box-shadow: 0 12px 34px -18px rgba(0, 0, 0, 0.75);
}
@media (min-width: 641px) and (prefers-reduced-motion: no-preference) {
  .semi-card {
    transition:
      transform 0.18s ease,
      box-shadow 0.25s ease,
      border-color 0.25s ease;
  }
  .semi-card:hover {
    transform: translateY(-2px);
    border-color: rgba(44, 74, 114, 0.4) !important;
    box-shadow:
      0 14px 36px -14px rgba(30, 58, 95, 0.28),
      0 4px 12px -6px rgba(0, 0, 0, 0.3);
  }
}

/* ---- 5. 顶栏: 动态墨蓝流光细线 ---- */
header {
  position: relative;
}
header::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(44, 74, 114, 0.5),
    rgba(120, 156, 200, 0.85),
    rgba(44, 74, 114, 0.5),
    transparent
  );
  background-size: 200% 100%;
  animation: chimeraSheen 6s linear infinite;
}
@keyframes chimeraSheen {
  0% {
    background-position: 0% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

/* ---- 6. 侧边导航选中项: 墨蓝左条 + 柔光 ---- */
.semi-navigation-item-selected {
  position: relative;
}
.semi-navigation-item-selected::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 58%;
  border-radius: 3px;
  background: linear-gradient(180deg, #5f81ac, #5842b5);
  box-shadow: 0 0 10px rgba(44, 74, 114, 0.55);
}

/* ---- 7. 输入/选择 聚焦: 墨蓝环 ---- */
.semi-input-wrapper:focus-within,
.semi-select-focus,
.semi-input-wrapper-focus {
  box-shadow: 0 0 0 3px rgba(44, 74, 114, 0.22) !important;
}

/* ---- 8. 滚动条 + 文本选区 墨蓝化 ---- */
* {
  scrollbar-color: rgba(44, 74, 114, 0.5) transparent !important;
}
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #4a6c9c, #5842b5);
  border-radius: 6px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #5f81ac, #7055d8);
  background-clip: padding-box;
}
::selection {
  background: rgba(44, 74, 114, 0.24);
  color: inherit;
}

/* ---- 9. 仪表盘统计图标: 八种彩虹色 -> 统一墨蓝质感(去 AI 感) ---- */
/* 源码用 Semi <Avatar color=blue/purple/green/cyan/yellow/pink/indigo/orange>,
   仅作用于卡片内头像, 不影响右上角用户头像 */
.semi-card .semi-avatar {
  background: radial-gradient(
    circle at 30% 25%,
    rgba(120, 156, 200, 0.3),
    rgba(30, 58, 95, 0.12)
  ) !important;
  border: 1px solid rgba(44, 74, 114, 0.4) !important;
  box-shadow:
    0 2px 10px -4px rgba(30, 58, 95, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  color: #a9c2e2 !important;
}
.semi-card .semi-avatar svg,
.semi-card .semi-avatar .semi-icon,
.semi-card .semi-avatar .semi-avatar-content {
  color: #a9c2e2 !important;
  fill: currentColor;
}
/* 亮色模式: 图标用更深的墨蓝以保对比 */
body:not([theme-mode='dark']) .semi-card .semi-avatar {
  background: radial-gradient(
    circle at 30% 25%,
    rgba(44, 74, 114, 0.2),
    rgba(30, 58, 95, 0.08)
  ) !important;
  color: #7055d8 !important;
}
body:not([theme-mode='dark']) .semi-card .semi-avatar svg,
body:not([theme-mode='dark']) .semi-card .semi-avatar .semi-icon,
body:not([theme-mode='dark']) .semi-card .semi-avatar .semi-avatar-content {
  color: #7055d8 !important;
}

/* ---- 10. 仪表盘头部彩色按钮(绿/蓝) -> 墨蓝 ---- */
button.bg-green-500,
button.bg-blue-500,
.semi-button.bg-green-500,
.semi-button.bg-blue-500 {
  background: linear-gradient(135deg, #806be0, #5842b5) !important;
  border-color: transparent !important;
  color: #ffffff !important;
}
button.bg-green-500:hover,
button.bg-blue-500:hover,
.semi-button.bg-green-500:hover,
.semi-button.bg-blue-500:hover {
  filter: brightness(1.08);
  background: linear-gradient(135deg, #4a6c9c, #7055d8) !important;
}

/* ---- 11. 卡片标题区图标(lucide) -> 墨蓝 ---- */
.semi-card .semi-card-header svg,
.semi-card .semi-card-header-title svg {
  color: #7055d8 !important;
}

/* ---- 降低动效偏好 ---- */
@media (prefers-reduced-motion: reduce) {
  header::after {
    animation: none;
  }
  .semi-button-primary::after {
    display: none;
  }
}

/* ============================================================
   14. 新版前端 (shadcn/ui + Radix + TanStack Router) 暖黑砚 Inkstone (2026-07-20)
   ------------------------------------------------------------
   与官网 V3 / Studio 同源: 暖黑 #0C0A08 / 米白 #EDE8E0 / 琥珀 #C9A26B。
   默认深色(由注入 JS v41 强制重置一次); 浅色保留为「灰宣」校准版
   (中性灰底, 避开奶油色带, 琥珀加深保对比), 供用户手动切换。
   注入 css 在 new-api index.css 之后加载 + !important, 稳定覆盖其变量默认值。
   ============================================================ */
html:not(.dark),
:root:not(.dark) {
  --background: #f6f5f9 !important;        /* 灰宣主底 (中性, 非米黄) */
  --foreground: #252238 !important;
  --card: #ffffff !important;
  --card-foreground: #252238 !important;
  --popover: #ffffff !important;
  --popover-foreground: #252238 !important;
  --primary: #7055d8 !important;           /* 深琥珀 (浅底对比 >= 4.5:1) */
  --primary-foreground: #fbfaf8 !important;
  --secondary: #e9e3fa !important;
  --secondary-foreground: #252238 !important;
  --muted: #eeecf4 !important;
  --muted-foreground: #6b667c !important;
  --accent: #e9e3fa !important;
  --accent-foreground: #5842b5 !important;
  --destructive: #9a4238 !important;
  --success: #4f7a4a !important;
  --warning: #a8632b !important;
  --info: #4e6b84 !important;
  --border: #dedbe8 !important;
  --input: #c6c0d7 !important;
  --ring: #7055d8 !important;
  --sidebar: #eeecf4 !important;
  --sidebar-foreground: #252238 !important;
  --sidebar-primary: #7055d8 !important;
  --sidebar-primary-foreground: #fbfaf8 !important;
  --sidebar-accent: #e9e3fa !important;
  --sidebar-accent-foreground: #5842b5 !important;
  --sidebar-border: #dedbe8 !important;
  --sidebar-ring: #7055d8 !important;
}
html.dark,
:root.dark {
  --background: #252238 !important;        /* 暖黑砚主底 (与官网同一张纸) */
  --foreground: #ede8e0 !important;
  --card: #312b4b !important;
  --card-foreground: #ede8e0 !important;
  --popover: #252238 !important;
  --popover-foreground: #ede8e0 !important;
  --primary: #9c8ae8 !important;           /* 琥珀: 主操作 / 选中 / 链接 */
  --primary-foreground: #252238 !important;
  --secondary: #3a3159 !important;
  --secondary-foreground: #ede8e0 !important;
  --muted: #252238 !important;
  --muted-foreground: #a89f92 !important;
  --accent: #3a3159 !important;
  --accent-foreground: #ede8e0 !important;
  --destructive: #b4554b !important;
  --success: #7fa37a !important;
  --warning: #d08b4a !important;
  --info: #7e93a8 !important;
  --border: #4a416c !important;
  --input: #3a332b !important;
  --ring: #9c8ae8 !important;
  --chart-1: #9c8ae8 !important;
  --chart-2: #7fa37a !important;
  --chart-3: #d08b4a !important;
  --chart-4: #7e93a8 !important;
  --chart-5: #b4554b !important;
  --overview-accent-1: #9c8ae8 !important;
  --overview-accent-2: #7fa37a !important;
  --overview-accent-3: #7e93a8 !important;
  --sidebar: #0a0806 !important;
  --sidebar-foreground: #ede8e0 !important;
  --sidebar-primary: #9c8ae8 !important;
  --sidebar-primary-foreground: #252238 !important;
  --sidebar-accent: #3a3159 !important;
  --sidebar-accent-foreground: #ede8e0 !important;
  --sidebar-border: #4a416c !important;
  --sidebar-ring: #9c8ae8 !important;
  --skeleton-base: #252238 !important;
  --skeleton-highlight: #241e17 !important;
}



/* v3: align legacy Semi surfaces with the violet console palette. */
html:not(.dark), :root:not(.dark), body:not([theme-mode='dark']) {
  --semi-color-bg-0: 243, 240, 251 !important;
  --semi-color-bg-1: 236, 232, 246 !important;
  --semi-color-bg-2: 228, 220, 248 !important;
  --semi-color-bg-3: 221, 214, 235 !important;
  --semi-blue-0: 244, 241, 252 !important;
  --semi-blue-1: 232, 225, 249 !important;
  --semi-blue-2: 215, 204, 244 !important;
  --semi-blue-3: 190, 174, 237 !important;
  --semi-blue-4: 156, 138, 232 !important;
  --semi-blue-5: 112, 85, 216 !important;
  --semi-blue-6: 88, 66, 181 !important;
  --semi-blue-7: 70, 51, 154 !important;
  --semi-blue-8: 52, 38, 122 !important;
  --semi-blue-9: 38, 28, 91 !important;
}
body:not([theme-mode='dark']) .semi-layout,
body:not([theme-mode='dark']) .semi-layout-sider,
body:not([theme-mode='dark']) .semi-navigation,
body:not([theme-mode='dark']) .semi-navigation-list {
  background-color: #ece8f6 !important;
}
body:not([theme-mode='dark']) .semi-navigation-item-selected,
body:not([theme-mode='dark']) .semi-navigation-item:hover {
  background-color: #e4dcf8 !important;
  color: #7055d8 !important;
}
body:not([theme-mode='dark']) .semi-navigation-item-selected::before {
  background: #7055d8 !important;
  box-shadow: 0 0 10px rgba(112, 85, 216, .35) !important;
}


/* v4: usage-log table chrome must not inherit the legacy green fill. */
body:not([theme-mode='dark']) .semi-table,
body:not([theme-mode='dark']) .semi-table-container,
body:not([theme-mode='dark']) .semi-table-thead,
body:not([theme-mode='dark']) .semi-table-thead > .semi-table-row,
body:not([theme-mode='dark']) .semi-table-thead > .semi-table-row > .semi-table-row-head {
  background-color: #e9e3f4 !important;
  background-image: none !important;
  border-color: #ded8eb !important;
}
body:not([theme-mode='dark']) .semi-table-thead > .semi-table-row > .semi-table-row-head {
  color: #4d4664 !important;
  font-weight: 600;
}
body:not([theme-mode='dark']) .semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell {
  background-color: #f3f0fb !important;
}


/* v5: new TanStack/shadcn tables use native table[data-slot] markup. */
html:not(.dark) [data-slot='table-header'],
html:not(.dark) [data-slot='table-head'],
html:not(.dark) table thead,
html:not(.dark) table thead tr,
html:not(.dark) table thead th {
  background-color: #e9e3f4 !important;
  background-image: none !important;
  color: #4d4664 !important;
  border-color: #ded8eb !important;
}
html:not(.dark) [data-slot='table-row']:hover,
html:not(.dark) table tbody tr:hover,
html:not(.dark) table tbody tr:hover td {
  background-color: #f3f0fb !important;
}


/* v6: overview success/chart accents follow the violet brand, not green. */
html:not(.dark), :root:not(.dark) {
  --success: #7055d8 !important;
  --success-foreground: #ffffff !important;
  --chart-1: #7055d8 !important;
  --chart-2: #9c8ae8 !important;
  --chart-3: #806be0 !important;
  --chart-4: #5842b5 !important;
  --chart-5: #b9aaf0 !important;
  --overview-accent-1: #7055d8 !important;
  --overview-accent-2: #9c8ae8 !important;
  --overview-accent-3: #5842b5 !important;
}
html.dark, :root.dark {
  --success: #9c8ae8 !important;
  --success-foreground: #252238 !important;
  --chart-2: #9c8ae8 !important;
  --overview-accent-2: #9c8ae8 !important;
}