/* Small flags only, no words. The language names stay in the links for screen readers. */
.academy-world .language-switch {
  display: flex;
  align-items: center;
  flex: none;
  gap: 2px;
}
.academy-world .language-switch a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  min-height: 44px;
  font-size: 0;
  color: var(--lime);
  opacity: .5;
  transition: opacity .2s ease;
}
.academy-world .language-switch > span { display: none; }
.academy-world .language-flag { display: block; flex: none; }
.academy-world .language-switch a[aria-current="page"],
.academy-world .language-switch a:hover { opacity: 1; }
.academy-world .language-switch a[aria-current="page"] .language-flag { box-shadow: 0 3px 0 -1px currentColor; }
.academy-world .language-switch a:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
@media (max-width: 1240px) {
  .academy-world .nav-login { margin-left: auto; }
}
@media (max-width: 480px) {
  /* The switch moves into the phone navigation, leaving the bar like the home page. */
  .academy-world .nav-links .language-switch {
    align-self: flex-start;
    margin-bottom: 12px;
  }
  /* The id outranks the accessibility layer's minimum text size, so the panel shows flags only, like the app. */
  html body.academy-world .site-header #main-nav .language-switch a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    border: 0;
    font-size: 0;
    color: #c8e84a;
  }
  .academy-world .nav-links .language-switch a::after { display: none; }
}