/* Only the language control is positioned; existing topbar/header sizes stay intact. */
@font-face { font-family: "MKA Switcher Chinese"; src: url('../assets/chinese.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "MKA Switcher Arabic"; src: url('../assets/arabic.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
.topbar { position: relative; }
.mka-language-switcher { position: absolute; right: max(15px, calc((100% - 1320px) / 2 + 15px)); top: 50%; transform: translateY(-50%); z-index: 1001; direction: ltr; }
.mka-language-toggle { display: flex; align-items: center; gap: 4px; height: 32px; padding: 0 6px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #D6D2C4; font: 500 14px/1 var(--mka-font-family); cursor: pointer; transition: border-color 200ms, color 200ms; }
.mka-language-toggle:hover, .mka-language-toggle[aria-expanded="true"] { color: #F1B300; }
.mka-language-chevron { transition: transform 200ms; }
.mka-language-toggle[aria-expanded="true"] .mka-language-chevron { transform: rotate(180deg); }
.mka-language-options { position: absolute; top: calc(100% + 6px); right: 0; width: 200px; padding: 6px; margin: 0; background: #333E48; border: 1px solid #D6D2C4; border-radius: 8px; box-shadow: 0 8px 24px #0003; opacity: 0; visibility: hidden; transform: translateY(-6px) scale(.98); transform-origin: top center; pointer-events: none; transition: opacity 160ms ease-out, transform 160ms ease-out, visibility 0s linear 160ms; }
.mka-language-switcher.is-open .mka-language-options { opacity: 1; visibility: visible; transform: translateY(0) scale(1); pointer-events: auto; transition: opacity 220ms ease-out, transform 220ms ease-out, visibility 0s; }
.mka-language-options a { display: grid; grid-template-columns: 24px 1fr; align-items: center; gap: 12px; height: 44px; padding: 8px 10px; border-radius: 4px; color: #D6D2C4; font: 500 14px/1.5 var(--mka-font-family); text-decoration: none; white-space: nowrap; transition: color 160ms ease-out, background-color 160ms ease-out; }
.mka-language-options a:hover, .mka-language-options a[aria-current="true"] { color: #F1B300; background: #ffffff0a; }
.mka-language-options [lang="zh-CN"] { font-family: "MKA Switcher Chinese", sans-serif; }
.mka-language-options [lang="ar"] { font-family: "MKA Switcher Arabic", sans-serif; direction: ltr; }
.mka-language-options .mka-language-short { min-width: 24px; font-family: "Mukta Mahee", sans-serif; direction: ltr; }
.mka-language-options a > span:last-child { text-align: left; }
.mka-language-options [lang="ar"] > span:last-child { direction: rtl; text-align: left; }
.mka-language-options::before { content: ""; position: absolute; left: 0; right: 0; top: -8px; height: 8px; }
.mka-language-toggle:focus-visible, .mka-language-options a:focus-visible { outline: 2px solid #F1B300; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .mka-language-options, .mka-language-switcher.is-open .mka-language-options, .mka-language-options a, .mka-language-chevron, .mka-language-toggle { transition: none; } }

[data-language-code] { font-family: "Mukta Mahee", sans-serif; }