.topbar-language { position: relative; display: inline-block; flex-shrink: 0; line-height: 1.4; }
.topbar-language__trigger { display: flex; align-items: center; justify-content: center; gap: .4rem; cursor: pointer;
    padding: .375rem .65rem; border-radius: .5rem; color: #fff; background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.15); font-size: 14px; font-weight: 500; list-style: none; }
.topbar-language__trigger::-webkit-details-marker { display: none; }
.topbar-language__trigger:hover, .topbar-language[open] > summary { background: rgba(255,255,255,.15); }
.topbar-language[data-light] > summary { color: #475569; background: #fff; border-color: #cbd5e1; }
.topbar-language[data-light] > summary:hover { background: #f1f5f9; }
.topbar-language__trigger:focus-visible, .topbar-language__option:focus-visible { outline: 2px solid #14b8a6; outline-offset: 2px; }
.topbar-language__menu { position: absolute; inset-inline-end: 0; top: calc(100% + .5rem); z-index: 1050;
    width: 240px; max-width: calc(100vw - 24px); max-height: 70vh; overflow-y: auto; padding: .5rem;
    background: #fff; color: #334155; border: 1px solid #e2e8f0; border-radius: .75rem; box-shadow: 0 8px 24px rgba(15,23,42,.18); }
.topbar-language[data-light] .topbar-language__menu { inset-inline-start: 0; inset-inline-end: auto; }
.topbar-language__label { padding: .4rem .6rem; font-size: 12px; color: #64748b; text-align: start; }
.topbar-language__option { display: flex; align-items: center; justify-content: space-between; gap: .75rem;
    width: 100%; padding: .65rem .6rem; text-align: start; border: 0; border-radius: .4rem;
    background: transparent; color: #334155; font: inherit; cursor: pointer; }
.topbar-language__option:hover, .topbar-language__option[aria-current="true"] { background: #f0fdfa; color: #0f766e; }