videoPlayer.css

#videoPlayerVideoMask {
    background-color: #ffffff80;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    transition: all 0.5s;
}

.darkmode--activated #videoPlayerVideoMask {
    background-color: #00000080;
}

#videoPlayerVideoMask[active="false"] {
    backdrop-filter: blur(0);
    pointer-events: none;
    opacity: 0;
}

#videoPlayerVideoMask[active="true"] {
    backdrop-filter: blur(8px);
    pointer-events: initial;
    opacity: 1;
}

#videoPlayerVideo {
    border-radius: 4px;
    box-shadow: 0px 0px 64px #00000080;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 95%;
    max-height: 95%;
    transition: all 0.5s;
}

#videoPlayerVideo[show="false"] {
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(0.8);
}

#videoPlayerVideo[show="true"] {
    opacity: 1;
    pointer-events: initial;
    transform: translate(-50%, -50%) scale(1);
}