/* ================= 用户中心 · 基元风格（视觉重做） =================
   保留左侧菜单结构，重做顶栏/侧边栏/内容区视觉，对齐首页与模型广场。
   不改变任何功能逻辑，仅覆盖样式。
   ================================================================= */
:root,
html.light {
  --bg: #f4f4f5;
  --bg-panel: #ffffff;
  --bg-panel-2: #f4f4f5;
  --bg-hover: #ececee;
  --bg-active: #e4e4e7;
  --border: rgba(24,24,27,.1);
  --border-soft: rgba(24,24,27,.08);
  --text: #18181b;
  --text-dim: #71717a;
  --text-faint: #a1a1aa;
  --accent: #18181b;
  --accent-hover: #000;
  --accent-soft: rgba(24,24,27,.06);
  --danger: #dc2626;
  --success: #15803d;
  --warning: #b45309;
  --shadow: 0 10px 30px -12px rgba(24,24,27,.16);
  --bg-card: #ffffff;
  --bg-soft: rgba(24,24,27,.05);
}
body,
html.light body { background: #f4f4f5; color: #18181b; font-family: "Inter",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; }

/* ---------- 顶栏：与首页 .fd-nav 对齐 ---------- */
.topbar,
html.light .topbar,
#site-topbar,
html.light #site-topbar {
  background: rgba(244,244,245,.82) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(24,24,27,.1) !important;
}
.topbar-in, html.light .topbar-in { height: 60px !important; max-width: 1280px !important; gap: 16px !important; }
.topbar-brand, .topbar-site, html.light .topbar-brand, html.light .topbar-site { color: #18181b !important; font-weight: 700 !important; }
/* logo：黑色方块 K，去掉发光圆点 */
.logo-dot {
  width: 26px !important; height: 26px !important; border-radius: 7px !important;
  background: #0c0c0e !important; box-shadow: none !important; position: relative;
}
.logo-dot::after {
  content: "K"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: #fff; font-family: "JetBrains Mono", monospace; font-weight: 700; font-size: 14px;
}
.topbar-models, html.light .topbar-models {
  background: #fff !important; border: 1px solid rgba(24,24,27,.12) !important;
  color: #71717a !important; border-radius: 999px !important;
}
.topbar-models:hover { color: #18181b !important; border-color: rgba(24,24,27,.24) !important; }
.topbar-nav a { color: #71717a !important; border-radius: 9px !important; }
.topbar-nav a:hover { color: #18181b !important; background: #ececee !important; }
.topbar-nav a.on { color: #18181b !important; background: #ececee !important; }
.tb-bell, .theme-toggle-btn, .tb-login-btn {
  background: #fff !important; border: 1px solid rgba(24,24,27,.12) !important; color: #18181b !important; border-radius: 9px !important;
}
.tb-bell:hover, .theme-toggle-btn:hover { background: #ececee !important; }
.tb-login-btn { background: #18181b !important; color: #fff !important; border-color: #18181b !important; }
.tb-chip, html.light .tb-chip { background: #fff !important; border: 1px solid rgba(24,24,27,.12) !important; border-radius: 999px !important; }
.tb-chip:hover { border-color: rgba(24,24,27,.26) !important; }
.tb-name, html.light .tb-name { color: #18181b !important; font-weight: 500 !important; }
.tb-avatar { background: #18181b !important; color: #fff !important; font-weight: 600; }
.tb-pop { background: #fff !important; border: 1px solid rgba(24,24,27,.1) !important; border-radius: 12px !important; box-shadow: 0 16px 40px rgba(0,0,0,.12) !important; }
.tb-pop-id b { color: #18181b !important; }
.tb-pop-id small, .tb-pop-list a { color: #71717a !important; }
.tb-pop-list a:hover { background: #f4f4f5 !important; color: #18181b !important; }
.tb-pop-list { border-color: rgba(24,24,27,.08) !important; }

/* ---------- 侧边栏：扁平化，去掉折叠箭头，选中=浅灰块 ---------- */
.sidebar, html.light .sidebar {
  top: 60px !important;
  width: 224px !important;
  background: #ffffff !important;
  border-right: 1px solid rgba(24,24,27,.1) !important;
}
.sidebar-nav { padding: 18px 12px 28px !important; }
/* 分组标题：小号大写灰字，纯标签不可点 */
.sidebar .nav-group { margin-bottom: 2px !important; }
.sidebar .nav-group-title {
  padding: 14px 10px 7px !important;
  font-size: 11px !important; letter-spacing: .08em; text-transform: uppercase;
  color: #a1a1aa !important; cursor: default !important; pointer-events: none;
  background: transparent !important; gap: 0 !important;
}
.sidebar .nav-group-title .nav-arrow { display: none !important; }
.sidebar .nav-group-title .sidebar-ic { display: none !important; }
/* 子菜单常显 */
.sidebar .nav-sub { display: block !important; padding-left: 0 !important; }
.sidebar .nav-sub .sidebar-item { padding-left: 11px !important; }
.sidebar-item {
  padding: 9px 11px !important;
  margin-bottom: 2px !important;
  border-radius: 9px !important;
  color: #71717a !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
.sidebar-item:hover { background: #f4f4f5 !important; color: #18181b !important; }
.sidebar-item.on {
  background: #ececee !important; color: #18181b !important; font-weight: 600 !important;
  box-shadow: none !important;
}
.sidebar-ic { color: inherit !important; }

/* ---------- 内容区 ---------- */
.page-wrap { max-width: 1120px; }
.page-head { margin: 26px 0 22px !important; }
.page-head h1, html.light .page-head h1 { color: #18181b !important; letter-spacing: -.03em; font-size: 30px !important; font-weight: 700 !important; }
.page-head p, html.light .page-head p { color: #71717a !important; font-size: 14.5px !important; }

/* 卡片 */
.pg-card, html.light .pg-card {
  background: #ffffff !important;
  border: 1px solid rgba(24,24,27,.1) !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 2px rgba(24,24,27,.04) !important;
}
.pg-card-head, html.light .pg-card-head {
  color: #18181b !important;
  border-bottom: 1px solid rgba(24,24,27,.08) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}
.pg-card-head.collapsible:hover { background: #fafafa !important; }

/* 按钮 */
.pg-btn-primary, html.light .pg-btn-primary, .btn-primary {
  background: #18181b !important; color: #fff !important; border-color: #18181b !important; border-radius: 10px !important; font-weight: 600 !important;
}
.pg-btn-primary:hover, .btn-primary:hover { background: #000 !important; }
.pg-btn-ghost, html.light .pg-btn-ghost, .btn-secondary {
  background: #fff !important; border: 1px solid rgba(24,24,27,.18) !important; color: #18181b !important; border-radius: 10px !important;
}
.pg-btn-ghost:hover, .btn-secondary:hover { background: #f4f4f5 !important; }

/* 表格（模型广场同款表头） */
.pg-table th, html.light .pg-table th {
  background: #fafafa !important; color: #a1a1aa !important;
  border-bottom: 1px solid rgba(24,24,27,.1) !important;
  font-size: 11.5px !important; font-weight: 600 !important; letter-spacing: .04em; text-transform: uppercase;
}
.pg-table td, html.light .pg-table td { border-bottom: 1px solid rgba(24,24,27,.08) !important; color: #18181b !important; }
.pg-table tbody tr:hover { background: #fafafa !important; }

/* 表单 */
input, select, textarea, html.light input, html.light select, html.light textarea {
  background: #fff !important; border: 1px solid rgba(24,24,27,.12) !important;
  color: #18181b !important; border-radius: 10px !important;
}
input:focus, select:focus, textarea:focus {
  border-color: rgba(24,24,27,.32) !important;
  box-shadow: 0 0 0 4px rgba(24,24,27,.05) !important; outline: none !important;
}
input::placeholder, textarea::placeholder { color: #a1a1aa !important; }

/* 弹窗 */
.modal, html.light .modal { background: #fff !important; border: 1px solid rgba(24,24,27,.1) !important; border-radius: 16px !important; box-shadow: 0 24px 60px -24px rgba(24,24,27,.28) !important; }
.modal h3 { color: #18181b !important; }
.modal-mask { background: rgba(24,24,27,.32) !important; backdrop-filter: blur(2px); }

/* 徽章 */
.badge, html.light .badge { background: #f4f4f5 !important; color: #71717a !important; border-color: rgba(24,24,27,.1) !important; }
.badge-accent { background: #18181b !important; color: #fff !important; }

/* 余额圆点 */
.bal-dot-wd { background: #18181b !important; }
.bal-dot-gift { background: #a1a1aa !important; }

/* 统计卡（控制台/用量）：基元风 + 防截断 */
.pf-stats { gap: 10px !important; margin-top: 16px !important; }
.pf-stat {
  background: #fafafa !important;
  border: 1px solid rgba(24,24,27,.08) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
}
.pf-stat .v { color: #18181b !important; font-size: 17px !important; font-weight: 700 !important; letter-spacing: -.01em; }
.pf-stat .k { color: #a1a1aa !important; }
#card-balance .pf-stats { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }

/* 余额大字 */
.bal-v, .balance-big .bal-v { color: #18181b !important; }
.bal-label { color: #71717a !important; }

/* 端点地址行 */
.endpoint-list { }

/* ---------- 顶栏：真正采用首页 fd-nav 结构 ---------- */
#site-topbar.fd-nav {
  position: sticky; top: 0; z-index: 200;
  background: rgba(244,244,245,.82) !important;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(24,24,27,.1) !important;
}
#site-topbar .fd-nav-in {
  max-width: 1280px; margin: 0 auto; padding: 0 24px; height: 60px;
  display: flex; align-items: center; gap: 20px;
}
#site-topbar .fd-burger {
  display: none; width: 38px; height: 38px; border: 1px solid rgba(24,24,27,.14);
  border-radius: 9px; background: #fff; color: #18181b; cursor: pointer; align-items: center; justify-content: center; flex: none;
}
#site-topbar .fd-logo { display: inline-flex; align-items: center; gap: 9px; font-weight: 700; font-size: 16px; letter-spacing: -.01em; color: #18181b !important; flex: none; text-decoration: none; }
#site-topbar .fd-mk { width: 26px; height: 26px; border-radius: 7px; background: #0c0c0e; display: flex; align-items: center; justify-content: center; flex: none; }
#site-topbar .fd-mk .logo-dot { width: auto !important; height: auto !important; background: transparent !important; box-shadow: none !important; border-radius: 0 !important; }
#site-topbar .fd-mk .logo-dot::after { content: "K"; color: #fff; font-family: "JetBrains Mono", monospace; font-weight: 700; font-size: 14px; position: static; }
#site-topbar .fd-site { color: #18181b !important; }
#site-topbar .fd-nav-links { display: flex; gap: 24px; margin-left: 10px; }
#site-topbar .fd-nav-links a { font-size: 14px; color: #71717a !important; text-decoration: none; transition: color .15s; }
#site-topbar .fd-nav-links a:hover { color: #18181b !important; }
#site-topbar .fd-nav-links a.on { color: #18181b !important; font-weight: 600; }
#site-topbar .fd-nav-right { display: flex; align-items: center; gap: 10px; margin-left: auto; }
#site-topbar .fd-icon-btn {
  width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(24,24,27,.12) !important; border-radius: 9px !important; background: #fff !important; color: #18181b !important; cursor: pointer;
}
#site-topbar .fd-icon-btn:hover { background: #ececee !important; }
#site-topbar .fd-user { position: relative; }
#site-topbar .fd-user-btn {
  display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px 0 5px;
  border: 1px solid rgba(24,24,27,.12) !important; border-radius: 999px !important; background: #fff !important; cursor: pointer;
}
#site-topbar .fd-user-btn:hover { border-color: rgba(24,24,27,.26) !important; }
#site-topbar .fd-user .tb-avatar, #site-topbar .tb-avatar { width: 28px; height: 28px; background: #18181b !important; color: #fff !important; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; font-size: 13px; flex: none; }
#site-topbar .tb-name { color: #18181b !important; font-weight: 500; }
#site-topbar .fd-pop {
  position: absolute; right: 0; top: calc(100% + 8px); min-width: 210px; background: #fff !important;
  border: 1px solid rgba(24,24,27,.1) !important; border-radius: 12px !important; box-shadow: 0 16px 40px rgba(0,0,0,.12) !important; overflow: hidden; z-index: 60;
}
#site-topbar .fd-pop-head { padding: 13px 16px; border-bottom: 1px solid rgba(24,24,27,.08); display: flex; align-items: center; gap: 10px; }
#site-topbar .fd-pop-head .tb-avatar-lg { width: 36px; height: 36px; background: #18181b; color: #fff; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; }
#site-topbar .fd-pop-id b { display: block; color: #18181b; font-size: 14px; }
#site-topbar .fd-pop-id small { color: #71717a; font-size: 12px; }
#site-topbar .fd-pop-list { padding: 6px; }
#site-topbar .fd-pop-list a { display: block; padding: 9px 12px; font-size: 13.5px; color: #71717a !important; border-radius: 8px; text-decoration: none; }
#site-topbar .fd-pop-list a:hover { background: #f4f4f5 !important; color: #18181b !important; }
#site-topbar .tb-bell-dot { position: absolute; top: 8px; right: 10px; width: 7px; height: 7px; border-radius: 50%; background: #dc2626; }
/* 未登录按钮 */
#site-topbar .fd-btn-dark { display: inline-flex; align-items: center; height: 38px; padding: 0 18px; background: #18181b !important; color: #fff !important; border-radius: 9px; font-size: 13.5px; font-weight: 600; text-decoration: none; }
/* 隐藏旧主题按钮（用户中心统一浅色） */
#site-topbar #theme-toggle { display: none !important; }

@media (max-width: 960px) {
  #site-topbar .fd-nav-links { display: none; }
  #site-topbar .fd-burger { display: inline-flex; }
}

/* ================= 控制台页新结构（.cx） ================= */
.cx { max-width: 1120px; }
.cx-hero {
  display: flex; align-items: center; justify-content: space-between; gap: 22px; flex-wrap: wrap;
  background: radial-gradient(700px 300px at 12% 0%, rgba(255,255,255,.10), transparent 60%), linear-gradient(160deg,#1c1c20,#0c0c0e 70%);
  color: #fff; border-radius: 18px; padding: 30px 32px; margin-bottom: 18px;
}
.cx-eyebrow { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.55); }
.cx-balance { font-size: 44px; font-weight: 800; letter-spacing: -.03em; margin: 8px 0 12px; font-variant-numeric: tabular-nums; }
.cx-bal-split { display: flex; gap: 20px; font-size: 13px; color: rgba(255,255,255,.6); flex-wrap: wrap; }
.cx-bal-split b { color: #fff; font-weight: 600; }
.cx-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }
.cx-dot-wd { background: #fff; }
.cx-dot-gift { background: rgba(255,255,255,.45); }
.cx-hero-r { display: flex; gap: 10px; flex-wrap: wrap; }
.cx-btn { display: inline-flex; align-items: center; gap: 7px; height: 42px; padding: 0 20px; border-radius: 11px; font-size: 14px; font-weight: 600; cursor: pointer; border: 1px solid transparent; }
.cx-btn-white { background: #fff; color: #0c0c0e; }
.cx-btn-white:hover { background: #e8e8e8; }
.cx-btn-outline { background: transparent; border-color: rgba(255,255,255,.22); color: #fff; }
.cx-btn-outline:hover { background: rgba(255,255,255,.08); }

.cx-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 18px; }
.cx-metric { background: #fff; border: 1px solid rgba(24,24,27,.1); border-radius: 14px; padding: 20px 22px; box-shadow: 0 1px 2px rgba(24,24,27,.04); }
.cx-metric .v { font-size: 28px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.cx-metric .k { font-size: 12.5px; color: #71717a; margin-top: 3px; }

.cx-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 16px; align-items: start; }
.cx-col { display: flex; flex-direction: column; gap: 16px; }
.cx-panel { background: #fff; border: 1px solid rgba(24,24,27,.1); border-radius: 14px; box-shadow: 0 1px 2px rgba(24,24,27,.04); overflow: hidden; }
.cx-panel-grow { min-height: 260px; }
.cx-panel-h { padding: 15px 20px; border-bottom: 1px solid rgba(24,24,27,.08); font-size: 14px; font-weight: 600; }
.cx-panel-b { padding: 18px 20px; }

.cx-endpoints { display: flex; flex-direction: column; gap: 9px; }
.cx-hint { color: #a1a1aa; font-size: 12.5px; margin-top: 12px; line-height: 1.7; }
.cx-links { display: flex; flex-direction: column; }
.cx-links a { display: flex; align-items: center; justify-content: space-between; padding: 12px 2px; font-size: 14px; color: #18181b; border-bottom: 1px solid rgba(24,24,27,.06); }
.cx-links a:last-child { border-bottom: 0; }
.cx-links a:hover { color: #000; }
.cx-links a span { color: #a1a1aa; }

@media (max-width: 900px) {
  .cx-hero { padding: 24px 20px; }
  .cx-balance { font-size: 34px; }
  .cx-metrics { grid-template-columns: 1fr 1fr; }
  .cx-grid { grid-template-columns: 1fr; }
}

/* ================= 统一的基元页面头 + 分组面板 ================= */
.cx-page { max-width: 1120px; }
.cx-head { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin: 30px 0 22px; }
.cx-head .cx-head-tx { flex: 1; min-width: 0; }
.cx-head h1 { font-size: 30px; font-weight: 700; letter-spacing: -.03em; color: #18181b; line-height: 1.2; }
.cx-head p { color: #71717a; font-size: 14.5px; margin-top: 6px; }
.cx-head .cx-head-act { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.cx-search { height: 38px; border: 1px solid rgba(24,24,27,.12); border-radius: 10px; background: #fff; padding: 0 14px; font-size: 13.5px; min-width: 220px; color: #18181b; }
.cx-search:focus { border-color: rgba(24,24,27,.3); box-shadow: 0 0 0 4px rgba(24,24,27,.05); outline: none; }

/* 用量/统计卡：手机端换行 + 缩字号，避免 5 列挤爆 */
@media (max-width: 760px) {
  .pf-stats, .pf-stats.pf-stats-5 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
  .pf-stat { padding: 10px 12px !important; }
  .pf-stat .v { font-size: 15px !important; }
  .pf-stat .k { font-size: 11px !important; }
}
/* 把旧的 page-head 也并入新样式 */
.page-head { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin: 30px 0 22px !important; }
.page-head > div { flex: 1; }
.cx-stack { display: flex; flex-direction: column; gap: 16px; }
/* 个人资料：左窄右宽两栏 */
.cx-grid2 { display: grid; grid-template-columns: 300px 1fr; gap: 16px; align-items: start; }
@media (max-width: 900px) { .cx-grid2 { grid-template-columns: 1fr; } }

/* ================= 控制台 · 银行卡式设计（.bk） ================= */
.bk-root { max-width: 1080px; }
.bk-head { margin: 30px 0 22px; }
.bk-head h1 { font-size: 30px; font-weight: 700; letter-spacing: -.03em; color: #18181b; }
.bk-head p { color: #71717a; font-size: 14.5px; margin-top: 6px; }

.bk-top { display: grid; grid-template-columns: 420px 1fr; gap: 22px; align-items: stretch; margin-bottom: 34px; }

/* 银行卡 */
.bk-card {
  position: relative; overflow: hidden; border-radius: 20px; padding: 24px 26px;
  color: #fff; display: flex; flex-direction: column; min-height: 250px;
  background: linear-gradient(135deg, #2a2a30 0%, #0c0c0e 55%, #050506 100%);
  box-shadow: 0 24px 60px -28px rgba(12,12,14,.7), inset 0 1px 0 rgba(255,255,255,.08);
}
.bk-card-glow { position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(420px 220px at 82% -10%, rgba(255,255,255,.14), transparent 60%),
              radial-gradient(300px 200px at 0% 110%, rgba(255,255,255,.05), transparent 60%); }
.bk-card-top { position: relative; display: flex; align-items: center; justify-content: space-between; }
.bk-brand { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 14px; letter-spacing: .02em; }
.bk-brand-mk { width: 22px; height: 22px; border-radius: 6px; background: #fff; color: #0c0c0e; display: inline-flex; align-items: center; justify-content: center; font-family: "JetBrains Mono", monospace; font-size: 13px; font-weight: 700; }
.bk-chip-img { width: 34px; height: 24px; border-radius: 5px; background: linear-gradient(135deg,#e9e9ec,#a9a9b2); opacity: .85; position: relative; }
.bk-chip-img::after { content: ""; position: absolute; inset: 5px 7px; border-radius: 2px; border: 1px solid rgba(0,0,0,.25); }
.bk-card-mid { position: relative; margin-top: 22px; }
.bk-card-label { font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.5); }
.bk-balance { font-size: 42px; font-weight: 800; letter-spacing: -.035em; margin-top: 4px; font-variant-numeric: tabular-nums; }
.bk-card-endpoint { position: relative; margin-top: 16px; }
.bk-ep-label { font-size: 10.5px; letter-spacing: .18em; color: rgba(255,255,255,.45); }
.bk-ep-val { margin-top: 5px; }
.bk-ep-val .endpoint-chip { position: relative !important; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: flex !important; align-items: center; gap: 7px; padding: 6px 10px !important; background: rgba(255,255,255,.06) !important; border: 1px solid rgba(255,255,255,.14) !important; color: #fff !important; border-radius: 8px !important; }
.bk-ep-val .endpoint-chip-label, .bk-ep-val .endpoint-chip-cp { display: none !important; }
.bk-ep-val .endpoint-chip-text { overflow: hidden; text-overflow: ellipsis; color: #fff !important; font-family: "JetBrains Mono", monospace; font-size: 12px; }
.bk-ep-val .endpoint-chip-ic { flex: none; opacity: .7; }
.bk-card-bottom { position: relative; margin-top: auto; padding-top: 18px; display: flex; gap: 26px; }
.bk-mini-l { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.45); }
.bk-mini-v { font-size: 15px; font-weight: 600; margin-top: 3px; font-variant-numeric: tabular-nums; }

/* 卡右侧操作 + 指标 */
.bk-side { display: flex; flex-direction: column; gap: 16px; }
.bk-actions { display: flex; gap: 12px; }
.bk-act { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 56px; border-radius: 14px; font-size: 15px; font-weight: 600; cursor: pointer; border: 1px solid transparent; }
.bk-act-main { background: #18181b; color: #fff; }
.bk-act-main:hover { background: #000; }
.bk-act-line { background: #fff; border-color: rgba(24,24,27,.16); color: #18181b; }
.bk-act-line:hover { background: #f4f4f5; }
.bk-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; flex: 1; }
.bk-metric { background: #fff; border: 1px solid rgba(24,24,27,.1); border-radius: 14px; padding: 18px 16px; display: flex; flex-direction: column; justify-content: center; box-shadow: 0 1px 2px rgba(24,24,27,.04); }
.bk-metric .v { font-size: 24px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.bk-metric .k { font-size: 12.5px; color: #71717a; margin-top: 4px; }

/* 分节标题 */
.bk-sec-title { font-size: 15px; font-weight: 600; color: #18181b; margin: 0 0 14px; }

/* 服务窗格 */
.bk-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 34px; }
.bk-tile { display: flex; flex-direction: column; gap: 6px; padding: 20px; border: 1px solid rgba(24,24,27,.1); border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(24,24,27,.04); transition: .16s; }
.bk-tile:hover { border-color: rgba(24,24,27,.2); transform: translateY(-3px); box-shadow: 0 16px 34px -22px rgba(24,24,27,.4); }
.bk-tile-ic { width: 40px; height: 40px; border-radius: 12px; background: #f4f4f5; border: 1px solid rgba(24,24,27,.08); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 8px; }
.bk-tile-ic svg, .bk-tile-ic img { width: 20px; height: 20px; }
.bk-tile b { font-size: 15px; color: #18181b; }
.bk-tile small { font-size: 12.5px; color: #71717a; line-height: 1.5; }

/* 订阅 */
.bk-subs { margin-bottom: 30px; }

@media (max-width: 900px) {
  .bk-top { grid-template-columns: 1fr; gap: 16px; }
  .bk-card { min-height: 220px; }
  .bk-balance { font-size: 34px; }
  .bk-grid { grid-template-columns: repeat(2, 1fr); }
  .bk-metrics { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 520px) {
  .bk-grid { grid-template-columns: 1fr; }
  .bk-card-bottom { gap: 16px; flex-wrap: wrap; }
}

/* 滚动条 */
::-webkit-scrollbar-thumb, html.light ::-webkit-scrollbar-thumb { background: #d4d4d8 !important; }

/* 手机端 */
@media (max-width: 900px) {
  .sidebar, html.light .sidebar { top: 60px !important; background: #fff !important; }
  .sidebar .nav-group-title { pointer-events: none; }
}

/* ================= 子页统一结构：页头带操作 / 分节 / 统计条升级 ================= */
.bk-head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.bk-head-row > div:first-child { flex: 1; min-width: 0; }
.bk-head-act { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.bk-head-act .bk-act, .bk-head-row .bk-act { flex: 0 0 auto; white-space: nowrap; }
.bk-act-sm { height: 40px !important; padding: 0 16px !important; border-radius: 10px !important; font-size: 13.5px !important; }
.bk-act-soft { background: #f4f4f5; border-color: transparent; color: #18181b; }
.bk-act-soft:hover { background: #ececee; }

/* 统计卡升级为控制台指标卡观感（用量 / 工作中心 / 推介通用） */
.pf-stats { gap: 12px !important; margin-bottom: 22px !important; }
.pf-stat { background: #fff !important; padding: 18px 18px !important; border-radius: 14px !important; box-shadow: 0 1px 2px rgba(24,24,27,.04); }
.pf-stat .v { font-size: 24px !important; letter-spacing: -.02em; }
.pf-stat .k { font-size: 12.5px !important; margin-top: 4px !important; }

/* 分节标题（子页通用间距） */
.bk-sec-title { margin: 26px 0 14px; }
.bk-sec-title:first-child { margin-top: 0; }

/* 页面主容器统一最大宽度 */
.bk-root { max-width: 1080px; }
.cx-page.bk-root { max-width: 1120px; }

/* ================= 子页组件精修（仅 idc 模板加载本文件） ================= */
/* 个人资料 */
.acct-top { display: flex; align-items: center; gap: 14px; }
.acct-avatar, .acct-avatar img { width: 54px; height: 54px; border-radius: 50%; }
.acct-avatar { background: #18181b !important; color: #fff !important; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 21px; flex: none; overflow: hidden; }
.acct-id b { font-size: 16px; color: #18181b; }
.acct-id small { color: #a1a1aa; font-size: 12.5px; }
.pf-form label { color: #71717a; font-size: 12.5px; }
.pf-divider { border: 0; border-top: 1px solid rgba(24,24,27,.08); margin: 18px 0; }
.pf-sub-title { font-size: 13px; font-weight: 600; color: #18181b; margin-bottom: 10px; }

/* 我的收藏 */
.fav-list { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; }
.fav-item { border: 1px solid rgba(24,24,27,.1); border-radius: 14px; padding: 14px 16px; background: #fff; box-shadow: 0 1px 2px rgba(24,24,27,.04); transition: .16s; }
.fav-item:hover { border-color: rgba(24,24,27,.2); }
.fav-item-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.fav-conv-link { color: #18181b !important; font-weight: 600; text-decoration: none; }
.fav-conv-link:hover { text-decoration: underline; }
.fav-date { margin-left: auto; color: #a1a1aa; font-size: 12.5px; }
.fav-preview, .fav-full { color: #52525b !important; line-height: 1.75; font-size: 13.5px; }
.fav-full { margin-top: 8px; }

/* 推介邀请卡 */
.aff-link-box { display: grid; gap: 14px; }
.aff-invite { border: 1px solid rgba(24,24,27,.1); border-radius: 14px; padding: 16px 18px; background: #fafafa; }
.aff-invite > label { display: block; font-size: 12.5px; color: #71717a; margin-bottom: 8px; }
.aff-copy-row { display: flex; gap: 8px; }
.aff-copy-row input { flex: 1; min-width: 0; }

/* 充值 / 订阅 */
.recharge-tabs { display: flex; gap: 8px; margin-bottom: 16px; }
.recharge-tab { height: 38px; padding: 0 18px; border-radius: 10px; border: 1px solid rgba(24,24,27,.12); background: #fff; color: #71717a; font-weight: 600; cursor: pointer; }
.recharge-tab.active { background: #18181b !important; color: #fff !important; border-color: #18181b !important; }
.amount-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.amount-item { border: 1px solid rgba(24,24,27,.12); border-radius: 12px; padding: 13px 12px; background: #fff; cursor: pointer; text-align: center; }
.amount-item.selected { border-color: #18181b !important; box-shadow: 0 0 0 3px rgba(24,24,27,.08); }
.amount-credit { font-size: 17px; font-weight: 800; color: #18181b; font-variant-numeric: tabular-nums; }
.amount-pay { font-size: 12px; color: #71717a; margin-top: 3px; }
.amount-rate { font-size: 11.5px; color: #16a34a; margin-top: 2px; min-height: 15px; }
.plan-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.plan-item { border: 1px solid rgba(24,24,27,.12); border-radius: 14px; padding: 16px; background: #fff; cursor: pointer; text-align: left; }
.plan-item.selected { border-color: #18181b !important; box-shadow: 0 0 0 3px rgba(24,24,27,.08); }
.plan-name { font-size: 15px; font-weight: 700; color: #18181b; }
.plan-price { font-size: 18px; font-weight: 800; color: #18181b; margin-top: 8px; font-variant-numeric: tabular-nums; }
.pay-methods { display: flex; gap: 8px; flex-wrap: wrap; }
.pay-method { height: 38px; padding: 0 16px; border-radius: 10px; border: 1px solid rgba(24,24,27,.12); background: #fff; color: #71717a; cursor: pointer; }
.pay-method.active { background: #18181b !important; color: #fff !important; border-color: #18181b !important; }
@media (max-width: 760px) {
  .amount-grid { grid-template-columns: repeat(2, 1fr); }
  .plan-grid { grid-template-columns: 1fr; }
  .fav-date { margin-left: 0; width: 100%; }
}
.aff-copy-row .bk-act { flex: 0 0 auto; }

/* 平台文章卡片（bk-art，与 bk-tile 同语言） */
.bk-art-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.bk-art-item { position: relative; display: flex; align-items: center; gap: 13px; padding: 16px 17px; cursor: pointer; background: #fff; border: 1px solid rgba(24,24,27,.1); border-radius: 14px; box-shadow: 0 1px 2px rgba(24,24,27,.04); transition: .16s; }
.bk-art-item:hover { border-color: rgba(24,24,27,.2); transform: translateY(-3px); box-shadow: 0 16px 34px -22px rgba(24,24,27,.4); }
.bk-art-item-main { min-width: 0; flex: 1; }
.bk-art-item-title { font-size: 13.5px; font-weight: 700; color: #18181b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bk-art-item-date { margin-top: 4px; font-size: 12px; color: #a1a1aa; }
.bk-art-item-arrow { color: #a1a1aa; flex-shrink: 0; font-size: 18px; transition: color .16s; }
.bk-art-item:hover .bk-art-item-arrow { color: #18181b; }

/* 文章弹窗：层级盖过顶栏/滚动公告(z-index:200)；右上角 × 关闭 */
.modal-mask { z-index: 1000; }
.art-modal-box { position: relative; }
.art-modal-box h3 { padding-right: 44px; }
.art-x { position: absolute; top: 10px; right: 12px; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border: none; background: transparent; font-size: 22px; line-height: 1; color: #71717a; cursor: pointer; border-radius: 8px; transition: .15s; z-index: 2; }
.art-x:hover { color: #18181b; background: rgba(24,24,27,.06); }