#flutter_target {
    border: 1px solid #aaa;
    width: 80vw;
    height: 60vh;
    border-radius: 0px;
    transition: all 150ms ease-in;
    align-self: center;
}
#flutter_target.resize {
    width: 480px;
    height: 320px;
}
#flutter_target.spin {
    animation: spin 6400ms ease-in-out infinite;
}
#flutter_target.shadow {
    position: relative;
}
#flutter_target.shadow::before {
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    top: calc(100% - 1px);
    left: 0;
    height: 1px;
    background-color: black;
    border-radius: 50%;
    z-index: -1;
    transform: rotateX(80deg);
    box-shadow: 0px 0px 60px 38px rgb(0 0 0 / 25%);
}
#flutter_target.mirror {
    -webkit-box-reflect: below 0px
        linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
}

@keyframes spin {
    0% {
        transform: perspective(1000px) rotateY(0deg);
        animation-timing-function: ease-in;
    }
    15% {
        transform: perspective(1000px) rotateY(165deg);
        animation-timing-function: linear;
    }
    75% {
        transform: perspective(1000px) rotateY(195deg);
        animation-timing-function: linear;
    }
    90% {
        transform: perspective(1000px) rotateY(359deg);
        animation-timing-function: ease-out;
    }
    100% {
        transform: perspective(1000px) rotateY(359deg);
        animation-timing-function: linear;
    }
}
