/* Shared readability baseline.
   Most product screens were designed around 8-13px utility type. Keep the
   compact visual hierarchy, but give real interface copy a legible floor. */
:root {
  --readable-body-size: clamp(.875rem, calc(.8125rem + .18vw), 1rem);
  --readable-control-size: .8125rem;
  --readable-label-size: .8125rem;
  --readable-small-size: .75rem;
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-size: var(--readable-body-size) !important;
  line-height: 1.5;
}

/* Controls and supporting copy are where the old 8-11px sizes caused the
   most strain. Important is intentional: many feature styles are highly
   specific and this accessibility floor must win consistently. */
body :where(button, input, select, textarea):not(:where(
  .mini-site *,
  .mini-shell *,
  .template-preview *,
  .mh-campaign-hero *,
  .mh-story-orbit *,
  .listing-preview *,
  .ad-preview *
)) {
  font-size: var(--readable-control-size) !important;
}

body :where(label):not(:where(
  .mini-site *,
  .mini-shell *,
  .template-preview *,
  .mh-campaign-hero *,
  .mh-story-orbit *,
  .listing-preview *,
  .ad-preview *
)) {
  font-size: var(--readable-label-size) !important;
}

body :where(small):not(:where(
  .mini-site *,
  .mini-shell *,
  .template-preview *,
  .mh-campaign-hero *,
  .mh-story-orbit *,
  .listing-preview *,
  .ad-preview *
)) {
  font-size: var(--readable-small-size) !important;
  line-height: 1.45;
}

body :where(p, li, dd, dt, td, th):not(:where(
  .mini-site *,
  .mini-shell *,
  .template-preview *,
  .mh-campaign-hero *,
  .mh-story-orbit *,
  .listing-preview *,
  .ad-preview *
)) {
  line-height: 1.55;
}

/* Repeated utility labels that are commonly rendered with spans rather than
   semantic small/label elements. */
body :where(
  .eyebrow,
  .kicker,
  .section-label,
  .badge,
  .status-pill,
  .stage-pill,
  .temp,
  .account-type,
  .admin-account-kind
):not(:where(
  .mini-site *,
  .mini-shell *,
  .template-preview *,
  .mh-campaign-hero *,
  .mh-story-orbit *,
  .listing-preview *,
  .ad-preview *
)) {
  font-size: var(--readable-small-size) !important;
  line-height: 1.35;
}

/* Laptop screens benefit from a stable 15px body baseline instead of type
   shrinking along with the available layout width. */
@media (min-width: 621px) and (max-width: 1440px) {
  :root {
    --readable-body-size: .9375rem;
  }
}

/* Phones are usually viewed farther away and in less controlled lighting. */
@media (max-width: 620px) {
  :root {
    --readable-body-size: 1rem;
    --readable-control-size: .9375rem;
    --readable-label-size: .875rem;
    --readable-small-size: .8125rem;
  }

  body :where(p, li, dd, dt):not(:where(
    .mini-site *,
    .mini-shell *,
    .template-preview *,
    .mh-campaign-hero *,
    .mh-story-orbit *,
    .listing-preview *,
    .ad-preview *
  )) {
    line-height: 1.6;
  }
}
