@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";.otp-form{display:flex;flex-direction:column;gap:16px}.input-group{display:flex;flex-direction:column;gap:10px}.otp-input{padding:16px 20px;font-family:Plus Jakarta Sans,monospace;font-size:1.75rem;font-weight:700;letter-spacing:10px;text-align:center;color:var(--secondary);background:var(--primary-dark);border:2px solid var(--border);border-radius:14px;transition:all .3s ease;width:100%}.otp-input::placeholder{color:var(--text-muted);letter-spacing:10px}.otp-input:focus{outline:none;border-color:var(--secondary);background:var(--primary-dark);box-shadow:0 0 0 4px #29d9d526}.otp-input:disabled{opacity:.6;cursor:not-allowed}.submit-button{padding:14px 24px;font-family:Plus Jakarta Sans,sans-serif;font-size:.95rem;font-weight:700;color:var(--primary);background:linear-gradient(135deg,#29d9d5,#5be5e2 30%,#9dc88d 70%,#e8c547);border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:10px;position:relative;overflow:hidden;width:100%}.submit-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.submit-button:hover:not(:disabled):before{left:100%}.submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 30px #29d9d566}.submit-button:active:not(:disabled){transform:translateY(0)}.submit-button:disabled{opacity:.5;cursor:not-allowed}.error-message{padding:12px 16px;background:#ef444426;color:#f87171;border:1px solid rgba(239,68,68,.3);border-radius:10px;font-size:.85rem;font-weight:500;text-align:center;display:flex;align-items:center;justify-content:center;gap:8px}.error-message:before{content:"⚠"}@media (min-width: 768px){.otp-form{gap:20px}.otp-input{padding:20px 24px;font-size:2rem;letter-spacing:12px;border-radius:16px}.otp-input::placeholder{letter-spacing:12px}.submit-button{padding:16px 28px;font-size:1rem;border-radius:14px}.error-message{padding:14px 18px;font-size:.875rem;border-radius:12px}}.audio-player{padding:0;background:var(--primary-dark);border-radius:14px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border:1px solid var(--border);height:25vw;min-height:120px;max-height:200px}.audio-player:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at center,rgba(41,217,213,.08) 0%,transparent 70%);pointer-events:none}.audio-player.active{filter:drop-shadow(0 0 20px rgba(41,217,213,.3))}.lottie-animation{width:100%!important;height:100%!important;position:absolute;top:0;left:0;right:0;bottom:0}.lottie-animation svg{width:100%!important;height:100%!important;transform:scale(2.5) translateY(-10%)}.lottie-animation>div{width:100%!important;height:100%!important}.idle-wave{width:100%;height:100%;display:flex;align-items:center;justify-content:center;opacity:.5}.idle-wave-svg{width:80%;height:60px;animation:idle-wave-float 3s ease-in-out infinite}@keyframes idle-wave-float{0%,to{transform:translateY(0);opacity:.3}50%{transform:translateY(-5px);opacity:.5}}@media (min-width: 768px){.audio-player{border-radius:16px;height:20vw;min-height:140px;max-height:220px}.idle-wave-svg{height:80px}}@media (min-width: 1024px){.audio-player{height:15vw;min-height:160px;max-height:250px}.idle-wave-svg{height:100px}}.audio-listener{display:flex;flex-direction:column;gap:16px}.status-section{padding:14px 16px;background:var(--primary-dark);border-radius:12px;border:1px solid var(--border)}.status-indicator{display:flex;align-items:center;gap:10px}.status-dot{width:10px;height:10px;border-radius:50%;background:var(--text-muted);flex-shrink:0}.status-dot.connecting,.status-dot.joining{background:var(--warning);animation:pulse 1.5s ease-in-out infinite}.status-dot.connected{background:var(--secondary)}.status-dot.waiting{background:var(--secondary);animation:pulse 2s ease-in-out infinite}.status-dot.listening{background:var(--success);box-shadow:0 0 12px #22c55e80;animation:pulse 1s ease-in-out infinite}.status-dot.ended{background:var(--warning)}.status-dot.disconnected,.status-dot.error{background:var(--error)}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.15)}}.status-text{font-weight:600;font-size:.875rem;color:var(--text-primary)}.playback-controls{display:flex;flex-direction:column;gap:14px;padding:16px;background:var(--surface-light);border-radius:14px;border:1px solid var(--border)}.play-pause-button{width:100%;padding:14px 20px;font-family:Plus Jakarta Sans,sans-serif;font-size:.95rem;font-weight:700;border:none;border-radius:10px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:8px}.play-pause-button.playing{background:var(--primary-dark);color:var(--text-primary);border:1px solid var(--border)}.play-pause-button.playing:hover{background:var(--primary);border-color:var(--secondary)}.play-pause-button.paused{background:linear-gradient(135deg,#29d9d5,#5be5e2 30%,#9dc88d 70%,#e8c547);color:var(--primary);box-shadow:0 4px 16px #29d9d54d}.play-pause-button.paused:hover{transform:translateY(-2px);box-shadow:0 8px 24px #29d9d566}.volume-control{display:flex;align-items:center;gap:10px;padding:6px 0}.volume-icon{font-size:1rem;width:24px;text-align:center}.volume-slider{flex:1;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--primary-dark);border-radius:3px;outline:none;cursor:pointer}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:var(--secondary);border-radius:50%;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #29d9d566}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.volume-value{font-size:.8rem;font-weight:600;color:var(--text-secondary);min-width:38px;text-align:right}.controls{display:flex;gap:10px}.reconnect-button{flex:1;padding:12px 16px;font-family:Plus Jakarta Sans,sans-serif;font-size:.85rem;font-weight:700;color:var(--primary);background:linear-gradient(135deg,#29d9d5,#5be5e2 30%,#9dc88d 70%,#e8c547);border:none;border-radius:10px;cursor:pointer;transition:all .3s ease}.reconnect-button:hover{transform:translateY(-2px);box-shadow:0 8px 24px #29d9d566}.disconnect-button{flex:1;padding:12px 16px;font-family:Plus Jakarta Sans,sans-serif;font-size:.85rem;font-weight:600;color:var(--text-secondary);background:var(--primary-dark);border:1px solid var(--border);border-radius:10px;cursor:pointer;transition:all .3s ease}.disconnect-button:hover{background:#ef444426;border-color:#ef44444d;color:#f87171}@media (min-width: 768px){.audio-listener{gap:20px}.status-section{padding:16px 20px;border-radius:14px}.status-text{font-size:.9rem}.playback-controls{gap:16px;padding:20px;border-radius:16px}.play-pause-button{padding:16px 24px;font-size:1rem;border-radius:12px}.volume-slider::-webkit-slider-thumb{width:18px;height:18px}.controls{gap:12px}.reconnect-button,.disconnect-button{padding:14px 20px;font-size:.9rem;border-radius:12px}}.animation-preview{padding:20px;max-width:500px;margin:0 auto}.animation-preview h2{text-align:center;color:var(--text-primary);margin-bottom:24px}.preview-card{background:#fff;border-radius:16px;padding:20px;margin-bottom:20px;box-shadow:0 4px 12px #00000014}.preview-card h3{font-size:.9rem;color:var(--text-secondary);margin-bottom:16px}.animation-container{height:100px;border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden}.animation-container.dark{background:var(--primary)}.equalizer{display:flex;align-items:flex-end;gap:6px;height:60px}.eq-bar{width:8px;background:linear-gradient(to top,var(--secondary),var(--secondary-light));border-radius:4px;animation:eq-bounce 1s ease-in-out infinite}.eq-bar:nth-child(1){animation-delay:0s;height:20px}.eq-bar:nth-child(2){animation-delay:.1s;height:35px}.eq-bar:nth-child(3){animation-delay:.2s;height:50px}.eq-bar:nth-child(4){animation-delay:.3s;height:40px}.eq-bar:nth-child(5){animation-delay:.4s;height:55px}.eq-bar:nth-child(6){animation-delay:.5s;height:30px}.eq-bar:nth-child(7){animation-delay:.6s;height:45px}@keyframes eq-bounce{0%,to{transform:scaleY(.3)}50%{transform:scaleY(1)}}.pulse-circles{position:relative;width:80px;height:80px;display:flex;align-items:center;justify-content:center}.pulse-circle{position:absolute;border:2px solid var(--secondary);border-radius:50%;animation:pulse-expand 2s ease-out infinite}.pulse-circle:nth-child(1){animation-delay:0s}.pulse-circle:nth-child(2){animation-delay:.6s}.pulse-circle:nth-child(3){animation-delay:1.2s}.pulse-icon{font-size:28px;z-index:1}@keyframes pulse-expand{0%{width:30px;height:30px;opacity:1}to{width:100px;height:100px;opacity:0}}.ecg-container{width:100%;height:100%;overflow:hidden;padding:0 20px}.ecg-line{width:200%;height:100%;animation:ecg-scroll 2s linear infinite}.ecg-path{stroke-dasharray:1000;stroke-dashoffset:1000;animation:ecg-draw 2s linear infinite}@keyframes ecg-scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}@keyframes ecg-draw{to{stroke-dashoffset:0}}.sound-waves{position:relative;width:100%;height:60px;display:flex;align-items:center;justify-content:center}.wave{position:absolute;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(41,217,213,.3) 25%,rgba(41,217,213,.5) 50%,rgba(41,217,213,.3) 75%,transparent 100%);border-radius:50%;animation:wave-flow 2s ease-in-out infinite}.wave1{animation-delay:0s}.wave2{animation-delay:.3s;opacity:.7}.wave3{animation-delay:.6s;opacity:.4}@keyframes wave-flow{0%,to{transform:scaleX(.8) scaleY(.5);opacity:.3}50%{transform:scaleX(1) scaleY(1);opacity:1}}.breathing-circle{position:relative;display:flex;align-items:center;justify-content:center}.breath-ring{width:70px;height:70px;border:3px solid var(--secondary);border-radius:50%;animation:breathe 3s ease-in-out infinite;box-shadow:0 0 20px #29d9d54d}.breath-icon{position:absolute;font-size:24px}@keyframes breathe{0%,to{transform:scale(.8);opacity:.5;box-shadow:0 0 10px #29d9d533}50%{transform:scale(1.2);opacity:1;box-shadow:0 0 30px #29d9d580}}.audio-dots{display:flex;align-items:center;gap:8px}.dot{width:12px;height:12px;background:var(--secondary);border-radius:50%;animation:dot-bounce 1.2s ease-in-out infinite}.dot:nth-child(1){animation-delay:0s}.dot:nth-child(2){animation-delay:.1s}.dot:nth-child(3){animation-delay:.2s}.dot:nth-child(4){animation-delay:.3s}.dot:nth-child(5){animation-delay:.4s}@keyframes dot-bounce{0%,to{transform:scale(.5);opacity:.4}50%{transform:scale(1.3);opacity:1}}.app{width:100%;max-width:100%}.container{background:var(--surface);border-radius:20px;padding:24px 20px;box-shadow:0 4px 6px #0003,0 20px 40px #0000004d;border:1px solid var(--border);width:100%}.header{text-align:center;margin-bottom:24px}.logo-container{display:flex;justify-content:center;margin-bottom:12px}.logo-image{width:64px;height:64px;object-fit:contain;border-radius:14px}.brand-text{display:flex;justify-content:center;align-items:baseline;gap:2px;margin-bottom:12px}.brand-fifth{font-size:1.1rem;font-weight:500;color:#9dc88d;font-family:Georgia,Times New Roman,serif;position:relative;top:-2px}.brand-ventricle{font-size:1.6rem;font-weight:700;color:var(--secondary);font-family:Georgia,Times New Roman,serif}.title{font-size:1.25rem;font-weight:800;color:var(--text-primary);margin-bottom:4px;line-height:1.3}.subtitle{font-size:.85rem;color:var(--text-secondary);font-weight:500}.instructions{font-size:.85rem;color:var(--text-secondary);text-align:center;line-height:1.6;margin-bottom:24px}@media (min-width: 768px){.app{max-width:480px}.container{padding:40px 36px;border-radius:24px}.header{margin-bottom:32px}.logo-image{width:80px;height:80px}.brand-fifth{font-size:1.3rem}.brand-ventricle{font-size:1.8rem}.title{font-size:1.5rem}.subtitle{font-size:.9rem}.instructions{font-size:.875rem;margin-bottom:28px}}@media (min-width: 1024px){.app{max-width:520px}.container{padding:48px 44px}.logo-image{width:90px;height:90px}.brand-fifth{font-size:1.5rem}.brand-ventricle{font-size:2rem}.title{font-size:1.75rem}}:root{--primary: #2C3137;--primary-dark: #1a1d21;--primary-light: #3d444b;--secondary: #29D9D5;--secondary-light: #5BE5E2;--secondary-dark: #1FB8B5;--background: #1a1d21;--surface: #2C3137;--surface-light: #363c44;--text-primary: #FFFFFF;--text-secondary: #9CA3AF;--text-muted: #6B7280;--error: #EF4444;--success: #22C55E;--warning: #F59E0B;--border: rgba(255, 255, 255, .08)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Plus Jakarta Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--background);min-height:100vh;color:var(--text-primary)}#root{width:100%;min-height:100vh;display:flex;justify-content:center;align-items:center;padding:16px}body:before{content:"";position:fixed;top:0;left:0;right:0;height:60vh;background:radial-gradient(ellipse at top,rgba(41,217,213,.12) 0%,transparent 60%);pointer-events:none;z-index:-1}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--primary-dark)}::-webkit-scrollbar-thumb{background:var(--secondary);border-radius:3px}@media (min-width: 768px){#root{padding:40px}}