/* 范围选择不再自成分隔带: 它是页级控件, 平白插在指标卡与主图之间会切断视觉层级。
   现在与状态文本同处一行、无边框, 紧贴主图区域上方。 */
.dashboard-trend-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 4px 0; }
.dashboard-trend-toolbar label { display: flex; align-items: center; gap: 8px; color: var(--th-text-secondary); font-size: 13px; }
.dashboard-trend-toolbar select { width: auto; min-width: 100px; height: 36px; padding: 0 10px; }
.dashboard-trend-toolbar [role="status"] { margin-left: auto; color: var(--th-text-secondary); font-size: 12px; }
#page-dashboard #dash-trend-chart { position: relative; display: block; height: 280px; min-height: 280px; }
#page-dashboard #dash-trend-message { color: var(--th-text-secondary); font-size: 13px; }
#page-dashboard .dashboard-section > header { flex-wrap: wrap; }
#page-dashboard .dashboard-section > header select { height: 32px; max-width: 180px; padding: 0 8px; font-size: 13px; }
/* 费用与用量: 单行紧凑条。
   原实现是「标题 + 三列大数字 + 每个数字下两行说明」的整块, 占 174px 高;
   而其中「平台 API 累计调用费」与上方 KPI 卡的「累计」是同一个查询、同一范围
   (管理员=全平台, 普通用户=本人), 属重复展示 —— 该列已移除。
   剩下的两项是有信息量的差分数据 (自有账号费用、一次性导入费), 横排即可, 无需整块。 */
.dash-billing-strip {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 26px;
  padding: 10px 0; border-block: 1px solid var(--th-border);
}
.dash-billing-strip-head { display: grid; gap: 1px; min-width: 0; }
.dash-billing-strip-head h2 { margin: 0; }
.dash-billing-strip-figures { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 0; margin-left: auto; }
.dash-billing-strip-figures > div { display: flex; align-items: baseline; gap: 8px; min-width: 0; flex-wrap: wrap; }
.dash-billing-strip-figures dt { color: var(--th-text-secondary); }
.dash-billing-strip-figures dd { margin: 0; color: var(--th-text); font-weight: 600; font-variant-numeric: tabular-nums; }
.dash-billing-hint { color: var(--th-text-2); font-size: var(--ui-small); }
.dash-billing-link { padding: 0; border: 0; color: var(--th-info); background: transparent; text-decoration: underline; font-size: var(--ui-small); }
.dash-billing-strip-action { flex: 0 0 auto; padding: 5px 11px; font-size: var(--ui-small); }
@media (max-width: 767px) {
  .dash-billing-strip { align-items: flex-start; }
  .dash-billing-strip-figures { margin-left: 0; }
  .dash-billing-hint { flex-basis: 100%; }
}
.dashboard-data { margin-top: 12px; color: var(--th-text-secondary); font-size: 13px; }
.dashboard-data summary { cursor: pointer; padding: 8px 0; }
.dashboard-data-scroll { overflow-x: auto; }
.dashboard-data table { width: 100%; font-size: 12px; font-variant-numeric: tabular-nums; }
.dashboard-data th, .dashboard-data td { color: var(--th-text-secondary); text-align: right; padding: 9px; border-bottom: 1px solid var(--th-border); white-space: nowrap; }
.dashboard-data th:first-child, .dashboard-data td:first-child { text-align: left; }
/* 高度由内容决定 (dashboard-charts.js 写入 --chart-h), 仅在缺失时回退到 260px。
   之前固定 260px, 2 个模型时两根柱子被均匀铺满, 中间留下大片空白。 */
.dashboard-model-chart { position: relative; height: var(--chart-h, 260px); }
#analytics-model-metric { width: auto; min-width: 92px; height: 36px; padding: 0 8px; }
.dashboard-model-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; color: var(--th-text-secondary); padding-top: 12px; }
.dashboard-model-legend span { font-size: 12px; overflow-wrap: anywhere; }
.dashboard-data td button { color: var(--th-text); text-decoration: underline; text-underline-offset: 3px; }
/* 普通用户看不到「分线与号池质量」右列; 此时让模型分布横跨两列, 避免右半屏留白。
   is-solo 由 console-app.js 按角色写入 (见 fetchAndRenderDashboard)。
   上限宽避免条目很少时条形被拉到 1100px+ 极度稀疏。 */
.dashboard-analytics-section > .grid.is-solo > :first-child { grid-column: 1 / -1; }
.dashboard-analytics-section > .grid.is-solo .dashboard-model-chart { max-width: 860px; }
#usage-source-selection:not([hidden]) { display: flex; align-items: center; gap: 8px; padding: 10px 0; color: var(--th-text-secondary); font-size: 13px; }
#usage-source-identity { min-width: 0; flex: 1; overflow-wrap: anywhere; }
#usage-source-selection button { flex: 0 0 36px; width: 36px; height: 36px; display: grid; place-items: center; }
#usage-source-selection svg { width: 18px; height: 18px; }
.analytics-source-link { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--th-border); text-align: left; }
.analytics-source-link strong { color: var(--th-text); }
.analytics-source-link span { color: var(--th-text-secondary); font-size: 13px; }
.analytics-source-link:focus-visible { outline: 2px solid var(--th-accent); outline-offset: 2px; }
.analytics-source-link > div { width: 100%; min-width: 0; }
.analytics-source-link > div:first-child { flex-wrap: wrap; }
.analytics-source-link > div:last-child { flex-wrap: wrap; }
.analytics-source-link .font-mono { overflow-wrap: anywhere; }
.usage-trend-table { grid-column: 1 / -1; min-width: 0; }
#usage-distribution-metric { width: auto; min-width: 104px; height: 36px; padding: 0 8px; font-size: 13px; }
.usage-distribution-value { text-align: right; }
@media (max-width: 600px) { .dashboard-trend-toolbar [role="status"] { margin-left: 0; width: 100%; } }

/* 标题行: 盾牌承诺与「网关概览」同行, 不再单独占据整行。 */
.dashboard-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; min-width: 0; }
.dashboard-title-row h1 { margin: 0; }

/* 防混用常驻承诺: 行内胶囊, 宽度随内容。
   盾牌**常绿**: 真实混用状态属风控信息, 只允许管理员在「服务状态」知晓;
   用户侧不提供任何可变颜色或计数, 因此这里没有 is-alert / status 变体。 */
.dashboard-safety-banner {
  display: inline-flex; align-items: center; gap: 7px; max-width: 100%;
  padding: 3px 11px 3px 4px; border: 1px solid rgba(52, 211, 153, .28); border-radius: 999px;
  background: linear-gradient(90deg, rgba(52, 211, 153, .10), rgba(52, 211, 153, .02));
}
.dashboard-safety-banner .channel-shield { flex-shrink: 0; width: 22px; height: 22px; border-radius: 7px; color: #34d399; border-color: rgba(52, 211, 153, .45); background: rgba(52, 211, 153, .1); }
.dashboard-safety-banner .channel-shield i { width: 13px; height: 13px; }
.dashboard-safety-copy { display: block; min-width: 0; }
.dashboard-safety-copy strong { color: var(--th-text); font-size: 12.5px; font-weight: 600; }
