@media(max-width:980px){
  body{overflow-x:hidden!important}
  .app{display:block!important}
  .side{display:none!important}
  .main{padding:16px!important}
  .hero,.top{display:block!important;padding:18px!important}
  .grid,.kpis,.layout{display:grid!important;grid-template-columns:1fr!important;gap:14px!important}
  .card{border-radius:16px!important;padding:16px!important}
  .row,.action{display:block!important}
  .row .status,.action .status{display:inline-block!important;margin-top:8px!important}
  h1{font-size:24px!important}
  h2{font-size:18px!important}
  .btn{width:100%;margin-top:8px!important}
  input,select,textarea{width:100%!important}
  #avRealtimeStrip{left:12px!important;right:12px!important;bottom:12px!important;border-radius:18px!important;justify-content:center!important;flex-wrap:wrap!important}
}
@media(max-width:560px){
  .main{padding:12px!important}
  .hero,.top,.card{border-radius:14px!important}
  h1{font-size:22px!important}
  .kpi .val{font-size:22px!important}
}