:root {
  --font-heading: "Cormorant Garamond", Georgia, serif;
  --font-wordmark: Cinzel, "Cormorant Garamond", serif;
  --font-body: Manrope, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;
}

html, body, button, input, select, textarea {
  font-family: var(--font-body) !important;
}

h1, h2, h3, h4, h5, h6,
.panel > h2, .card-title h2, .content-title h2,
.admin-header h1, .content-admin > header h1, .inbox-shell > header h1,
.admin-panel h2, .public-hero h1,
.prose-card h2, .document-layout article h2, .message-identity h2 {
  font-family: var(--font-heading) !important;
  font-weight: 600;
}

.double-brand span {
  font-family: var(--font-wordmark) !important;
  font-weight: 600;
}

time, code, output,
input[type="number"], input[type="date"], input[type="datetime-local"],
.stats strong, .stats em, .supply b, .slippage-value,
.market-info b, .market-value, .market-change,
.reserve-metric strong, .reserve-metric b, .reserve-info b,
.redemption-summary strong, .redemption-summary b,
.ledger td, .ledger th, .registry td:first-child, .registry td:nth-child(2),
.registry-public time, .table-row > span, .share-badge,
.admin-kpis b, .axis-labels text, .treasury-point-labels text,
.current-label text, .fee-admin output, .progress-value,
.product-price, .order-number, address {
  font-family: var(--font-mono) !important;
  font-variant-numeric: tabular-nums;
}

:lang(ar) {
  --font-heading: Amiri, serif;
  --font-body: "IBM Plex Sans Arabic", Arial, sans-serif;
}

:lang(ar) h1, :lang(ar) h2, :lang(ar) h3, :lang(ar) h4,
:lang(ar) h5, :lang(ar) h6 {
  font-weight: 700;
  letter-spacing: 0;
}

:lang(zh) {
  --font-heading: "Noto Serif SC", serif;
  --font-body: "Noto Sans SC", sans-serif;
}
:lang(ja) {
  --font-heading: "Noto Serif JP", serif;
  --font-body: "Noto Sans JP", sans-serif;
}
:lang(ko) {
  --font-heading: "Noto Serif KR", serif;
  --font-body: "Noto Sans KR", sans-serif;
}
:lang(hi) {
  --font-heading: "Noto Serif Devanagari", serif;
  --font-body: "Noto Sans Devanagari", Arial, sans-serif;
}

:lang(zh) h1, :lang(zh) h2, :lang(zh) h3,
:lang(ja) h1, :lang(ja) h2, :lang(ja) h3,
:lang(ko) h1, :lang(ko) h2, :lang(ko) h3 {
  letter-spacing: .03em;
  overflow-wrap: anywhere;
}

button, a, label, p, span, strong, small, td, th, input, textarea, select {
  overflow-wrap: break-word;
}

/* Keep the core token facts readable against the dark homepage artwork. */
.supply p {
  color: #f0d98e;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: .045em;
}

.supply b {
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0;
  text-shadow: 0 1px 12px rgba(0, 0, 0, .9);
}

@media (max-width: 560px) {
  .double-brand span { letter-spacing: .045em; }
  nav a, button, .public-header nav a { overflow-wrap: normal; }
  .supply p { font-size: 13px; }
  .supply b { font-size: 16px; }
}

/* ---------------------------------------------------------------------------
   Small print on the homepage
   ---------------------------------------------------------------------------
   The older stylesheets declare `font: 12px Arial` — the shorthand, which
   resets font-family along with the size. That silently overrode the per
   language font stacks above, so Arabic rendered in Arial's plain fallback
   glyphs rather than the Arabic face actually loaded for it, at a size chosen
   for Latin. Re-assert the family wherever that shorthand is used.

   Deliberately excluded: .stats em and the .ledger cells, which are in the
   tabular-figure list above and must stay monospaced.

   Everything here is scoped to homepage classes. This stylesheet is also
   loaded by the admin layout, so bare element selectors would reach screens
   this change was never looked at against. */
.footcols p, .footcols a, .footcols h3,
.legal, .footbrand p,
.list p, .detail p, .sponsors p {
  font-family: var(--font-body) !important;
}

/* 11-12px is below comfortable reading at arm's length even in Latin. */
.footbrand p { font-size: 13px; line-height: 1.5; }
.footcols h3 { font-size: 15px; letter-spacing: .04em; }
.footcols p, .footcols a { font-size: 14px; line-height: 1.6; }
.legal { font-size: 12.5px; line-height: 1.6; gap: 14px; }
.sponsors p { font-size: 13px; line-height: 1.5; }
.stats label { font-size: 13px; }
.list p { font-size: 14px; }
.detail p { font-size: 14px; }
.reserve aside p, .reserve aside small { font-size: 12.5px; line-height: 1.55; }
.chart h2 small { font-size: 12px; }

/* ---------------------------------------------------------------------------
   Scripts that need more room than Latin
   ---------------------------------------------------------------------------
   Arabic, Devanagari and CJK all sit optically smaller than Latin at the same
   pixel size, and Arabic additionally needs leading for its diacritics and
   descenders. Sizes below are the Latin values scaled up rather than new
   choices, so the footer keeps its proportions in every language. */
:lang(ar) .footbrand p { line-height: 1.8; }
:lang(ar) .footcols h3 { letter-spacing: 0; }
:lang(ar) .footcols p, :lang(ar) .footcols a { line-height: 1.9; }
:lang(ar) .legal { line-height: 1.85; }
:lang(ar) .sponsors p { line-height: 1.7; }
:lang(ar) .list p, :lang(ar) .detail p { line-height: 1.8; }
:lang(ar) .reserve aside p, :lang(ar) .reserve aside small { line-height: 1.75; }

:lang(hi) .footcols p, :lang(hi) .footcols a { line-height: 1.85; }
:lang(hi) .legal { line-height: 1.8; }
:lang(hi) .footbrand p { line-height: 1.75; }

:lang(zh) .footcols p, :lang(zh) .footcols a,
:lang(ja) .footcols p, :lang(ja) .footcols a,
:lang(ko) .footcols p, :lang(ko) .footcols a { line-height: 1.8; }
:lang(zh) .legal, :lang(ja) .legal, :lang(ko) .legal { line-height: 1.75; }

/* Amiri is a Naskh face built for running text at size; below roughly 20px its
   strokes thin out and it becomes the squinting problem rather than the fix.
   Small headings take the sans Arabic face, which holds up at UI sizes. Large
   display headings keep Amiri. */
:lang(ar) .footcols h3,
:lang(ar) .sponsors h3,
:lang(ar) .card-title h2,
:lang(ar) .chart h2 small {
  font-family: "IBM Plex Sans Arabic", Arial, sans-serif !important;
}

@media (max-width: 560px) {
  /* The footer collapses to one column here, so it can afford the full size
     rather than the usual shrink. */
  .footcols p, .footcols a { font-size: 14.5px; }
  .legal { flex-direction: column; }
}

/* ---------------------------------------------------------------------------
   The same letter size in every language
   ---------------------------------------------------------------------------
   Each script has its own typeface, and typefaces do not agree on how big a
   letter is at a given size. Measured at 100px: an English heading capital
   (Cormorant Garamond) is 63 high, an Arabic alef in Amiri 74, a Chinese or
   Japanese character in Noto Serif 84 and a Korean one 86 — so the same
   heading was a third larger in Chinese than in English. Body text was closer
   but had been corrected by hand, element by element, in some places and not
   others.

   font-size-adjust scales a typeface's letters without changing any font-size
   in the stylesheets: the value is the height its small letters are drawn at,
   as a share of the font size. English is the reference and has no rule. The
   others are set so that:
     - Arabic and Hindi letters average the height of English ones (tall and
       small letters taken together, since Arabic's small letters are smaller
       than English's and its tall ones no taller);
     - a Chinese, Japanese or Korean character is as tall as an English
       capital.

   To make one language larger or smaller everywhere, change its number here.
   Body text (the page's own typeface, set once on the document): */
html:lang(ar) { font-size-adjust: .562; }               /* IBM Plex Sans Arabic x 1.08 */
html:lang(zh), html:lang(ja) { font-size-adjust: .495; } /* Noto Sans SC / JP    x 0.90 */
html:lang(ko) { font-size-adjust: .472; }               /* Noto Sans KR          x 0.87 */

/* Headings (the heading typeface; the list is the one that assigns it above). */
:lang(ar) :is(h1, h2, h3, h4, h5, h6, .panel > h2, .card-title h2, .content-title h2, .public-hero h1, .prose-card h2, .document-layout article h2, .message-identity h2) { font-size-adjust: .384; } /* Amiri x 0.89 */
:lang(zh) :is(h1, h2, h3, h4, h5, h6, .panel > h2, .card-title h2, .content-title h2, .public-hero h1, .prose-card h2, .document-layout article h2, .message-identity h2),
:lang(ja) :is(h1, h2, h3, h4, h5, h6, .panel > h2, .card-title h2, .content-title h2, .public-hero h1, .prose-card h2, .document-layout article h2, .message-identity h2) { font-size-adjust: .386; } /* Noto Serif SC / JP x 0.75 */
:lang(ko) :is(h1, h2, h3, h4, h5, h6, .panel > h2, .card-title h2, .content-title h2, .public-hero h1, .prose-card h2, .document-layout article h2, .message-identity h2) { font-size-adjust: .376; } /* Noto Serif KR x 0.73 */
:lang(hi) :is(h1, h2, h3, h4, h5, h6, .panel > h2, .card-title h2, .content-title h2, .public-hero h1, .prose-card h2, .document-layout article h2, .message-identity h2) { font-size-adjust: .504; } /* Noto Serif Devanagari x 0.81 */

/* Small Arabic headings are set in the sans face (see above), so they take its figure, not Amiri's. */
:lang(ar) .footcols h3, :lang(ar) .sponsors h3, :lang(ar) .card-title h2, :lang(ar) .chart h2 small { font-size-adjust: .562; }

/* Figures are set in the same monospaced face in every language and stay as they are. */
time, code, output, .stats strong, .stats em, .supply b, .slippage-value, .market-info b, .market-value, .market-change,
.reserve-metric strong, .reserve-info b, .ledger td, .ledger th, .registry td:first-child, .registry td:nth-child(2),
.registry-public time, .share-badge, address,
/* The chapter number beside a heading is a figure too, not part of its wording. */
:is(h1, h2, h3, h4, h5, h6) > i { font-size-adjust: none; }