/* One continuous conversation, with large labels and touch controls. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
#translatorView .translator-tabs,#translatorView .translator-output-actions,#translatorView .legacy-translation,#translatorView #swapLanguages{display:none!important}
main:has(> #translatorView.active){padding:0 8px 4px}
#translatorView.active{gap:0;padding-top:4px}
#translatorView .translator-grid{padding:0;gap:0;border:1px solid #657389;border-radius:18px;overflow:hidden;background:#071a30}
#translatorView .language-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:8px 8px 4px}
#translatorView .language-row select{height:52px;min-height:52px;padding:6px 22px 6px 8px;font-family:inherit;font-size:clamp(21px,5.8vw,29px);font-weight:900;color:#ffe3a0;border-color:#c4a565;border-radius:12px;appearance:none;background:#0a1d33 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='10'%3E%3Cpath d='M1 2L7 8L13 2' fill='none' stroke='%23ffe3a0' stroke-width='3'/%3E%3C/svg%3E") no-repeat right 7px center}
#translatorView .language-row option{font-size:23px;font-weight:900}
#translatorView .tone-select{height:42px;min-height:42px;margin:0 8px 4px;width:calc(100% - 16px);font-size:21px;border-radius:10px;padding-top:5px;padding-bottom:5px}
#translationMessages{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:8px;scrollbar-width:thin}
#translationMessages:empty:before{content:attr(data-placeholder);color:#bdc8d4;font-size:22px;line-height:1.5}
.translation-pair{display:flex;flex-direction:column;gap:9px;margin-bottom:18px}
.translation-message{max-width:94%;border-radius:16px;border:1px solid #3b5976;padding:10px 12px;background:#0d2943;overflow-wrap:anywhere;user-select:text}
.translation-message.own{align-self:flex-end;background:#193c57}
.translation-message.other{align-self:flex-start;background:#0a2239}
.translation-language{display:block;color:#ffe3a0;font-size:19px;font-weight:850;margin-bottom:5px}
.translation-body{white-space:pre-wrap;font-size:23px;line-height:1.45}
.text-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;user-select:none}
.text-actions button,.translation-pending button{min-height:44px;padding:8px 10px;border:1px solid #8e794e;border-radius:10px;background:#0a1d33;color:#ffe3a0;font-family:inherit;font-size:17px;font-weight:750;line-height:1.2;cursor:pointer}
.translation-pending{font-size:18px;color:#ffe3a0;margin:0 4px}
.translation-pending.error{color:#ffb6b6}.translation-pending button{display:block;margin-top:6px}
#translatorView .translator-composer{flex-shrink:0;border-top:1px solid #49617b;padding:5px 7px 0}
#translatorView #sourceText{height:44px;min-height:44px!important;max-height:120px;resize:none;padding:8px;font-size:21px;line-height:27px;border:0;border-radius:8px;display:block;background:#0a2038}
#translatorView .translate-actions{grid-template-columns:minmax(72px,1fr) 52px 52px minmax(72px,1fr);gap:7px;padding:5px 0}
#translatorView .translate-actions>*{min-height:48px;font-size:18px;font-weight:850;grid-column:auto!important;padding:6px 4px}
#translatorView .translate-actions #voiceInput{font-size:29px;min-height:48px}
#translatorView .translate-actions #translationSpeak{font-size:26px}
#translatorView .conversation-toggle{padding:2px 8px;font-size:16px}
#translatorView .translation-status{padding:2px 8px 5px;font-size:15px;min-height:18px}
.simple-action-status{position:fixed;z-index:2000;bottom:12px;left:12px;right:12px;pointer-events:none;max-width:600px;margin:auto;padding:10px 14px;border-radius:12px;background:#173651;color:#fff5db;font-size:19px;box-shadow:0 2px 12px #0008}
.simple-action-status:empty{display:none}
@media(min-width:680px){#translatorView .language-row select{font-size:30px}.translation-message{max-width:85%}}
@media(max-height:510px){#translatorView .conversation-toggle{display:none}#translatorView .language-row select{min-height:44px;height:44px;font-size:22px}#translatorView .tone-select{min-height:38px;height:38px;font-size:19px}}

#translatorView .section-head{display:block;margin:2px 0 5px}
#translatorView .section-head h1{font-size:20px}

@media(max-width:359px){#translatorView .language-row select{font-size:20px;padding-left:6px}}

/* v2.2.31: write directly in the large, shared translation area. */
#translatorView .translation-writing-area{display:flex;flex-direction:column;flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:8px;cursor:text}
#translatorView #translationMessages{flex:0 0 auto;overflow:visible;padding:0}
#translatorView #translationMessages:empty:before{content:none}
#translatorView #sourceText{flex:1 0 auto;width:100%;box-sizing:border-box;height:160px;min-height:160px!important;max-height:none;resize:none;overflow:hidden;padding:8px 0;border:0;border-radius:0;background:transparent;color:var(--text);font-size:22px;line-height:1.5;outline:none;box-shadow:none}
#translatorView #sourceText::placeholder{color:#bdc8d4;opacity:1}
#translatorView #sourceText:focus-visible{outline:none}
#translatorView .translation-writing-area:focus-within{box-shadow:inset 2px 0 #c4a565}
#translatorView .translator-composer{border-top:0}