@media (max-width: 900px) {
  .shell { grid-template-columns: 1fr; }
  aside { position: static; height: auto; padding: 12px 10px; display: block; }
  aside > .brand { display: none; }
  aside nav { margin: 0; display: flex; overflow: auto; gap: 4px; }
  aside nav button { flex: 0 0 auto; min-width: 88px; padding: 10px 8px; white-space: nowrap; text-align: center; font-size: 12px; }
  .logout { display: none; }
  main { padding: 20px 14px; }
  header { gap: 12px; }
  header h1 { font-size: 28px; white-space: nowrap; }
  header button { padding: 9px 14px; white-space: nowrap; }
  .metrics { grid-template-columns: repeat(2, 1fr); }
  .columns { grid-template-columns: 1fr; }
  .toolbar { gap: 12px; }
  .toolbar p { font-size: 13px; }
  .toolbar button { flex: 0 0 auto; white-space: nowrap; }
  .form-grid { grid-template-columns: 1fr; }
  .wide { grid-column: auto; }
  .filters { padding-bottom: 4px; }
  .detail-grid { grid-template-columns: 1fr; }
}