.M-FlipCard{display:inline-block;position:relative;width:64px;height:80px;line-height:80px;border-radius:5px;background-color:var(--text-border-3);font-size:78px;color:var(--text-1);box-shadow:1.63px 1.63px 0 0 var(--text-4);text-align:center;font-family:HarmonyOS Sans SC;font-weight:700}.M-FlipCard .digital:after,.M-FlipCard .digital:before{content:"";position:absolute;left:0;right:0;background-color:var(--text-border-3);overflow:hidden;box-sizing:border-box}.M-FlipCard .digital:before{top:0;bottom:50%;border-radius:10px 10px 0 0;border-bottom:1px solid var(--bg-card-bg)}.M-FlipCard .digital:after{top:50%;bottom:0;border-radius:0 0 10px 10px;line-height:0}.M-FlipCard.down .front:before{z-index:3}.M-FlipCard.down .back:after{z-index:2;transform-origin:50% 0;transform:perspective(160px) rotateX(180deg)}.M-FlipCard.down .back:before,.M-FlipCard.down .front:after{z-index:1}.M-FlipCard.down.go .front:before{transform-origin:50% 100%;animation:frontFlipDown .6s ease-in-out both;box-shadow:0 -2px 6px hsla(0,0%,100%,.3);backface-visibility:hidden}.M-FlipCard.down.go .back:after{animation:backFlipDown .6s ease-in-out both}.M-FlipCard.up .front:after{z-index:3}.M-FlipCard.up .back:before{z-index:2;transform-origin:50% 100%;transform:perspective(160px) rotateX(-180deg)}.M-FlipCard.up .back:after,.M-FlipCard.up .front:before{z-index:1}.M-FlipCard.up.go .front:after{transform-origin:50% 0;animation:frontFlipUp .6s ease-in-out both;box-shadow:0 2px 6px hsla(0,0%,100%,.3);backface-visibility:hidden}.M-FlipCard.up.go .back:before{animation:backFlipUp .6s ease-in-out both}@keyframes frontFlipDown{0%{transform:perspective(160px) rotateX(0deg)}to{transform:perspective(160px) rotateX(-180deg)}}@keyframes backFlipDown{0%{transform:perspective(160px) rotateX(180deg)}to{transform:perspective(160px) rotateX(0deg)}}@keyframes frontFlipUp{0%{transform:perspective(160px) rotateX(0deg)}to{transform:perspective(160px) rotateX(180deg)}}@keyframes backFlipUp{0%{transform:perspective(160px) rotateX(-180deg)}to{transform:perspective(160px) rotateX(0deg)}}.M-FlipCard .number0:after,.M-FlipCard .number0:before{content:"0"}.M-FlipCard .number1:after,.M-FlipCard .number1:before{content:"1"}.M-FlipCard .number2:after,.M-FlipCard .number2:before{content:"2"}.M-FlipCard .number3:after,.M-FlipCard .number3:before{content:"3"}.M-FlipCard .number4:after,.M-FlipCard .number4:before{content:"4"}.M-FlipCard .number5:after,.M-FlipCard .number5:before{content:"5"}.M-FlipCard .number6:after,.M-FlipCard .number6:before{content:"6"}.M-FlipCard .number7:after,.M-FlipCard .number7:before{content:"7"}.M-FlipCard .number8:after,.M-FlipCard .number8:before{content:"8"}.M-FlipCard .number9:after,.M-FlipCard .number9:before{content:"9"}