@media (max-width: 900px) {
  body { overflow-x: hidden; }
  .sidebar { width: 64px !important; }
  .sidebar .brand { padding: 16px 8px !important; }
  .sidebar .brand .sub, .sidebar .menu a:not(.active)::after, .sidebar .menu a { font-size: 0 !important; }
  .sidebar .menu a { justify-content: center; padding: 14px 4px !important; }
  .sidebar .menu a .icon { margin: 0 !important; font-size: 18px !important; }
  .sidebar .user-info { display: none; }
  .main { margin-left: 64px !important; padding: 12px !important; }
  .card { padding: 14px !important; }
  div[style*="grid-template-columns:repeat(6,1fr)"],
  div[style*="grid-template-columns:1fr 1fr 1fr"] { grid-template-columns: 1fr !important; }
  .el-table { overflow-x: auto; display: block; }
}
@media (max-width: 560px) {
  .sidebar { width: 0 !important; overflow: hidden; }
  .main { margin-left: 0 !important; }
  .main .topbar { align-items: flex-start !important; gap: 8px; flex-direction: column; }
  .el-dialog { width: calc(100vw - 24px) !important; }
}