/* Reading text and navigation use separate sizes so compact controls still fit. */
:root {
  --kids-body-size: 1.125rem;
  --kids-detail-size: 1rem;
  --kids-nav-size: .9375rem;
}

@media (max-width: 767px) {
  :root {
    --kids-body-size: 1.0625rem;
    --kids-detail-size: .9375rem;
  }
}

main#main p:not(:where(.hero-catchcopy, .hero-services, .eyebrow, .date,
    .small, .note, .topic-back, .roster-week-note, .roster-update-note,
    .illness-card-alias, .ai-help-limit, .notice *, .action-row *, .floor-links *,
    .photo-loop-section *, .photo-loop-note, .sns-banners *, .news-latest *)),
main#main :is(.article, .illness-page, .draft-section) :is(dd, ul:not([class]) > li, ol:not([class]) > li) {
  font-size: var(--kids-body-size) !important;
  font-weight: 400;
  line-height: 1.9;
  overflow-wrap: anywhere;
}

main#main :is(.article, .draft-section, .illness-detail, .illness-page-intro) p:not(:where(.eyebrow, .topic-back)),
main#main :is(.article, .draft-section, .illness-detail) dd {
  max-inline-size: 42em;
}

main#main :is(.article, .draft-section, .illness-page) :is(h2, h3) {
  line-height: 1.5;
  text-wrap: pretty;
}

main#main :is(.note, .small.muted, .roster-week-note, .roster-update-note, .ai-help-limit) {
  font-size: var(--kids-detail-size) !important;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

header.header :is(.main-nav, .full-nav) > a {
  font-size: var(--kids-nav-size);
  line-height: 1.5;
  font-weight: 500;
}

header.header .full-nav > a {
  overflow-wrap: anywhere;
}

footer.footer-compact :is(.footer-address, .footer-hours, .footer-nav a, .footer-related a, .footer-social a) {
  font-size: var(--kids-nav-size);
  line-height: 1.6;
  overflow-wrap: anywhere;
}

footer.footer-compact .footer-bottom,
footer.footer-compact .footer-bottom .site-credit-link {
  font-size: .8125rem;
  line-height: 1.6;
}

footer.footer-compact .footer-bottom > div {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* The mobile rail uses small labels because all four actions share one row. */
.mobile-bottom-bar > :is(a, button) > span {
  font-size: .6875rem;
  line-height: 1.25;
}
