/* Overview-only card treatment. Shared app pages keep their existing theme. */
.dashboard-control-center [data-dashboard-card-style] {
  --overview-card: #0b111b;
  --overview-border: rgba(226, 232, 240, 0.15);
}

.dashboard-control-center [data-dashboard-card-style] .workspace-verdict,
.dashboard-control-center [data-dashboard-card-style] .metric,
.dashboard-control-center [data-dashboard-card-style] .panel {
  border: 1px solid var(--overview-border) !important;
  border-radius: 12px !important;
  background: var(--overview-card) !important;
  box-shadow: none !important;
  transition: border-color 160ms ease;
}

.dashboard-control-center [data-dashboard-card-style] .workspace-verdict {
  padding: 24px !important;
}

.dashboard-control-center [data-dashboard-card-style] .metric-strip {
  gap: 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

.dashboard-control-center [data-dashboard-card-style] .metric {
  min-width: 0;
  padding: 24px !important;
}

.dashboard-control-center [data-dashboard-card-style] .metric:hover,
.dashboard-control-center [data-dashboard-card-style] .panel:focus-within,
.dashboard-control-center [data-dashboard-card-style] .workspace-verdict:focus-within {
  border-color: var(--dashboard-muted) !important;
}

.dashboard-control-center [data-dashboard-card-style] .dashboard-grid {
  gap: 20px !important;
}

.dashboard-control-center [data-dashboard-card-style] .panel-head {
  padding: 20px 24px !important;
  background: transparent !important;
}

.dashboard-control-center [data-dashboard-card-style] .panel-head h2 {
  font-size: 18px !important;
  font-weight: 600 !important;
}

.dashboard-control-center [data-dashboard-card-style] :is(.kpi-label, .kpi-sub, .panel-head p, .chart-summary dt, .traffic-period-heading, .status-copy p, .verdict-diagnostics dt, .verdict-diagnostics dd, .alert-meta, .panel-head-link, .status-action, .traffic-period-control select) {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

.dashboard-control-center [data-dashboard-card-style] .kpi-value {
  margin-top: 12px !important;
  font-family: var(--dashboard-font-display) !important;
  font-variant-numeric: tabular-nums;
  font-size: 28px !important;
  line-height: 1.2 !important;
}

.dashboard-control-center [data-dashboard-card-style] .kpi-sub {
  margin-top: 8px !important;
}

.dashboard-control-center [data-dashboard-card-style] :is(.dashboard-button, .panel-head-link, .status-action, .traffic-period-control select, .filter-chip) {
  border-radius: 6px !important;
}

.dashboard-control-center [data-dashboard-card-style] .traffic-period-control select {
  min-height: 44px !important;
  width: 116px;
}

.dashboard-control-center [data-dashboard-card-style] :is(.usage-x-label, .usage-y-label) {
  font-size: 14px !important;
}

/* Keep the chart's clipped screen-reader table inside its own containing block. */
.dashboard-control-center [data-dashboard-card-style] .usage-chart {
  position: relative;
}

@media (max-width: 680px) {
  .dashboard-control-center [data-dashboard-card-style] .metric,
  .dashboard-control-center [data-dashboard-card-style] .workspace-verdict,
  .dashboard-control-center [data-dashboard-card-style] .panel-head {
    padding: 20px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dashboard-control-center [data-dashboard-card-style] .metric,
  .dashboard-control-center [data-dashboard-card-style] .panel,
  .dashboard-control-center [data-dashboard-card-style] .workspace-verdict {
    transition: none !important;
  }
}