@font-face{font-family:Montserrat;src:url(./Montserrat-Regular-BQsUpcHj.ttf)}.preview-container{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;background-color:#cfdfd0;font-family:Montserrat;overflow:hidden}.preview-container .preview-wrapper{display:grid;padding:1em;width:300px;box-sizing:border-box;justify-content:center;align-content:center;justify-items:center;gap:1em}@media screen and (max-width: 340px){.preview-wrapper{width:100%}}.preview-navigation{display:flex;width:100%;justify-content:space-between;align-self:flex-start;gap:.5em;z-index:10}.preview-navigation .button{background-color:#7c8dad;color:#f1f1f1;padding:.5em 1em;border-radius:5px;gap:.2em;display:flex;align-items:center;border:none;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;transition:.1s}.preview-navigation .button svg{transition:.4s}.preview-navigation .button:hover{opacity:.9}.preview-navigation .button:active{transform:scale(.95)}.preview-navigation .rotate-button svg{transform:rotate(180deg)}.preview-navigation .back-button{background-color:#9bbd7e;border-top-right-radius:0;border-bottom-right-radius:0}.preview-navigation .generate-button{margin-left:-.2em;width:100%;background-color:#9bbd7e;border-top-left-radius:0;border-bottom-left-radius:0}.preview-navigation .palette-button{background-color:#7c8dad}@media screen and (max-width: 340px){.preview-navigation{display:grid;grid-template-columns:1fr 1fr}.preview-navigation .back-button{border-radius:5px}.preview-navigation .generate-button{margin-left:0;border-radius:5px}}@media screen and (max-width: 240px){.preview-navigation button{font-size:.7em}}@media screen and (max-width: 200px){.preview-navigation{grid-template-columns:1fr}}.maket{opacity:1;transition:.1s;animation:start-animation .2s 1}.new-color{transform:scale(1.04)}.maket-animate-new{opacity:0;transform:translate(-10%)}.maket-animate-prev,.new-maket{opacity:0;transform:translate(10%)}.prev-maket{opacity:0;transform:translate(-10%)}.empty-maket{text-align:center;display:grid;align-content:center;justify-items:center;padding:2em;height:320px;box-sizing:border-box;transition:.5s}.empty-maket svg{transition:.2s ease-in-out}.empty-maket p{margin:0;font-size:18px;color:#7c8dad}.empty-maket.started{opacity:0;transform:translateY(-40%)}.empty-maket.started svg{transform:translateY(-40%)}@keyframes start-animation{0%{opacity:0;transform:translateY(40%)}to{opacity:1;transform:translateY(0)}}@media screen and (max-width: 340px){.empty-maket{padding:1em}}@media screen and (max-width: 260px){.empty-maket{padding:1em}.empty-maket p{font-size:14px}}@media screen and (max-width: 200px){.empty-maket{padding:.5em}.empty-maket p{font-size:12px}}body{margin:0;background-color:#f1f1f1}.main-container{display:flex;gap:1em}.main-container .main-screen{display:grid;width:100%;gap:1em}