*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f0f1a;--bg-card: #1a1a2e;--bg-input: #252540;--text: #eaeaea;--text-dim: #8888aa;--accent: #4a9eff;--accent-glow: rgba(74, 158, 255, .2);--source-color: #d4a574;--target-color: #74d4a5;--error: #ff6b6b;--radius: 12px;--safe-bottom: env(safe-area-inset-bottom, 0px)}html,body{height:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}#root{height:100%}.app{display:flex;flex-direction:column;height:100%;max-width:600px;margin:0 auto;padding-bottom:var(--safe-bottom)}.header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.06)}.logo{font-size:18px;font-weight:600;background:linear-gradient(135deg,var(--accent),var(--target-color));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-actions{display:flex;gap:8px}.btn-settings{background:none;border:none;color:var(--text-dim);cursor:pointer;padding:6px;border-radius:8px;transition:background .2s}.btn-settings:active{background:var(--bg-input)}.settings-panel{background:var(--bg-card);border-bottom:1px solid rgba(255,255,255,.06);padding:12px 16px}.setting-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0}.setting-row label{font-size:14px;color:var(--text-dim)}.toggle{padding:4px 12px;border-radius:16px;border:1px solid var(--text-dim);background:none;color:var(--text-dim);font-size:12px;font-weight:600;cursor:pointer;transition:all .2s}.toggle.on{border-color:var(--accent);color:var(--accent);background:var(--accent-glow)}.setting-slider{display:flex;align-items:center;gap:10px}.setting-slider input[type=range]{width:100px;accent-color:var(--accent);cursor:pointer}.slider-value{font-size:14px;font-weight:600;color:var(--accent);min-width:30px}.btn-clear{background:none;border:1px solid var(--error);color:var(--error);padding:6px 14px;border-radius:8px;font-size:13px;cursor:pointer}.lang-bar{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;background:var(--bg-card);border-bottom:1px solid rgba(255,255,255,.06)}.lang-select{flex:1;background:var(--bg-input);border:1px solid rgba(255,255,255,.1);color:var(--text);padding:10px 12px;border-radius:var(--radius);font-size:15px;-moz-appearance:none;appearance:none;-webkit-appearance:none;text-align:center;cursor:pointer}.btn-swap{background:var(--bg-input);border:1px solid rgba(255,255,255,.1);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:var(--accent);cursor:pointer;transition:transform .3s;flex-shrink:0}.btn-swap:active{transform:rotate(180deg)}.model-bar{padding:6px 16px;border-bottom:1px solid rgba(255,255,255,.04)}.model-button{display:flex;align-items:center;gap:6px;background:none;border:none;color:var(--text-dim);font-size:13px;cursor:pointer;padding:4px 0}.model-label{color:var(--text-dim)}.model-name{color:var(--text);font-weight:500}.model-dropdown{background:var(--bg-card);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);margin:0 16px 8px;overflow:hidden;max-height:300px;overflow-y:auto}.model-option{display:block;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid rgba(255,255,255,.04);color:var(--text);padding:12px 16px;cursor:pointer;transition:background .15s}.model-option:last-child{border-bottom:none}.model-option:active,.model-option.active{background:var(--accent-glow)}.model-option-name{font-size:14px;font-weight:500}.model-option-desc{font-size:12px;color:var(--text-dim);margin-top:2px}.conversation{flex:1;overflow-y:auto;padding:16px;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}.empty-state{text-align:center;padding:40px 20px;color:var(--text-dim)}.empty-icon{font-size:48px;margin-bottom:16px}.empty-state p{margin-bottom:8px;font-size:15px}.empty-hint{font-size:13px!important;opacity:.7}.conv-entry{margin-bottom:20px;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.conv-source{background:var(--bg-card);border-left:3px solid var(--source-color);border-radius:0 var(--radius) var(--radius) 0;padding:12px 14px;margin-bottom:6px}.conv-translation{background:var(--bg-card);border-left:3px solid var(--target-color);border-radius:0 var(--radius) var(--radius) 0;padding:12px 14px;position:relative}.conv-lang-tag{display:inline-block;font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.conv-source p,.conv-translation p{font-size:16px;line-height:1.5;word-wrap:break-word}.btn-replay{position:absolute;top:10px;right:10px;background:none;border:none;color:var(--text-dim);cursor:pointer;padding:4px;border-radius:6px;transition:color .2s}.btn-replay:active{color:var(--accent)}.conv-meta{font-size:11px;color:var(--text-dim);margin-top:4px;padding-left:14px}.conv-entry.listening .conv-source{border-left-color:var(--accent)}.interim-text{color:var(--accent);font-style:italic}.silence-indicator{margin-top:8px;display:flex;align-items:center;gap:8px}.silence-bar{height:3px;background:var(--accent);border-radius:2px;transition:width .5s linear;max-width:100px}.silence-label{font-size:12px;color:var(--accent)}.processing-indicator{display:flex;align-items:center;gap:10px;padding:12px;color:var(--text-dim);font-size:14px}.spinner{width:18px;height:18px;border:2px solid var(--text-dim);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-bar{display:flex;align-items:center;justify-content:space-between;background:#ff6b6b1a;border-top:1px solid var(--error);padding:8px 16px;font-size:13px;color:var(--error)}.error-bar button{background:none;border:none;color:var(--error);font-size:18px;cursor:pointer;padding:0 4px}.input-area{padding:12px 16px;padding-bottom:calc(12px + var(--safe-bottom));background:var(--bg-card);border-top:1px solid rgba(255,255,255,.06);display:flex;flex-direction:column;align-items:center;gap:12px}.text-input-row{display:flex;width:100%;gap:8px}.text-input{flex:1;background:var(--bg-input);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);padding:12px 16px;color:var(--text);font-size:16px;outline:none;transition:border-color .2s}.text-input:focus{border-color:var(--accent)}.text-input::placeholder{color:var(--text-dim)}.text-input:disabled{opacity:.5}.btn-send{background:var(--accent);border:none;border-radius:var(--radius);width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;flex-shrink:0}.btn-send:active{opacity:.8}.btn-mic-main{width:64px;height:64px;border-radius:50%;border:3px solid var(--accent);background:var(--bg-input);color:var(--accent);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;position:relative}.btn-mic-main:active{transform:scale(.95)}.btn-mic-main.active{background:var(--accent);color:#fff;animation:pulse 1.5s ease-in-out infinite}.btn-mic-main.processing{opacity:.7;border-color:var(--text-dim);cursor:wait}.btn-mic-main.processing .spinner{width:24px;height:24px;border-width:3px}@keyframes pulse{0%,to{box-shadow:0 0 0 0 var(--accent-glow)}50%{box-shadow:0 0 0 12px transparent}}.mic-status{font-size:13px;color:var(--accent);text-align:center;display:flex;align-items:center;justify-content:center;gap:6px}.mic-pulse{display:inline-block;width:8px;height:8px;background:#4ade80;border-radius:50%;animation:micPulse 1s ease-in-out infinite}@keyframes micPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}.mic-active-dot{display:inline-block;width:8px;height:8px;background:#4ade80;border-radius:50%;margin-left:8px;animation:micPulse 1s ease-in-out infinite;vertical-align:middle}.conversation::-webkit-scrollbar{width:4px}.conversation::-webkit-scrollbar-thumb{background:var(--text-dim);border-radius:2px}.conversation::-webkit-scrollbar-track{background:transparent}@media(max-width:420px){.header{padding:10px 12px}.lang-bar{padding:10px 12px;gap:6px}.lang-select{padding:8px;font-size:14px}.conversation{padding:12px}.input-area{padding:10px 12px}.btn-mic-main{width:56px;height:56px}}@media(max-height:500px){.empty-state{padding:16px}.empty-icon{font-size:32px;margin-bottom:8px}.btn-mic-main{width:48px;height:48px}.input-area{gap:8px;padding:8px 12px}}.btn-log{background:none;border:none;color:var(--text-dim);cursor:pointer;padding:6px;border-radius:8px;transition:background .2s}.btn-log.active{color:var(--accent);background:var(--accent-glow)}.btn-log:active{background:var(--bg-input)}.log-panel{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--bg);z-index:1000;display:flex;flex-direction:column;font-family:SF Mono,Fira Code,Cascadia Code,monospace}.log-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.1);flex-wrap:wrap;gap:8px}.log-header h3{font-size:14px;color:var(--text);margin:0}.log-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.log-search{background:var(--bg-input);border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:4px 8px;color:var(--text);font-size:12px;width:100px;outline:none}.log-search:focus{border-color:var(--accent)}.log-filter{background:var(--bg-input);border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:4px 6px;color:var(--text);font-size:11px}.log-btn{background:var(--bg-input);border:1px solid rgba(255,255,255,.1);border-radius:6px;color:var(--text);padding:4px 8px;font-size:12px;cursor:pointer}.log-btn:active{background:var(--bg-card)}.log-close{font-size:18px;padding:2px 8px;color:var(--error)}.log-body{flex:1;overflow-y:auto;padding:8px;font-size:11px;line-height:1.5}.log-entry{padding:3px 6px;border-radius:3px;margin-bottom:1px;display:flex;flex-wrap:wrap;gap:6px;align-items:baseline}.log-entry:hover{background:#ffffff08}.log-entry.log-error{background:#ff6b6b0d}.log-entry.log-warn{background:#ffaa440d}.log-time{color:#555;font-size:10px;min-width:75px}.log-level{font-weight:700;font-size:10px;min-width:40px;text-transform:uppercase}.log-category{font-size:10px;min-width:60px}.log-msg{color:var(--text);word-break:break-word}.log-details{color:var(--text-dim);font-size:10px;word-break:break-word}.log-data{width:100%;color:var(--text-dim);font-size:10px;background:#0000004d;padding:4px 8px;border-radius:4px;margin-top:2px;white-space:pre-wrap;word-break:break-word;max-height:100px;overflow-y:auto}.log-empty{text-align:center;padding:40px;color:var(--text-dim)}.speech-buffer{position:fixed;bottom:140px;left:8px;right:8px;max-width:600px;margin:0 auto;background:#0f0f1af2;border:1px solid rgba(74,158,255,.3);border-radius:8px;padding:6px 10px;font-family:SF Mono,Fira Code,monospace;font-size:11px;z-index:900;max-height:150px;overflow-y:auto}.speech-buffer-header{display:flex;justify-content:space-between;align-items:center;color:var(--accent);font-size:10px;font-weight:600;margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}.speech-buffer-header button{background:none;border:none;color:var(--text-dim);font-size:14px;cursor:pointer}.speech-buffer-entries{display:flex;flex-direction:column;gap:2px}.speech-buffer-entry{display:flex;gap:6px;align-items:baseline;padding:1px 0;color:var(--text-dim)}.speech-buffer-entry.final{color:var(--text);font-weight:500}.sbe-time{color:#555;font-size:9px;min-width:70px}.sbe-type{font-size:9px;min-width:40px;color:var(--text-dim)}.speech-buffer-entry.final .sbe-type{color:#4ade80;font-weight:700}.sbe-text{word-break:break-word}