.startCover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: crosshair;
    z-index: 2147483647;
}

.startCoverLogo {
    pointer-events: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -75%);
    transform-origin: center 85%;
    width: 400px;
    height: 400px;
    opacity: 1;
    pointer-events: none;
    transition: all .5s cubic-bezier(0.19, 0.93, 0.58, 1);
    z-index: 2147483648;
}

.startCoverTitle {
    pointer-events: none;
    text-shadow: 0 0 5px #ffffff99;
    white-space: nowrap;
    position: absolute;
    text-align: center;
    font-size: 40px;
    top: 50%;
    left: 50%;
    color: #dedede;
    opacity: 0;
    transform: translate(-50%, calc(0.75 * 50px));
    transform-origin: center center;
    pointer-events: none;
    transition: all .5s cubic-bezier(0.19, 0.93, 0.58, 1);
    z-index: 2147483648;
    animation: startCoverTitle-appear .5s cubic-bezier(0.19, 0.93, 0.58, 1) .1s forwards;
}

.startCoverTitle span {
    font-family: 'He Yin';
}

@keyframes startCoverTitle-appear {
    0% {
        opacity: 0;
        letter-spacing: 0;
        margin-left: 0;
    }

    100% {
        opacity: 1;
        letter-spacing: 6px;
        margin-left: 3px;
        /* 出于视觉平衡的考量 */
    }
}

@keyframes startCoverTitle-disappear {
    0% {
        opacity: 1;
        letter-spacing: 6px;
        margin-left: 3px;
        filter: blur(0);
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 0;
        letter-spacing: 10px;
        margin-left: 5px;
        filter: blur(4px);
    }
}



@keyframes startCover-disappear {
    0% {
        backdrop-filter: blur(200px);
        opacity: 1;
    }

    /* 25% {
        opacity: 1;
    } */

    100% {
        backdrop-filter: blur(200px);
        /* backdrop-filter: blur(0px); */
        opacity: 0;
    }
}

/* 用固定的模糊有问题,边角和动画中的模糊不一样(固定的模糊边缘是有颜色的,但动画的模糊边缘一律黑色) */
@keyframes startCover-display {
    0% {
        backdrop-filter: blur(200px);
        opacity: 1;
    }

    100% {
        backdrop-filter: blur(200px);
        opacity: 1;
    }
}