@import"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap";@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200";.loginPage{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;background:linear-gradient(to bottom,#ccd0cf,#9ba8ab,#4a5c6a,#11212d,#06141b)}.loginBox{margin:0;width:400px;max-width:90%;padding:100px 20px;display:flex;align-items:center;justify-content:center;flex-direction:column;border:2px solid #fff;border-radius:10px;background:#ffffff1a}.loginTitle{font-size:30px;font-weight:700;color:#fff;margin:20px}.loginInputBox{width:100%;height:40px;display:flex;align-items:center;justify-content:center;background:#ffffff4d;border-radius:5px}.loginInput{padding:5px 10px;width:100%;height:100%;outline:none;border:none;font-size:16px;background:#0000;border-radius:5px;color:#fff}.loginInput::placeholder{color:#ddd}.emailInputBox,.passwordInputBox{margin:5px 0}.passwordInputIconBox{margin:0 10px 0 0;display:flex;align-items:center;justify-content:center;color:#fff}.passwordInputIconBox:hover{cursor:pointer}.loginButtonPrimary{width:100%;height:40px;background:#000;display:flex;align-items:center;justify-content:center;border-radius:5px;color:#fff;font-weight:700;text-align:center;transition:transform .2s}.loginButtonSecondary{width:100%;height:40px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:5px;color:#000;font-weight:700;text-align:center;transition:transform .2s}.loginButtonTertiary{height:40px;display:flex;align-items:center;justify-content:center;font-weight:700;text-align:center;transition:transform .2s;color:#fff}.loginButtonPrimary:hover,.loginButtonSecondary:hover,.loginButtonTertiary:hover{cursor:pointer}.loginButtonPrimary:active,.loginButtonSecondary:active,.loginButtonTertiary:active{transform:scale(.9)}.loginButton,.createAccountButton,.forgotPasswordButton,.loginWithGoogleButton{margin:2px 0}.loginButton{margin-top:5px}.profilePage{width:100%;height:100%;display:flex;align-items:center;flex-direction:column;overflow-y:auto;background:linear-gradient(to bottom,#ccd0cf,#9ba8ab,#4a5c6a,#11212d,#06141b)}.profileBox{margin:0;width:500px;max-width:95%;padding:50px 20px;display:flex;align-items:center;flex-direction:column}.profileAvatarBox{width:150px;height:150px;border:5px solid #fff;border-radius:50%}.profileAvatar{width:100%;height:100%;border-radius:50%}.profileName{margin:10px 0 0;font-size:24px;font-weight:700;color:#fff}.profileUsername{margin:0 0 10px;font-size:20px;color:#fff}.profileInfoBox{margin:10px 0;width:100%;display:flex;align-items:center;flex-direction:column;border-radius:20px;background:#fff}.profileStatBox{margin:10px 0 0;width:100%;display:grid;grid-template-columns:1fr 1fr 1fr}.profileSignersBox,.profileUploadBox,.profileSigningBox{display:flex;align-items:center;flex-direction:column;flex-grow:1;color:#000}.profileSignersBox{border-right:2px solid #000}.profileSigningBox{border-left:2px solid #000}.profileSignersCount,.profileUploadCount,.profileSigningCount{font-size:24px;font-weight:700}.profileSignersText,.profileUploadText,.profileSigningText{font-size:14px;color:#444}.profileVinxign{margin:10px 0;font-size:20px;font-weight:700;color:#ff407f}.profileBio{margin:0 0 10px;font-size:16px;color:#000}.profileUserUploadBox{margin:10px 0;width:100%;display:flex;align-items:center;flex-direction:column;border-radius:20px;background:#fff}.profileUserUploadNav{margin:5px;width:100%;height:30px;display:grid;grid-template-columns:1fr 1fr 1fr}.profileUserUploadNavPosts,.profileUserUploadNavCuts,.profileUserUploadNavVinxign{margin:10px;display:flex;align-items:center;justify-content:center;font-size:18px;flex-grow:1;font-weight:700;color:#000;border-bottom:2px solid #6969AF}.profileUserUploadsBox{margin:10px;padding:10px;width:100%;height:300px;display:grid;grid-template-columns:1fr 1fr 1fr;align-content:start;align-items:center;justify-content:center;overflow-y:auto}.profileUserUpload{margin:5px;width:90%;height:100px;border:2px solid black;border-radius:5px;background:#000}.profileUserUploadThumbnail{width:100%;height:100%;border-radius:5px;object-fit:contain}.editProfilePage{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow-y:auto;background:linear-gradient(to bottom,#ccd0cf,#9ba8ab,#4a5c6a,#11212d,#06141b)}.editProfileBox{padding:60px 0;margin:20px 0;width:500px;max-width:90%;display:flex;align-items:center;flex-direction:column;border:2px solid #fff;border-radius:10px;background:#ffffff1a}.editProfileAvatarBox{margin:0 0 10px;width:150px;height:150px;border:5px solid #fff;border-radius:50%}.editProfileAvatar{width:100%;height:100%;border-radius:50%}.editProfileInputBox{margin:5px 0;width:90%;height:40px;color:#fff;display:flex;align-items:center;justify-content:center;background:#ffffff4d;border-radius:5px}.editProfileInput{padding:5px 10px;width:100%;height:100%;outline:none;border:none;font-size:16px;background:#0000;color:#fff}.editProfileInput::placeholder{color:#ddd}.editProfileProfileGenderInputBox{padding:0 10px 0 0}.editProfileButtonPrimary{width:90%;height:40px;background:#000;display:flex;align-items:center;justify-content:center;border-radius:5px;color:#fff;font-weight:700;text-align:center;transition:transform .2s}.editProfileButtonPrimary:hover{cursor:pointer}.editProfileButtonPrimary:active{transform:scale(.9)}.editProfileUploadButton{margin:0 0 30px}.editProfileSaveButton{margin:30px 0 0}.videosPage{width:100%;height:100%;display:flex;align-items:center;flex-direction:column;overflow-y:auto}.videosBox{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:80px 0;margin:20px 0;width:500px;max-width:90%}.video{padding:5px 0;width:600px;max-width:90%;display:flex;flex-direction:column}.videoBox{width:100%;margin:10px 0;background:#d9d9d9;border-radius:10px;display:flex;align-items:center;flex-direction:column}.videoThumbnailBox{position:relative;display:flex;align-items:center;justify-content:center;width:100%;background:#000;border-radius:10px 10px 0 0;object-fit:contain}.videoThumbnail{width:100%;aspect-ratio:16 / 9;border-radius:10px 10px 0 0}.videoDuration{padding:5px 10px;position:absolute;top:10px;right:10px;background:#fff;border-radius:10px;font-weight:700}.videoDetailBox{display:flex;align-items:center;flex-direction:row;width:100%;padding:10px 0;flex-grow:1}.videoDetailIconBox{margin:0 10px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:#000;border-radius:50%;object-fit:contain}.videoDetailIcon{width:100%;height:100%;border-radius:50%}.videoDetailTitle{font-weight:700}.videoDetailExtra{margin:0 10px 0 auto;display:flex;align-items:center;justify-content:center}.videoViews{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:10px;font-weight:700}.videoShareButton{margin:0 10px;width:30px;height:30px;background:#6969af;border-radius:10px}.videoDots{display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:#fff;border-radius:10px;font-weight:700}.videoCaption{padding:0 10px}.cutsPage{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow-y:hidden}.cutsBox{width:500px;max-width:100%;height:100%;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none}.cut{margin:10px 0;width:100%;height:100%;scroll-snap-align:start;display:flex;align-items:center;justify-content:center;background:linear-gradient(#000,#f05)}.xocialPage{width:100%;height:100%;display:flex;align-items:center;flex-direction:column;overflow-y:auto}.xocialBox{width:500px;max-width:90%;padding:100px 0;display:flex;align-items:center;justify-content:center;flex-direction:column}.xocial{margin:5px 0 0;padding:10px 0;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;border-radius:10px}.xocialPost{padding:10px 0;width:95%;background:#d9d9d9;border-radius:20px;display:flex;align-items:center;justify-content:center;flex-direction:column}.xocialHeader{width:100%;display:flex;align-items:center;padding:0 10px}.xocialHeaderIconBox{margin:10px 5px;width:30px;height:30px}.xocialHeaderIcon{width:100%;height:100%;border-radius:50%}.xocialHeaderDots{margin:0 5px 0 auto;width:30px;height:30px;display:flex;align-items:center;justify-content:center}.xocialPostIcon{width:100%;height:100%;border-radius:5px}.xocialHeaderTitle{font-weight:700}.xocialPostThumbnailBox{margin:10px 0;position:relative;display:flex;align-items:center;justify-content:center;width:100%;object-fit:contain}.xocialPostThumbnail{width:100%;height:auto}.xocialPostButtons{padding:10px;width:100%;display:flex;align-items:center}.xocialPostLikeButton{margin:-5px 0 0 10px;width:30px;height:30px;display:flex;align-items:center;justify-content:center}.xocialPostCommentButton{margin:0 0 0 10px;width:30px;height:30px;display:flex;align-items:center;justify-content:center}.xocialPostDescription{width:90%;padding:10px 20px;display:flex;align-items:center;flex-direction:row}.xocialPostBody{width:90%;padding:10px;display:flex;align-items:center;flex-direction:row}.videoPlayerPage{width:100%;height:100%;display:flex;align-items:center;flex-direction:column;overflow-y:auto}.videoPlayerBox{display:flex;align-items:center;justify-content:center;flex-direction:column;width:600px;max-width:100%}.videoPlayerVideoBox{width:100%;aspect-ratio:2 / 1;background:#000}.videoPlayerVideoTitleBox{padding:10px;width:100%;display:flex;align-items:center}.videoPlayerDetailBox{width:100%;height:50px;display:flex;align-items:center;justify-content:center;flex-direction:row}.videoPlayerDetailLeft{width:50%;height:100%;display:flex;align-items:center;flex-direction:row}.videoPlayerAvatarBox{margin:0 10px;width:40px;height:40px;border-radius:50%;background:#000}.videoPlayerNameBox{display:flex;justify-content:center;flex-direction:column}.videoPlayerName{font-size:18px;font-weight:700}.videoPlayerCount{font-size:12px}.videoPlayerBoxDetailRight{width:50%;height:100%;display:flex;align-items:center}.videoPlayerButtonPrimary{height:40px;background:#000;display:flex;align-items:center;justify-content:center;border-radius:5px;color:#fff;font-weight:700;text-align:center;transition:transform .2s}.videoPlayerButtonSecondary{width:100%;height:40px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:20px;color:#000;font-weight:700;text-align:center;transition:transform .2s;border:2px solid #000}.videoPlayerButtonPrimary:hover,.videoPlayerButtonSecondary:hover{cursor:pointer}.videoPlayerButtonPrimary:active,.videoPlayerButtonSecondary:active{transform:scale(.9)}.videoPlayerBoxSignButton{margin:0 10px 0 auto;width:50%;background:#000}.videoPlayerButtons{padding:20px;width:100%;display:flex;align-items:center;flex-direction:row}.videoPlayerDetailButton{margin:0 5px 0 0;width:30px;height:30px}.videoPlayerButtonCount{margin:0 10px 0 0;font-size:12px;font-weight:700}.videoPlayerCommentsBox{width:90%;border:2px solid #000;border-radius:10px;padding:10px;display:flex;align-items:center;justify-content:center;flex-direction:column}.videoPlayerCommentsTitleBox{width:100%;display:flex;align-items:center;flex-direction:row}.videoPlayerCommentsTitle{margin:0 0 0 10px;font-size:20px}.videoPlayerExpandButton{margin:0 10px 0 auto;width:30px;height:30px}.videoPlayerAddCommentButton{margin:30px 0 10px;width:200px;max-width:90%}.createPostPage{width:100%;height:100%;display:flex;align-items:center;flex-direction:column;overflow-y:auto;background:linear-gradient(to bottom,#ccd0cf,#9ba8ab,#4a5c6a,#11212d,#06141b)}.createPostBox{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:80px 0;margin:20px 0;width:500px;max-width:90%}.createPostUploadBox{padding:20px;width:500px;max-width:90%;background:#fff;margin:10px 0;border-radius:20px;display:flex;align-items:center;justify-content:center;flex-direction:column}.createPostUploadButton{width:100px;height:100px;display:flex;align-items:center;justify-content:center;border:2px solid #000;border-radius:20px;transition:transform .1s}.createPostPreview{padding:10px;margin:20px 0 0;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:row}.createPostPreviewImageBox{width:50px;height:50px;background:#000;object-fit:contain;border-radius:20px}.createPostPreviewImage{width:100%;height:100%;border-radius:20px}.createPostPreviewImageTitle{margin:0 5px;font-size:14px;display:flex;align-items:center;justify-content:center}.createPostUploadButton:hover{cursor:pointer}.createPostUploadButton:active{transform:scale(.9)}.createPostDescriptionBox,.createPostBodyBox{padding:25px;width:500px;max-width:90%;background:#fff;margin:10px 0;border-radius:20px}.createPostUploadFinalButton{margin:20px 0;width:90%;height:40px;background:#000;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;text-align:center;transition:transform .2s;border-radius:20px;border:2px solid #fff}.createPostUploadFinalButton:hover{cursor:pointer}.createPostUploadFinalButton:active{transform:scale(.9)}.createPostDescriptionTitle{width:100%;margin:0 0 10px;font-size:20px;display:flex;align-items:center;flex-direction:row;font-weight:700}.createPostDescriptionInputBox{margin:0 0 10px;width:100%;height:150px;display:flex;align-items:center;justify-content:center}.createPostDescriptionInput{padding:10px 20px;width:100%;height:100%;resize:none;border:2px solid #000;border-radius:20px;outline:none}.createPostBodyTitle{width:100%;margin:0 0 10px;font-size:20px;display:flex;align-items:center;flex-direction:row;font-weight:700}.createPostBodyInputBox{margin:0 0 10px;width:100%;height:150px;display:flex;align-items:center;justify-content:center}.createPostBodyInput{padding:10px 20px;width:100%;height:100%;resize:none;border:2px solid #000;border-radius:20px;outline:none}.topBar{position:fixed;top:20px;left:50%;width:90%;max-width:500px;height:60px;background:#4a5c6a;border-radius:20px;transform:translate(-50%);color:#fff;display:flex;align-items:center;flex-direction:row}.topBarTitle{margin:0 30px;font-size:24px;font-weight:700;display:flex;align-items:center;justify-content:center}.bottomBar{position:fixed;bottom:20px;left:50%;width:90%;max-width:500px;height:60px;background:#4a5c6a;border-radius:20px;transform:translate(-50%);display:grid;align-items:center;grid-template-columns:1fr 1fr 1fr 1fr 1fr;color:#fff}.bottomBarButton{text-decoration:none;color:inherit;display:flex;align-items:center;justify-content:center;transition:transform .1s}.bottomBarButton:hover{cursor:pointer}.bottomBarButton:active{transform:scale(.8)}.bottomBarCreateButtonBox{position:relative}.bottomBarCreateButton{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.bottomBarCreateButton:active{transform:scale(.8) translate(-60%,-60%)}.bottomBarMenu{margin:0 0 20px;position:absolute;bottom:50%;left:50%;width:400px;max-width:80vw;background:#fff;border:2px solid #000;border-radius:20px;transform:translate(-50%);display:flex;align-items:center;flex-direction:column;padding:20px}.bottomBarMenuCreate{text-decoration:none;color:inherit;width:100%;border:2px solid #000;border-radius:20px;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:10px 20px;margin:10px 0;transition:transform .1s}.bottomBarMenuCreate:hover{cursor:pointer}.bottomBarMenuCreate:active{transform:scale(.9)}.bottomBarMenuCreateTitle{color:#6969af;font-size:20px;width:100%;display:flex;align-items:center;flex-direction:row}.bottomBarMenuCreateDescription{color:#000;width:100%;display:flex;align-items:center;flex-direction:row}*{font-family:Nunito;-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing:border-box}.material-symbols-outlined{font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}.app{position:fixed;top:0;left:0;width:100%;height:100%;background:#fff;-webkit-user-select:none;user-select:none}
