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