@media (max-width: 991px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  .mobile-header {
    padding-right: max(1rem, env(safe-area-inset-right));
    padding-left: max(1rem, env(safe-area-inset-left));
  }
  #mobile-page-title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .content:not(.guanmo-viewport) {
    padding: 64px .55rem calc(.75rem + env(safe-area-inset-bottom)) !important;
  }
  .content > .container-fluid { padding-right: 0; padding-left: 0; }
  .page-panel { margin-bottom: 1rem !important; }
  .overview-banner {
    margin-bottom: .7rem;
    border-radius: 8px;
    padding: .9rem !important;
  }
  .overview-banner h3 { font-size: 1.1rem; }
  .overview-banner p { max-width: 100%; font-size: .8rem; line-height: 1.5; }
  .overview-banner .d-flex > div:last-child { width: 100%; }
  .overview-banner .btn-group,
  .overview-banner .d-flex > div:last-child:has(.btn) {
    display: flex;
    width: 100%;
    gap: .4rem;
    overflow-x: auto;
  }
  .overview-banner .btn-group > .btn,
  .overview-banner .d-flex > div:last-child > .btn {
    flex: 1 0 auto;
    margin: 0 !important;
  }
  .card { border-radius: 8px; }
  .card-header { padding: .75rem .85rem; font-size: .92rem; }
  .card-body { padding: .85rem; }
  .row { --bs-gutter-x: .75rem; }
  .content .form-control,
  .content .form-select {
    min-height: 44px;
    font-size: 16px;
  }
  .content textarea.form-control { min-height: 96px; }
  .content .btn { min-height: 40px; }
  .content .btn-sm { min-height: 38px; padding: .4rem .62rem; }
  .input-group > .btn { min-width: 42px; }
  .nav-tabs,
  .nav-pills {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }
  .nav-tabs::-webkit-scrollbar,
  .nav-pills::-webkit-scrollbar { display: none; }
  .nav-tabs .nav-link,
  .nav-pills .nav-link { white-space: nowrap; }
  .table-responsive {
    width: calc(100% + .6rem);
    margin-right: -.3rem !important;
    margin-left: -.3rem !important;
    padding: 0 .3rem .35rem !important;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }
  .table-responsive > .table { margin-bottom: .25rem; }
  .table th,
  .table td { vertical-align: middle; }
  .modal-dialog {
    width: auto;
    max-width: none;
    margin: .5rem;
  }
  .modal-content { max-height: calc(100dvh - 1rem); border-radius: 8px; }
  .modal-header,
  .modal-footer { flex: 0 0 auto; padding: .75rem .85rem; }
  .modal-body { min-height: 0; padding: .85rem; overflow-y: auto; }
  .modal-footer { gap: .4rem; }
  .modal-footer > .btn { flex: 1; margin: 0; }
  .workspace-stat-slot { width: 50%; }
  .workspace-stat-card .card-body { padding: .75rem; }
  .workspace-stat-card .display-6 { font-size: 1.55rem; }
  .workspace-stat-card small { display: block; line-height: 1.35; }
}

@media (max-width: 420px) {
  .content:not(.guanmo-viewport) { padding-right: .4rem !important; padding-left: .4rem !important; }
  .overview-banner { padding: .78rem !important; }
  .card-body { padding: .75rem; }
  .workspace-stat-card .card-body { padding: .65rem; }
  .workspace-stat-card .display-6 { font-size: 1.35rem; }
}