:root{color-scheme:dark;font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;color:#e6edf7;background:#10151e;--surface:#171e2a;--raised:#202a3a;--blue:#88afff;--muted:#a2afc2;--line:#303b4d;--text:#e6edf7}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}button,select,textarea{font:inherit}button{cursor:pointer}button:disabled,select:disabled{opacity:.45;cursor:not-allowed}button,input,select{-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.app{max-width:1000px;margin:auto;padding:24px 28px 12px}header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;white-space:nowrap}.mark{background:#26354f;color:#b4ccff;border:1px solid #3c5276;border-radius:12px;padding:8px 10px;font-weight:700;letter-spacing:-1px}.brand b{font-size:20px;font-weight:600}.brand small{font-size:12px;color:var(--muted);font-weight:400;margin-left:10px}.header-actions{display:flex;gap:12px;align-items:center}#connection{font-size:11px;color:var(--muted)}button{border-radius:10px;min-height:40px}.quiet{border:0;background:transparent;color:var(--muted);padding:7px 10px;font-size:12px}.quiet:hover{color:var(--text);background:#ffffff08}.secondary{border:1px solid var(--line);background:var(--raised);color:var(--text);padding:8px 12px;font-size:13px}.primary,.danger{border:0;color:#10213e;background:var(--blue);padding:11px 26px;min-height:46px;font-size:14px;font-weight:600}.danger{background:#59313a;color:#ffd4d8;border:1px solid #814753}.workspace{background:var(--surface);border:1px solid var(--line);border-radius:22px;overflow:hidden;min-width:0;box-shadow:0 24px 70px #0003}
.language-row{display:flex;align-items:center;gap:14px;padding:20px 24px;border-bottom:1px solid var(--line)}.language-row label:not(.inline){flex:1;min-width:0}.language-row label>span{display:block;font-size:10px;color:var(--muted);margin-bottom:2px}select{border:1px solid var(--line);border-radius:8px;background:var(--raised);color:var(--text);padding:8px 10px;max-width:100%;font-size:13px}.language-row select{width:100%;font-size:17px;font-weight:550;padding:4px 0;border:none;background:transparent}.swap{font-size:24px;align-self:end;color:var(--blue)}.inline{display:flex;align-items:center;gap:8px;font-size:12px;white-space:nowrap}.inline input{accent-color:var(--blue);width:16px;height:16px;margin:0}#autoSource{flex:1;color:var(--muted);font-size:14px}.conversation-bar{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;color:var(--muted);font-size:12px}.speech-toggle{min-height:34px;padding:5px 13px;border:1px solid #48628a;border-radius:18px;background:#23344d;color:#b8d0ff;font-size:12px}.speech-toggle[aria-pressed=false]{background:#202834;border-color:var(--line);color:var(--muted)}
.conversation{height:42dvh;min-height:210px;max-height:510px;overflow:auto;padding:4px 24px 12px;scrollbar-color:#465369 transparent}.empty{display:grid;place-content:center;justify-items:center;gap:14px;text-align:center;min-height:190px;color:var(--muted)}.empty>span:last-child{font-size:23px;font-weight:400;letter-spacing:1px}.empty-icon{font-size:38px;color:#637897;background:#202b3d;border:1px solid #344258;width:76px;height:76px;display:grid;place-items:center;border-radius:24px}.bubble{border:1px solid #344661;border-radius:15px 15px 15px 4px;background:#203049;padding:13px 17px;margin:0 0 14px;max-width:88%;overflow-wrap:anywhere}.bubble.reverse{background:#213931;border-color:#3a564b;border-radius:15px 15px 4px 15px;margin-left:auto}.meta{font-size:11px;color:#a9bcd5;display:flex;align-items:center;justify-content:space-between;gap:8px}.original{color:#b8c7da;font-size:14px;line-height:1.7;margin:5px 0}.translation{font-size:20px;line-height:1.65;margin:6px 0;color:#f0f5ff}.bubble.reverse .original,.bubble.reverse .meta{color:#b8cfc4}.bubble.pending{border-style:dashed}.bubble.pending .meta-label::after{content:' · 翻译中';color:var(--muted)}
.status-row{display:flex;align-items:center;gap:8px;padding:13px 24px 5px;font-size:12px;color:var(--muted);min-height:38px}.status-row #status{overflow-wrap:anywhere}#dot{width:6px;height:6px;background:#73849b;border-radius:50%;flex-shrink:0}#dot.active{background:#7dd0ae;box-shadow:0 0 8px #7dd0ae44}#clock{margin-left:auto;font-variant-numeric:tabular-nums}.meter{height:2px;background:#263244;margin:4px 24px}.meter i{height:100%;display:block;width:0;background:#7dd0ae;transition:width .1s}.controls{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px 4px;flex-wrap:wrap}.main-actions{display:flex;gap:8px}.mini-tools{display:flex;justify-content:center;padding:0 14px 8px;gap:8px}#error{margin:10px 24px;padding:12px;border:1px solid #815054;color:#ffd0cc;background:#3e272b;border-radius:10px;font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}
footer{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:var(--muted);gap:10px;margin-top:8px}dialog{width:min(480px,calc(100% - 24px));max-height:90dvh;overflow:auto;border:1px solid #465570;border-radius:18px;color:var(--text);background:var(--surface);padding:20px}dialog::backdrop{background:#060b13bf;backdrop-filter:blur(4px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.dialog-head h2{font-size:18px;margin:0}.setting{display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line);padding:14px 0;font-size:13px}.setting select{max-width:65%;min-width:0}.device-buttons,.dialog-actions{display:flex;gap:8px;flex-wrap:wrap}.dialog-actions{justify-content:flex-end;margin-top:16px}.muted,#deviceStatus{font-size:12px;color:var(--muted);overflow-wrap:anywhere}details{margin-top:15px;font-size:12px}pre{font-size:11px;white-space:pre-wrap;overflow-wrap:anywhere;background:#111a27;padding:10px;border-radius:8px}#feedback{margin-bottom:12px}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.account-bar{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:#aab7cc;padding:8px 2px}.account-bar a{color:#8db6ff}#accountDialog input{width:100%;padding:10px;border:1px solid #344156;border-radius:8px;background:#111a28;color:#edf3ff}#accountIdentity{overflow-wrap:anywhere}#accountMessage{color:#a8bde3}#accountBar[hidden]{display:none}@media(max-width:440px){.header-actions{gap:4px}.header-actions button{font-size:11px;padding:6px}#connection{display:none}}

#accountDialog .setting{display:grid;grid-template-columns:1fr;gap:8px}

/* Voice-only layout, 1.0.3 UI refresh. */
.app{max-width:920px;padding:20px 24px 12px}
header{margin-bottom:16px;gap:12px}.brand small{display:none}.header-actions{gap:14px;min-width:0;white-space:nowrap}
.account-bar{padding:6px 12px;border:1px solid var(--line);border-radius:20px;text-decoration:none;font-variant-numeric:tabular-nums;color:#b8d0ff;font-size:12px;white-space:nowrap}
#accountOpen{color:var(--text);font-size:13px;padding:8px 4px}
.language-row{padding:16px 24px;gap:16px}.language-row select{min-height:44px}.swap{align-self:center}.language-row .inline{color:var(--muted)}
.conversation-bar{padding:6px 18px 0 24px}.icon-button{width:44px;height:44px;display:grid;place-items:center;color:#c5d6ee}.icon-button[aria-pressed=true]{background:#2b3c56;color:#fff}
.conversation{height:47dvh;min-height:230px;max-height:620px;padding-top:10px}.empty{height:100%;min-height:180px;gap:16px}.empty>span:last-child{font-size:24px}
.controls{padding:14px 20px 8px}.main-actions{justify-content:center;align-items:center;gap:12px;max-width:100%;flex-wrap:wrap}
#start{background:#78d6a9;color:#102a21;min-width:160px;min-height:48px}#start.connecting{background:#343e4d;color:#c1c9d4;opacity:1}#stop{min-height:48px}
.speech-toggle{min-height:48px;padding:10px 16px;border-radius:10px;font-size:13px}.speech-toggle[aria-pressed=false]{color:#bec9d8}
.status-row{padding-top:8px}.mini-tools{padding-bottom:12px}footer{justify-content:center;gap:18px}footer .quiet{font-size:11px}
body.immersive{overflow:hidden;background:#10151e}
.immersive .app{position:fixed;inset:0;max-width:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);height:100dvh;display:flex;z-index:10}
.immersive header,.immersive footer,.immersive .language-row,.immersive .mini-tools{display:none}
.immersive .workspace{display:flex;flex-direction:column;flex:1;min-height:0;border:0;border-radius:0;background:#10151e}
.immersive .conversation-bar{flex-shrink:0;padding:4px 14px 0 20px}.immersive .conversation{flex:1;min-height:0;max-height:none;height:auto;padding:8px max(20px,5vw)}
.immersive .bubble{max-width:100%;padding:14px 20px}.immersive .translation{font-size:clamp(24px,3.6vw,42px);line-height:1.5}.immersive .original{font-size:clamp(16px,2.4vw,24px)}
.immersive .controls{flex-shrink:0;padding:8px 12px 12px}.immersive .status-row{padding:4px 20px;font-size:11px}.immersive #error{max-height:18dvh;overflow:auto;margin:4px 20px;flex-shrink:0}.immersive .meter{flex-shrink:0}
@media(max-width:600px){
 .app{padding:12px 10px 6px}header{gap:8px;margin-bottom:12px}.brand{gap:7px}.brand b{font-size:17px}.mark{padding:5px 8px;border-radius:10px}.header-actions{gap:8px}.account-bar{padding:5px 9px;font-size:11px}#accountOpen{font-size:12px}
 .workspace{border-radius:18px}.language-row{padding:10px 14px;gap:8px}.language-row select{font-size:16px}.language-row .inline{font-size:11px;gap:5px}.swap{padding:4px}
 .conversation-bar{padding:2px 8px 0 14px}.conversation{padding:6px 14px 10px;height:46dvh;min-height:200px}.empty>span:last-child{font-size:21px}.empty-icon{width:62px;height:62px;font-size:32px;border-radius:19px}
 .bubble{max-width:96%;padding:10px 13px}.translation{font-size:20px}.original{font-size:14px}.status-row{padding:6px 14px 4px}.meter{margin:4px 14px}#error{margin:6px 14px}.controls{padding:10px 12px 6px}.mini-tools{padding-bottom:6px}footer{gap:10px}
}
@media(max-width:380px){.brand b{display:none}.header-actions{gap:6px}.language-row .inline{font-size:10px}.language-row select{font-size:15px}#start{min-width:136px}.main-actions{gap:8px}}
@media(orientation:landscape) and (max-height:550px){
 .app{padding:6px 12px}header{margin-bottom:4px}.language-row{padding:3px 16px}.conversation{height:43dvh;min-height:120px}.conversation-bar{padding-top:0}.empty{min-height:100px;gap:4px}.empty-icon{display:none}.mini-tools,footer{display:none}.controls{padding:6px 12px}.status-row{padding-top:2px}
 .immersive .conversation-bar{height:44px}.immersive .controls{padding:4px 12px}.immersive .status-row{min-height:20px}.immersive .translation{font-size:26px}.immersive .original{font-size:17px}
}
textarea{width:100%;resize:vertical;min-height:110px;border:1px solid var(--line);border-radius:11px;padding:12px;background:#111a27;color:var(--text);font-size:16px;line-height:1.6}textarea::placeholder{color:#8b9ab0}
/* One speaker: a continuous transcript rather than left/right chat bubbles. */
.one-way .conversation{padding-top:4px}
.one-way .bubble,.one-way .bubble.reverse{max-width:100%;margin:0;padding:18px 2px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent}
.one-way .bubble .meta{display:none}
.one-way .original{font-size:clamp(22px,3.1vw,30px);line-height:1.5;margin:0 0 8px;color:#b6c6da}
.one-way .translation{font-size:clamp(28px,4vw,38px);line-height:1.5;font-weight:550;margin:0;color:#f5f8ff}
.one-way .bubble.pending .translation{font-weight:500}
.immersive.one-way .original{font-size:clamp(24px,3.4vw,36px)}
.immersive.one-way .translation{font-size:clamp(30px,4.6vw,48px)}

@media(max-width:600px){.main-actions{gap:8px}#start{min-width:126px;padding:11px 18px}.speech-toggle{padding:10px 11px}#stop{padding:11px 15px}.one-way .bubble{padding:14px 0}}
@media(max-width:350px){.main-actions{gap:6px}#start{min-width:110px;padding:11px 12px}.speech-toggle{padding:10px 8px;font-size:12px}}

/* Compact controls: noise option above, sound icon beside fullscreen. */
.language-options{display:flex;align-items:center;justify-content:flex-end;gap:16px;flex-shrink:0}
.language-options .inline{min-height:36px;cursor:pointer}
.caption-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}
#captionLabel{min-width:0;overflow-wrap:anywhere}
#speechToggle .sound-on{display:none}
#speechToggle[aria-pressed=true] .sound-on{display:block}
#speechToggle[aria-pressed=true] .sound-off{display:none}
#speechToggle[aria-pressed=true]{color:#99e3bc;background:transparent}
#speechToggle[aria-pressed=false]{color:var(--muted)}
/* Keep language and options on a single row, including narrow phones. */
.language-row{flex-wrap:nowrap}
.language-options{order:0;flex:0 0 auto}
.transcript-panel{position:relative;min-height:0}
.conversation{padding-bottom:52px}
.clear-captions{position:absolute;bottom:4px;right:14px;width:36px;height:36px;min-height:36px;border-radius:9px;background:var(--surface);color:#8fa1b8}
.mini-tools:not(:has(button:not([hidden]))){display:none}
.immersive .transcript-panel{flex:1;min-height:0;display:flex;flex-direction:column}
.immersive .conversation{padding-bottom:52px}
.immersive .clear-captions{background:#10151e}
@media(max-width:600px){
 .language-row{gap:6px;padding:10px 12px}
 .language-row select{font-size:14px}
 .language-row .swap{flex:0 0 36px;width:36px;min-height:36px;padding:0;font-size:20px}
 .language-options{gap:8px}
 .language-options .inline{font-size:12px;gap:4px;min-height:40px}
 .language-options input{width:14px;height:14px}
 .clear-captions{right:10px}
}
@media(max-width:350px){
 .language-row{gap:4px;padding:8px 10px}
 .language-row select{font-size:13px}
 .language-options{gap:6px}
 .language-options .inline{font-size:11px;gap:3px}
 .language-options input{width:13px;height:13px}
}
/* Short utterance: hold, then release. Keep both entry buttons adjacent. */
.main-actions{display:flex;gap:10px;flex-wrap:wrap}.hold-talk{background:#202d3e;border:1px solid #526982;color:#e8f0fc;min-width:125px;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.hold-talk[aria-pressed="true"]{background:#986147;border-color:#ffc299;color:#fff}.hold-talk:focus-visible{outline:2px solid #94dab8;outline-offset:3px}@media(max-width:600px){.main-actions>button{flex:1;min-width:0}.main-actions{gap:8px}.hold-talk{padding-left:12px;padding-right:12px}}