@media (max-width: 1280px) {
  .grid-4 { grid-template-columns: 1fr 1fr; }
  .metric-cards { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
}

@media (max-width: 1024px) {
  .app-shell { grid-template-columns: var(--sidebar-collapsed-width) 1fr; }
  .sidebar { width: var(--sidebar-collapsed-width); }
  .sidebar-brand-text,
  .sidebar-item-label,
  .sidebar-item-badge,
  .sidebar-section-label,
  .sidebar-collapse-btn span { display: none; }
  .sidebar-item { justify-content: center; padding: var(--space-3); }
  .sidebar-brand { justify-content: center; padding: var(--space-4) var(--space-2); }
  .sidebar-nav { padding: var(--space-4) var(--space-2); }
  .grid-2 { grid-template-columns: 1fr; }
  .grid-3 { grid-template-columns: 1fr; }
  .header-user-info { display: none; }
  .login-page { grid-template-columns: 1fr; }
  .login-hero { display: none; }
}

@media (max-width: 768px) {
  .app-shell { grid-template-columns: 1fr; grid-template-areas: "header" "main"; }
  .sidebar { display: none; }
  .main-content { padding: var(--space-4); }
  .header { padding: 0 var(--space-4); }
  .metric-cards { grid-template-columns: 1fr 1fr; }
  .page-header { flex-direction: column; align-items: flex-start; }
  .data-table-container { overflow-x: auto; }
  .notification-panel { width: calc(100vw - var(--space-8)); }
  .modal { width: 95%; }
  .filter-bar { flex-direction: column; align-items: stretch; }
}