/* The compact picker (frrx.18, prototypes/language-picker/): globe and code as the
   face, the native select transparent over the whole control, so the platform's
   own list, keyboard and screen reader behaviour stay. Its height is the bar's
   control height (--nav-control, styles.css), 36px where no bar sets one. */
.language-selector { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex-shrink: 0; height: var(--nav-control, 36px); padding: 0 10px 0 9px; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; color: var(--text); font-size: 12px; font-weight: 500; letter-spacing: 0.03em; line-height: 1; transition: background 120ms ease; }
.language-selector svg { flex: none; color: var(--text-2); }
/* 16px keeps iOS from zooming the page when the select takes focus. */
.language-selector select { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; font-size: 16px; cursor: pointer; }
.language-selector:has(select:focus-visible) { outline: 2px solid var(--accent); outline-offset: 3px; }
@media (hover: hover) { .language-selector:hover { background: var(--surface-2); } }
/* /login and /register: the picker sits in the card's top-right corner, out of
   flow, so it adds no height and the pages fit a phone (frrx.26). It clears the
   centred logo on the card's own padding (styles.css, Auth screens). The safe-area
   insets only apply where the card runs edge to edge (the same 720px breakpoint
   as the card's own inset padding); a centred card never touches the notch. */
.auth-card { position: relative; }
.auth-language { position: absolute; top: 16px; right: 16px; display: flex; }
@media (max-width: 720px) {
    .auth-language { top: max(16px, env(safe-area-inset-top)); right: max(16px, env(safe-area-inset-right)); }
}
@media (max-width: 600px) {
    .topnav:has(.language-selector) { flex-wrap: wrap; gap: 12px; }
    .topnav:has(.language-selector) .nav-right { flex-wrap: wrap; gap: 8px; }
}
