@media (max-width: 1199px) {
  .dashboard-shell { padding: 24px; }
  .kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #brandPanel,#platformPanel { grid-column: span 6; }
}
@media (max-width: 720px) {
  .dashboard-shell { padding: 20px 12px 32px; }
  .dashboard-header { align-items: start; flex-direction: column; gap: 12px; margin-bottom: 16px; }
  .header-actions { width: 100%; justify-content: space-between; }
  h1 { font-size: 24px; }
  .filter-toolbar { align-items: stretch; gap: 8px; }
  .dashboard-mode-controls { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  select { max-width: 100%; width: 100%; }
  .brand-period-controls { width: 100%; }
  .month-selector { width: 100%; }
  .week-selector { width: 100%; overflow-x: auto; }
  .week-button { flex: 1 0 auto; padding: 4px 8px; min-height: 32px; }
  .kpi-grid { gap: 8px; }
  .kpi-card { padding: 12px; }.kpi-card > strong { font-size: 24px; }
  .dashboard-grid { grid-template-columns: minmax(0,1fr); gap: 12px; }
  .panel,#brandPanel,#platformPanel,.is-brand-mode #platformPanel { grid-column: 1; grid-row: auto; padding: 16px; }
  #brandPanel { order: 0; }#platformPanel { order: 1; }.chart-panel { order: 2; }.critical-signals-panel { order: 3; }.panel-insights { order: 4; }.panel-actions { order: 5; }
  .signal-card-grid { grid-template-columns: 1fr; }
  .critical-signal-top { flex-wrap: wrap; }
  .category-chart-row { grid-template-columns: minmax(110px,.9fr) minmax(0,1.1fr); gap: 10px; }
  .rank-label { flex-direction: column; gap: 0; }
  .rank-change { max-width: 140px; text-align: right; }
  .distribution { grid-template-columns: 1fr; }.donut { width: 144px; height: 144px; }
}
@media (max-width: 359px) { .kpi-grid { grid-template-columns: 1fr; } }

@media (max-width: 720px) {
  .is-brand-mode .chart-panel { grid-row: auto; }
  .trend-values { display: table; width: 100%; border-collapse: collapse; font-size: 12px; }
  .trend-values caption { text-align: left; color: var(--muted); padding: 8px 0; }
  .trend-values th,.trend-values td { border-top: 1px solid var(--line); padding: 6px 0; }
  .trend-values th { text-align: left; font-weight: 500; }.trend-values td { text-align: right; font-variant-numeric: tabular-nums; }
}
