html,body{overflow: hidden;margin:0;padding:0;top:0;position:relative;background:black;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background:black;}
#wrapper{width:100%;height:177.78dvw;max-width:1080px;height:auto;position:relative;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
#wrapper video{width:100%;height:177.78dvw;position:relative;z-index:2;}
#wrapper .ab{position:absolute;width:100%;height:177.78dvw;left:0;top:0;z-index:3;}
#wrapper canvas{width:100%;height:178.08dvw;position:absolute;left:0;top:0;z-index:4;}

@media (min-aspect-ratio: 9/16) {
    #wrapper{height:100dvh;max-height:1920px;width:auto;}
    #wrapper video{width:auto;height:100dvh;width:56.25dvh;}
    #wrapper .ab{width:auto;height:100dvh;width:56.25dvh;}
    #wrapper canvas{width:auto;height:100dvh;width:56.65dvh;}
    
}