:root{--color-blue: #134c70;--color-whiteText: #e0dedb;--color-blackText: #242425;--color-dropDownColor: #a3a3a3;--color-dropDownColorTint: #929292;--color-dropDownColorLight: #b6b6b6;--color-errorBox: rgba(200, 40, 40, .6);--color-errorButtonColor: white}body{background-color:var(--color-whiteText)}html,body{height:100%;margin:0;overflow:hidden}.blueFrame{background-color:var(--color-blue);border-radius:2em;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center}.tempRed{background-color:red;border-radius:25px}.resultFrames{display:flex;flex-direction:row;margin:0 0 40px}.resultBox{max-width:clamp(220px,75vw,300px);max-height:clamp(220px,75vw,400px);width:auto;height:auto;border-radius:1.5em;object-fit:cover}.errorBox{position:fixed;top:40px;left:50%;transform:translate(-50%);width:clamp(320px,60vw,300px);padding:18px 28px;background:#c8282899;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:1.5em;display:flex;justify-content:center;align-items:center;animation:errorAppear .3s ease;z-index:4000}.errorButton{position:absolute;right:20px;top:50%;transform:translateY(-50%);background:none;border:none;color:#fff;font-size:22px;cursor:pointer;opacity:.8;transition:opacity .2s ease}.errorButton:hover{opacity:1}.errorText{color:#fff;font-weight:600;font-size:17px;text-align:center;letter-spacing:.5px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.dropBox{width:clamp(250px,90vw,700px);height:clamp(250px,90vw,400px);aspect-ratio:5 / 3;position:relative;overflow:hidden;margin:0 auto}.dropBox:before{content:"";position:absolute;inset:13px;border:6px dashed var(--color-whiteText);border-radius:1.5em;pointer-events:none}.dropBox.errorTilt:after{background:#ffffff21}.dropBox:after{content:"";position:absolute;inset:17px;background:#ffffff14;border-radius:1.5em;pointer-events:none;transition:background .3s ease}.dropBox.active:after{content:"";position:absolute;inset:0;background:#ffffff40;border-radius:inherit}.dropBox.dragActive:after{content:"";position:absolute;inset:0;background:#ffffff40;border-radius:inherit;pointer-events:none}.centerButton{width:clamp(150px,80vw,500px);height:clamp(20px,60vw,80px);aspect-ratio:6 / 1;margin:15px auto 0}.againButton{width:clamp(150px,80vw,300px);height:clamp(20px,60vw,80px);aspect-ratio:6 / 1;margin:15px auto 0}.mainBlock{min-height:100vh;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center}.dropText,.buttonText{color:var(--color-whiteText)}.dropText,.buttonText,.resultText,.dropDownInnerTextTitle,.dropDownInnerTextMain,.historyInnerTextTitle,.blockHistoryTitleText{font-family:Modak,cursive;letter-spacing:1px}.dropText{font-size:clamp(18px,6vw,30px)}.clearButtonOutside{position:absolute;top:calc(50% - 290px);right:calc(50% - 400px);width:28px;height:28px;border-radius:50%;border:none;background:#0006;color:#fff;font-size:18px;cursor:pointer;z-index:10}.buttonText{font-size:clamp(20px,10vw,50px)}.resultText{font-size:clamp(20px,10vw,55px);color:var(--color-blackText)}.resultWordBox{width:90%;display:flex;flex-direction:column;justify-content:center;align-items:center}.imageInput{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.whatButton{position:absolute;inset:0;opacity:0;cursor:pointer}.previewImage{max-width:80%;max-height:80%;border-radius:1.5em;transform:rotate(-10deg);object-fit:cover}.header{position:fixed;top:0;left:0;width:100%;z-index:2000}.googleLoginWrapper{position:absolute;top:20px;right:20px;z-index:1000}@keyframes tiltError{0%{transform:rotate(0)}15%{transform:rotate(-1.5deg)}35%{transform:rotate(1.5deg)}50%{transform:rotate(-1deg)}to{transform:rotate(0)}}.errorTilt{animation:tiltError .5s ease}.loader{width:50px;height:50px;border:5px solid rgba(19,76,112,.2);border-top:5px solid var(--color-blue);border-radius:50%;display:flex;justify-content:center;align-items:center;margin:20px auto;animation:spin .8s linear infinite}.loader.historyLoader{border-top:5px solid var(--color-dropDownColor);position:relative;top:20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes errorAppear{0%{opacity:0;transform:translate(-50%,-20px)}to{opacity:1;transform:translate(-50%)}}.btnAnimated{transition:transform .25s ease,box-shadow .15s ease;cursor:pointer}.btnAnimated:hover{transform:scale(1.03)}.btnAnimated:active{transform:scale(.97)}.resultBoxAnimated{transition:transform .25s ease;transform:rotate(var(--rot))}.resultBoxAnimated:hover{transform:rotate(var(--rot)) scale(1.05)}.resultBoxAnimated2{transition:transform .25s ease;transform:rotate(var(--rot))}.resultBoxAnimated2:hover{transform:rotate(var(--rot)) scale(1.05)}.dropBoxFull{position:fixed;top:50px;right:50px}.menuButton{position:relative;top:15px;right:-247px;width:42px;height:42px;border-radius:50%;border:2px solid var(--color-dropDownColor);display:flex;align-items:center;justify-content:center;cursor:pointer;background:transparent;z-index:3000}.menuButton.menuOpen{background:var(--color-dropDownColorLight);right:-247px;border:none}.menuButton.menuOpen.menuHistory{right:0;top:0;width:60px;height:60px}.menuButton.menuOpen.blockClose{background:var(--color-dropDownColorTint);right:10px;top:10px;width:35px;height:35px;position:absolute}.menuIconText{font-size:55px;color:var(--color-dropDownColor);line-height:1px}.menuButton.menuOpen .menuIconText{font-size:35px;color:var(--color-dropDownColor)}.menuIconText.historyIconText{font-size:50px!important}.menuIconText.blockCloseText{font-size:28px!important;color:var(--color-dropDownColorLight)!important}.dropdownBox{position:relative;top:-42px;right:0;width:270px;padding:15px;background:var(--color-dropDownColor);border-radius:22px;display:flex;flex-direction:column;gap:15px;align-items:center;z-index:1900;opacity:1;transform-origin:top right;animation:dropdownShow .2s ease forwards}.dropdownBox.open{animation:dropdownShow .2s ease forwards}.dropdownBox.closed{animation:dropdownHide .15s ease forwards;pointer-events:none}@keyframes dropdownShow{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes dropdownHide{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.7)}}.dropDownInnerBoxTitle{position:relative;top:0;right:28px;width:223px;height:42px;display:flex;align-items:center;justify-content:center;background:var(--color-dropDownColorLight);border-radius:1.2em}.dropDownInnerTextTitle{font-size:35px;color:var(--color-whiteText);line-height:1px;position:relative;top:2px}.dropDownInnerBoxMain{position:relative;top:0;right:0;width:278px;height:42px;display:flex;align-items:center;justify-content:center;background:var(--color-dropDownColorLight);border:none;border-radius:1.2em}.dropDownInnerTextMain{position:relative;right:15px;top:2px;font-size:35px;color:var(--color-whiteText);line-height:1px}.OAuthFrame{position:relative;top:0;right:40px;width:32px;height:32px;border-radius:50%;background-color:var(--color-whiteText);display:flex;align-items:center;justify-content:center}.OAuthIconGoogle{width:23px;height:23px;object-fit:contain}.googleWrapper{position:relative}.googleWrapper>div{position:absolute;inset:0;opacity:0;cursor:pointer}.historyFull{width:clamp(220px,60vw,900px);height:clamp(220px,60vh,500px);border-radius:1.5em;background-color:var(--color-dropDownColor);position:relative;display:flex;flex-direction:column;padding:20px;transform:scale(.8);opacity:0;transition:all .15s ease}.historyFull.open{transform:scale(1);opacity:1}.historyFull.close{transform:scale(.8);opacity:0}.historyFull.done{transform:none}.historyHeader{position:relative;display:flex;align-items:center;justify-content:space-between}.historyInnerBoxTitle{position:relative;top:0;right:0;width:clamp(220px,50vw,450px);height:60px;display:flex;align-items:center;justify-content:center;background:var(--color-dropDownColorLight);border-radius:1.2em}.historyInnerTextTitle{font-size:50px;color:var(--color-whiteText);line-height:1px;position:relative;top:2px}.historyBlock{width:clamp(50px,180vw,180px);height:clamp(50px,180vh,180px);border-radius:1.5em;background-color:var(--color-dropDownColorLight);position:relative;top:15px;display:flex;flex-direction:column;transform:scale(.8);opacity:0;animation:blockAppear .25s ease forwards}@keyframes blockAppear{to{transform:scale(1);opacity:1}}.historyBlock:before{content:"";position:absolute;inset:-2px;border:6px dashed var(--color-whiteText);border-radius:1.5em;pointer-events:none}.historyBlock.deleteMenu:after{content:"";position:absolute;inset:-2px;background:#ffffff80;border-radius:inherit;pointer-events:none}.blockHistoryTitleText{font-size:clamp(20px,35vw,35px);color:var(--color-blackText);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.blockHistoryTitleFrame{position:absolute;bottom:10px;left:50%;transform:translate(-50%);padding:0 10px;width:80%;height:45px;display:flex;align-items:center;justify-content:center;background:var(--color-dropDownColor);border-radius:1.2em}.deleteFull{position:absolute;inset:-2px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#cccccca8;border-radius:inherit;z-index:3001}.deleteWindowButtonsFrames{width:80px;height:45px;display:flex;align-items:center;justify-content:center;background:var(--color-dropDownColor);border-radius:1.2em}.blockHistoryTitleText.deleteWindow{text-align:center;color:var(--color-blackText)}.deleteFrame{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px;margin-top:10px}.historyBlockImages{display:flex;flex-direction:row;justify-content:center}.historyBlockImg{max-width:clamp(30px,30vw,80px);max-height:clamp(40px,40vw,100px);position:relative;top:15px;width:auto;height:auto;border-radius:1.5em;object-fit:cover}.historyBlockImg.left{rotate:-8deg}.historyBlockImg.right{rotate:8deg}.historyContent{margin:15px 0 0;height:76%;position:relative;background-color:var(--color-dropDownColorTint);border-radius:1.2em;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px;padding:10px 20px 40px;overflow-y:auto;scrollbar-width:none}.customScrollbar{position:absolute;top:120px;bottom:45px;right:32px;width:8px;background:#ffffff9f;border-radius:10px;z-index:10}.scrollBar{width:100%;height:80px;background:var(--color-dropDownColorLight);border-radius:10px}.historyResultPreviewAll{position:fixed;inset:0;background:#0006;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:3005;pointer-events:all}.backQuestions{position:fixed;top:-50px;width:200%;height:200%;display:grid;grid-template-columns:repeat(20,1fr);gap:20px;pointer-events:none;z-index:0;overflow:hidden}.tempQuestionWraper{display:grid;grid-template-columns:repeat(20,1fr);gap:20px}.backQuestionsText{font-family:Modak,cursive;font-size:150px;color:#c2c0bd75;display:flex;justify-content:center;align-items:center;--y: 0px;--r: 0deg;transform:translate(0px,var(--y) rotate(var(--r)));animation:rotateQuestions linear infinite;animation-fill-mode:backwards}@keyframes rotateQuestions{0%{transform:translateY(var(--y, 0px)) rotate(calc(var(--r)));opacity:1}25%{transform:translate(50px,calc(var(--y, 0px) - 50px)) rotate(calc(var(--r) - 90deg))}50%{transform:translateY(calc(var(--y, 0px) - 100px)) rotate(calc(var(--r) - 180deg));opacity:.5}75%{transform:translate(50px,calc(var(--y, 0px) - 50px)) rotate(calc(var(--r) - 270deg))}to{transform:translateY(var(--y, 0px)) rotate(calc(var(--r) - 360deg));opacity:1}}.backQuestionsText:nth-child(odd){--y: 200px}@media(max-width:768px){.centerContentBlock{position:relative}.clearButtonOutside{z-index:3000;top:30px;right:30px}.dropBoxFull{top:calc(env(safe-area-inset-top) + 30px);right:10px}.historyFull{width:90vw;height:60vh;padding:10px}.historyContent{width:94%;height:75%;left:0;right:0;padding:10px;justify-items:center;grid-template-columns:1fr}.historyBlock{width:clamp(70px,250vw,250px);height:clamp(70px,250vh,250px)}.historyBlockImg{max-width:clamp(110px,30vw,80px);max-height:clamp(150px,40vw,100px)}.resultFrames{gap:10px;justify-content:center}.resultBox{max-width:45vw;max-height:45vw}.resultText{font-size:clamp(15px,10vw,55px);color:var(--color-blackText);text-align:center}.loader{width:30px;height:30px;margin:8px auto}.centerButton{margin:15px auto 0}.clearButtonOutside.preview{position:relative;top:-7%;right:-37%;width:28px;height:28px}}