@media (max-width:1200px){
  .stats,
  .stats-row,
  .stats-bar{
    grid-template-columns:repeat(2,1fr);
  }

  .ea-card{
    grid-template-columns:200px 1fr;
  }

  .ea-right{
    grid-column:1 / -1;
    justify-content:flex-start;
    margin-top:12px;
  }
}

@media (max-width:992px){
  .sidebar{
    width:200px;
  }

  .main{
    margin-left:200px;
  }

  .split-view{
    grid-template-columns:1fr;
    padding:0 20px;
  }

  .navigator-panel{
    height:auto;
    max-height:320px;
  }
}

@media (max-width:768px){
  .sidebar{
    position:fixed;
    inset:0 auto 0 0;
    transform:translateX(-100%);
    transition:.3s;
    z-index:1000;
  }

  .sidebar.open{
    transform:translateX(0);
  }

  .main{
    margin-left:0;
  }

  .topbar,
  .top-header,
  .page-header{
    padding:15px 20px;
  }

  .stats,
  .stats-row,
  .stats-bar{
    grid-template-columns:1fr;
    padding:15px 20px;
  }

  .ea-card{
    grid-template-columns:1fr;
    gap:16px;
  }

  .ea-left,
  .ea-right{
    width:100%;
    justify-content:space-between;
  }

  .ea-center *{
    white-space:normal;
  }
}

@media (max-width:576px){
  .brand-title,
  .brand-name,
  .page-title{
    font-size:18px;
  }

  .stat-value{
    font-size:22px;
  }

  .stat-title{
    font-size:11px;
  }

  .avatar,
  .user-avatar{
    width:36px;
    height:36px;
  }

  .vm-box{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
  }

  .vm-actions{
    flex-direction:row;
    width:100%;
    justify-content:flex-end;
  }
}
