/* ============================================================
   曜火品牌主题 · 注入层（Yohoo Token）
   由 nginx 反代注入（yaohuotech.com / console.yaohuotech.com / api.yaohuotech.com），
   不修改 new-api 源码。

   分两层：
     A. CSS 变量层 —— 覆盖 new-api 自带主题系统（控制台内部页面基本都读这套变量）
     B. 落地页层 —— 前台首页用的是 Tailwind 工具类 + 内联渐变，不读变量，
        只能按类名精确覆盖（见文件下半部分）
   ============================================================ */

/* ============================================================
   A. 主题变量层（控制台 / 登录页）
   ============================================================ */
:root {
  /* 主色 */
  --primary: #C71722 !important;
  --primary-foreground: #FFFFFF !important;
  --ring: #C71722 !important;
  --secondary-foreground: #8A0E16 !important;

  /* 次级高亮（沿用其暗色主题的 color-mix 公式，保证是"淡底"而不是"实色块"） */
  --accent: color-mix(in oklch, #C71722 12%, #FFFFFF) !important;
  --accent-foreground: #8A0E16 !important;

  /* 侧栏 */
  --sidebar-primary: #C71722 !important;
  --sidebar-primary-foreground: #FFFFFF !important;
  --sidebar-accent: #FDF0F1 !important;
  --sidebar-accent-foreground: #A6111B !important;

  /* 概览页图表配色 */
  --overview-accent-1: #C71722 !important;
  --overview-accent-2: #E0818A !important;
  --overview-accent-3: #A8A296 !important;
}

/* 深色模式下提亮一档，保证对比度 */
.dark, [data-theme="dark"], html.dark {
  --primary: #E0343F !important;
  --sidebar-primary: #E0343F !important;
  --sidebar-accent: color-mix(in oklch, #E0343F 24%, #000000) !important;
  --sidebar-accent-foreground: #FFD9DC !important;
  --accent: color-mix(in oklch, #E0343F 20%, #000000) !important;
}

/* ============================================================
   B. 落地页层（前台首页）
   首页 hero 用的是 Tailwind 工具类，实测元素：
     · 渐变标题 span: class="bg-gradient-to-r from-blue-400 via-violet-400 to-purple-500 bg-clip-text text-transparent"
     · 徽标「人工智能应用基座」span: 自身无 class，父级为
       "landing-animate-fade-up mb-5 inline-flex items-center gap-1.5 rounded-..."
     · 背景光晕 div: "pointer-events-none absolute inset-0 -z-10 opacity-25 dark:opacity-[0.12]"
                     "absolute inset-0 -z-10 opacity-20 dark:opacity-[0.08]"
   这些都不读 --primary，必须按类名覆盖。
   ============================================================ */

/* B1. Hero 渐变标题：蓝 → 紫  改成  品牌红渐变 */
[class*="bg-gradient-to-r"][class*="from-blue-400"],
[class*="bg-gradient-to-r"][class*="from-blue-400"][class*="to-purple-500"] {
  background-image: linear-gradient(to right, #E8636C 0%, #C71722 52%, #8A0E16 100%) !important;
}

/* B2. Hero 徽标「人工智能应用基座」：蓝字 + 淡蓝底 → 品牌红 */
[class*="landing-animate-fade-up"][class*="mb-5"] {
  background-color: rgba(199, 23, 34, 0.06) !important;
  border-color: rgba(199, 23, 34, 0.22) !important;
}
[class*="landing-animate-fade-up"][class*="mb-5"] span {
  color: #C71722 !important;
}

/* B3. 背景光晕：蓝色 radial-gradient → 品牌红（保持原几何与透明度） */
[class*="-z-10"][class*="inset-0"][class*="opacity-25"] {
  background-image:
    radial-gradient(60% 50% at 20% 20%, rgba(199, 23, 34, 0.55) 0%, rgba(0, 0, 0, 0) 70%),
    radial-gradient(50% 40% at 80% 15%, rgba(199, 23, 34, 0.34) 0%, rgba(0, 0, 0, 0) 70%) !important;
}
[class*="-z-10"][class*="inset-0"][class*="opacity-20"] {
  background-image:
    radial-gradient(50% 50% at 30% 50%, rgba(199, 23, 34, 0.42) 0%, rgba(0, 0, 0, 0) 70%),
    radial-gradient(40% 40% at 70% 40%, rgba(199, 23, 34, 0.26) 0%, rgba(0, 0, 0, 0) 70%) !important;
}

/* B4. 主 CTA「开始使用」若落到深色实底，统一品牌红 */
[class*="bg-foreground"][class*="text-background"] {
  background-color: #C71722 !important;
  color: #FFFFFF !important;
}

/* ============================================================
   C. 首页（落地页）排版放大 + 算力元素
   ------------------------------------------------------------
   背景：new-api 落地页整体字号偏小 —— 正文 14px、卡片标题也 14px
   （和正文同级，层级拉不开），hero 副标题只有 15px。作为营销页
   偏紧凑。这里整体上浮一档，让层级和节奏更像官网。

   作用域：`.yh-home` —— 由 brand-site.js 在 pathname === '/' 时
   挂到落地页外壳 div 上。因此 **不影响** /pricing、/rankings、
   /about 以及控制台（那些页面没有 .yh-home）。
   ============================================================ */

/* ---- C1. 顶栏 ---- */
.yh-home header nav a[class*="text-sm"] { font-size: 15px !important; }
.yh-home header nav span[class*="text-sm"] { font-size: 15.5px !important; }

/* ---- C2. Hero ---- */
.yh-home h1 {
  font-size: clamp(2.6rem, 4.6vw, 3.75rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.022em !important;
}
.yh-home h1 + p {
  font-size: 18px !important;
  line-height: 1.78 !important;
  max-width: 36rem !important;
}
/* hero 徽标「人工智能应用基座」 */
.yh-home [class*="landing-animate-fade-up"][class*="mb-5"] {
  font-size: 12.5px !important;
  padding: 7px 14px !important;
}
/* hero 主/次按钮 */
.yh-home [class*="landing-animate-fade-up"][class*="mt-8"] a[data-slot="button"] {
  font-size: 15.5px !important;
  height: 46px !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}
/* 客户端芯片（Cherry Studio / CC Switch …） */
.yh-home a[class*="rounded-full"][class*="px-5"] {
  font-size: 15px !important;
  padding-top: 11px !important;
  padding-bottom: 11px !important;
}
.yh-home a[class*="rounded-full"][class*="px-5"] svg {
  width: 26px !important;
  height: 26px !important;
}

/* ---- C3. 区块标题 ---- */
.yh-home section h2 {
  font-size: 2.35rem !important;
  line-height: 1.18 !important;
}
.yh-home section p[class*="tracking-widest"] {
  font-size: 13px !important;
  letter-spacing: 0.14em !important;
}
.yh-home h1,
.yh-home h2 { text-wrap: balance; }

/* ---- C4. 卡片：标题 / 正文 / 徽章 ---- */
.yh-home h3[class*="text-sm"] { font-size: 18.5px !important; letter-spacing: -0.01em !important; }
.yh-home h3[class*="text-base"] { font-size: 20px !important; }
.yh-home p[class*="text-sm"] { font-size: 16.5px !important; line-height: 1.72 !important; }
.yh-home span[class*="size-7"][class*="tabular-nums"] { font-size: 12px !important; }
.yh-home div[class*="yohoo-vendor-chip"] {
  font-size: 13.5px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}
.yh-home div[class*="size-6"][class*="rounded-full"] { font-size: 14px !important; }

/* ---- C5. 统计数字带 ----
   字号用 clamp 而不是固定值：窄屏（两列）里「¥0.15 起」按 2.6rem 会折行。 */
.yh-home [class*="md:grid-cols-4"] > div > span:first-child {
  font-size: clamp(1.9rem, 4.2vw, 2.6rem) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.1 !important;
}
.yh-home [class*="md:grid-cols-4"] > div > span:nth-child(2) {
  font-size: 14px !important;
  margin-top: 9px !important;
}

/* ---- C6. 代码示例卡 ----
   卡内没有 pre/code 元素，正文是 div+span（容器类含 font-mono，
   容器上写着 text-[12.5px]）。容器高度是写死的 h-[400px] /
   grid-rows-[235px_...]，字号调大后要同步抬高，否则 REQUEST 区会被裁。 */
.yh-home [class*="font-mono"] { font-size: 13.5px !important; line-height: 1.62 !important; }
.yh-home [class*="h-[400px]"] {
  height: 440px !important;
  grid-template-rows: 262px minmax(0, 1fr) !important;
}

/* ---- C7. 卡片悬停微动效 ---- */
.yh-home [class*="bg-background"][class*="p-7"] {
  transition: transform .28s ease, box-shadow .28s ease, background-color .28s ease !important;
}
.yh-home [class*="bg-background"][class*="p-7"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px -20px rgba(199, 23, 34, .38);
}

/* ---- C8. 页脚 ---- */
.yh-home footer,
.yh-home footer a,
.yh-home footer p,
.yh-home footer span { font-size: 13.5px !important; }

/* ---- C9. 算力脉络（hero 装饰层，纯视觉） ---- */
.yh-fabric {
  position: absolute;
  inset: 0;
  z-index: -5;
  pointer-events: none;
  overflow: hidden;
  opacity: .42;
}
.yh-fabric svg { display: block; width: 100%; height: 100%; }
.yh-fabric .yh-node { transform-box: fill-box; transform-origin: center; animation: yhNodePulse 4.2s ease-in-out infinite; }
.yh-fabric .yh-link { animation: yhLinkFlow 3.6s linear infinite; }
@keyframes yhNodePulse { 0%, 100% { opacity: .18; } 50% { opacity: .95; } }
@keyframes yhLinkFlow { to { stroke-dashoffset: -48; } }

/* ---- C10. 「算力底座」区块 ---- */
.yh-compute-sec { position: relative; overflow: hidden; }
.yh-compute-sec .yh-fabric { opacity: .3; }
.yh-compute {
  display: grid;
  gap: 1px;
  background: var(--border, #E7E7E9);
  border: 1px solid var(--border, #E7E7E9);
  border-radius: 16px;
  overflow: hidden;
}
@media (min-width: 900px) { .yh-compute { grid-template-columns: repeat(4, 1fr); } }
.yh-compute-card { background: var(--background, #fff); padding: 24px 22px; }
.yh-compute-ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px;
  background: rgba(199, 23, 34, .07);
  border: 1px solid rgba(199, 23, 34, .18);
  color: #C71722;
}
.yh-compute-card h3 { font-size: 17.5px !important; font-weight: 600; margin: 0 0 8px; }
.yh-compute-card p { font-size: 15px !important; line-height: 1.72 !important; margin: 0; color: var(--muted-foreground); }

/* ---- C11. 实时算力监测条 ---- */
.yh-live {
  margin-top: 20px;
  border: 1px solid rgba(199, 23, 34, .18);
  border-radius: 16px;
  padding: 20px 22px;
  background: linear-gradient(180deg, rgba(199, 23, 34, .05) 0%, rgba(199, 23, 34, 0) 100%);
}
.yh-live-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #A6111B;
  margin-bottom: 16px;
}
.yh-live-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, .55);
  animation: yhDot 2.4s ease-out infinite;
}
@keyframes yhDot {
  0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .5); }
  70% { box-shadow: 0 0 0 8px rgba(34, 197, 94, 0); }
  100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}
.yh-live-grid { display: grid; grid-template-columns: repeat(1, 1fr); gap: 16px; }
@media (min-width: 700px) { .yh-live-grid { grid-template-columns: repeat(3, 1fr); } }
.yh-live-n {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--foreground);
  font-variant-numeric: tabular-nums;
}
.yh-live-n small { font-size: 13px; font-weight: 500; color: var(--muted-foreground); margin-left: 4px; }
.yh-live-l { margin-top: 4px; font-size: 12.5px; color: var(--muted-foreground); }
.yh-live-note { margin-top: 16px; font-size: 12px; color: var(--muted-foreground); }

/* 尊重系统「减少动态效果」偏好 */
@media (prefers-reduced-motion: reduce) {
  .yh-fabric .yh-node,
  .yh-fabric .yh-link,
  .yh-live-dot,
  .yh-c3-bd,
  .yh-c3-link,
  .yh-c3-halo { animation: none !important; }
}

/* ============================================================
   D. 核心功能四宫格 · 03「境内合规算力」/ 04「开发者友好」增强
   ------------------------------------------------------------
   这两格原来是「1/2/3 序号清单」和「4 个灰色圆形缩写」，视觉单薄，
   且带写死的 Tailwind 蓝色（bg-blue-500/20 / text-blue-500），与全站
   品牌红不统一。展示层由 brand-site.js 的 enhanceFeatureCards() 重建，
   这里只负责样式。作用域仍是 .yh-home —— /pricing 与控制台零影响。
   ============================================================ */

/* ---- D1. 03 合规边界示意图 ---- */
.yh-home .yh-c3-visual { margin-top: 16px; }
.yh-home .yh-c3-svg { display: block; width: 100%; height: auto; }

/* 边界线缓慢流动，暗示「持续的合规校验」 */
.yh-c3-bd { animation: yhC3Dash 11s linear infinite; }
@keyframes yhC3Dash { to { stroke-dashoffset: -52; } }

/* 节点底色跟主题走，深色模式自动变暗底 */
.yh-c3-node {
  fill: var(--background, #fff);
  stroke: rgba(199, 23, 34, .5);
  stroke-width: 1.2;
}
.dark .yh-c3-node,
[data-theme="dark"] .yh-c3-node,
html.dark .yh-c3-node { fill: rgba(199, 23, 34, .12); }

/* 节点背后的红色光晕，逐个错峰呼吸（幅度压小，避免看成"圆盘"） */
.yh-c3-halo { opacity: .05; animation: yhC3Halo 3.8s ease-in-out infinite; }
@keyframes yhC3Halo { 0%, 100% { opacity: .04; } 50% { opacity: .11; } }

/* 节点之间的数据流 */
.yh-c3-link { animation: yhC3Flow 2.4s linear infinite; }
@keyframes yhC3Flow { to { stroke-dashoffset: -20; } }

.yh-c3-t1 { fill: #A6111B; font-family: inherit; }
.yh-c3-cap { fill: var(--muted-foreground, #8a919a); font-size: 10.5px; font-family: inherit; }
.dark .yh-c3-t1,
[data-theme="dark"] .yh-c3-t1,
html.dark .yh-c3-t1 { fill: #FF9AA2; }

/* ---- D2. 04 接入方式四宫格 ---- */
.yh-home .yh-c4-body { margin-top: 16px; }
.yh-home .yh-c4-tiles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 760px) { .yh-home .yh-c4-tiles { grid-template-columns: repeat(4, 1fr); } }

.yh-home .yh-c4-tile {
  border: 1px solid var(--border, #E7E7E9);
  border-radius: 12px;
  padding: 11px 13px;
  background: rgba(199, 23, 34, .022);
  transition: border-color .25s ease, background-color .25s ease, transform .25s ease;
}
.yh-home .yh-c4-tile:hover {
  border-color: rgba(199, 23, 34, .28);
  background: rgba(199, 23, 34, .06);
  transform: translateY(-1px);
}
.yh-home .yh-c4-ico {
  display: flex;
  width: 26px;
  height: 26px;
  margin-bottom: 8px;
  border-radius: 8px;
  align-items: center;
  justify-content: center;
  background: rgba(199, 23, 34, .08);
  color: #C71722;
}
.yh-home .yh-c4-tile b {
  display: block;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--foreground);
}
.yh-home .yh-c4-tile em {
  display: block;
  margin-top: 3px;
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.5;
  white-space: pre-line;   /* 文案里的 \n 用来锁定两行，避免单字掉行 */
  color: var(--muted-foreground);
}
.yh-home .yh-c4-note {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 11px;
  font-size: 11.5px;
  color: var(--muted-foreground);
}
.yh-home .yh-c4-note svg { flex: none; color: #C71722; }

/* ============================================================
   E. 核心功能四宫格 · 01「极速」/ 02「安全可靠」风格对齐
   ------------------------------------------------------------
   这两格原来是「6 枚灰底芯片（hover 是写死的 Tailwind 蓝）」和「一个
   绿色盾牌圆标 + 大片留白」。展示层由 brand-site.js 的
   enhanceFeatureCards() 重建，这里只负责样式，与 D 段共用同一套设计
   语汇（淡红底 rgba(199,23,34,.022) / 红描边 / 红图标方块 / 红字脚注），
   让四格看起来是一套东西。作用域仍是 .yh-home。
   ============================================================ */

/* ---- E1. 01 极速：厂商芯片墙 ---- */
.yh-home .yh-c1-body { margin-top: 16px; }
.yh-home .yh-c1-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (min-width: 700px) { .yh-home .yh-c1-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.yh-home .yh-c1-tile {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  border: 1px solid var(--border, #E7E7E9);
  border-radius: 12px;
  background: rgba(199, 23, 34, .022);
  color: inherit;
  text-decoration: none;
  transition: border-color .25s ease, background-color .25s ease, transform .25s ease;
}
.yh-home .yh-c1-tile:hover {
  border-color: rgba(199, 23, 34, .28);
  background: rgba(199, 23, 34, .06);
  transform: translateY(-1px);
}
.yh-home .yh-c1-ico {
  display: flex;
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  align-items: center;
  justify-content: center;
  background: rgba(199, 23, 34, .08);
  color: #C71722;
}
.yh-home .yh-c1-tx { min-width: 0; }
.yh-home .yh-c1-tx b {
  display: block;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--foreground);
  white-space: nowrap;
}
.yh-home .yh-c1-tx em {
  display: block;
  margin-top: 2px;
  font-size: 11.5px;
  font-style: normal;
  color: var(--muted-foreground);
}
/* 第 6 格是入口：箭头靠右，hover 时红移 */
.yh-home .yh-c1-more { justify-content: flex-start; }
.yh-home .yh-c1-arw {
  display: flex;
  margin-left: auto;
  color: var(--muted-foreground);
  transition: color .25s ease, transform .25s ease;
}
.yh-home .yh-c1-more:hover .yh-c1-arw { color: #C71722; transform: translateX(2px); }

/* ---- E2. 02 安全可靠：安全边界面板 ---- */
.yh-home .yh-c2-body { margin-top: 16px; }
.yh-home .yh-c2-panel {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 13px;
  border: 1px solid rgba(199, 23, 34, .16);
  border-radius: 12px;
  background: rgba(199, 23, 34, .028);
}
.yh-home .yh-c2-badge {
  display: flex;
  flex: none;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  align-items: center;
  justify-content: center;
  background: rgba(199, 23, 34, .08);
  color: #C71722;
}
.yh-home .yh-c2-list { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.yh-home .yh-c2-row {
  display: flex;
  align-items: baseline;
  gap: 7px;
  font-size: 11.5px;
  line-height: 1.35;
}
.yh-home .yh-c2-row svg { flex: none; align-self: center; color: #C71722; }
.yh-home .yh-c2-row b {
  flex: none;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--foreground);
}
.yh-home .yh-c2-row em {
  min-width: 0;
  font-style: normal;
  color: var(--muted-foreground);
}
.yh-home .yh-c2-note {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 11px;
  font-size: 11.5px;
  color: var(--muted-foreground);
}
.yh-home .yh-c2-note svg { flex: none; color: #C71722; }

/* 深色模式下红色图标提亮，否则压在暗底上发闷 */
.dark .yh-home .yh-c1-ico,
[data-theme="dark"] .yh-home .yh-c1-ico,
html.dark .yh-home .yh-c1-ico,
.dark .yh-home .yh-c2-badge,
[data-theme="dark"] .yh-home .yh-c2-badge,
html.dark .yh-home .yh-c2-badge { color: #FF8A92; }

/* ============================================================
   F. 排行榜（/rankings）· 实测性能榜
   数据全部来自平台真实探测（/model-probe.json + /api/perf-metrics/summary），
   样式沿用 E/D 段那套设计语言：淡红底 + 细描边 + 品牌红渐变条。
   作用域限定 .yh-rank-sec，不影响 new-api 原有榜单卡片。
   ============================================================ */
.yh-rank-sec { padding: 20px 24px 18px; }
.yh-rank-head { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.yh-rank-head h2 { margin: 0; font-size: 17px; font-weight: 600; letter-spacing: -0.01em; }
.yh-rank-dot {
  width: 8px; height: 8px; border-radius: 50%; background: #22c55e;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, .14); flex: none;
}
.yh-rank-time { font-size: 12px; color: var(--muted-foreground, #8a919a); }
.yh-rank-head p {
  flex: 1 1 100%; margin: 4px 0 0; font-size: 13px;
  line-height: 1.65; color: var(--muted-foreground, #8a919a);
}
.yh-rank-head p b { color: var(--foreground, #1a1a1a); font-weight: 600; }
.yh-rank-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px; margin-top: 16px;
}
.yh-pb-wait { grid-column: 1 / -1; font-size: 13px; color: var(--muted-foreground, #8a919a); }
.yh-pb {
  min-width: 0; padding: 14px 14px 8px;
  border: 1px solid var(--border, #e6e8eb); border-radius: 10px;
  background: rgba(199, 23, 34, .018);
}
.yh-pb-h { display: flex; flex-direction: column; gap: 2px; }
.yh-pb-h b { font-size: 14px; font-weight: 600; letter-spacing: -0.01em; }
.yh-pb-h span { font-size: 11.5px; color: var(--muted-foreground, #8a919a); }
.yh-pb-list { list-style: none; margin: 10px 0 0; padding: 0; }
.yh-pb-row {
  display: grid; grid-template-columns: 16px minmax(0, 1fr) 78px;
  align-items: center; gap: 8px; padding: 5px 0;
  border-top: 1px solid var(--border, #eef0f2);
}
.yh-pb-row:first-child { border-top: 0; }
.yh-pb-i {
  font-size: 11px; text-align: center; font-variant-numeric: tabular-nums;
  color: var(--muted-foreground, #8a919a);
}
.yh-pb-row:nth-child(1) .yh-pb-i,
.yh-pb-row:nth-child(2) .yh-pb-i,
.yh-pb-row:nth-child(3) .yh-pb-i { color: #C71722; font-weight: 700; }
.yh-pb-m {
  min-width: 0; display: block; font-size: 12.5px; line-height: 1.35;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.yh-pb-m em {
  display: block; font-style: normal; font-size: 11px;
  font-family: inherit; color: var(--muted-foreground, #8a919a);
}
.yh-pb-v { min-width: 0; text-align: right; font-variant-numeric: tabular-nums; }
.yh-pb-v b { font-size: 12.5px; font-weight: 600; }
.yh-pb-v b small { font-size: 10.5px; font-weight: 500; color: var(--muted-foreground, #8a919a); }
.yh-pb-v i {
  display: block; height: 3px; margin: 4px 0 0 auto; border-radius: 2px;
  background: linear-gradient(90deg, rgba(199, 23, 34, .28), #C71722);
}
.yh-rank-note {
  margin: 14px 0 0; font-size: 11.5px; line-height: 1.7;
  color: var(--muted-foreground, #8a919a);
}
.yh-rank-note b { color: var(--foreground, #1a1a1a); font-weight: 600; }
@media (max-width: 1023px) {
  .yh-rank-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .yh-rank-sec { padding: 16px 14px 14px; }
  .yh-rank-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
}
/* 深色模式下红条与序号提亮，压暗底才看得清 */
.dark .yh-pb-v i, [data-theme="dark"] .yh-pb-v i, html.dark .yh-pb-v i {
  background: linear-gradient(90deg, rgba(255, 138, 146, .35), #FF8A92);
}
.dark .yh-pb-row:nth-child(1) .yh-pb-i,
.dark .yh-pb-row:nth-child(2) .yh-pb-i,
.dark .yh-pb-row:nth-child(3) .yh-pb-i,
[data-theme="dark"] .yh-pb-row:nth-child(1) .yh-pb-i,
[data-theme="dark"] .yh-pb-row:nth-child(2) .yh-pb-i,
[data-theme="dark"] .yh-pb-row:nth-child(3) .yh-pb-i { color: #FF8A92; }
.dark .yh-pb, [data-theme="dark"] .yh-pb, html.dark .yh-pb {
  background: rgba(255, 138, 146, .045);
}

/* ============================================================
   G. 登录 / 注册页（auth）· 品牌化
   ------------------------------------------------------------
   由 brand-site.js 第 11b 节挂载：
     .yh-auth        外壳（原「左上小 logo + 居中单列表单」）
     .yh-auth-brand  左栏品牌区（桌面显示 / 窄屏隐藏）
     .yh-auth-card   表单卡片
     .yh-auth-submit 主提交按钮
   作用域限定 .yh-auth，控制台与其它前台页零影响。
   卡片与文字色走 new-api 自身的 shadcn 变量（--card / --border /
   --foreground / --muted-foreground / --input），深色模式自动跟随。
   ============================================================ */

/* ---- G1. 两栏骨架：桌面左品牌 + 右表单；窄屏单列 ---- */
.yh-auth { grid-template-columns: minmax(0, 1fr) !important; }
@media (min-width: 1024px) {
  .yh-auth { grid-template-columns: minmax(0, 1.02fr) minmax(0, 1fr) !important; }
  /* 左栏已含品牌 logo → 隐藏左上角那个浮动 logo（窄屏时它是唯一的品牌标识，保留） */
  .yh-auth > a[class*="top-4"] { display: none !important; }
}

/* ---- G2. 左栏品牌区 ---- */
.yh-auth-brand {
  display: none;
  position: relative;
  overflow: hidden;
  padding: 46px 52px;
  color: #FFFFFF;
  background: linear-gradient(158deg, #6F0A11 0%, #B8141E 46%, #C71722 72%, #8A0E16 100%);
}
@media (min-width: 1024px) { .yh-auth-brand { display: flex; } }

/* 网格纹理 + 顶部柔光 + 底部辉光（纯装饰，不拦事件） */
.yh-auth-brand::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image:
    radial-gradient(72% 55% at 10% 4%, rgba(255, 255, 255, .18), rgba(255, 255, 255, 0) 62%),
    linear-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
  background-size: auto, 44px 44px, 44px 44px;
}
.yh-auth-brand::after {
  content: ''; position: absolute; left: -14%; bottom: -22%; width: 68%; height: 58%;
  pointer-events: none;
  background: radial-gradient(closest-side, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0));
}

.yh-brand-inner {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; justify-content: space-between;
  gap: 44px; width: 100%; max-width: 34rem;
}

/* 品牌 logo：红色标记要垫白底圆角块，深红底上才看得清 */
.yh-brand-logo { display: flex; align-items: center; gap: 11px; text-decoration: none; color: #FFFFFF; }
.yh-brand-logo img {
  width: 34px; height: 34px; padding: 3px; border-radius: 10px;
  background: #FFFFFF; box-shadow: 0 2px 10px rgba(0, 0, 0, .18);
}
.yh-brand-name { font-size: 17px; font-weight: 600; letter-spacing: .01em; }

.yh-brand-body h2 {
  margin: 0 0 15px; font-size: 31px; line-height: 1.34;
  font-weight: 600; letter-spacing: -.015em;
}
.yh-brand-lead {
  margin: 0 0 28px; max-width: 27rem;
  font-size: 14.5px; line-height: 1.9; color: rgba(255, 255, 255, .84);
}
.yh-brand-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.yh-brand-list li {
  position: relative; padding-left: 27px;
  font-size: 14px; line-height: 1.7; color: rgba(255, 255, 255, .93);
}
.yh-brand-list li::before {
  content: ''; position: absolute; left: 0; top: 3px;
  width: 16px; height: 16px; border-radius: 50%;
  background: rgba(255, 255, 255, .17);
  border: 1px solid rgba(255, 255, 255, .3);
}
.yh-brand-list li::after {
  content: ''; position: absolute; left: 5.5px; top: 6.5px;
  width: 5px; height: 2.5px;
  border-left: 1.6px solid #FFFFFF; border-bottom: 1.6px solid #FFFFFF;
  transform: rotate(-45deg);
}

/* 规模数据条（读不到数据时整条隐藏，不编数字） */
.yh-brand-facts {
  display: flex; margin-top: 34px; padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .2);
}
.yh-brand-facts[hidden] { display: none; }
.yh-brand-facts > div { flex: 1; min-width: 0; }
.yh-brand-facts b {
  display: block; font-size: 25px; font-weight: 600; line-height: 1.1;
  letter-spacing: -.01em; font-variant-numeric: tabular-nums;
}
.yh-brand-facts span { display: block; margin-top: 6px; font-size: 12px; color: rgba(255, 255, 255, .72); }

.yh-brand-foot { font-size: 12px; line-height: 1.9; color: rgba(255, 255, 255, .62); }

/* ---- G3. 右栏表单卡片 ---- */
.yh-auth-main { align-items: center !important; }
.yh-auth-card {
  padding: 40px !important;
  border: 1px solid var(--border, rgba(0, 0, 0, .08)) !important;
  border-radius: 18px !important;
  background: var(--card, #FFFFFF) !important;
  box-shadow:
    0 1px 2px rgba(16, 24, 40, .05),
    0 20px 48px -22px rgba(16, 24, 40, .28) !important;
}
@media (max-width: 639px) {
  .yh-auth-card { padding: 26px 20px !important; border-radius: 14px !important; }
}

/* 标题区：拉开层级（原来是正文与卡片标题都是 14px，没有层级）
   卡片标题实测是 h2（不是 h1）：class="text-center text-2xl ... sm:text-left"
   → text-align 强制左对齐，否则窄屏居中、宽屏左对齐，换设备会跳。 */
.yh-auth-card h1, .yh-auth-card h2 {
  text-align: left !important;
  font-size: 23px !important; font-weight: 600 !important;
  line-height: 1.32 !important; letter-spacing: -.012em !important;
}
.yh-auth-card h1 + p, .yh-auth-card h2 + p, .yh-auth-card [class*="space-y-2"] > p {
  margin-top: 7px !important;
  text-align: left !important;
  font-size: 13.5px !important;
  color: var(--muted-foreground, #71717A) !important;
}
.yh-auth-card a { color: #C71722 !important; font-weight: 500; text-decoration: none; }
.yh-auth-card a:hover { text-decoration: underline; }

/* 表单：字段间距 + 控件尺寸 */
.yh-auth-card form { gap: 18px !important; }
.yh-auth-card label {
  margin-bottom: 7px;
  font-size: 13.5px !important; font-weight: 500 !important;
  color: var(--foreground, #18181B) !important;
}
.yh-auth-card input {
  height: 44px !important;
  padding-left: 14px !important;
  border-radius: 10px !important;
  border-color: var(--input, rgba(0, 0, 0, .16)) !important;
  background-color: var(--background, #FFFFFF) !important;
  font-size: 14.5px !important;
  transition: border-color .15s ease, box-shadow .15s ease !important;
}
.yh-auth-card input::placeholder { color: var(--muted-foreground, #9AA0A6) !important; }
.yh-auth-card input:focus, .yh-auth-card input:focus-visible {
  border-color: #C71722 !important;
  box-shadow: 0 0 0 3.5px rgba(199, 23, 34, .13) !important;
  outline: none !important;
}
/* 显示密码的图标按钮：贴输入框右内侧垂直居中（输入框变高后要重新对齐） */
.yh-auth-card form button:not(.yh-auth-submit) {
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 26px !important; height: 26px !important;
}
.yh-auth-submit {
  height: 44px !important;
  margin-top: 4px;
  border-radius: 10px !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  letter-spacing: .01em !important;
  background-color: #C71722 !important;
  color: #FFFFFF !important;
  box-shadow: 0 1px 2px rgba(138, 14, 22, .3), 0 10px 22px -12px rgba(199, 23, 34, .75) !important;
  transition: background-color .15s ease, transform .12s ease, box-shadow .15s ease !important;
}
.yh-auth-submit:hover {
  background-color: #A6111B !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(138, 14, 22, .3), 0 14px 26px -12px rgba(199, 23, 34, .8) !important;
}
.yh-auth-submit:active { transform: translateY(0); }

/* 卡片下方辅助入口（模型价格 / 文档 / 返回首页） */
.yh-auth-links {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin-top: 22px; padding-top: 18px;
  border-top: 1px solid var(--border, rgba(0, 0, 0, .07));
  font-size: 12.5px; color: var(--muted-foreground, #71717A);
}
.yh-auth-links i { font-style: normal; color: var(--border, #D4D4D8); }
.yh-auth-links a { color: var(--muted-foreground, #71717A) !important; text-decoration: none; }
.yh-auth-links a:hover { color: #C71722 !important; text-decoration: none; }

/* ---- G4. 深色模式 ---- */
.dark .yh-auth-card, [data-theme="dark"] .yh-auth-card, html.dark .yh-auth-card {
  box-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 20px 48px -24px rgba(0, 0, 0, .7) !important;
}
.dark .yh-auth-submit, [data-theme="dark"] .yh-auth-submit, html.dark .yh-auth-submit {
  background-color: #E0343F !important;
}
.dark .yh-auth-submit:hover, [data-theme="dark"] .yh-auth-submit:hover,
html.dark .yh-auth-submit:hover { background-color: #F04A55 !important; }
/* 深红 #C71722 压在深色底上对比度不够（「注册」「忘记密码」这类行内链接会看不清）→ 提亮一档 */
.dark .yh-auth-card a, [data-theme="dark"] .yh-auth-card a, html.dark .yh-auth-card a,
.dark .yh-auth-links a:hover, [data-theme="dark"] .yh-auth-links a:hover,
html.dark .yh-auth-links a:hover { color: #FF8A92 !important; }