@media (max-width: 767px) {
  .content { padding: 0 12px; }
  .content-inner { padding-bottom: 0; }
  .page.active { padding-bottom: max(20px, env(safe-area-inset-bottom)); }
}
.sidebar .nav-item { padding-top: 6px; padding-bottom: 6px; }

@media (max-width: 900px) {
  :root { --sidebar-w: 68px; }
}

@media (min-width: 768px) and (max-width: 900px) {
  .brand-text { display: none; }
}

@media (min-width: 768px) and (max-width: 900px) { .nav-group-label { display: none; } }

@media (min-width: 768px) and (max-width: 900px) {
  .sidebar-status { padding: 8px 6px; align-items: center; }
  .status-line { justify-content: center; }
  .sidebar-status .txt { display: none; }
  .status-actions { display: none; }
}

@media (max-width: 900px) {
  .topbar-actions .badge.optional { display: none; }
}

.page { display: none; }
.page.active {
  display: block;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding-bottom: 20px;
  overflow-anchor: none;
}
.page[data-page="__plugin__"].active {
  display: flex;
  flex: 1;
  min-height: 0;
  padding-bottom: 0;
  overflow: hidden;
}

.plugin-page-frame {
  display: block;
  flex: 1;
  width: 100%;
  min-height: 0;
  border: 0;
  background: transparent;
}
.head-actions { margin-left: auto; display: flex; gap: 7px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }

.panel-foot .spacer { flex: 1 1 auto; }
.table-foot-bar { row-gap: 6px; }
.table-foot-ctl {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-left: auto;
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.table-foot-count {
  color: var(--text-2);
  font-variant-numeric: tabular-nums;
}
.table-foot-size,
.table-foot-jump {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--text-2);
  white-space: nowrap;
}
.page.active[data-page="accounts"] {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-bottom: var(--pad);
}

.page[data-page="accounts"] .panel {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}

.page[data-page="accounts"] .account-table { flex: 1; min-height: 120px; }
.page.active[data-page="logs"],
.page.active[data-page="requests"] {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-bottom: var(--pad);
}
.page.active[data-page="tasks"] {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-bottom: var(--pad);
}

.page[data-page="tasks"] .panel {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}

.page[data-page="tasks"] .panel-head,
.page[data-page="tasks"] .panel-foot { flex: none; }
.page[data-page="tasks"] .panel-body { flex: 1; min-height: 0; }

.page[data-page="logs"] .panel,
.page[data-page="requests"] .panel {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}
.page[data-page="logs"] .panel-head,
.page[data-page="logs"] .panel-foot,
.page[data-page="requests"] .panel-head,
.page[data-page="requests"] .panel-foot { flex: none; }

.page[data-page="logs"] .panel-body,
.page[data-page="requests"] .panel-body { flex: 1; min-height: 0; }