/* ============================================================
   H3视频云 · 品牌视觉层 v1（与 ModelHub 统一：深空靛蓝 + 青色辉光）
   只覆盖设计 token 与少量组件精修，不改布局、不动 bundle。
   ============================================================ */

:root{
  /* 品牌渐变两端：靛蓝 -> 蓝紫 */
  --brand-a: 234 81% 61% !important;   /* #4b5cec */
  --brand-b: 251 100% 68% !important;  /* #7a5cff */
  /* 光晕：靛蓝 + 青 */
  --glow-a: 234 81% 61% !important;
  --glow-b: 191 77% 58% !important;    /* #43cae7 */
  /* 主色/焦点环 */
  --primary: 234 81% 61% !important;
  --ring: 191 77% 58% !important;
  /* 圆角语言与 ModelHub 对齐 */
  --radius: 1rem;
  --grid-line: 231 40% 90% !important;
}

.dark{
  /* 深色：发光靛蓝 + 青辉光（深色模式的记忆点） */
  --brand-a: 228 100% 74% !important;  /* #7993ff */
  --brand-b: 191 77% 58% !important;   /* #43cae7 */
  --glow-a: 228 100% 74% !important;
  --glow-b: 191 77% 58% !important;
  --primary: 228 100% 74% !important;
  --ring: 191 77% 58% !important;
  --background: 232 40% 8% !important; /* #0c0e1c 深空 */
  --card: 231 32% 12% !important;      /* #151829 */
  --popover: 231 32% 12% !important;
  --grid-line: 231 30% 16% !important;
}

/* ---------- 全局质感 ---------- */
body{
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑",
    "Noto Sans SC", "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
::selection{ background: hsl(var(--brand-a) / .22); }

/* ---------- 顶部导航：品牌下缘发光线 ---------- */
header.sticky{
  backdrop-filter: blur(14px) saturate(1.5);
  -webkit-backdrop-filter: blur(14px) saturate(1.5);
  border-bottom: 1px solid transparent !important;
  background-image:
    linear-gradient(hsl(var(--background) / .82), hsl(var(--background) / .82)),
    linear-gradient(90deg, transparent, hsl(var(--brand-a) / .55), hsl(var(--glow-b) / .55), transparent) !important;
  background-origin: border-box;
  background-clip: padding-box, border-box;
}

/* ---------- 主按钮：加深一号，更挺 ---------- */
.btn-brand{
  background: linear-gradient(120deg, hsl(var(--brand-a)), hsl(var(--brand-b)));
  box-shadow: 0 6px 20px hsl(var(--brand-a) / .38), inset 0 1px 0 hsl(0 0% 100% / .18);
}
.btn-brand:hover{
  box-shadow: 0 10px 30px hsl(var(--brand-a) / .5), inset 0 1px 0 hsl(0 0% 100% / .22);
}

/* ---------- 卡片：轻边框 + 柔阴影 + 悬浮微光 ---------- */
.bg-card, .glass{
  border-color: hsl(var(--brand-a) / .14) !important;
}
.lift:hover{
  border-color: hsl(var(--brand-a) / .5) !important;
  box-shadow: 0 14px 40px hsl(var(--brand-a) / .16), 0 0 0 1px hsl(var(--glow-b) / .18) !important;
}

/* ---------- 代码块：深空底 ---------- */
pre.codeblock{
  background: #0c0e1c !important;
  color: #c8d3f0 !important;
  border: 1px solid hsl(234 60% 60% / .22) !important;
  border-radius: 12px !important;
}

/* ---------- 页脚：深空色块（浅色模式也用深底，大平台签名式页脚） ---------- */
#h3-footer{
  background: #0c0e1c;
  color: #aab3d0;
  border-top: 1px solid hsl(234 60% 60% / .25);
  position: relative;
}
#h3-footer::before{
  content: ""; position: absolute; inset: 0 0 auto 0; height: 1px;
  background: linear-gradient(90deg, transparent, #4b5cec, #43cae7, transparent);
}
#h3-footer a{ color: #8b96bd; text-decoration: none; transition: color .15s; }
#h3-footer a:hover{ color: #43cae7; }

/* ---------- 平台联动横幅（首页注入） ---------- */
#h3-bridge{
  border-radius: 20px;
  border: 1px solid hsl(var(--brand-a) / .25);
  background:
    radial-gradient(120% 160% at 8% 0%, hsl(var(--brand-a) / .14), transparent 55%),
    radial-gradient(120% 160% at 95% 100%, hsl(var(--glow-b) / .16), transparent 55%),
    hsl(var(--card) / .8);
  backdrop-filter: blur(12px);
}
#h3-bridge .bridge-btn{
  background: linear-gradient(120deg, hsl(var(--brand-a)), hsl(var(--brand-b)));
  color: #fff; box-shadow: 0 6px 20px hsl(var(--brand-a) / .35);
  transition: transform .15s, box-shadow .15s;
}
#h3-bridge .bridge-btn:hover{ transform: translateY(-1px); box-shadow: 0 10px 28px hsl(var(--brand-a) / .5); }

/* ---------- 语言切换胶囊 ---------- */
.h3-lang{
  display: inline-flex; align-items: center; border: 1px solid hsl(var(--border));
  border-radius: 999px; overflow: hidden; font-size: 12px; line-height: 1;
  background: hsl(var(--card) / .6); flex-shrink: 0;
}
.h3-lang button{
  appearance: none; border: 0; background: transparent; cursor: pointer;
  padding: 6px 10px; font-size: 12px; font-weight: 600; color: hsl(var(--muted-foreground));
  transition: all .15s;
}
.h3-lang button.on{
  background: linear-gradient(120deg, hsl(var(--brand-a)), hsl(var(--brand-b)));
  color: #fff;
}

/* ---------- 手机端导航条同步品牌 ---------- */
.h3mnav .lg .mk{ background: linear-gradient(135deg, #4b5cec, #7a5cff) !important; }
.h3mnav .menu a.cur{ color: #4b5cec !important; background: hsl(234 81% 61% / .1) !important; }

/* ---------- 快捷入口（内联样式盖不住，JS 会改；此处保底） ---------- */
@media(max-width:765px){
  #h3-footer .cols{ grid-template-columns: 1fr 1fr !important; }
}

/* 手机菜单内的语言项：呈现为普通菜单行 */
.h3-lang.as-item{ border: 0; background: transparent; display: flex; gap: 10px; padding: 0; }
.h3-lang.as-item button{
  flex: 1; padding: 13px 14px; border-radius: 8px; font-size: 15px; font-weight: 600;
  color: #3d4a63; text-align: left; background: transparent;
}
.h3-lang.as-item button.on{
  background: hsl(234 81% 61% / .1); color: #4b5cec;
}

/* API Key 卡标题不换行（避免英文下 Key 掉行） */
div[class*="@container/card-header"] > .text-lg { white-space: nowrap; }

/* 静态页 .topnav 品牌色（docs/prompt-guide 等） */
.topnav { background: linear-gradient(120deg, hsl(var(--brand-a)), hsl(var(--brand-b))) !important; border-radius: 12px !important; box-shadow: 0 8px 22px hsl(var(--brand-a) / .28) !important; }

/* ===== 深色静态页品牌化（admin2 / status / api-lab / results / modelhub-docs） ===== */
html.h3-dark { --bg: #0c0e1c !important; --panel: #151829 !important; --panel2: #1b2033 !important; --line: #262c44 !important; --sub: #8b94b0 !important; --acc: #4b5cec !important; }
html.h3-dark .h3nav { background: rgba(9, 11, 22, .82) !important; border-bottom: 1px solid rgba(120, 135, 190, .14) !important; }
html.h3-dark .h3nav a, html.h3-dark .h3nav .brand { color: #aab3cf !important; }
html.h3-dark .h3nav a:hover { color: #e7ebff !important; }
html.h3-dark .h3-lang { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); }
html.h3-dark .h3-lang button { color: #aab3cf; }
html.h3-dark .h3-lang button.on { background: linear-gradient(135deg, #4b5cec, #7a5cff); color: #fff; }