/* 白底看板的作用域独立于历史蓝紫主题，沿用小 Q 指标卡与分区图表布局。 */
.theme-dashboard { box-sizing: border-box; min-width: 0; padding: 22px; background: #fff; border-radius: 10px; color: #28344e; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; container-type: inline-size; }
.theme-dashboard * { box-sizing: border-box; }
.theme-dashboard-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.theme-dashboard-eyebrow { color: #8e98aa; font-size: 10px; letter-spacing: .5px; }
.theme-dashboard-heading h3 { margin: 7px 0 0; color: #25324b; font-size: 21px; line-height: 1.4; font-weight: 600; }
.theme-sample-label { flex: none; padding: 5px 9px; border: 1px solid #e4eafa; border-radius: 5px; background: #f7f9ff; color: #6d86c6; font-size: 10px; }
.theme-dashboard-scope { display: flex; flex-wrap: wrap; gap: 16px; padding: 12px 0; margin-bottom: 16px; border-top: 1px solid #edf0f6; border-bottom: 1px solid #edf0f6; color: #8d96a8; font-size: 11px; }
.theme-dashboard-scope > span:first-child { color: #516384; }
.theme-dashboard-scope i { display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: #547bfa; }
.theme-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.theme-kpi { min-width: 0; padding: 17px 15px; border: 1px solid #e9edf5; border-radius: 7px; background: #fff; }
.theme-kpi > span { display: block; overflow-wrap: anywhere; color: #738099; font-size: 11px; }
.theme-kpi > strong { display: block; margin: 10px 0; color: var(--metric-color); font-size: clamp(18px, 2.2cqw, 29px); line-height: 1.2; font-weight: 600; white-space: normal; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.theme-kpi strong small { margin-left: 5px; color: #97a1b2; font-size: 10px; font-weight: 400; }
.theme-kpi em { color: #a4adbc; font-size: 9px; font-style: normal; }
.theme-panel-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.theme-panel { min-width: 0; overflow: hidden; border: 1px solid #e9edf5; border-radius: 7px; background: #fff; }
.theme-panel-wide { grid-column: span 2; }
.theme-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 10px 14px; border-bottom: 1px solid #f0f2f7; }
.theme-panel h4 { margin: 0; color: #3b4863; font-size: 12px; line-height: 1.5; font-weight: 500; }
.theme-panel > header > span { flex: none; color: #a2acbd; font-size: 9px; }
.theme-panel > header > input { min-width: 0; width: 100%; padding: 3px 0; border: 0; background: transparent; color: #3b4863; font: inherit; font-size: 12px; outline-offset: 3px; }
.theme-panel-actions { display: flex; align-items: center; flex: none; gap: 4px; }
.theme-panel-actions select { max-width: 82px; border: 1px solid #e5eaf5; border-radius: 4px; padding: 3px; color: #7c88a1; background: #fff; font-size: 10px; }
.theme-panel-actions button { width: 23px; height: 23px; padding: 0; border: 0; background: transparent; color: #9ba7bb; cursor: pointer; font-size: 18px; }
.theme-panel-actions button:hover { color: #dc6677; background: #fff4f6; border-radius: 4px; }
.theme-echart { width: 100%; height: 218px; min-width: 0; background: #fff; }
.theme-echart svg { display: block; width: 100%; height: 100%; fill: none; stroke: none; stroke-width: 0; }
.theme-panel-map .theme-echart { height: 260px; }
.theme-map-caption { padding: 0 10px 10px; color: #9aa5b8; font-size: 9px; text-align: center; }
.theme-table-wrap { max-width: 100%; overflow: auto; padding: 5px 12px 12px; }
.theme-table { width: 100%; border-collapse: collapse; color: #64718a; font-size: 11px; white-space: nowrap; }
.theme-table th { padding: 13px 8px; background: #f7f9fd; color: #8a96ab; font-weight: 400; text-align: left; }
.theme-table td { padding: 15px 8px; border-bottom: 1px solid #f0f2f7; }
.theme-table tbody tr:last-child td { border-bottom: 0; }
.theme-dashboard-note { margin: 18px 0 0; color: #98a2b5; font-size: 10px; line-height: 1.8; }
.theme-thumbnail { display: block; width: 100%; height: auto; background: #fff; fill: none; stroke: none; stroke-width: 0; }
.generation-template-thumbnail:has(> .theme-thumbnail) { height: auto; aspect-ratio: 32 / 19; border: 1px solid #edf0f7; }
.generation-template-stage:has(> .theme-dashboard) { padding: 0; background: #fff; border-color: #e9edf5; }
.generation-template-stage .theme-dashboard { padding: 18px; }
.quick-dashboard-canvas:has(> .theme-dashboard) { background: #fff !important; }
.quick-dashboard-canvas > .theme-dashboard { padding: 18px 0 0; }
.quick-dashboard-thumb:has(> .theme-thumbnail) { padding: 0; background: #fff; }
.quick-module-dialog:has(.theme-dashboard) { width: min(1180px, calc(100vw - 32px)); max-width: none; }
.generation-template-dialog:has(.theme-dashboard) { width: min(1180px, calc(100vw - 40px)); }
.generation-template-dialog:has(.theme-dashboard) .generation-template-body { grid-template-columns: 208px minmax(0, 1fr); }
@container (max-width: 720px) {
  .theme-panel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .theme-kpis { gap: 8px; }
  .theme-kpi { padding: 13px 10px; }
  .theme-kpi em { display: none; }
}
@container (max-width: 440px) {
  .theme-dashboard-heading h3 { font-size: 18px; }
  .theme-dashboard-scope { gap: 8px 14px; }
  .theme-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .theme-panel-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .theme-panel-wide { grid-column: auto; }
  .theme-kpi > strong { font-size: 23px; }
  .theme-echart { height: 215px; }
}
@media (max-width: 600px) {
  .generation-template-dialog:has(.theme-dashboard) { width: calc(100vw - 24px); }
  .generation-template-stage .theme-dashboard { padding: 12px; }
  .theme-dashboard { padding: 14px; }
}