yield to context

Style based on container

/* ❌ Viewport-based decisions */
@media (max-width: 768px) {
  .card {
    padding: 0.5rem;
  }
}

/* ✅ Context-aware styling */
.container {
  container-type: inline-size;
}

@container (max-width: 200px) {
  .card {
    padding: 0.75rem;
    font-size: 0.875rem;
  }
}