/*
 * Shared readability layer
 * Keeps admin, portal, authentication and public typography aligned with the UX scale.
 */
body:is(.admin-page, .portal-page, .public-page, .auth-page) {
    font-kerning: normal;
    line-height: 1.5;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

:is(.admin-page, .portal-page, .public-page, .auth-page) :is(h1, h2, h3, h4, h5) {
    text-wrap: balance;
}

:is(.admin-page, .portal-page, .public-page, .auth-page) :is(p, li, dd, figcaption) {
    text-wrap: pretty;
}

/* Admin */
.admin-page .admin-sidebar__context {
    font-size: 12px;
    line-height: 18px;
}

.admin-page .admin-menu__section {
    color: #9aabc0;
    font-size: 12px;
    line-height: 16px;
}

.admin-page .admin-menu__link {
    font-size: 13px;
    line-height: 20px;
}

.admin-page .admin-topbar__heading span,
.admin-page .admin-kicker {
    font-size: 12px;
    line-height: 16px;
}

.admin-page .admin-page-heading p {
    max-width: 72ch;
    color: #5f6c82;
    font-size: 16px;
    line-height: 24px;
}

.admin-page .admin-stat-card__label,
.admin-page .admin-stat-card small {
    color: #5f6c82;
    font-size: 12px;
    line-height: 17px;
}

.admin-page .admin-panel__header p,
.admin-page .admin-content .muted {
    color: #5f6c82;
    font-size: 13px;
    line-height: 20px;
}

.admin-page .admin-data-table th {
    color: #5f6c82;
    font-size: 12px;
    line-height: 16px;
}

.admin-page .admin-data-table td {
    color: #3f4d63;
    font-size: 13px;
    line-height: 20px;
}

.admin-page :is(.admin-table-primary, .admin-project-name) {
    font-size: 14px;
    line-height: 20px;
}

.admin-page :is(.admin-table-subline, .admin-table-empty, .admin-table-secondary) {
    color: #667085;
    font-size: 12px;
    line-height: 18px;
}

.admin-page .admin-filter-grid .admin-field span,
.admin-page .admin-review-form .admin-field span,
.admin-page .admin-document-review-form .admin-field span,
.admin-page .admin-document-review-form__label {
    font-size: 12px;
    line-height: 18px;
}

.admin-page .admin-filter-grid .admin-field__hint,
.admin-page .admin-field small {
    color: #667085;
    font-size: 12px;
    line-height: 18px;
}

.admin-page .admin-table-action {
    font-size: 12px;
    line-height: 18px;
}

.admin-page .admin-status-badge {
    font-size: 12px;
    line-height: 16px;
}

.admin-page .admin-mini-list :is(dt, dd) {
    font-size: 12px;
    line-height: 18px;
}

/* Public pages */
.public-page :is(.public-nav a, .public-login-link, .public-header__register) {
    font-size: 14px;
    line-height: 20px;
}

.public-page .public-kicker {
    font-size: 12px;
    line-height: 16px;
}

.public-page .public-button {
    font-size: 14px;
    line-height: 20px;
}

.public-page .public-status-badge {
    font-size: 12px;
    line-height: 16px;
}

.public-page .public-project-card__date,
.public-page .public-project-card__meta {
    color: #667085;
    font-size: 12px;
    line-height: 18px;
}

.public-page .public-project-card h3 {
    font-size: 20px;
    line-height: 28px;
}

.public-page .public-project-card p,
.public-page .public-process-card p,
.public-page .public-faq p {
    color: #5f6c82;
    font-size: 14px;
    line-height: 22px;
}

.public-page .public-faq summary {
    font-size: 15px;
    line-height: 22px;
}

.public-page .public-filter-bar label {
    color: #475467;
    font-size: 12px;
    line-height: 18px;
}

.public-page .public-filter-bar select {
    min-height: 44px;
    font-size: 14px;
    line-height: 20px;
}

.public-page .public-filter-reset {
    color: #667085;
    font-size: 12px;
    line-height: 18px;
}

.public-page .public-objectives li,
.public-page .public-document-list {
    color: #475467;
    font-size: 14px;
    line-height: 21px;
}

.public-page .public-course-grid__number,
.public-page .public-info-card dt {
    color: #667085;
    font-size: 12px;
    line-height: 18px;
}

.public-page .public-course-grid :is(p, article > span:last-child),
.public-page .public-help-card p {
    color: #5f6c82;
    font-size: 14px;
    line-height: 21px;
}

.public-page .public-info-card dd {
    font-size: 14px;
    line-height: 20px;
}

.public-page .public-footer :is(p, span, a),
.public-page .public-footer__links strong {
    font-size: 13px;
    line-height: 20px;
}

.public-page .public-copyright,
.public-page .cookie-consent-category__badge {
    font-size: 12px;
    line-height: 18px;
}

/* Participant and teacher portals */
.portal-page .portal-brand__text small,
.portal-page :is(.portal-profile-photo-field small, .portal-muted) {
    color: #667085;
    font-size: 12px;
    line-height: 18px;
}

.portal-page .portal-sidebar__label {
    color: #7f8da3;
    font-size: 12px;
    line-height: 16px;
}

.portal-page .portal-menu a {
    font-size: 14px;
    line-height: 20px;
}

.portal-page .portal-page-heading p {
    max-width: 72ch;
    color: #5f6c82;
    font-size: 15px;
    line-height: 24px;
}

.portal-page :is(.portal-kicker, .portal-role-badge) {
    font-size: 12px;
    line-height: 16px;
}

.portal-page .portal-stat-card :is(span, small),
.portal-page :is(.portal-application-item span, .portal-session-list article > div span, .portal-session-list time) {
    color: #5f6c82;
    font-size: 12px;
    line-height: 18px;
}

.portal-page :is(.portal-panel__heading a, .portal-action-card a, .portal-row-action, .portal-mini-project-grid a) {
    font-size: 13px;
    line-height: 20px;
}

.portal-page :is(.portal-application-item strong, .portal-session-list article > div strong) {
    font-size: 14px;
    line-height: 20px;
}

.portal-page .portal-enrollment-table__head {
    color: #5f6c82;
    font-size: 12px;
    line-height: 16px;
}

.portal-page .portal-status-badge {
    font-size: 12px;
    line-height: 16px;
}

.portal-page :is(.portal-mini-project-grid p, .portal-file-picker__name, .portal-version, .portal-filter-chip, .portal-pagination-nav__summary) {
    color: #667085;
    font-size: 12px;
    line-height: 18px;
}

.portal-page .portal-button {
    font-size: 13px;
    line-height: 20px;
}

.portal-page .portal-data-grid :is(span, dt) {
    color: #667085;
    font-size: 12px;
    line-height: 16px;
}

.portal-page .portal-data-grid :is(strong, dd) {
    font-size: 14px;
    line-height: 20px;
}

.portal-page .portal-document-list strong {
    font-size: 13px;
    line-height: 18px;
}

.portal-page .portal-document-list article > div span,
.portal-page :is(.portal-document-request, .portal-document-preview-link, .portal-file-dropzone small, .portal-history-card__placeholder p) {
    color: #667085;
    font-size: 12px;
    line-height: 18px;
}

.portal-page .portal-document-item__actions :is(.portal-status-badge, .portal-button) {
    font-size: 12px;
    line-height: 16px;
}

/* Authentication */
.auth-page :is(.auth-card__role-summary, .auth-interface-path, .auth-context) {
    font-size: 13px;
    line-height: 20px;
}

.auth-page .auth-context-panel__features li {
    font-size: 15px;
    line-height: 24px;
}

.auth-page :is(.auth-context-panel__description, .auth-card__header p) {
    line-height: 24px;
}

.auth-page .auth-field input {
    font-size: 16px;
    line-height: 24px;
}

.auth-page :is(.auth-field__hint, .auth-field__error) {
    font-size: 12px;
    line-height: 18px;
}

@media (max-width: 600px) {
    .admin-page .admin-page-heading p,
    .public-page :is(.public-hero p, .public-page-intro p, .public-project-hero p),
    .portal-page .portal-page-heading p {
        font-size: 15px;
        line-height: 23px;
    }
}

@media (min-width: 601px) {
    .public-page .public-section--soft {
        width: 100%;
        margin-left: 0;
        border-radius: 20px;
    }
}

/*
 * Professional readable type scale
 * Body copy follows the UX 16/24 scale, supporting copy 14/20,
 * and 12/16 is reserved for short metadata.
 */
body:is(.admin-page, .portal-page, .public-page, .auth-page) {
    font-size: 16px;
    line-height: 24px;
}

:is(.admin-page, .portal-page, .public-page, .auth-page) small {
    font-size: 13px;
    line-height: 19px;
}

/* Admin content */
.admin-page .admin-menu__link,
.admin-page :is(.admin-button, .admin-table-primary, .admin-project-name) {
    font-size: 14px;
    line-height: 20px;
}

.admin-page .admin-stat-card__label,
.admin-page .admin-stat-card small,
.admin-page :is(.admin-table-subline, .admin-table-empty, .admin-table-secondary),
.admin-page .admin-mini-list :is(dt, dd) {
    color: #536176;
    font-size: 13px;
    line-height: 19px;
}

.admin-page .admin-panel__header p,
.admin-page .admin-content .muted {
    color: #536176;
    font-size: 14px;
    line-height: 21px;
}

.admin-page .admin-data-table td {
    color: #3f4d63;
    font-size: 14px;
    line-height: 21px;
}

.admin-page .admin-filter-grid .admin-field span,
.admin-page .admin-review-form .admin-field span,
.admin-page .admin-document-review-form .admin-field span,
.admin-page .admin-document-review-form__label,
.admin-page label {
    font-size: 14px;
    line-height: 20px;
}

.admin-page .admin-filter-grid .admin-field__hint,
.admin-page .admin-field small,
.admin-page .admin-table-action {
    color: #5f6c82;
    font-size: 13px;
    line-height: 19px;
}

.admin-page :is(input, select, textarea) {
    font-size: 14px;
    line-height: 20px;
}

.admin-page :is(.admin-brand__text small, .admin-user-summary small, .admin-topbar-profile__summary small) {
    font-size: 12px;
    line-height: 16px;
}

/* Public content */
.public-page .public-project-card__date,
.public-page .public-project-card__meta,
.public-page .public-filter-reset,
.public-page .public-course-grid__number,
.public-page .public-info-card dt {
    color: #5f6c82;
    font-size: 13px;
    line-height: 19px;
}

.public-page .public-filter-bar label {
    color: #475467;
    font-size: 14px;
    line-height: 20px;
}

/* Participant and teacher portals */
.portal-page .portal-brand__text small {
    font-size: 12px;
    line-height: 18px;
}

.portal-page :is(.portal-profile-photo-field small, .portal-muted) {
    color: #5f6c82;
    font-size: 14px;
    line-height: 20px;
}

.portal-page .portal-muted small {
    color: inherit;
    font-size: inherit;
    line-height: inherit;
}

.portal-page .portal-stat-card :is(span, small),
.portal-page :is(.portal-application-item span, .portal-session-list article > div span, .portal-session-list time),
.portal-page :is(.portal-mini-project-grid p, .portal-file-picker__name, .portal-version, .portal-filter-chip, .portal-pagination-nav__summary),
.portal-page .portal-data-grid :is(span, dt),
.portal-page .portal-document-list article > div span,
.portal-page :is(.portal-document-request, .portal-document-preview-link, .portal-file-dropzone small, .portal-history-card__placeholder p) {
    color: #536176;
    font-size: 13px;
    line-height: 19px;
}

.portal-page :is(.portal-panel__heading a, .portal-action-card a, .portal-row-action, .portal-mini-project-grid a),
.portal-page .portal-button,
.portal-page .portal-document-list strong {
    font-size: 14px;
    line-height: 20px;
}

.portal-page .portal-demo-alert,
.portal-page .portal-form label,
.portal-page .portal-check,
.portal-page .portal-input {
    font-size: 14px;
    line-height: 20px;
}

.portal-page .portal-field-error {
    font-size: 13px;
    line-height: 19px;
}

.portal-page .portal-panel__heading h2 {
    line-height: 28px;
}

/* Authentication */
.auth-page :is(.auth-field__hint, .auth-field__error) {
    font-size: 13px;
    line-height: 19px;
}

@media (max-width: 600px) {
    :is(.admin-page, .portal-page, .public-page, .auth-page) :is(input, select, textarea) {
        font-size: 16px;
        line-height: 24px;
    }
}

.portal-page .portal-profile-photo-field {
    min-width: 0;
}

.portal-page .portal-profile-photo-field label {
    min-width: 0;
    flex: 1 1 auto;
}

.portal-page .portal-profile-photo-field input[type='file'] {
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 760px) {
    .portal-page .portal-menu a {
        font-size: 11px;
        line-height: 14px;
    }

    .portal-page .portal-notification {
        width: 44px;
        height: 44px;
    }

    .portal-page .portal-profile-menu__trigger {
        min-width: 44px;
        min-height: 44px;
    }

    .portal-page .portal-button {
        min-height: 48px;
    }

    .portal-page .portal-document-item__actions .portal-button,
    .portal-page .portal-document-replacement-form .portal-button {
        min-height: 44px;
    }

    .portal-page :is(input.portal-input, select.portal-input, textarea.portal-input) {
        min-height: 48px;
    }

    .portal-page .portal-mobile-brand {
        min-height: 44px;
    }
}

@media (max-width: 600px) {
    .admin-page .admin-button {
        min-height: 44px;
    }
}