/* ---------- Responsive ---------- */
@media (max-width: 640px) {
  .header {
    flex-direction: column;
    align-items: flex-start;
  }
  .header__controls { width: 100%; flex-wrap: wrap; }
  .favorites-bar { max-width: 100%; }
  .aqi-card__body { flex-direction: column; align-items: flex-start; }
  .aqi-card__section--info { width: 100%; }
  .aqi-gauge { width: 120px; height: 120px; }
  .aqi-gauge__value { font-size: 3.8rem; }
  .pollutant-tooltip { width: 200px; left: 0; transform: none; }
  .pollutant-tooltip::after { left: 30px; transform: none; }
}