@media (max-width: 900px){
  .cards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 640px){
  .app{display:block}
  .sidebar{position:fixed;left:0;top:0;height:100vh;transform:translateX(-100%);transition:transform .2s ease}
  .sidebar.open{transform:translateX(0)}
  .main{margin-left:0}
  .header{position:sticky;top:0}
  .cards{grid-template-columns:1fr}
}