
/* Language selector beside the avatar, responsive without changing calculator layout */
.spl-language-control {margin-left:auto;margin-right:12px;min-width:132px;max-width:160px;align-self:center}
.spl-language-control label{margin:0 0 6px;color:var(--muted);font-size:10px;letter-spacing:1px}
.spl-language-control select{height:38px;font-size:12px;padding:6px 8px}
html[dir="rtl"] .spl-language-control {margin-left:12px;margin-right:auto}
html[dir="rtl"] .spl-guide-dialog,html[dir="rtl"] .terminal{direction:rtl}
html[dir="rtl"] input[type="number"],html[dir="rtl"] input[inputmode="decimal"]{direction:ltr;text-align:left}
@media(max-width:520px){.topbar{flex-wrap:wrap}.spl-language-control{order:3;flex:1 1 100%;max-width:none;margin:8px 0 0}.spl-language-control select{max-width:100%}}

/* Both preference selectors stack neatly to the left of the avatar. */
.spl-language-control {display:flex;flex-direction:column;gap:4px;min-width:172px;max-width:205px;flex:0 0 190px}
.spl-language-control label {margin:5px 0 2px}
.spl-language-control select {height:36px}
.spl-language-control #spl-theme {font-size:11px}
@media(max-width:640px){.spl-language-control{flex:1 1 100%;max-width:none;margin:10px 0 0;order:3}.spl-language-control select{max-width:100%}}
