/* Responsive - Tablet */
@media (max-width: 768px) {
  .container {
    padding: 1rem;
    padding-bottom: 140px;
  }

  h1 {
    font-size: 1.8rem;
  }

  .radio-grid {
    grid-template-columns: 1fr;
  }

  .player-bar {
    padding: 0.75rem 1rem;
  }

  .player-content {
    gap: 1rem;
  }

  .now-playing-logo {
    width: 40px;
    height: 40px;
    font-size: 0.65rem;
  }

  .now-playing-title {
    font-size: 0.9rem;
  }

  .control-btn.play-pause {
    width: 48px;
    height: 48px;
  }

  .volume-control {
    display: none;
  }

  .stats {
    flex-wrap: wrap;
    gap: 1rem;
  }
}

/* Responsive - Small Mobile */
@media (max-width: 480px) {
  .container {
    padding: 0.75rem;
    padding-bottom: 120px;
  }

  h1 {
    font-size: 1.5rem;
  }

  .logo-icon {
    width: 48px;
    height: 48px;
    font-size: 22px;
  }

  .filter-btn {
    padding: 0.5rem 0.9rem;
    font-size: 0.8rem;
  }

  .player-bar {
    padding: 0.6rem 0.75rem;
  }

  .player-content {
    gap: 0.75rem;
  }

  .now-playing {
    gap: 0.6rem;
  }

  .now-playing-logo {
    width: 36px;
    height: 36px;
    font-size: 0.6rem;
    border-radius: 8px;
  }

  .now-playing-title {
    font-size: 0.85rem;
  }

  .now-playing-status {
    font-size: 0.75rem;
  }

  .live-dot {
    width: 6px;
    height: 6px;
  }

  .control-btn.play-pause {
    width: 44px;
    height: 44px;
  }

  .control-btn.play-pause svg {
    width: 20px;
    height: 20px;
  }
}