:root{--vh:1vh}body{background-color:#0000;margin:0;padding:0}#app{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#fff;height:100vh;height:calc(var(--vh,1vh) * 100);justify-content:center;align-items:center;width:100vw;font-family:Arial,sans-serif;display:flex}.content-container{width:1920px;height:1080px;position:relative;overflow:hidden}.content-wrapper{flex-direction:column;width:100%;height:100%;display:flex;position:absolute}.user-info{z-index:10;flex-direction:column;align-items:center;display:flex;position:absolute;top:20px;left:20px}.user-avatar{border:4px solid #0f0;border-radius:50%;width:80px;height:80px;box-shadow:0 0 10px #00ff00b3}.user-name{color:#fff;text-shadow:2px 2px 4px #000c;background-color:#00000080;border-radius:15px;margin-top:5px;padding:5px 10px;font-size:24px;font-weight:700}.content-center{flex-grow:1;justify-content:center;align-items:center;padding:20px;display:flex}.content-center.fullscreen{padding:0}.fullscreen img,.fullscreen video{object-fit:contain;width:100%;height:100%}.text-content,.image-content,.video-content{max-width:100%;max-height:100%}.text-content p{text-align:center;background-color:#00000080;border-radius:15px;padding:20px;font-size:48px;line-height:1.4}.description-container{justify-content:center;padding:0 20px;display:flex;position:absolute;bottom:30px;left:0;right:0}.description{text-shadow:2px 2px 4px #000c;text-align:center;background-color:#00000080;border-radius:15px;max-width:80%;padding:10px 20px;font-size:36px;font-style:italic;font-weight:700}.top-left{top:0;left:0;transform:translate(0)}.top-right{top:0;right:0;transform:translate(0)}.bottom-left{bottom:0;left:0;transform:translate(0)}.bottom-right{bottom:0;right:0;transform:translate(0)}.center{top:50%;left:50%;transform:translate(-50%,-50%)}.top-left .content-center,.top-right .content-center,.bottom-left .content-center,.bottom-right .content-center{width:50%;height:50%;position:absolute}.top-left .content-center{top:0;left:0}.top-right .content-center{top:0;right:0}.bottom-left .content-center{bottom:0;left:0}.bottom-right .content-center{bottom:0;right:0}.text-content{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.top-left .text-content,.top-right .text-content,.bottom-left .text-content,.bottom-right .text-content{justify-content:flex-start;align-items:flex-start;padding:20px}.top-right .text-content,.bottom-right .text-content{text-align:right}.bottom-left .text-content,.bottom-right .text-content{align-items:flex-end}.center .text-content{text-align:center}.text-content p{background-color:#00000080;border-radius:5px;margin:0;padding:10px}.top-left-with-user{top:20px!important;left:120px!important}.top-left .content-center.top-left-with-user{width:calc(50% - 120px)}.full-video{object-fit:contain;width:100%;height:100%;position:absolute;top:0;left:0}.video-content{width:100%;height:100%;position:relative}.content-wrapper.fullscreen{z-index:1000;width:100%;height:100%;position:fixed;top:0;left:0}.content-center.fullscreen,.image-content.fullscreen,.video-content.fullscreen{width:100%;height:100%;padding:0;position:fixed;top:0;left:0}.fullscreen.top-left,.fullscreen.top-right,.fullscreen.bottom-left,.fullscreen.bottom-right,.fullscreen.center{inset:0;transform:none}