/* Sélecteur de langue + CJK (pages HTML autonomes). */

html[data-i18n-pending] body {
  visibility: hidden;
}

.pearl-langs {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: none;
}

.pearl-langs.flottant {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 32;
  padding: 10px 12px;
  background: rgba(18, 20, 25, 0.55);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-radius: 0 0 0 10px;
}

.pearl-langs button {
  font-family: "IBM Plex Mono", "Noto Sans SC", monospace;
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-3);
  min-height: 44px;
  padding: 0 6px;
  background: none;
  border: none;
  cursor: pointer;
}

.pearl-langs button:nth-child(3) {
  letter-spacing: 0.08em;
  text-transform: none;
}

.pearl-langs button[data-actif] {
  color: var(--gold);
}

.pearl-langs button:hover {
  color: var(--text);
}

.pearl-langs button[data-actif]:hover {
  color: var(--gold);
}

html.lang-zh body {
  font-family: "Noto Sans SC", "Inter", sans-serif;
}

html.lang-zh .q,
html.lang-zh .r-title,
html.lang-zh .serif,
html.lang-zh h1.q,
html.lang-zh .doc-title,
html.lang-zh .done-badge {
  font-family: "Noto Serif SC", "Marcellus", serif;
}

html.lang-zh .brandbar span,
html.lang-zh .ldr-word,
html.lang-zh .doc-brand span {
  font-family: "Marcellus", serif;
}