.language-control {
  position: relative;
  display: inline-flex;
  flex: 0 0 68px;
  width: 68px;
  height: 44px;
  align-self: center;
}
.language-selector {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  min-width: 0;
  height: 44px;
  min-height: 44px;
  margin: 0;
  padding: 0 7px;
  border: 1px solid #43536b;
  border-radius: 9px;
  color: #e7edf7;
  background: #141e2e;
  cursor: pointer;
  touch-action: manipulation;
}
.language-control img {
  display: block;
  flex: 0 0 24px;
  width: 24px;
  height: 16px;
  border-radius: 2px;
  box-shadow: 0 0 0 1px #ffffff1f;
  object-fit: cover;
}
.language-code { font: 700 12px/1.2 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .04em; }
.language-selector:hover, .language-selector[aria-expanded="true"] { border-color: #b6f34b; background: #1d2c30; }
.language-selector:focus-visible, .language-option:focus-visible { outline: 2px solid #b6f34b; outline-offset: 3px; }
.language-menu {
  position: fixed;
  inset: auto;
  z-index: 10000;
  box-sizing: border-box;
  width: 112px;
  max-width: calc(100vw - 16px);
  max-height: calc(100dvh - 16px);
  margin: 0;
  padding: 6px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  border: 1px solid #42536c;
  border-radius: 12px;
  background: #111b2a;
  color: #e7edf7;
  box-shadow: 0 16px 42px #0008, inset 0 1px #ffffff08;
}
.language-menu[hidden] { display: none; }
.language-menu .language-option {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  box-sizing: border-box;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 36px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #dce6f4;
  cursor: pointer;
  touch-action: manipulation;
}
.language-option + .language-option { margin-top: 2px !important; }
.language-menu .language-option:hover, .language-menu .language-option:focus-visible { background: #243349; }
.language-menu .language-option[aria-checked="true"] { border-color: #b6f34b55; color: #c5ff6b; background: #b6f34b14; }
@media (pointer: coarse) { .language-menu .language-option { min-height: 44px !important; height: 44px !important; } }
html { font-family: system-ui, 'Segoe UI', 'Noto Sans CJK SC', 'Yu Gothic', 'Malgun Gothic', sans-serif; }

/* Preserve space for the translated round action without removing league navigation. */
:is(.game-fullscreen-active, .game-layout) [data-fullscreen-region="head"] > .league-back {
  flex: 0 0 44px;
  width: 44px;
  min-width: 44px;
  padding: 0;
  font-size: 22px;
  line-height: 1;
}
:is(.game-fullscreen-active, .game-layout) [data-fullscreen-region="head"] > :is(#start, #runner-start)[data-league-round-state] {
  height: 44px;
  max-height: 44px;
  overflow-wrap: normal;
}

@media (max-height: 540px) and (orientation: landscape) {
  :is(.game-fullscreen-active, .game-layout) [data-fullscreen-region="head"] > :is(#start, #runner-start)[data-league-round-state] { height: 31px; max-height: 31px; }
}

/* Symmetric wings keep the language control centered when notifications appear. */
.site-header .header-inner:has(> .language-control) {
  grid-template-columns: minmax(0, 1fr) 68px minmax(0, 1fr);
  column-gap: 20px;
}
.site-header .header-inner:has(> .language-control) > .brand { grid-column: 1; grid-row: 1; justify-self: start; }
.site-header .header-inner > .language-control { grid-column: 2; grid-row: 1; justify-self: center; }
.site-header-actions { grid-column: 3; grid-row: 1; display: flex; align-items: center; justify-content: flex-end; gap: 20px; min-width: 0; }
.site-header-actions > nav { min-width: 0; }
.site-header-actions > .account-menu { flex: none; }
@media (max-width: 1100px) {
  .site-header-actions { display: contents; }
  .site-header-actions > nav, .site-header-actions > .play-link {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: start;
  }
  .site-header .header-inner:has(> .language-control) { column-gap: 10px; }
}
@media (max-width: 650px) {
  .site-header .header-inner:has(> .language-control) {
    grid-template-columns: auto minmax(68px, 1fr) 96px;
    column-gap: 8px;
  }
  .site-header .header-inner:has(> .language-control) > .brand {
    min-height: 44px;
    font-size: 16px;
    letter-spacing: -.7px;
    gap: 6px;
  }
  .site-header .header-inner:has(> .language-control) > .brand img { width: 30px; height: 30px; }
  .site-header .header-inner:has(> .language-control) .account-menu {
    width: 96px;
    min-width: 96px;
    gap: 8px;
    justify-content: flex-end;
  }
}
@media (max-width: 360px) {
  .site-header .header-inner:has(> .language-control) { grid-template-columns: auto minmax(58px, 1fr) 96px; column-gap: 4px; }
  .site-header .header-inner:has(> .language-control) > .brand { font-size: 14px; gap: 4px; }
  .site-header .header-inner:has(> .language-control) > .brand img { width: 24px; height: 24px; }
  .site-header .header-inner > .language-control { width: 58px; flex-basis: 58px; }
  .site-header .header-inner > .language-control > .language-selector { gap: 5px; padding-inline: 5px; }
}