@media (max-width: 1100px){
  .shell{display:block;overflow-x:hidden}
  .sidebar{position:relative;width:100%;min-height:0;height:auto;padding:16px 22px;display:block}
  .sidebar nav{display:flex;gap:4px;margin:18px 0 0;overflow-x:auto}
  .nav-link{white-space:nowrap}
  .logout{position:absolute;right:18px;top:16px;margin:0}
  .main{margin:0;width:100%;max-width:100%;padding:32px 25px 60px;overflow:hidden}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split-grid{grid-template-columns:1fr}
}
@media (max-width: 600px){
  .sidebar{padding:14px 14px 12px}
  .brand{padding-right:75px}
  .sidebar nav{margin-top:14px}
  .logout{right:14px;top:14px}
  .main{padding:25px 14px 50px}
  .topbar h1{font-size:29px}
  .panel-heading{padding:18px}
  .date-filter{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}
  .date-filter input{width:100%}
  .table-wrap{max-width:100%}
}
@media (max-width: 430px){
  .date-filter{grid-template-columns:1fr 1fr}
  .date-filter .button{grid-column:span 2}
  .employee-edit{grid-template-columns:1fr}
  .employee-edit .button{grid-column:auto}
  .form-grid{grid-template-columns:1fr}
  .form-grid .button{grid-column:auto}
}