@media (min-width: 600px) {
  .content {
    padding-top: 72px;
  }
  .header {
    padding: 20px 32px;
  }
  .header.scrolled {
    padding: 10px 28px;
  }
  .section-label,
  .section-heading {
    padding-left: 28px;
    padding-right: 28px;
  }
  .section-heading {
    font-size: 1.2rem;
  }
  .card {
    flex: 0 0 175px;
  }
  .settings-header {
    padding: 1rem 2rem;
  }
  .settings-body {
    padding: 2rem;
    gap: 2.5rem;
  }
  .theme-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 700px) {
  .settings-content {
    max-width: 700px;
  }
  .theme-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 769px) {
  .media-split {
    flex-direction: row;
  }
}

@media (min-width: 900px) {
  .section-label,
  .section-heading {
    padding-left: 40px;
    padding-right: 40px;
  }
  .card {
    flex: 0 0 185px;
  }
}

@media (min-width: 1024px) {
  .info-section-grid {
    flex-direction: row;
  }
}

@media (min-width: 1200px) {
  .section-label,
  .section-heading {
    padding-left: 56px;
    padding-right: 56px;
  }
}

@media (min-width: 600px) and (max-height: 500px) and (orientation: landscape) {
  .settings-content {
    max-height: 90vh;
  }
}