@media (max-width: 1100px) {
  :root { --sidebar-width: 228px; }
  .topbar__date { display: none; }
  .page-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-grid--sidebar, .page-grid--wide-side, .page-grid--main-side { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  :root { --sidebar-width: 256px; }
  .app-shell__sidebar { transform: translateX(-100%); box-shadow: var(--shadow-lg); transition: transform var(--transition); }
  .app-shell__main { margin-left: 0; }
  .app-shell.is-mobile-nav-open .app-shell__sidebar { transform: translateX(0); }
  .app-shell.is-mobile-nav-open::after { position: fixed; z-index: calc(var(--z-sidebar) - 1); inset: 0; background: var(--color-overlay); content: ""; }
  .topbar { padding: 0 var(--space-4); }
  .topbar__search { display: none; }
  .topbar__breadcrumbs { flex: 1; }
  .topbar__profile-copy { display: none; }
  .topbar__profile { border-left: 0; }
  .app-shell__content { padding: var(--space-5) var(--space-4) var(--space-6); }
  .footer { min-height: 52px; height: auto; padding: 10px var(--space-4); align-items: flex-start; flex-direction: column; }
  .footer__right { text-align: left; }
  .page-header { flex-direction: column; }
  .page-header__actions { justify-content: flex-start; }
  .page-grid--2, .page-grid--3 { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .form-field--full { grid-column: auto; }
  .table-toolbar { align-items: stretch; flex-direction: column; }
  .table-toolbar__left, .table-toolbar__right { width: 100%; }
  .search-field { flex: 1; min-width: 0; }
  .tabs { margin-right: -4px; margin-left: -4px; border-radius: 0; border-right: 0; border-left: 0; }
}

@media (max-width: 560px) {
  h1 { font-size: 24px; }
  h2 { font-size: 19px; }
  .topbar__right > .topbar__icon-btn:nth-of-type(2) { display: none; }
  .topbar__profile { padding-left: 0; }
  .topbar__avatar { width: 30px; height: 30px; }
  .page-grid--4 { grid-template-columns: 1fr 1fr; gap: var(--space-3); }
  .metric-card { min-height: 116px; padding: 13px; }
  .metric-card__value { font-size: 21px; }
  .card__header, .card__body { padding-right: var(--space-4); padding-left: var(--space-4); }
  .page-header__actions .btn:not(.btn--primary):not(.btn--accent) { padding-right: 9px; padding-left: 9px; }
  .data-table { min-width: 640px; }
  .modal-backdrop { padding: 12px; }
  .modal__header, .modal__body { padding: var(--space-4); }
  .drawer__header, .drawer__body { padding: var(--space-4); }
  .drawer__footer { padding: var(--space-3) var(--space-4); }
}

@media (max-width: 1100px) {
  .topbar__role-select { max-width: 132px; }
  .topbar__terminal-select { max-width: 138px; }
}
@media (max-width: 820px) {
  .topbar__role-select { display: none; }
  .topbar__terminal-select { max-width: 128px; }
}
@media (max-width: 560px) {
  .topbar__terminal-select { display: none; }
}