body {
  font-family: Arial, sans-serif;
  background-color: #f8f9fa;
  color: #212529;
}

#sentenceDisplay {
  min-height: 2em;
}

.theme-card {
  cursor: default;
  background-color: #ffffff;
  color: #212529;
  border-top: 4px solid var(--theme-color, #0d6efd);
  border-radius: 0.5rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.theme-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.theme-icon {
  font-size: 2.5rem;
}

#playArea .btn {
  padding: 0.75rem 1.5rem;
  font-size: 1.25rem;
}

@media (max-width: 576px) {
  body {
    font-size: 1.1rem;
  }

  .theme-icon {
    font-size: 3rem;
  }

  .theme-card .btn {
    font-size: 1.25rem;
    padding: 0.75rem 1rem;
  }

  #playArea .btn {
    width: 100%;
    margin-bottom: 0.5rem;
  }

  #playArea .d-flex {
    flex-direction: column;
  }
}