:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--primary: #8b5cf6;--primary-light: #a78bfa;--primary-dark: #7c3aed;--accent: #f472b6;--accent-light: #f9a8d4;--success: #10b981;--error: #ef4444;--recording: #a855f7;--recording-dark: #8A2BE2;--recording-light: #c084fc;--bg: #0a0a0f;--bg-card: rgba(22, 22, 31, .8);--bg-card-solid: #16161f;--bg-secondary: #1e1e2a;--text: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--border: rgba(45, 45, 58, .6);--shadow: 0 4px 20px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 30px rgba(0, 0, 0, .5);--radius: 16px;--radius-sm: 12px;--radius-full: 9999px;--glow-primary: rgba(139, 92, 246, .5);--glow-recording: rgba(168, 85, 247, .6);--glow-success: rgba(16, 185, 129, .5);--glow-accent: rgba(244, 114, 182, .5);--glass-bg: rgba(22, 22, 31, .6);--glass-border: rgba(139, 92, 246, .15);--glass-blur: 12px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;background:var(--bg);color:var(--text);min-height:var(--tg-viewport-stable-height, 100vh);-webkit-font-smoothing:antialiased;overflow:hidden;position:fixed;width:100%}#root{min-height:var(--tg-viewport-stable-height, 100vh);width:100%}.app{min-height:100vh;display:flex;flex-direction:column;align-items:center;background:radial-gradient(ellipse at top,#1a1a2e 0%,var(--bg) 50%)}.app-main{flex:1;display:flex;flex-direction:column;padding:12px;padding-top:calc(var(--tg-content-safe-area-inset-top, 0px) + var(--tg-safe-area-inset-top, env(safe-area-inset-top, 0px)) + 12px);max-width:480px;margin:0 auto;width:100%;max-height:var(--tg-viewport-stable-height, 100vh);overflow:hidden}.voice-session{display:flex;flex-direction:column;align-items:center;flex:1;gap:12px;max-height:100%;overflow:hidden}.language-selector{background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border-radius:var(--radius);padding:12px;border:1px solid var(--glass-border);width:100%}.lang-row{display:flex;align-items:center;gap:12px}.lang-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 16px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-secondary);cursor:pointer;transition:all .2s ease;font-size:15px;color:var(--text)}.lang-btn:hover:not(:disabled){border-color:var(--primary);background:#8b5cf61a}.lang-btn:disabled{opacity:.5;cursor:not-allowed}.lang-flag{font-size:24px}.lang-name{font-weight:500}.swap-btn{width:44px;height:44px;border:none;border-radius:var(--radius-full);background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;font-size:18px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 0 20px var(--glow-primary)}.swap-btn:hover:not(:disabled){transform:rotate(180deg);box-shadow:0 0 30px var(--glow-primary)}.swap-btn:disabled{opacity:.4;cursor:not-allowed}.lang-select{flex:1;padding:14px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-secondary);color:var(--text);font-size:15px;cursor:pointer;appearance:none;text-align:center;font-weight:500}.lang-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--glow-primary)}.lang-select:disabled{opacity:.5;cursor:not-allowed}.voice-limit{display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 16px;border-radius:var(--radius-sm);background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);width:100%;font-variant-numeric:tabular-nums}.voice-limit-bar{position:relative;width:100%;height:4px;background:#2d2d3a66;border-radius:2px;overflow:hidden}.voice-limit-bar-fill{height:100%;transition:width .5s ease,background-color .3s ease;box-shadow:0 0 10px currentColor}.voice-limit-bar-label{position:absolute;top:-20px;right:0;font-size:10px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-variant-numeric:tabular-nums}.voice-limit-time{font-size:16px;font-weight:700;color:var(--success);letter-spacing:.5px}.voice-limit-label{font-size:13px;color:var(--text-muted);font-weight:400}.voice-limit.low{border-color:#fbbf2466;background:#fbbf2414}.voice-limit.low .voice-limit-time{color:#fbbf24;animation:pulse 1.5s ease-in-out infinite}.voice-limit.exhausted{border-color:#ef444466;background:#ef444414}.voice-limit.exhausted .voice-limit-time{color:var(--error)}.voice-limit.exhausted .voice-limit-label{color:var(--error);opacity:.8}.dialog-history{overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:8px 4px 8px 0;flex:1;min-height:100px;max-height:calc(100vh - 300px);scrollbar-width:thin;scrollbar-color:var(--primary) transparent;width:100%}.dialog-history::-webkit-scrollbar{width:4px}.dialog-history::-webkit-scrollbar-track{background:transparent}.dialog-history::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--primary) 0%,var(--accent) 100%);border-radius:4px}.dialog-history::-webkit-scrollbar-thumb:hover{background:var(--primary-light)}.dialog-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 20px;color:var(--text-muted)}.dialog-empty p{margin:4px 0;font-size:16px}.dialog-empty .hint{font-size:14px;opacity:.7}.message{max-width:85%;padding:12px 16px;border-radius:20px;animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message-input{align-self:flex-start;background:var(--bg-secondary);border:1px solid var(--border);border-bottom-left-radius:6px}.message-output{align-self:flex-end;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;border-bottom-right-radius:6px;box-shadow:0 4px 15px var(--glow-primary)}.message-text{font-size:15px;line-height:1.5;word-wrap:break-word;letter-spacing:.3px}.message-time{font-size:11px;opacity:.6;margin-top:4px;text-align:right}.record-section{display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px 0;flex-shrink:0}.record-btn{width:100px;height:100px;border-radius:var(--radius-full);border:none;background:linear-gradient(145deg,var(--bg-secondary) 0%,var(--bg-card-solid) 100%);color:var(--primary-light);cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 0 40px var(--glow-primary),inset 0 2px 10px #ffffff0d,0 10px 40px #0000004d;animation:breathing-idle 4s ease-in-out infinite}@keyframes breathing-idle{0%,to{box-shadow:0 0 40px var(--glow-primary),inset 0 2px 10px #ffffff0d,0 10px 40px #0000004d}50%{box-shadow:0 0 60px var(--glow-primary),inset 0 2px 10px #ffffff14,0 15px 50px #00000059}}.record-btn:before{content:"";position:absolute;inset:-3px;border-radius:var(--radius-full);background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%);z-index:-1;opacity:.5;transition:opacity .3s}.record-btn:hover:not(:disabled){transform:scale(1.05);box-shadow:0 0 60px var(--glow-primary),inset 0 2px 10px #ffffff1a,0 15px 50px #0006}.record-btn:hover:not(:disabled):before{opacity:.8}.record-btn:active:not(:disabled){transform:scale(.98)}.record-btn:disabled{opacity:.5;cursor:not-allowed}.record-btn.recording{background:linear-gradient(145deg,#2a1a2a,#1a0a1a);color:var(--recording-light);box-shadow:0 0 60px var(--glow-recording),inset 0 2px 10px #ffffff0d,0 10px 40px #0000004d;animation:pulse-glow 1.5s ease-in-out infinite!important}.record-btn.recording:before{background:linear-gradient(135deg,var(--recording) 0%,var(--recording-dark) 100%);opacity:.7}@keyframes pulse-glow{0%,to{box-shadow:0 0 40px var(--glow-recording),inset 0 2px 10px #ffffff0d,0 10px 40px #0000004d}50%{box-shadow:0 0 80px var(--glow-recording),inset 0 2px 10px #ffffff1a,0 15px 50px #0006}}.record-btn.processing{background:linear-gradient(145deg,#2a1a2a,#1a0a1a);color:var(--accent);box-shadow:0 0 50px var(--glow-accent),inset 0 2px 10px #ffffff0d,0 10px 40px #0000004d;animation:none!important}.record-btn.processing:before{background:linear-gradient(135deg,var(--accent) 0%,#e879a9 100%);opacity:.6;animation:rotate-gradient 2s linear infinite;filter:blur(8px)}@keyframes rotate-gradient{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.record-btn.playing{background:linear-gradient(145deg,#0a2a1a,#0a1a0f);color:var(--success);box-shadow:0 0 50px var(--glow-success),inset 0 2px 10px #ffffff0d,0 10px 40px #0000004d}.record-btn.playing:before{background:linear-gradient(135deg,var(--success) 0%,#059669 100%);opacity:.6}.record-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.record-icon svg{width:100%;height:100%;fill:currentColor}.record-status{font-size:14px;color:var(--text-secondary);font-weight:500;min-height:20px;text-transform:uppercase;letter-spacing:1.5px}.wave-wrapper{height:60px;display:flex;align-items:center;justify-content:center}.wave-container{display:flex;align-items:center;justify-content:center;gap:6px;height:60px;padding:10px 0}.wave-bar{width:5px;background:var(--primary);border-radius:3px;transition:height .1s ease;box-shadow:0 0 10px var(--glow-primary)}.wave-bar.recording{background:var(--recording);box-shadow:0 0 15px var(--glow-recording)}.wave-bar.playing{background:var(--success);box-shadow:0 0 15px var(--glow-success);animation:wave-playing .5s ease-in-out infinite alternate}@keyframes wave-playing{0%{height:15px}to{height:40px}}.wave-bar:nth-child(1){animation-delay:0s}.wave-bar:nth-child(2){animation-delay:.1s}.wave-bar:nth-child(3){animation-delay:.2s}.wave-bar:nth-child(4){animation-delay:.3s}.wave-bar:nth-child(5){animation-delay:.4s}.wave-bar:nth-child(6){animation-delay:.3s}.wave-bar:nth-child(7){animation-delay:.2s}.wave-bar:nth-child(8){animation-delay:.1s}.wave-bar:nth-child(9){animation-delay:0s}.spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toggle-label{display:flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-label input{position:absolute;opacity:0;width:0;height:0}.toggle-slider{position:relative;width:48px;height:26px;background:var(--border);border-radius:13px;transition:background .3s}.toggle-slider:before{content:"";position:absolute;width:22px;height:22px;left:2px;top:2px;background:#fff;border-radius:50%;transition:transform .3s;box-shadow:0 2px 4px #0000004d}.toggle-label input:checked+.toggle-slider{background:var(--primary);box-shadow:0 0 15px var(--glow-primary)}.toggle-label input:checked+.toggle-slider:before{transform:translate(22px)}.toggle-text{font-size:14px;font-weight:500;color:var(--text)}.mode-tab{flex:1;padding:12px 16px;border:none;background:transparent;color:var(--text-muted);font-size:13px;font-weight:600;cursor:pointer;transition:all .3s ease;position:relative;text-transform:uppercase;letter-spacing:.5px}.mode-tab:first-child{border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.mode-tab:last-child{border-radius:0 var(--radius-sm) var(--radius-sm) 0}.mode-tab.active{color:#fff;text-shadow:0 0 10px currentColor}.mode-tab.active:before{content:"";position:absolute;inset:4px;background:linear-gradient(135deg,var(--primary) 0%,var(--accent) 100%);border-radius:8px;z-index:-1;box-shadow:0 0 25px var(--glow-primary)}.mode-tab:hover:not(.active){color:var(--text-secondary)}.toggle-section{display:flex;background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-sm);padding:4px;gap:0;width:100%}.mode-pills{display:flex;gap:8px;justify-content:center;margin:10px 0;width:100%}.mode-pill{flex:1;max-width:180px;padding:8px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-secondary);color:var(--text-muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:all .3s ease;position:relative}.mode-pill:hover:not(.active){background:var(--bg-card-solid);color:var(--text-secondary)}.mode-pill.active{color:#fff;border-color:transparent}.mode-pill.economy.active{background:linear-gradient(135deg,#0369a1,#0284c7);box-shadow:0 4px 15px #0369a166}.mode-pill.gpt-audio.active{background:linear-gradient(135deg,#dc2626,#ef4444);box-shadow:0 4px 15px #dc262666}.context-toggle{display:flex;align-items:center;justify-content:space-between;background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-sm);padding:12px 16px;width:100%}.context-toggle .toggle-label{display:flex;flex-direction:column;gap:2px;cursor:default}.context-toggle .toggle-text{font-size:14px;font-weight:500;color:var(--text)}.context-toggle .toggle-hint{font-size:12px;color:var(--text-muted)}.toggle-switch{position:relative;width:48px;height:26px;background:var(--border);border:none;border-radius:13px;cursor:pointer;transition:background .3s,box-shadow .3s;padding:0}.toggle-switch .toggle-slider{position:absolute;width:22px;height:22px;left:2px;top:2px;background:#fff;border-radius:50%;transition:transform .3s;box-shadow:0 2px 4px #0000004d}.toggle-switch.active{background:var(--primary);box-shadow:0 0 15px var(--glow-primary)}.toggle-switch.active .toggle-slider{transform:translate(22px)}.orbital-ring{position:absolute;border-radius:50%;border:2px solid transparent;pointer-events:none;opacity:0;transition:opacity .3s}.ring-1{inset:-15px;border-color:var(--primary);opacity:.15}.ring-2{inset:-30px;border-color:var(--primary-light);opacity:.1}.ring-3{inset:-45px;border-color:var(--accent);opacity:.05}.record-btn:hover .orbital-ring,.record-btn.recording .orbital-ring,.record-btn.connected .orbital-ring{opacity:1}.record-btn.recording .ring-1{border-color:var(--recording);animation:orbit-pulse 2s ease-in-out infinite}.record-btn.recording .ring-2{border-color:var(--recording-light);animation:orbit-pulse 2s ease-in-out infinite .3s}.record-btn.recording .ring-3{border-color:var(--recording-dark);animation:orbit-pulse 2s ease-in-out infinite .6s}.record-btn.playing .ring-1{border-color:var(--success);animation:orbit-spin 3s linear infinite}.record-btn.playing .ring-2{border-color:var(--success);animation:orbit-spin 4s linear infinite reverse}.record-btn.playing .ring-3{border-color:var(--success);animation:orbit-spin 5s linear infinite}@keyframes orbit-pulse{0%,to{transform:scale(1);opacity:.3}50%{transform:scale(1.1);opacity:.6}}@keyframes orbit-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes progress-ring-fill{0%{stroke-dashoffset:var(--ring-circumference, 377)}to{stroke-dashoffset:0}}.progress-ring circle{--ring-circumference: 377}.clear-btn{padding:12px 24px;border:1px solid var(--border);border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-size:14px;cursor:pointer;transition:all .2s}.clear-btn:hover{background:var(--bg-secondary);color:var(--text);border-color:var(--primary)}.speech-preview{background:linear-gradient(135deg,#8b5cf633,#f472b626);border:1px solid rgba(139,92,246,.4);border-radius:var(--radius);padding:16px 20px;animation:slideIn .3s ease;box-shadow:0 4px 20px #8b5cf633;transition:all .3s ease;width:100%}.speech-preview.processing{border-color:#f472b680;box-shadow:0 4px 25px #f472b640}.speech-preview.fading{animation:fadeOut .5s ease forwards}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes fadeOut{0%{opacity:1}to{opacity:.5}}.preview-header{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.preview-icon{font-size:16px;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.preview-label{font-size:12px;color:var(--primary-light);text-transform:uppercase;letter-spacing:1.5px;font-weight:600}.preview-timer{margin-left:auto;font-size:14px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}.preview-hint{font-size:11px;color:var(--text-muted);font-weight:400;text-transform:none;letter-spacing:0;margin-left:8px}.speech-preview.countdown{background:linear-gradient(135deg,#fbbf2433,#f472b626);border-color:#fbbf2466}.speech-preview.countdown .preview-icon{animation:pulse .5s ease-in-out infinite}.speech-preview.countdown .preview-label{color:#fbbf24}.preview-rec-dot{width:10px;height:10px;border-radius:50%;background:var(--recording);animation:pulse 1s ease-in-out infinite;flex-shrink:0}.preview-countdown-num{font-size:20px;font-weight:800;color:#fbbf24;font-variant-numeric:tabular-nums;min-width:20px;text-align:center}.preview-text{font-size:16px;color:var(--text);line-height:1.4;margin-top:8px;font-weight:400;opacity:.9;font-style:italic;transition:opacity .15s ease}.preview-skeleton{display:flex;flex-direction:column;gap:6px;margin-top:10px}.skeleton-line{height:12px;border-radius:6px;background:linear-gradient(90deg,#8b5cf61a,#8b5cf640,#8b5cf61a);background-size:200% 100%;animation:skeleton-wave 1.5s ease-in-out infinite}.skeleton-line-1{width:100%}.skeleton-line-2{width:85%}.skeleton-line-3{width:60%}@keyframes skeleton-wave{0%{background-position:200% 0}to{background-position:-200% 0}}.no-speech-hint{background:#fbbf2426;border:1px solid rgba(251,191,36,.4);color:#fbbf24;padding:12px 16px;border-radius:var(--radius-sm);font-size:14px;text-align:center;width:100%}.no-speech-hint.with-retry{display:flex;align-items:center;justify-content:center;gap:12px;animation:fadeIn .2s ease}.hint-retry-btn{background:#fbbf244d;border:1px solid rgba(251,191,36,.5);color:#fbbf24;padding:6px 12px;border-radius:var(--radius-sm);font-size:13px;font-weight:500;cursor:pointer;transition:background .2s}.hint-retry-btn:hover{background:#fbbf2480}.hint-dismiss-btn{background:transparent;border:none;color:#fbbf24b3;padding:4px 8px;font-size:14px;cursor:pointer;transition:color .2s}.hint-dismiss-btn:hover{color:#fbbf24}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInOut{0%{opacity:0;transform:translateY(-5px)}15%{opacity:1;transform:translateY(0)}85%{opacity:1}to{opacity:0}}.error-container{display:flex;flex-direction:column;gap:12px;width:100%}.error-message{background:#ef44441a;color:var(--error);padding:12px 16px;border-radius:var(--radius-sm);font-size:14px;text-align:center;border:1px solid rgba(239,68,68,.3)}.error-actions{display:flex;gap:10px;justify-content:center}.retry-btn{padding:10px 20px;border:none;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 4px 15px var(--glow-primary)}.retry-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px var(--glow-primary)}.dismiss-btn{padding:10px 16px;border:1px solid var(--border);border-radius:var(--radius-sm);background:transparent;color:var(--text-muted);font-size:14px;cursor:pointer;transition:all .2s}.dismiss-btn:hover{background:var(--bg-secondary);color:var(--text)}.offline-banner{background:#ef444426;border:1px solid rgba(239,68,68,.4);color:var(--error);padding:10px 16px;border-radius:var(--radius-sm);font-size:14px;text-align:center;width:100%;animation:fadeIn .2s ease}@media(max-width:360px){.record-btn{width:100px;height:100px}.record-icon{width:40px;height:40px}}