:root {
  --font-arabic: "Noto Naskh Arabic", "Segoe UI", Tahoma, serif;
  --font-devanagari: "Noto Serif Devanagari", "Nirmala UI", Mangal, serif;
  --font-bengali: "Noto Serif Bengali", "Nirmala UI", Vrinda, serif;
  --font-sinhala: "Noto Serif Sinhala", "Nirmala UI", Iskoola Pota, serif;
  --font-tamil: "Noto Serif Tamil", "Nirmala UI", Latha, serif;
  --font-gurmukhi: "Noto Serif Gurmukhi", "Nirmala UI", Raavi, serif;
  --font-odia: "Noto Serif Oriya", "Noto Serif Odia", "Nirmala UI", Kalinga, serif;
  --font-gujarati: "Noto Serif Gujarati", "Nirmala UI", Shruti, serif;
  --font-telugu: "Noto Serif Telugu", "Nirmala UI", Gautami, serif;
  --font-kannada: "Noto Serif Kannada", "Nirmala UI", Tunga, serif;
  --font-malayalam: "Noto Serif Malayalam", "Nirmala UI", Kartika, serif;
  --font-thaana: "Noto Sans Thaana", "MV Boli", sans-serif;
  --font-tibetan: "Noto Serif Tibetan", "Microsoft Himalaya", serif;
  --font-myanmar: "Noto Serif Myanmar", "Myanmar Text", serif;
}

/* Keep the publication chrome predictable when the article itself is RTL.
   Urdu has a translated navigation and gets its intentional RTL header below. */
.site-header,
.site-footer { direction: ltr; }
html[lang="ur"] .site-header,
html[lang="ur"] .site-footer { direction: rtl; }

.language-nav {
  display:flex;
  align-items:center;
  gap:.55rem;
  position:relative;
}
.language-direct { white-space:nowrap; }
.language-menu { position:relative; }
.language-menu > summary {
  cursor:pointer;
  list-style:none;
  white-space:nowrap;
  font-size:.78rem;
}
.language-menu > summary::-webkit-details-marker { display:none; }
.language-menu > summary::after { content:" ▾"; font-size:.72em; }
.language-menu[open] > summary::after { content:" ▴"; }
.language-menu-panel {
  position:absolute;
  z-index:90;
  top:calc(100% + .7rem);
  inset-inline-end:0;
  width:min(520px, calc(100vw - 2rem));
  max-height:min(70vh, 620px);
  overflow:auto;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0;
  padding:.65rem;
  border:1px solid var(--line);
  background:var(--paper);
  box-shadow:0 14px 40px color-mix(in srgb,var(--ink) 16%,transparent);
}
.language-menu-item {
  display:grid;
  grid-template-columns:1fr auto;
  gap:.2rem .7rem;
  align-items:baseline;
  padding:.6rem .65rem;
  text-decoration:none;
  border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent);
}
.language-menu-item span { font-size:.95rem; }
.language-menu-item small { color:var(--muted); font-size:.67rem; direction:ltr; text-align:end; }
.language-menu-item[aria-current="page"] { background:var(--soft); }

.language-directory {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0 1.25rem;
  padding-block:2rem 5rem;
}
.language-directory-item {
  display:grid;
  grid-template-columns:1fr auto;
  gap:.2rem 1rem;
  border-top:1px solid var(--line);
  padding:1rem 0 1.2rem;
  text-decoration:none;
}
.language-directory-item strong { font-size:1.15rem; }
.language-directory-item > span { color:var(--muted); font-size:.78rem; direction:ltr; text-align:end; }
.language-directory-item small { grid-column:1/-1; color:var(--muted); line-height:1.45; }

/* Reading typography by writing system. These are font stacks only; the theme does
   not ship font binaries. Self-host appropriately licensed fonts in production if needed. */
html:is(:lang(ps),:lang(fa),:lang(fa-AF),:lang(pa-Arab),:lang(ks-Arab),:lang(sd-Arab),:lang(bal),:lang(brh)) .article-content,
.post-card:is(:lang(ps),:lang(fa),:lang(fa-AF),:lang(pa-Arab),:lang(ks-Arab),:lang(sd-Arab),:lang(bal),:lang(brh)),
.language-archive:is(:lang(ps),:lang(fa),:lang(fa-AF),:lang(pa-Arab),:lang(ks-Arab),:lang(sd-Arab),:lang(bal),:lang(brh)) {
  font-family:var(--font-arabic);
}
html:is(:lang(hi),:lang(ne),:lang(ks-Deva),:lang(mr)) .article-content,
.post-card:is(:lang(hi),:lang(ne),:lang(ks-Deva),:lang(mr)),
.language-archive:is(:lang(hi),:lang(ne),:lang(ks-Deva),:lang(mr)) {
  font-family:var(--font-devanagari);
}
html:is(:lang(bn),:lang(as)) .article-content,
.post-card:is(:lang(bn),:lang(as)),
.language-archive:is(:lang(bn),:lang(as)) { font-family:var(--font-bengali); }
html:lang(si) .article-content,.post-card:lang(si),.language-archive:lang(si) { font-family:var(--font-sinhala); }
html:lang(ta) .article-content,.post-card:lang(ta),.language-archive:lang(ta) { font-family:var(--font-tamil); }
html:lang(pa-Guru) .article-content,.post-card:lang(pa-Guru),.language-archive:lang(pa-Guru) { font-family:var(--font-gurmukhi); }
html:lang(or) .article-content,.post-card:lang(or),.language-archive:lang(or) { font-family:var(--font-odia); }
html:lang(gu) .article-content,.post-card:lang(gu),.language-archive:lang(gu) { font-family:var(--font-gujarati); }
html:lang(te) .article-content,.post-card:lang(te),.language-archive:lang(te) { font-family:var(--font-telugu); }
html:lang(kn) .article-content,.post-card:lang(kn),.language-archive:lang(kn) { font-family:var(--font-kannada); }
html:lang(ml) .article-content,.post-card:lang(ml),.language-archive:lang(ml) { font-family:var(--font-malayalam); }
html:lang(dv) .article-content,.post-card:lang(dv),.language-archive:lang(dv) { font-family:var(--font-thaana); }
html:is(:lang(dz),:lang(bo)) .article-content,.post-card:is(:lang(dz),:lang(bo)),.language-archive:is(:lang(dz),:lang(bo)) { font-family:var(--font-tibetan); }
html:lang(my) .article-content,.post-card:lang(my),.language-archive:lang(my) { font-family:var(--font-myanmar); }

html:is(:lang(ps),:lang(fa),:lang(fa-AF),:lang(pa-Arab),:lang(ks-Arab),:lang(sd-Arab),:lang(bal),:lang(brh),:lang(dv)) .article-content {
  line-height:1.82;
  text-align:start;
}
html:is(:lang(bn),:lang(as),:lang(hi),:lang(ne),:lang(ks-Deva),:lang(mr),:lang(si),:lang(ta),:lang(pa-Guru),:lang(or),:lang(gu),:lang(te),:lang(kn),:lang(ml),:lang(dz),:lang(bo),:lang(my)) .article-content {
  line-height:1.72;
}
html:is(:lang(ps),:lang(fa),:lang(fa-AF),:lang(pa-Arab),:lang(ks-Arab),:lang(sd-Arab),:lang(bal),:lang(brh),:lang(bn),:lang(as),:lang(hi),:lang(ne),:lang(ks-Deva),:lang(mr),:lang(si),:lang(ta),:lang(pa-Guru),:lang(or),:lang(gu),:lang(te),:lang(kn),:lang(ml),:lang(dv),:lang(dz),:lang(bo),:lang(my)) .article-header h1,
html:is(:lang(ps),:lang(fa),:lang(fa-AF),:lang(pa-Arab),:lang(ks-Arab),:lang(sd-Arab),:lang(bal),:lang(brh),:lang(bn),:lang(as),:lang(hi),:lang(ne),:lang(ks-Deva),:lang(mr),:lang(si),:lang(ta),:lang(pa-Guru),:lang(or),:lang(gu),:lang(te),:lang(kn),:lang(ml),:lang(dv),:lang(dz),:lang(bo),:lang(my)) .gh-content h2,
html:is(:lang(ps),:lang(fa),:lang(fa-AF),:lang(pa-Arab),:lang(ks-Arab),:lang(sd-Arab),:lang(bal),:lang(brh),:lang(bn),:lang(as),:lang(hi),:lang(ne),:lang(ks-Deva),:lang(mr),:lang(si),:lang(ta),:lang(pa-Guru),:lang(or),:lang(gu),:lang(te),:lang(kn),:lang(ml),:lang(dv),:lang(dz),:lang(bo),:lang(my)) .gh-content h3 {
  letter-spacing:0;
  line-height:1.3;
}

/* Opt-in automatic translation. */
.automatic-translation {
  width:min(calc(100% - 2rem), var(--reading));
  margin:.7rem auto 0;
  padding:.58rem 0;
  border-bottom:1px solid var(--line);
  font-family:var(--sans);
  direction:ltr;
  text-align:start;
}
.automatic-translation-main { display:flex; flex-wrap:wrap; align-items:center; gap:.48rem; }
.automatic-translation select { max-width:300px; min-height:40px; background:var(--paper); border:1px solid var(--line); padding:.4rem .55rem; }
.automatic-translation-status { margin:.55rem 0 0; color:var(--muted); font-size:.76rem; }
.automatic-translation[data-machine-translated="true"] .automatic-translation-status { color:var(--ink); font-weight:650; }
.browser-translation-help { margin-top:.55rem; font-size:.75rem; color:var(--muted); }
.browser-translation-help summary { cursor:pointer; }
.browser-translation-help p { margin:.45rem 0; }

@media(max-width:900px) {
  .language-menu-panel { position:fixed; left:1rem; right:1rem; top:72px; width:auto; grid-template-columns:1fr 1fr; }
  .language-directory { grid-template-columns:1fr 1fr; }
}
@media(max-width:640px) {
  .language-direct { display:none; }
  .language-menu-panel { top:64px; grid-template-columns:1fr; max-height:75vh; }
  .language-directory { grid-template-columns:1fr; }
  .automatic-translation { width:min(calc(100% - 1.25rem), var(--narrow)); }
  .automatic-translation-main { display:grid; grid-template-columns:1fr; }
  .automatic-translation select,.automatic-translation .button { width:100%; max-width:none; }
}

/* Standing pages follow the same restrained hierarchy in every writing system. */
.language-page .article-header h1 {
  letter-spacing:0;
  line-height:1.2;
  font-size:clamp(2.55rem,4.6vw,4.15rem);
}
.language-page .article-content {
  font-size:clamp(1.03rem,1.15vw,1.16rem);
}
html:lang(ur) .language-page .article-header h1 {
  font-size:clamp(2.45rem,4.35vw,3.9rem);
  line-height:1.45;
}
html:lang(ur) .language-page .article-content {
  font-size:clamp(1.14rem,1.35vw,1.28rem);
  line-height:2.02;
}

/* Language archive display sizes by script. The generic archive layout lives in screen.css. */
.language-archive[dir="rtl"] {
  text-align: start;
}

.language-archive:is(:lang(ur),:lang(ps),:lang(fa),:lang(fa-AF),:lang(pa-Arab),:lang(ks-Arab),:lang(sd-Arab),:lang(bal),:lang(brh),:lang(dv)) h1 {
  letter-spacing: 0;
  line-height: 1.28;
  font-size: clamp(2.85rem, 4.6vw, 4.55rem);
}

.language-archive:is(:lang(hi),:lang(ne),:lang(ks-Deva),:lang(mr),:lang(bn),:lang(as),:lang(si),:lang(ta),:lang(pa-Guru),:lang(or),:lang(gu),:lang(te),:lang(kn),:lang(ml),:lang(my)) h1 {
  letter-spacing: 0;
  line-height: 1.16;
  font-size: clamp(2.9rem, 4.7vw, 4.65rem);
}

.language-archive:is(:lang(dz),:lang(bo)) h1 {
  letter-spacing: 0;
  line-height: 1.35;
  font-size: clamp(2.7rem, 4.3vw, 4.25rem);
}

.language-archive:is(:lang(ur),:lang(ps),:lang(fa),:lang(fa-AF),:lang(pa-Arab),:lang(ks-Arab),:lang(sd-Arab),:lang(bal),:lang(brh),:lang(dv)) p {
  line-height: 1.8;
}

.language-archive:is(:lang(hi),:lang(ne),:lang(ks-Deva),:lang(mr),:lang(bn),:lang(as),:lang(si),:lang(ta),:lang(pa-Guru),:lang(or),:lang(gu),:lang(te),:lang(kn),:lang(ml),:lang(my),:lang(dz),:lang(bo)) p {
  line-height: 1.65;
}

html[dir="rtl"] .footer-secondary .nav,
html[dir="rtl"] .footer-link-strip {
  direction: rtl;
}

html[lang="ur"] .footer-main,
html[lang="ur"] .footer-link-strip,
html[lang="ur"] .footer-bottom {
  direction: rtl;
  text-align: start;
}

@media(max-width:640px) {
  .language-archive:is(:lang(ur),:lang(ps),:lang(fa),:lang(fa-AF),:lang(pa-Arab),:lang(ks-Arab),:lang(sd-Arab),:lang(bal),:lang(brh),:lang(dv)) h1,
  .language-archive:is(:lang(hi),:lang(ne),:lang(ks-Deva),:lang(mr),:lang(bn),:lang(as),:lang(si),:lang(ta),:lang(pa-Guru),:lang(or),:lang(gu),:lang(te),:lang(kn),:lang(ml),:lang(my)) h1,
  .language-archive:is(:lang(dz),:lang(bo)) h1 {
    font-size: clamp(2.35rem, 11.5vw, 3.35rem);
  }
}


/* Responsive header integration. Keep the language control compact before the
   rest of the publication chrome needs to collapse. */
@media (max-width: 820px) {
  .language-direct { display:none; }
  .language-nav { gap:.35rem; }
}

@media (max-width: 640px) {
  .language-menu-panel {
    top:62px;
    left:.75rem;
    right:.75rem;
    width:auto;
    max-height:76vh;
  }
}

/* Mixed-direction text safety -------------------------------------------------
   RTL pages often contain English titles, excerpts, URLs and interface strings.
   Neutral punctuation such as full stops, colons and brackets follows the base
   paragraph direction under the Unicode Bidirectional Algorithm. A whole English
   sentence inside an RTL container can therefore show its final punctuation on
   the visually wrong side unless that sentence establishes its own direction.

   The theme uses explicit lang/dir attributes for known interface copy and
   dir="auto" + unicode-bidi: plaintext for user/editorial text whose language may
   vary. This changes text flow only; it does not reverse the page layout. */

[dir="ltr"],
[dir="rtl"] {
  unicode-bidi: isolate;
}

.bidi-auto,
[dir="auto"] {
  unicode-bidi: plaintext;
}

.bidi-ltr,
code,
pre,
kbd,
samp {
  direction: ltr;
  unicode-bidi: isolate;
}

/* Keep English explanatory copy visually aligned with an RTL archive while
   giving the sentence an LTR base direction so punctuation stays at its end. */
.language-archive[dir="rtl"] .archive-kicker[dir="ltr"],
.language-archive[dir="rtl"] .archive-description[dir="ltr"],
.language-archive[dir="rtl"] .archive-empty[dir="ltr"] {
  text-align: right;
  margin-inline-start: auto;
}

/* Known English/Urdu interface fragments are isolated from the surrounding
   paragraph direction. This is especially important in header/footer chrome. */
.i18n-en[dir="ltr"],
.i18n-ur[dir="rtl"],
.language-menu-item > small[dir="ltr"],
.language-directory-item > span[dir="ltr"],
.language-directory-item > small[dir="ltr"] {
  unicode-bidi: isolate;
}

/* URLs, email addresses and code should never inherit RTL ordering. */
.article-content a.bidi-ltr,
.original-source a,
.author-socials a[href^="http"],
.author-socials a[href^="mailto:"],
.author-socials a[href^="tel:"] {
  direction: ltr;
  unicode-bidi: isolate;
  display: inline-block;
  max-width: 100%;
  overflow-wrap: anywhere;
}

/* Ghost editor output can contain a paragraph in a different language from the
   surrounding article. JS adds dir="auto" to these block-level elements. */
[data-bidi-scope] :where(p, li, blockquote, figcaption, dd, dt, h1, h2, h3, h4, h5, h6)[dir="auto"],
.post-card :where(.post-card-title, .post-card-excerpt, .post-card-meta > span)[dir="auto"],
.author-card :where(h3, p)[dir="auto"] {
  text-align: start;
}

/* On RTL article/archive layouts an LTR paragraph may still be intentionally
   aligned with the right-hand reading column. Use this opt-in class where that
   visual treatment is preferred without changing its writing direction. */
.align-column-edge[dir="ltr"] {
  text-align: end;
}
