@media (max-width:640px) {
  .subtitle { font-size:.95rem; }
  button { padding:.8rem 1.2rem; }
  #progress-wrap { min-width:190px; }
  .start-panel {
    gap:.8rem;
  }
  .countdown-config {
    flex-direction:column;
    align-items:flex-start;
  }
  .modal-card {
    padding:1.1rem;
  }
}

@media (max-width:768px) {
  #overlay-ui {
    flex-direction:column;
    align-items:stretch;
    gap:.8rem;
  }
  #session-cluster {
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
  }
  #metrics-panel {
    max-width:none;
  }
  .stats-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  #session-cluster {
    align-items:flex-start;
  }
  #session-status-text {
    align-self:flex-start;
  }
}

@media (max-width:480px) {
  .stats-grid {
    grid-template-columns: 1fr;
  }
  .volume-meter {
    height:58px;
  }
  .mode-grid {
    grid-template-columns: 1fr;
  }
  .summary-grid {
    grid-template-columns: 1fr;
  }
  #summary-growth-chart {
    height:100px;
  }
}