.language-select {
  position: relative;
  z-index: 1;
  flex: none;
  width: 8.6rem;
  height: 2.75rem;
  color: var(--fg);
}
.language-select[open] { z-index: 3; }
.language-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .55rem;
  width: 100%;
  height: 100%;
  padding: .55rem .85rem;
  border: 1px solid rgb(255 255 255 / .18);
  border-radius: var(--radius-btn, 999px);
  background: linear-gradient(135deg, rgb(255 255 255 / .08), rgb(255 255 255 / .02)), color-mix(in srgb, var(--card) 80%, transparent);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .07);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  color: inherit;
  font: 600 .85rem/1.3 var(--font-body);
  list-style: none;
  cursor: pointer;
  user-select: none;
  transition: border-color .2s, background .2s;
}
.language-trigger::marker { content: ""; }
.language-trigger::-webkit-details-marker { display: none; }
.language-trigger:hover,
.language-select[open] > .language-trigger { border-color: var(--accent); }
.language-trigger:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.language-current { flex: 1; white-space: nowrap; }
.language-globe { flex: none; color: var(--accent); }
.language-chevron { flex: none; transition: transform .2s; }
.language-select[open] .language-chevron { transform: rotate(180deg); }
.language-menu {
  position: absolute;
  z-index: 1;
  top: calc(100% + .5rem);
  right: 0;
  display: grid;
  width: max(100%, 10.5rem);
  max-width: calc(100vw - 32px);
  margin: 0;
  padding: .4rem;
  border: 1px solid rgb(255 214 190 / .2);
  border-radius: 1rem;
  background: linear-gradient(135deg, rgb(255 255 255 / .06), transparent), color-mix(in srgb, var(--card) 95%, transparent);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .07), 0 .8rem 2rem rgb(0 0 0 / .4);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  backdrop-filter: blur(18px) saturate(130%);
  list-style: none;
}
.language-select:not([open]) .language-menu { display: none; }
.language-menu li { margin: 0; padding: 0; }
.language-option {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-height: 2.75rem;
  padding: .6rem .75rem;
  border-radius: .65rem;
  color: var(--fg);
  font: 600 .9rem/1.3 var(--font-body);
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s;
}
.language-option[aria-checked="true"] { background: color-mix(in srgb, var(--primary) 14%, transparent); }
.language-option:hover,
.language-option:focus-visible { background: color-mix(in srgb, var(--primary) 24%, transparent); }
.language-option:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.language-check { flex: none; color: var(--accent); opacity: 0; }
.language-option[aria-checked="true"] .language-check { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
  .language-select[open] .language-menu { animation: language-menu-in .14s ease-out both; }
}
@keyframes language-menu-in {
  from { opacity: 0; transform: translateY(-.3rem); }
  to { opacity: 1; transform: none; }
}
@media (max-width: 47.99rem) {
  .language-select { width: 7.7rem; }
  .language-trigger { padding-inline: .7rem; gap: .45rem; font-size: .8rem; }
}
@media (max-width: 23.4rem) {
  header.site > .wrap { padding-inline: 16px; }
  header.site .bar { gap: .4rem; }
  header.site .brand { font-size: 1rem; }
  header.site .mark { width: 1.75rem; height: 1.75rem; }
  .language-select { width: 6rem; }
  .language-trigger { padding-inline: .65rem; }
  .language-globe { display: none; }
}
@media (min-width: 64rem) and (max-width: 79.99rem) {
  header.site nav.main ul { gap: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .language-trigger, .language-chevron, .language-option { transition: none; }
}