/* Shared language UI. Load after the page stylesheet; palette comes from tokens. */
.language-control{--language-accent:var(--accent,var(--pink,var(--ink)));--language-surface:var(--panel,var(--white));position:relative;color:var(--ink);font-size:13px;line-height:1.4}
.language-control>summary{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:44px;max-width:none;padding:9px 12px;overflow:visible;border:1px solid var(--line);border-radius:999px;background:var(--language-surface);color:var(--ink);list-style:none;white-space:normal;cursor:pointer}
.language-control>summary::-webkit-details-marker{display:none}
.language-control .language-current{overflow-wrap:anywhere}
.language-control svg,.language-suggestion--compact svg{display:block;width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.language-control[open]>summary{border-color:var(--language-accent)}
.language-control[open] .language-chevron{transform:rotate(180deg)}
.language-control>.language-options{position:absolute;inset-inline-end:0;top:calc(100% + 6px);z-index:30;box-sizing:border-box;width:min(240px,calc(100vw - 24px));max-height:min(65vh,440px);overflow-y:auto;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--language-surface);box-shadow:0 12px 32px color-mix(in srgb,var(--paper,var(--bg)) 55%,transparent)}
.language-control .language-options a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:10px 12px;border-radius:7px;text-decoration:none;color:var(--ink);font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.language-control .language-options a:hover,.language-control .language-options a[aria-current]{background:color-mix(in srgb,var(--language-accent) 12%,var(--language-surface));color:var(--ink)}
.language-control .language-check{color:var(--language-accent)}
.language-control :focus-visible,.language-suggestion--compact :focus-visible{outline:2px solid var(--focus,var(--accent,var(--pink,var(--ink))));outline-offset:3px}
.language-suggestion.language-suggestion--compact{--language-surface:var(--panel,var(--white));box-sizing:border-box;position:relative;width:calc(100% - 24px);max-width:28rem;margin:12px auto;border:1px solid var(--line);border-radius:12px;background:var(--language-surface);color:var(--ink)}
.language-suggestion.language-suggestion--compact[hidden]{display:none!important}
.language-suggestion--compact .language-suggestion-inner{display:flex;align-items:center;justify-content:space-between;gap:8px;width:auto;margin:0;padding:8px 8px 8px 14px}
.language-suggestion--compact #language-title{min-width:0;flex:1;margin:0;font-family:var(--sans);font-size:14px;font-weight:600;line-height:1.45;letter-spacing:0;text-wrap:pretty;overflow-wrap:anywhere}
.language-suggestion--compact .language-suggestion-actions{display:flex;flex:none;align-items:center;flex-wrap:nowrap;gap:4px;width:auto;max-width:100%}
.language-suggestion--compact .language-action,.language-suggestion--compact .language-close{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;margin:0;border:1px solid transparent;border-radius:8px;font:600 13px/1.4 var(--sans);text-align:center;text-decoration:none;cursor:pointer}
.language-suggestion--compact .language-action{padding:10px 12px;background:var(--accent,var(--pink,var(--ink)));color:var(--on-accent,var(--paper,var(--bg)));overflow-wrap:anywhere}
.language-suggestion--compact .language-close{width:44px;height:44px;padding:12px;background:transparent;color:var(--muted)}
.language-suggestion--compact .language-close:hover{background:color-mix(in srgb,var(--ink) 8%,transparent);color:var(--ink)}
@media(max-width:360px){.language-control>summary{font-size:12px;padding-inline:9px}.language-suggestion--compact .language-suggestion-inner{gap:6px;padding-inline-start:10px}.language-suggestion--compact .language-action{padding-inline:9px}}
@media print{.language-suggestion--compact{display:none!important}}
/* Fixed language prompts keep their viewport width instead of inheriting page overflow. */
@media(max-width:760px){body.chrome-ready .language-suggestion.language-suggestion--compact{width:calc(100vw - 24px);max-width:calc(100vw - 24px);margin:0;left:12px;right:12px}}
.language-suggestion--compact .language-suggestion-inner{flex-direction:row}
