.card-container{perspective:1000px}.card{width:200px;height:300px;background-color:#fff;box-shadow:0 2px 4px rgba(0,0,0,.1);transition:all .3s ease}.card:hover{transform:rotateY(180deg)}.note{max-width:500px;margin:0 auto;text-align:center}.note textarea{width:100%}.card-content{padding:16px;color:#333}.card textarea{border:1px solid #eee;padding:5px}.note .ant-btn-primary{width:100px;height:100px;border-radius:50%}.asr-text{position:fixed;left:10px;top:10px;background-color:#ffffff3e;color:#fff}.audio-recorder-pad{width:100%;text-align:center}.audio-recorder-pad .ant-btn{margin:10px}.audio-recorder-pad .ant-btn-primary{width:100px;height:100px;border-radius:50%}.audio-recorder-pad .ant-btn-primary.paused{background-color:#006400}.audio-recorder-pad .ant-btn-primary.recording{background-color:brown}.stop-btn{padding:10px;position:absolute;right:50px}