/* Readable type for ages 20-60. Same scale on every portal page.
   12px  uppercase kickers / breadcrumbs
   13px  field labels, hints, tags, secondary meta
   15px  buttons, supporting copy
   16px  body copy and form controls
   Display headings stay large. Nothing readable goes below 12px. */

.portal-page {
    font-size: 16px;
    line-height: 1.55;
}

.portal-page small {
    font-size: 13px;
}

.portal-page .auth-form-head .portal-brand {
    font-size: 0;
}

.portal-page .sidebar-nav a,
.portal-page .mobile-bottom-nav a,
.portal-page .mobile-bottom-nav button {
    font-size: 15px;
}

.portal-page .sidebar-label,
.portal-page .dashboard-space-label,
.portal-page .admin-space-label,
.portal-page .dashboard-breadcrumb,
.portal-page .admin-breadcrumb,
.portal-page .dashboard-eyebrow,
.portal-page .admin-eyebrow,
.portal-page .dashboard-card-label,
.portal-page .dashboard-index,
.portal-page .sa-index,
.portal-page .sa-eyebrow,
.portal-page .sa-breadcrumb,
.portal-page .sa-space-label,
.portal-page .sa-card-kicker,
.portal-page .auth-kicker,
.portal-page .auth-visual-foot {
    font-size: 12px;
    letter-spacing: .1em;
}

.portal-page .nav-icon svg,
.portal-page .sidebar-nav .nav-icon svg {
    width: 18px;
    height: 18px;
}

.portal-page .nav-counter,
.portal-page .admin-counter {
    font-size: 12px;
    min-width: 22px;
    padding: 4px 7px;
}

.portal-page .sidebar-bottom,
.portal-page .dashboard-sidebar-user small,
.portal-page .admin-role small,
.portal-page .sa-sidebar-user small {
    font-size: 13px;
}

.portal-page .dashboard-sidebar-user strong,
.portal-page .admin-role strong,
.portal-page .sa-sidebar-user strong {
    font-size: 15px;
}

.portal-page .user-avatar,
.portal-page .admin-avatar,
.portal-page .member-card-avatar,
.portal-page .community-avatar,
.portal-page .sa-person-avatar {
    font-size: 13px;
}

.portal-page .portal-topbar h1,
.portal-page .dashboard-topbar h1,
.portal-page .admin-topbar h1,
.portal-page .sa-topbar h1 {
    font-size: 26px;
}

.portal-page .dashboard-command,
.portal-page .admin-command,
.portal-page .sa-command {
    font-size: 14px;
    min-height: 42px;
}

.portal-page .dashboard-command kbd,
.portal-page .admin-command kbd,
.portal-page .sa-command kbd {
    font-size: 12px;
}

.portal-page .auth-form-head p,
.portal-page .dashboard-hero p,
.portal-page .admin-page-head p,
.portal-page .portal-welcome p,
.portal-page .sa-page-intro p {
    font-size: 16px;
    line-height: 1.65;
}

.portal-page .field label,
.portal-page .admin-form label {
    font-size: 13px;
}

.portal-page .field input,
.portal-page .field select,
.portal-page .field textarea,
.portal-page .admin-form input,
.portal-page .admin-form select,
.portal-page .admin-form textarea,
.portal-page .portal-search,
.portal-page .admin-search {
    font-size: 16px;
    min-height: 48px;
}

.portal-page .admin-form input[type="checkbox"],
.portal-page .admin-form input[type="radio"],
.portal-page .admin-form input[type="hidden"],
.portal-page .field input[type="checkbox"],
.portal-page .field input[type="radio"] {
    width: auto;
    min-width: 18px;
    min-height: 18px;
    height: 18px;
    padding: 0;
}

.portal-page .field-toggle,
.portal-page .field-hint,
.portal-page .admin-form-hint {
    font-size: 13px;
}

.portal-page .check-label,
.portal-page .form-link,
.portal-page .auth-switch,
.portal-page .sidebar-logout {
    font-size: 15px;
}

.portal-page .check-label {
    align-items: flex-start;
}

.portal-page .check-label span {
    flex: 1;
    min-width: 0;
    line-height: 1.5;
}

.portal-page .check-label a {
    color: var(--blue, #087cff);
    font-weight: 700;
}

.portal-page .button,
.portal-page .auth-submit,
.portal-page .social-button,
.portal-page .admin-button,
.portal-page .dashboard-primary-button,
.portal-page .dashboard-dark-button,
.portal-page .dashboard-quiet-link,
.portal-page .dashboard-outline-button,
.portal-page .sa-primary-button,
.portal-page .sa-dark-button,
.portal-page .sa-outline-button,
.portal-page .account-danger-button,
.portal-page .mini-button {
    font-size: 15px;
    font-family: 'DM Sans', sans-serif;
}

.portal-page .sa-outline-button {
    padding: 9px 14px;
    border-radius: 10px;
    border: 1px solid #d4e2ee;
    background: #fff;
    color: #4b7297;
    font-weight: 700;
    transition: background .2s, color .2s, border-color .2s;
}

.portal-page .sa-outline-button:hover {
    background: #f0f7ff;
    color: #087cff;
    border-color: #b9d7f6;
}

.portal-page .sa-outline-button svg {
    width: 16px;
    height: 16px;
}

.portal-page .active-pill,
.portal-page .status-badge,
.portal-page .status-pill {
    font-size: 12px;
    padding: 6px 10px;
}

.portal-page .member-identity strong,
.portal-page .member-number strong {
    font-size: 16px;
}

.portal-page .member-identity > div span,
.portal-page .member-number span,
.portal-page .member-card-footer,
.portal-page .profile-progress-row p,
.portal-page .profile-progress-row a {
    font-size: 13px;
    line-height: 1.45;
}

.portal-page .profile-progress-row strong,
.portal-page .dashboard-membership-strip strong,
.portal-page .dashboard-tip strong,
.portal-page .community-person strong,
.portal-page .action-copy strong,
.portal-page .timeline-item strong {
    font-size: 16px;
    line-height: 1.4;
}

.portal-page .action-copy small,
.portal-page .action-copy span,
.portal-page .timeline-item > div > span,
.portal-page .dashboard-heading-note,
.portal-page .dashboard-hero-meta small,
.portal-page .community-person small,
.portal-page .community-footer,
.portal-page .dashboard-membership-strip small,
.portal-page .dashboard-tip small {
    font-size: 13px;
}

.portal-page .dashboard-section-heading h2,
.portal-page .dashboard-panel-heading h2,
.portal-page .sa-section-head h2 {
    font-size: 24px;
}

.portal-page .admin-stat-label,
.portal-page .admin-stat small,
.portal-page .admin-panel-heading p,
.portal-page .admin-panel-link,
.portal-page .admin-insight span,
.portal-page .admin-insight small,
.portal-page .admin-hero-meta small,
.portal-page .admin-footer-note,
.portal-page .admin-filter,
.portal-page .admin-table th,
.portal-page .admin-table td small {
    font-size: 13px;
}

.portal-page .admin-stat strong {
    font-size: 32px;
}

.portal-page .admin-panel-heading h3,
.portal-page .admin-form-card h3 {
    font-size: 20px;
}

.portal-page .admin-queue-item strong,
.portal-page .admin-activity-item strong,
.portal-page .admin-quick-card strong,
.portal-page .admin-toggle-row strong,
.portal-page .admin-permission strong,
.portal-page .admin-table td,
.portal-page .admin-table td strong,
.portal-page .admin-check,
.portal-page .admin-hero p {
    font-size: 15px;
    line-height: 1.45;
}

.portal-page .admin-queue-item small,
.portal-page .admin-activity-item span,
.portal-page .admin-quick-card small,
.portal-page .admin-toggle-row small,
.portal-page .admin-permission span {
    font-size: 13px;
}

.portal-page .portal-card-heading h3,
.portal-page .portal-thread h3,
.portal-page .event-page-body h3 {
    font-size: 18px;
}

.portal-page .portal-card-heading a,
.portal-page .activity-item span,
.portal-page .thread-meta,
.portal-page .portal-date,
.portal-page .portal-stat .stat-label,
.portal-page .portal-stat small,
.portal-page .tag,
.portal-page .event-page-body p,
.portal-page .event-page-footer,
.portal-page .directory-person-card small,
.portal-page .directory-person-card p {
    font-size: 13px;
    line-height: 1.5;
}

.portal-page .activity-item strong,
.portal-page .portal-thread p,
.portal-page .directory-person-card strong,
.portal-page .next-event p {
    font-size: 15px;
    line-height: 1.5;
}

.portal-page .portal-tabs button {
    font-size: 14px;
    padding: 10px 14px;
}

.portal-page .dev-switcher-kicker {
    font-size: 12px;
}

.portal-page .dev-switcher-card span {
    font-size: 14px;
}

.portal-page .dev-switcher-card small {
    font-size: 12px;
}

.portal-page .dev-switcher-card b {
    font-size: 15px;
}

.portal-page .field-error,
.portal-page .auth-alert {
    font-size: 15px;
}

.portal-page .account-intro p,
.portal-page .sa-rail-note p,
.portal-page .sa-profile-note p {
    font-size: 16px;
    line-height: 1.65;
}

.portal-page .account-intro-action > span:not(.sa-card-kicker),
.portal-page .account-profile-row p,
.portal-page .account-preview-card > p,
.portal-page .account-form-actions,
.portal-page .account-switch-row small,
.portal-page .settings-row small {
    font-size: 13px;
    line-height: 1.5;
}

.portal-page .account-danger p,
.portal-page .profile-danger-copy {
    font-size: 15px;
    line-height: 1.6;
}

.portal-page .account-intro-action a {
    font-size: 15px;
}

.portal-page .account-form-grid label > span,
.portal-page .account-link-grid label > span,
.portal-page .account-field-wide > span,
.portal-page .account-field-label,
.portal-page .account-form-grid small,
.portal-page .account-link-grid small,
.portal-page .account-field-wide small {
    font-size: 13px;
}

.portal-page .account-form-grid input,
.portal-page .account-form-grid select,
.portal-page .account-link-grid input,
.portal-page .account-field-wide textarea,
.portal-page .account-field-wide input:not([data-chip-field]) {
    font-size: 16px;
    min-height: 48px;
}

.portal-page .account-chip,
.portal-page .account-chip-input span,
.portal-page .account-chip em,
.portal-page .account-chip-suggest button,
.portal-page .sa-person-tags span,
.portal-page .sa-member-tags span,
.portal-page .sa-topic-chip {
    font-size: 13px;
}

.portal-page .sa-person-tags span,
.portal-page .sa-member-tags span {
    padding: 6px 10px;
}

.portal-page .sa-verified {
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    justify-self: start;
    width: fit-content;
}

.portal-page .account-switch-row strong,
.portal-page .sa-rail-note strong,
.portal-page .settings-row strong {
    font-size: 15px;
}

.portal-page .account-preview-card h3 {
    font-size: 18px;
}

.portal-page .account-panel-heading h2,
.portal-page .account-section-heading h2 {
    font-size: 24px;
}

.portal-page .profile-media-button {
    font-size: 15px;
}

.portal-page .account-chip-input input[data-chip-field] {
    font-size: 16px;
}

@media (max-width: 520px) {
    .portal-page .dashboard-hero p,
    .portal-page .admin-page-head p,
    .portal-page .admin-hero p {
        font-size: 15px;
    }

    .portal-page .mobile-bottom-nav a,
    .portal-page .mobile-bottom-nav button {
        font-size: 12px;
    }
}