body,html{margin:0;padding:0;height:100%;overflow:hidden;font-family:Comfortaa,sans-serif}#root{height:100dvh;width:100dvw}button{font-family:Comfortaa,sans-serif;border:0;border-radius:1rem;padding:1rem 2rem;transition:all .2s}button:hover{background-color:#d0bbdebf}button:active{background-color:#a992b8bf}::-webkit-scrollbar{width:1rem}::-webkit-scrollbar-track{background:#0e0216bf}::-webkit-scrollbar-thumb{background:#fffdf4}::-webkit-scrollbar-thumb:hover{background:#fff}.kofi-button{position:absolute;bottom:1rem;right:1rem}.warning-screen{z-index:999;position:fixed;width:100%;height:100%;max-width:100dvw;max-height:100dvh;background-color:#110b13;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2rem;box-sizing:border-box}.notice{z-index:5;position:absolute;bottom:0;background-color:#0e021680;color:#fffdf4;font-weight:700;font-size:large;display:flex;align-items:center;justify-content:center;height:2rem;padding:2rem;width:100%;box-sizing:border-box;pointer-events:none}.main-menu{position:absolute;bottom:2rem;left:2rem;color:#fffdf4;display:flex;flex-direction:column}@media screen and (max-width: 600px){.main-menu{bottom:3rem;left:0;width:100%}}.title{margin-left:2rem;letter-spacing:-3px}.mode-title{letter-spacing:-2px}.header{display:flex;padding-left:1rem;background:linear-gradient(transparent,#0e0216bf)}.header>img{width:3rem}.mode-selectors{background-color:#0e0216bf;border-radius:0 0 1rem 1rem}.mode-selector{margin:1rem;display:grid;background-color:#0e0216bf;border-radius:1rem}.mode-header{display:flex;gap:1rem;background-color:#422059bf;padding:1rem;border-radius:1rem 1rem 0 0}.mode-header>img{width:4rem}.mode-header>button{margin-left:auto;justify-self:flex-end}.menu{position:absolute;right:6rem;top:1rem;position-anchor:--active-icon;align-self:anchor-center;color:#fffdf4;background-color:#0e0216bf;padding:2rem;border-radius:1rem 0 1rem 1rem;overflow-y:auto;max-height:calc(100dvh - 12rem);justify-self:right;transform-origin:right}@supports (top: anchor(top)) and (right: anchor(left)){.menu{right:anchor(left);top:anchor(top)}}@media screen and (max-width: 600px){.menu{position:relative;right:auto;top:auto;width:calc(100% - 2rem);box-sizing:border-box;max-height:calc(100dvh - 20rem);border-radius:0 0 1rem 1rem}}.menu-parent{position:fixed;right:0;top:1rem;z-index:25;height:100%;display:flex;pointer-events:none}.menu-parent *{pointer-events:all}@media screen and (max-width: 600px){.menu-parent{height:auto;top:0;width:100%;flex-direction:column-reverse}}.menu-list{anchor-name:--menu-list;display:flex;flex-direction:column;gap:.5rem}@media screen and (max-width: 600px){.menu-list{padding:0 1rem;box-sizing:border-box;flex-direction:row;width:100%;justify-content:stretch}}.size-slider{width:100%}.menu-icon{position:relative;background-color:#0e0216bf;padding:1rem 2rem 1rem 1rem;right:-1rem;border-radius:2rem 0 0 2rem;cursor:pointer;transition:all .15s ease-out}.menu-icon>img{width:50px}@media screen and (max-width: 600px){.menu-icon{padding:1rem;flex-grow:1;height:min-content;right:auto;border-radius:0 0 2rem 2rem;display:flex;justify-content:center}}.back-button{color:#fffdf4;font-size:1.5rem}.back-button>p{margin:0;transition:margin .5s ease-in-out}@media screen and (max-width: 600px){.back-button{display:none}}.active-back-button>p{scale:-1 1}.active-menu-icon{right:0;border-radius:0;background-color:#a992b8bf;anchor-name:--active-icon}@media screen and (max-width: 600px){.active-menu-icon{padding-top:2rem}}.custom-footprint-display{display:grid;grid-template-columns:1fr 1fr 1fr;background-color:#0e0216bf;margin:1rem 0;border-radius:1rem;position:relative}.custom-footprint-display>*{padding:1rem}.custom-footprint-display>header{background-color:#422059bf;border-radius:1rem 0 0 1rem;display:flex;flex-direction:column}.custom-footprint-display>header>*{flex-grow:1}@media screen and (max-width: 600px){.custom-footprint-display>header{border-radius:1rem 1rem 0 0}}.custom-footprint-display>img{width:125px;height:125px}@media screen and (max-width: 600px){.custom-footprint-display>img{justify-self:center}}@media screen and (max-width: 600px){.custom-footprint-display{width:100%;grid-template-columns:1fr;grid-template-rows:1fr 1fr 1fr}}.clear-file-button{background-color:#ff5151;font-weight:700;display:flex;justify-content:center;height:2rem;aspect-ratio:1/1;padding:.5rem}.top-right{position:absolute;top:0;right:0}.file-input-label{display:flex;gap:1rem;align-items:center}.stomp-image-inputs{display:flex}@media screen and (max-width: 600px){.stomp-image-inputs{flex-direction:column}}