body,html{background:#385cff}.client-screen{height:100svh;width:100vw;overflow:hidden}.client-screen .section-indicators{position:absolute;top:2rem;left:2rem;right:2rem;height:.25rem;display:flex;gap:.25rem;z-index:2}.client-screen .section-indicators button{flex-grow:1;background:#fff3;border:none;border-radius:2rem;transition:.4s ease}.client-screen .section-indicators button.active{background:#fff}.client-screen .screens{display:flex;background-image:url(../../../assets/background.svg);background-size:cover;background-position:center center;width:fit-content;transition:.4s ease}.client-screen .screens .screen{height:100svh;width:100vw;flex-shrink:0;display:flex;flex-direction:column}.client-screen .screens .screen .header{flex-grow:1;display:flex;flex-direction:column;justify-content:center;gap:.5rem;padding:4.25rem 2rem 2rem;color:#fff}.client-screen .screens .screen .header .small-chip{background:#fff;color:#000;padding:.5rem .75rem;font-size:.875rem;border-radius:4rem;width:fit-content}.client-screen .screens .screen .header h2{font-size:2rem;margin:0}.client-screen .screens .screen .header.landing-header{align-items:center;text-align:center}.client-screen .screens .screen .content,.client-screen .screens .screen .audio-recorder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;background:#fff;padding:2rem;min-height:10rem}.client-screen .screens .screen .content .subtitle{text-align:center;font-size:.875rem;opacity:.8}.client-screen .screens .screen .content .button{width:100%}.client-screen .screens .screen .recording-controls{display:flex;gap:1rem;align-items:center}.client-screen .screens .screen .recording-controls button{background:#000;color:#fff;aspect-ratio:1/1;border:none;border-radius:50%;flex-shrink:0;display:grid;place-items:center;width:3rem;height:3rem;transition:.2s ease}.client-screen .screens .screen .recording-controls button.primary-recorder{width:5rem;height:5rem;position:relative}.client-screen .screens .screen .recording-controls button.primary-recorder:after{content:"";width:12px;height:12px;border:2.5px solid #fb2c36;background:#fff;border-radius:1rem;position:absolute;top:0;right:0;pointer-events:none;transition:.2s ease;transform:scale(0)}.client-screen .screens .screen .recording-controls button.primary-recorder.indicator:after{transform:scale(1)}.client-screen .screens .screen .recording-controls button.primary-recorder.recording:after{background:#fb2c36;animation-name:flash;animation-duration:1s;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes flash{0%{background:#fb2c36}25%{background:#fff}75%{background:#fff}to{background:#fb2c36}}.client-screen .screens .screen .recording-controls button:disabled{opacity:.75}.client-screen .screens .screen .recording-controls button:not(:disabled):active{opacity:.9}