/* Language menu: globe · current language · caret, list opens below. */
.lang-menu { position: relative; flex: none; width: max-content; margin-left: auto; z-index: 40; }
.lang-menu > summary {
  display: inline-flex; align-items: center; gap: .55rem;
  min-height: 44px; padding: 0 .5rem; cursor: pointer; list-style: none;
  color: var(--pine-deep); font: 400 1.05rem/1 var(--serif); white-space: nowrap;
  border-radius: 6px;
}
.lang-menu > summary::-webkit-details-marker { display: none; }
.lang-menu > summary:hover { background: rgba(37, 75, 56, .06); }
.lang-menu > summary:focus-visible { outline: 2px solid var(--pine); outline-offset: 2px; }
.lang-menu svg { flex: none; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
.lang-globe { width: 1.45rem; height: 1.45rem; stroke-width: 1.5; }
.lang-caret { width: 1.1rem; height: 1.1rem; stroke-width: 2; transition: transform .2s ease; }
.lang-menu[open] .lang-caret { transform: rotate(180deg); }
.lang-menu .visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.lang-menu > nav.lang-list.lang-list {
  position: absolute; right: 0; top: calc(100% + 6px);
  display: flex; flex-direction: column; gap: 0;
  min-width: 11rem; width: max-content; margin: 0; padding: .35rem;
  background: var(--paper-light); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 18px 40px rgba(24, 62, 45, .14);
}
.lang-menu > nav.lang-list.lang-list > a {
  display: flex; align-items: center; justify-content: flex-start;
  min-height: 44px; min-width: 0; width: 100%; margin: 0; padding: 0 .9rem; border: 0; border-radius: 6px; text-align: left; box-sizing: border-box;
  color: var(--pine-deep); text-decoration: none; font-size: 1rem; line-height: 1.2;
}
.lang-menu > nav.lang-list.lang-list > a:hover, .lang-menu > nav.lang-list.lang-list > a:focus-visible { background: #e7eddb; outline: none; }
.lang-menu > nav.lang-list.lang-list > a[aria-current="page"] { font-weight: 600; background: var(--citron); }
@media (prefers-reduced-motion: reduce) { .lang-caret { transition: none; } }

/* Header fit on small screens: the motion control shows only its dot. */
@media (max-width: 720px) {
  .lang-menu > summary { gap: .35rem; padding-inline: .3rem; font-size: .98rem; }
  :is(.site-header, .stream-navwrap) .lang-menu { margin-left: 0; }
  .site-header:has(.lang-menu) #motion-toggle { min-width: 44px; padding-inline: 0; gap: 0; }
  .site-header:has(.lang-menu) #motion-toggle [data-motion-label] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (max-width: 480px) {
  .site-header:has(.lang-menu) .nav-toggle { padding-inline: 6px; }
  .site-header:has(.lang-menu) .brand-name { font-size: 22px; }
  .lang-menu > summary { gap: .25rem; padding-inline: .2rem; font-size: .92rem; }
  .lang-menu .lang-globe { width: 1.2rem; height: 1.2rem; }
  .lang-menu .lang-caret { width: .9rem; height: .9rem; }
}
@media (max-width: 420px) {
  .site-header:has(.lang-menu) .brand-name { font-size: 20px; }
  .site-header:has(.lang-menu) .nav-toggle { padding-inline: 4px; }
  .lang-menu > summary { font-size: .86rem; gap: .2rem; padding-inline: 0; }
  .lang-menu .lang-globe { width: 1.05rem; height: 1.05rem; }
}
@media (max-width: 370px) {
  .lang-menu .lang-caret { display: none; }
  .site-header:has(.lang-menu) .brand { gap: 5px; }
  .site-header:has(.lang-menu) .brand-name { font-size: 19px; }
}