html:is([lang="x-binary"], [lang="binary"]) {
  --binary-display-size: clamp(1.5rem, 2.4vw, 2.4rem);
  --binary-heading-size: clamp(1rem, 1.05vw, 1.25rem);
  --binary-copy-size: clamp(.875rem, .72vw, 1rem);
  --binary-micro-size: clamp(.75rem, .6vw, .875rem);
  --binary-control-size: clamp(.8125rem, .66vw, .9375rem);
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] {
  font-size: var(--binary-copy-size);
  line-height: 1.4;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] :is(
  main h1,
  main h2,
  .threshold-copy h1,
  .scene-heading h2,
  .foundation-intro h2,
  .subhead h3,
  .krek-heading h2,
  .making-heading h2,
  .creator-copy h2,
  .routes-heading h2,
  .network-directory h3
) {
  font-size: var(--binary-display-size);
  line-height: 1.06;
  letter-spacing: .01em;
  overflow-wrap: anywhere;
  word-break: normal;
  text-wrap: balance;
  max-inline-size: min(100%, 48rem);
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] :is(
  h3,
  h4,
  blockquote,
  .solar-card h3,
  .krek-panels h3
) {
  font-size: var(--binary-heading-size);
  line-height: 1.15;
  overflow-wrap: anywhere;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] :is(
  p,
  li,
  dd,
  dt,
  figcaption,
  .solar-chronometer small,
  .solar-chronometer strong,
  .experience-category-trigger strong,
  .experience-category-trigger small,
  .krek-tabs button,
  .locale-route-link
) {
  font-size: var(--binary-copy-size);
  line-height: 1.4;
  max-inline-size: 100%;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] :is(
  .threshold-copy,
  .scene-heading,
  .foundation-intro,
  .subhead,
  .creator-copy,
  .universe-statement,
  .boundary-ledger,
  .solar-facts,
  .solar-note-stack,
  .routes-directory,
  .network-directory
) {
  min-inline-size: 0;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] :is(
  .threshold-copy > p,
  .scene-heading > p,
  .foundation-intro > p,
  .subhead > p,
  .creator-prose p,
  .foundation-chapters p,
  .art-card :is(span, strong),
  .music-card :is(span, strong),
  .solar-note-stack :is(h3, p),
  .identity-system figcaption
) {
  font-size: var(--binary-copy-size);
  line-height: 1.38;
  max-inline-size: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] :is(
  .threshold-copy h1,
  .scene-heading h2,
  .foundation-intro h2,
  .subhead h3
) {
  inline-size: auto;
  min-inline-size: 0;
  letter-spacing: 0;
  text-transform: none;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] :is(
  button,
  select,
  label,
  .control-choice,
  .control-action,
  .control-select
) {
  font-size: var(--binary-control-size);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] :is(
  .scope-ribbon article > span,
  .identity-system figcaption,
  .world-card strong,
  .doctrine-card strong,
  .route-card strong,
  .music-card strong,
  .solar-card strong,
  .solar-cycle-header strong,
  .krek-stage strong,
  .process-card strong,
  .network-directory strong
) {
  font-size: var(--binary-heading-size);
  line-height: 1.16;
  letter-spacing: .015em;
  overflow-wrap: anywhere;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] :is(
  .scope-ribbon article > p,
  .identity-system figcaption span,
  .identity-system figcaption b,
  .world-card p,
  .doctrine-card p,
  .route-card p,
  .music-card p,
  .solar-card :is(p, dt, dd, small),
  .solar-cycle-header :is(span, p),
  .krek-stage :is(p, small),
  .process-card :is(p, small),
  .network-directory :is(p, a, small),
  .scene-index,
  .scene-kicker
) {
  font-size: var(--binary-micro-size);
  line-height: 1.42;
  letter-spacing: .015em;
  overflow-wrap: anywhere;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"] :is(
  .site-header a,
  .site-header button,
  .nav-drawer a,
  .locale-state,
  .locale-list a,
  .privacy-reopen,
  .privacy-banner,
  .experience-controls button,
  .experience-dialog,
  .language-dialog
) {
  font-size: var(--binary-control-size);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"]
  .experience-controls button > span:last-child {
  min-inline-size: 0;
  max-inline-size: 10rem;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"]
  .experience-controls button :is(b, small, .persistent-audio-copy) {
  font-size: var(--binary-micro-size);
  line-height: 1.25;
  letter-spacing: .02em;
  overflow-wrap: anywhere;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"]
  .scope-ribbon article {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: .55rem;
  min-block-size: clamp(18rem, 31vw, 34rem);
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"]
  .scope-ribbon article > :is(span, p) {
  position: relative;
  inset: auto;
  max-block-size: none;
  overflow: visible;
}

html:is([lang="x-binary"], [lang="binary"]) body[data-locale="binary"]
  .scope-ribbon article > p {
  margin: 0;
}

@media (max-width: 48rem) {
  html:is([lang="x-binary"], [lang="binary"]) {
    --binary-display-size: clamp(1.35rem, 6.2vw, 2rem);
    --binary-heading-size: clamp(.9375rem, 4vw, 1.125rem);
    --binary-copy-size: clamp(.8125rem, 3.1vw, .9375rem);
    --binary-micro-size: clamp(.6875rem, 2.7vw, .8125rem);
    --binary-control-size: clamp(.75rem, 2.9vw, .875rem);
  }
}