/* Shared typography standard. Keep this stylesheet last on every page. */
:root {
    --type-body: 18px;
    --type-copy: 17px;
    --type-secondary: 15px;
    --type-control: 16px;
    --type-nav: 14px;
}

html {
    font-size: var(--type-body);
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body,
button,
input,
select,
textarea {
    font-size: var(--type-body);
}

main p,
main li,
main blockquote,
.description,
.privacy-copy,
.report-command {
    font-size: var(--type-copy) !important;
    line-height: 1.7;
}

/* Plain text spans are used extensively by dashboard and summary cards. */
main span:not(.card-symbol):not(.notification-dot),
dialog span {
    font-size: 16px !important;
    line-height: 1.55;
}

main small,
main time,
main .muted,
main .eyebrow,
main .status,
main .badge,
main .event-badge,
main .event-status,
main .voter-list,
main .empty-state {
    font-size: var(--type-secondary) !important;
    line-height: 1.55;
}

main label,
main legend,
main summary,
main button,
main .button,
main .btn,
main .submit,
main input,
main select,
main textarea {
    font-size: var(--type-control) !important;
}

main button,
main .button,
main .btn,
main .submit,
main input,
main select,
main textarea {
    min-height: 48px;
}

/* Card titles and action text were as small as 8–13px in legacy styles. */
.quick b,
.checklist b,
.people h3,
.games h2,
.more b,
.community-links a b,
.member-group-card strong,
.initial-activities strong,
.proposal-item strong,
.budget-options b,
.initial-activities > b,
.initial-attendees > b,
.collab-head b,
.member-types-list b,
.member-types-total b,
.pending-member-list b,
.admin-member-profile b,
.admin-user-head b,
.password-user b,
.admin-menu b,
.friend-card b,
.gallery-grid b,
.details b {
    font-size: 17px !important;
    line-height: 1.45;
}

dialog p,
dialog li {
    font-size: var(--type-copy) !important;
    line-height: 1.7;
}

dialog small,
dialog time {
    font-size: var(--type-secondary) !important;
    line-height: 1.55;
}

dialog label,
dialog legend,
dialog button,
dialog input,
dialog select,
dialog textarea {
    font-size: var(--type-control) !important;
}

/* Preserve decorative symbols while normalizing their accompanying text. */
.admin-placeholder > span,
.admin-menu > a > span,
.community-links > a {
    font-size: 22px !important;
}

.quick em,
.checklist em,
.more em,
.community-links a em,
.vote-button,
.add-proposal > summary,
.photo-picker {
    font-size: var(--type-secondary) !important;
}

/* Reunion summary cards contain plain spans instead of paragraphs. */
.initial-plan span {
    font-size: 16px !important;
    line-height: 1.6 !important;
}

.initial-plan span b {
    font-size: 16px !important;
    line-height: 1.45;
}

.app-nav a,
.app-nav button,
nav .profile-nav,
nav button {
    font-size: var(--type-nav) !important;
    line-height: 1.25;
}

.app-header .app-brand b {
    font-size: 17px !important;
}

.app-header .app-brand small {
    font-size: 10px !important;
    line-height: 1.2;
}

.app-account a,
.app-account button,
.app-user > b {
    font-size: 14px !important;
}

@media (max-width: 700px) {
    :root {
        --type-body: 17px;
        --type-copy: 16px;
        --type-secondary: 15px;
        --type-control: 16px;
        --type-nav: 13px;
    }

    .app-header .app-brand b {
        font-size: 16px !important;
    }

    .app-header .app-brand small {
        font-size: 9px !important;
    }
}