/* Área administrativa — reaproveita 100% dos tokens/componentes de app.css (.overlay-card,
   .field, .form-actions, .data-table, .table-scroll, .status-pill, button.primary,
   .empty-hint, .notify-banner); só o que é específico desta página fica aqui. */

#admin-main { max-width: 900px; margin: 0 auto; padding: 24px 18px 60px; }

.admin-login-card { width: 360px; max-width: calc(100% - 32px); margin: 80px auto 0; }
.admin-login-card h2 { margin-top: 0; }

#admin-app.hidden, #admin-login-card.hidden, #admin-whoami.hidden, #admin-logout-btn.hidden { display: none; }

.admin-section {
  background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 18px 20px; margin-bottom: 18px;
}
.admin-section h2 { margin: 0 0 4px; font-size: 15px; }
.admin-section .empty-hint { margin: 0 0 14px; }
.admin-section-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 4px; }
.admin-section-header h2 { margin: 0; }

.admin-form-row { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; }
.admin-form-row .field { flex: 1; min-width: 160px; margin-bottom: 0; }

#admin-whoami { color: var(--muted); font-size: 12.5px; }

.admin-inline-form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.admin-inline-form select, .admin-inline-form input { width: auto; min-width: 140px; }

.admin-status-connected { color: var(--success); font-weight: 600; }
.admin-status-disconnected { color: var(--muted); }