*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--tg-theme-bg-color, #fff);color:var(--tg-theme-text-color, #000)}.app{display:flex;flex-direction:column;height:100vh;max-width:600px;margin:0 auto}header{padding:20px;text-align:center;background:var(--tg-theme-secondary-bg-color, #f0f0f0);border-bottom:1px solid var(--tg-theme-hint-color, #ccc)}header h1{font-size:24px;margin-bottom:5px}header p{font-size:14px;opacity:.7}.tabs{display:flex;background:var(--tg-theme-secondary-bg-color, #f0f0f0);border-bottom:1px solid var(--tg-theme-hint-color, #ccc)}.tabs button{flex:1;padding:15px;border:none;background:none;color:var(--tg-theme-text-color, #000);font-size:16px;cursor:pointer;border-bottom:3px solid transparent}.tabs button.active{border-bottom-color:var(--tg-theme-button-color, #3390ec);font-weight:600}.content{flex:1;overflow:hidden;display:flex;flex-direction:column}.chat-container{display:flex;flex-direction:column;height:100%}.messages{flex:1;overflow-y:auto;padding:20px}.message{margin-bottom:15px;display:flex}.message.user{justify-content:flex-end}.message-content{max-width:80%;padding:12px 16px;border-radius:18px;word-wrap:break-word}.message.user .message-content{background:var(--tg-theme-button-color, #3390ec);color:var(--tg-theme-button-text-color, #fff)}.message.assistant .message-content{background:var(--tg-theme-secondary-bg-color, #f0f0f0);color:var(--tg-theme-text-color, #000)}.message-content.typing{font-style:italic;opacity:.7}.input-area{padding:15px;background:var(--tg-theme-bg-color, #fff);border-top:1px solid var(--tg-theme-hint-color, #ccc);display:flex;gap:10px}.input-area textarea{flex:1;padding:10px;border:1px solid var(--tg-theme-hint-color, #ccc);border-radius:20px;resize:none;font-size:16px;font-family:inherit;background:var(--tg-theme-bg-color, #fff);color:var(--tg-theme-text-color, #000)}.input-area button{width:50px;height:50px;border:none;border-radius:25px;background:var(--tg-theme-button-color, #3390ec);color:var(--tg-theme-button-text-color, #fff);font-size:20px;cursor:pointer}.input-area button:disabled{opacity:.5;cursor:not-allowed}.voice-chat{padding:20px;text-align:center}.voice-chat h2{margin-bottom:30px}.record-button-container{margin:40px 0}.record-button{padding:20px 40px;font-size:18px;border:none;border-radius:30px;background:var(--tg-theme-button-color, #3390ec);color:var(--tg-theme-button-text-color, #fff);cursor:pointer;box-shadow:0 4px 12px #00000026;transition:all .3s}.record-button.recording{background:#ff3b30;animation:pulse 1.5s infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.response-box{margin-top:30px;padding:20px;background:var(--tg-theme-secondary-bg-color, #f0f0f0);border-radius:12px;text-align:left}.response-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.response-box h3{margin:0;font-size:16px}.replay-button{padding:8px 12px;background:var(--tg-theme-button-color, #3390ec);color:var(--tg-theme-button-text-color, #fff);border:none;border-radius:8px;font-size:14px;cursor:pointer;transition:opacity .2s}.replay-button:hover:not(:disabled){opacity:.8}.replay-button:disabled{opacity:.5;cursor:not-allowed}.response-box p{line-height:1.6}.livekit-voice{display:flex;flex-direction:column;height:100%}.livekit-voice h2{margin-bottom:20px}.voice-assistant{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}.status-indicator{font-size:24px;font-weight:600;margin-bottom:30px;text-align:center;min-height:40px}.visualizer-container{width:100%;max-width:300px;height:150px;margin:20px 0;display:flex;align-items:center;justify-content:center;background:var(--tg-theme-secondary-bg-color, #f0f0f0);border-radius:12px;padding:20px}.audio-visualizer{width:100%;height:100%}.help-text{font-size:14px;opacity:.7;text-align:center;margin-top:20px;min-height:40px}.controls{padding:20px;display:flex;justify-content:center}.disconnect-button{padding:12px 30px;font-size:16px;border:none;border-radius:24px;background:#ff3b30;color:#fff;cursor:pointer;box-shadow:0 4px 12px #ff3b304d;transition:all .3s}.disconnect-button:hover{background:#d32f2f;box-shadow:0 6px 16px #ff3b3066}.info-text{padding:20px;text-align:center;font-size:13px;opacity:.6;border-top:1px solid var(--tg-theme-hint-color, #ccc)}.info-text p{margin:5px 0}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:20px}.loading-container p{font-size:18px}.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:15px;padding:20px}.error-container p{font-size:18px;text-align:center}.error-message{font-size:14px!important;color:#ff3b30;padding:10px;background:#ff3b301a;border-radius:8px;max-width:90%}.error-container button{padding:12px 30px;font-size:16px;border:none;border-radius:24px;background:var(--tg-theme-button-color, #3390ec);color:var(--tg-theme-button-text-color, #fff);cursor:pointer;box-shadow:0 4px 12px #00000026;transition:all .3s}.error-container button:hover{opacity:.9}