.recording-card{border-radius:28px;background:#f8fafc;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;width:100%}.controls{display:flex;gap:16px}.control-btn{width:64px;height:64px;border-radius:50%;border:none;font-size:22px;cursor:pointer;display:flex;align-items:center;justify-content:center}.control-btn.play{background:#3b82f6;color:#fff}.control-btn.stop{background:#e5e7eb;color:#1f2937}.recording-text{font-size:20px;font-weight:600;color:#1e293b;margin-bottom:0}.asr-sidebar label span{color:#32ade6;font-size:13px}.asr-sidebar label svg{width:16px;height:16px;color:#32ade6}.asr-main-content{flex:1;gap:20px;background-color:#f8fafc;border-radius:16px;padding:24px;display:flex;flex-direction:column;height:330px;overflow:hidden}.upload-container{display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed #bfdbfe;border-radius:16px;background-color:#fff;padding:40px;cursor:pointer;height:100%;width:100%;min-height:220px;transition:all .2s ease}.upload-container:hover{background-color:#f0f9ff;border-color:#0ea5e9}.upload-input{display:none}.upload-icon-wrapper{width:48px;height:48px;border-radius:50%;background-color:#f0f9ff;display:flex;align-items:center;justify-content:center;margin-bottom:16px}.upload-title{font-size:16px;font-weight:600;color:#0f172a;margin-bottom:8px;margin-top:0}.upload-subtitle{font-size:14px;color:#94a3b8;margin:0}.convert-btn{margin-top:16px;height:36px;padding:0 20px;border-radius:999px;border:none;background:var(--blue-color);color:#fff;font-weight:500;font-size:13px;cursor:pointer}.convert-btn:disabled{background:#93c5fd;cursor:not-allowed}.success-text{margin-top:12px;font-weight:600;color:#16a34a}.uploaded-card{width:100%;background:#f8fafc;border-radius:20px;position:relative;height:100%}.uploaded-left{gap:14px}.file-icon,.uploaded-left{display:flex;align-items:center}.file-icon{width:44px;height:44px;border-radius:10px;background:#eef2ff;justify-content:center;position:relative;color:#3b82f6}.file-ext{position:absolute;bottom:-6px;font-size:10px;background:var(--blue-color);color:#fff;padding:2px 6px;border-radius:6px}.file-info{display:flex;flex-direction:column;gap:4px}.file-name{font-weight:600;color:#0f172a}.file-meta{font-size:14px;color:#64748b}.remove-btn{position:absolute;top:19%;right:16px;width:32px;height:32px;border-radius:50%;border:none;background:#fff;cursor:pointer;color:#0f172a}.progress-bar{margin-top:16px;height:6px;background:#e5e7eb;border-radius:999px;overflow:hidden}.progress-bar span{display:block;width:100%;height:100%;background:var(--blue-color)}.asr-final-screen{display:flex;align-items:center;justify-content:center;padding:16px}.asr-final-container{width:100%;max-width:640px;font-family:Inter,system-ui,sans-serif}.asr-final-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.asr-final-lang-left{display:flex;align-items:center;gap:12px}.asr-final-icon-circle{width:40px;height:40px;background:linear-gradient(135deg,#60a5fa,#2563eb);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.asr-final-title{color:#fff;font-family:Poppins,sans-serif;font-size:24px}.asr-final-lang-btn{background:#fff;border:none;border-radius:999px;padding:8px 16px;display:flex;align-items:center;gap:8px;cursor:pointer}.asr-final-waveform{height:80px;display:flex;align-items:flex-end;gap:4px;background:hsla(0,0%,100%,.05);border-radius:24px 24px 0 0;padding:24px 12px 0}.asr-final-wave-bar{flex:1;background:linear-gradient(0deg,#60a5fa,#93c5fd);border-radius:4px 4px 0 0}.asr-final-card{background:#fff;border-radius:0 0 24px 24px;box-shadow:0 25px 50px rgba(0,0,0,.25);overflow:hidden}.asr-final-controls{padding:24px;background:linear-gradient(90deg,#eff6ff,#f8fafc);border-bottom:1px solid #e5e7eb}.asr-final-play-btn{display:flex;align-items:center;gap:12px;background:transparent;border:none;cursor:pointer}.asr-final-play-circle{width:48px;height:48px;background:linear-gradient(135deg,#60a5fa,#2563eb);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.asr-final-content{padding:64px 32px;text-align:center}.asr-final-content p{font-size:20px;line-height:1.6}.asr-final-content strong{color:#020617}.asr-final-content span{color:#94a3b8}.asr-final-footer-text{margin-top:32px;text-align:center;font-size:14px;color:#64748b}.dn_lst_container{display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed #bfdbfe;border-radius:16px;background-color:#fff;padding:10px;height:100%;width:100%;transition:all .2s ease;overflow:hidden}.dn_lst_optz{display:flex}.recording-result,.upload-wrapper{width:100%;height:100%}.recording-result{display:flex;flex-direction:column;gap:16px}.recording-result-player{display:flex;align-items:center;gap:16px}.recording-play-btn{display:flex;align-items:center;width:88px;gap:8px;padding:6px 14px;border-radius:999px;border:none;background:var(--blue-color,#0ea5e9);color:#fff;font-weight:500;font-size:13px;cursor:pointer;transition:all .2s ease}.recording-play-btn:hover{background:#0284c7}.recording-waveform{display:flex;align-items:center;gap:2px;flex:1;height:40px}.recording-waveform-bar{width:3px;border-radius:2px;background-color:#bfdbfe;transition:background-color .2s ease}.recording-waveform-bar.playing{background-color:#32ade6;animation:recordingWaveAnimate .5s ease-in-out infinite alternate}@keyframes recordingWaveAnimate{0%{transform:scaleY(.8)}to{transform:scaleY(1.2)}}.recording-transcription{flex:1;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:20px;overflow-y:auto;min-height:150px}.recording-transcription-text{font-size:15px;line-height:1.7;color:#475569;margin:0}