.creator-main{display:grid;grid-template-columns:30rem auto;height:100svh}.creator-main aside{padding:4rem;display:flex;flex-direction:column;justify-content:space-between}.creator-main aside .logo{width:5rem}.creator-main aside .steps{display:flex;flex-direction:column;gap:.5rem}.creator-main aside .steps button{background:none;border:none;width:fit-content;font:inherit}.creator-main aside .steps button.selected{text-decoration:underline solid #FFC400}.creator-main aside .steps button:not(:disabled):not(.selected):hover{cursor:pointer;opacity:.8}.creator-main .main-steps{background:#ffc400;height:100svh;overflow:hidden}.creator-main .main-steps .step{height:100svh;transition:.5s ease;transform:translateY(calc((var(--step) - 1) * -100%));display:flex;flex-direction:column;align-items:center;justify-content:center}.creator-main .main-steps .step .step-content{display:flex;flex-direction:column;gap:1rem}.creator-main .main-steps .step .step-content h2{margin:0}.creator-main .main-steps .step .input-image{width:20rem;height:20rem;object-fit:cover;margin:1rem 0;border:2px dashed rgba(51,46,38,.7490196078);display:block}.creator-main .main-steps .step .output-image{margin:1rem 0;border:2px dashed rgba(51,46,38,.7490196078);display:block;max-width:20rem}.creator-main .main-steps .step .placeholder{width:20rem;height:20rem;display:grid;place-items:center;border:2px dashed rgba(51,46,38,.7490196078);margin:1rem 0;padding:2rem;text-align:center}.creator-main .main-steps .step .loading-spinner{display:inline-block;height:1rem;margin-bottom:-.125em;animation-name:spin;animation-duration:1s;animation-iteration-count:infinite;animation-timing-function:linear}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}