*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:#fafafa;color:#1e293b}.container{max-width:600px;margin:0 auto;padding:1rem}.card{background:#fff;border-radius:16px;padding:1.5rem;margin-bottom:1rem;box-shadow:0 1px 3px #0000001a}h1{font-size:1.5rem;margin-bottom:.5rem;color:#1e293b}h2{font-size:1.25rem;margin-bottom:1rem;color:#334155}p{color:#64748b;margin-bottom:1rem;line-height:1.6}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.btn-primary{background:#6366f1;color:#fff}.btn-primary:hover{background:#4f46e5}.btn-primary:disabled{background:#c7d2fe;cursor:not-allowed}.btn-secondary{background:#f1f5f9;color:#475569}.btn-secondary:hover{background:#e2e8f0}.btn-danger{background:#fee2e2;color:#dc2626}.input{width:100%;padding:.75rem 1rem;border:2px solid #e2e8f0;border-radius:12px;font-size:1rem;transition:border-color .2s}.input:focus{outline:none;border-color:#6366f1}.flex{display:flex}.flex-col{flex-direction:column}.gap-1{gap:.5rem}.gap-2{gap:1rem}.gap-3{gap:1.5rem}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.text-center{text-align:center}.text-sm{font-size:.875rem}.text-gray{color:#64748b}.record-btn{width:80px;height:80px;border-radius:50%;border:4px solid #6366f1;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s;margin:1rem auto}.record-btn:hover{transform:scale(1.05);box-shadow:0 4px 12px #6366f14d}.record-btn.recording{background:#ef4444;border-color:#dc2626;animation:pulse 1s infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.record-icon{width:32px;height:32px;background:#ef4444;border-radius:50%}.record-btn.recording .record-icon{background:#fff;border-radius:4px;width:24px;height:24px}.waveform{display:flex;align-items:center;justify-content:center;gap:3px;height:40px;margin:1rem 0}.waveform-bar{width:4px;background:#6366f1;border-radius:2px;animation:wave 1s ease-in-out infinite}.waveform-bar:nth-child(1){animation-delay:0s;height:20px}.waveform-bar:nth-child(2){animation-delay:.1s;height:30px}.waveform-bar:nth-child(3){animation-delay:.2s;height:25px}.waveform-bar:nth-child(4){animation-delay:.3s;height:35px}.waveform-bar:nth-child(5){animation-delay:.4s;height:20px}.waveform-bar:nth-child(6){animation-delay:.5s;height:30px}.waveform-bar:nth-child(7){animation-delay:.6s;height:25px}.waveform-bar:nth-child(8){animation-delay:.7s;height:35px}@keyframes wave{0%,to{transform:scaleY(1)}50%{transform:scaleY(.5)}}.message-list{display:flex;flex-direction:column;gap:1rem;max-height:400px;overflow-y:auto;padding:1rem 0}.message{padding:1rem;border-radius:16px;max-width:85%}.message.user{background:#6366f1;color:#fff;margin-left:auto;border-bottom-right-radius:4px}.message.assistant{background:#f1f5f9;color:#1e293b;border-bottom-left-radius:4px}.audio-player{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:#f1f5f9;border-radius:12px;margin-top:.5rem}.play-btn{width:40px;height:40px;border-radius:50%;background:#6366f1;border:none;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center}.voice-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}.voice-card{background:#fff;border-radius:16px;padding:1rem;text-align:center;box-shadow:0 1px 3px #0000001a;cursor:pointer;transition:all .2s;border:2px solid transparent}.voice-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.voice-card.selected{border-color:#6366f1;background:#eef2ff}.voice-emoji{font-size:2rem;margin-bottom:.5rem}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;color:#64748b}.spinner{width:32px;height:32px;border:3px solid #e2e8f0;border-top-color:#6366f1;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:.5rem}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;bottom:2rem;left:50%;transform:translate(-50%);padding:.75rem 1.5rem;background:#1e293b;color:#fff;border-radius:12px;font-size:.875rem;z-index:1000;animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translate(-50%) translateY(100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.progress-bar{width:100%;height:6px;background:#e2e8f0;border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:#6366f1;transition:width .3s}