#root{margin:0 auto}.App{display:flex;width:100vw;width:100dvw;height:100vh;height:100dvh;overflow-y:hidden;position:relative}.sidebar{height:100vh;height:100dvh;width:300px;display:flex;flex-direction:column;justify-content:space-between;gap:.4rem;padding:.4rem}.blackbg{background-color:#000}.whitebg{background-color:#fff}.semiwhitebg{background-color:#fff0}.LayerControl{max-height:70vh;overflow-y:scroll;flex:auto;scrollbar-width:none}.LeftPadding{padding-left:3rem}.Layer{display:flex;align-items:center;justify-content:space-between;gap:.4rem;padding:.2rem}.Layer .box{width:3rem;height:3rem;object-fit:contain;border:1px solid #000;flex-shrink:0}.box img{width:100%;height:100%;object-fit:contain}.transparentbg{background-color:#fff8}.flex-auto{flex:auto}.flex{display:flex}.wrap{flex-wrap:wrap}.align-center{align-items:center}.flex-col{flex-direction:column}.space-between{justify-content:space-between}.gap-s{gap:.5rem}.active{background-color:#555}.padding{padding:1rem}.paddingS{padding:.4rem}.gap{gap:.4rem}.min50{min-width:50px}.relative{position:relative}.absolute,.abs{position:absolute}canvas{border:1px solid #ccc}.font0{width:min-content;height:min-content;font-size:0}.displaynone{display:none}.softhide{opacity:0}.dim{opacity:.3}.small{font-size:.8rem}.Filedrop{flex:1 1 0;overflow:hidden}.DrawCanvas{background-position:center;width:100%;position:relative}nav.Bottom{position:absolute;bottom:1rem;left:50%;z-index:10;transform:translate(-50%);display:flex;gap:.4rem;padding:.3rem;background-color:#3335;border-radius:.4rem;align-items:center}nav.box{padding:.2rem;background-color:#3335;border-radius:.4rem}.tileoutline{position:absolute;outline:3px dotted #00F;z-index:20;transform:translate(50%,50%)}.ZoomableDiv{width:100%;height:100%;display:flex;align-items:center;justify-content:center;touch-action:none;overflow:hidden;max-height:100vh;will-change:"background-image"}.bgchange{position:absolute;width:100%;height:100%;-webkit-perspective:1000;-webkit-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);will-change:transform;background-position:center;pointer-events:none}.bgcanvas{color:#000;position:absolute;pointer-events:none;top:0;left:0}.overflow-hidden{overflow:hidden}.outline{outline:1px solid red}.centerVH{align-items:center;justify-content:center}.ToolBox{display:flex;flex-direction:column;gap:.4rem;padding:.4rem;background-color:#333;border-radius:.6rem}.ToolBox button{aspect-ratio:1}.noevent{pointer-events:none}.fullheight{min-height:100vh;min-height:100dvh}.fullwidth{width:100%}.DisplayCredits{background-color:#555}.DisplayCredits span{max-width:100px;text-overflow:ellipsis;overflow:hidden}.custom-checkbox{position:relative;width:2rem;height:2rem}.custom-checkbox input{opacity:0;position:absolute;cursor:pointer}.checkmark:hover{cursor:pointer}.checkmark{position:absolute;top:0;left:0;width:100%;height:100%;background-color:transparent;display:flex;align-items:center;justify-content:center;transition:transform .2s ease}.checkmark i{font-size:20px}.custom-checkbox input:checked~.checkmark i:nth-child(2){display:none}.custom-checkbox input:not(:checked)~.checkmark i:nth-child(1){display:none}.container span{margin-left:10px;color:#333}.layer-item{padding:5px;cursor:grab;border:1px solid #555}.dialog{border:none;border-radius:8px;background:#000;box-shadow:0 5px 15px #0003;max-width:80vw}.dialog-content{display:flex;flex-direction:column;gap:10px;padding:20px}.dialog::backdrop{background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.dialog-content canvas{max-width:100%;max-height:60vh}.Dialog{gap:.4rem;font-size:.8rem;color:#fff;min-width:50vw;max-width:80vw}.Dialog label{color:#fff}.Dialog textarea{min-height:100px;width:100%;resize:none;font-size:1rem}.ConfigSize select{border:0;padding:.6rem;height:3rem}.ConfigSize input[type=number]{width:80px;text-align:center}input,select,textarea{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;border:0;padding:.4rem;border-radius:.4rem;background:#333;color:#fff}input:focus,select:focus{outline:1px solid #888}input[type=checkbox]{width:1.8rem;height:1.8rem;accent-color:#ccc}input[type=checkbox]:hover{cursor:pointer}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;cursor:pointer;margin-top:.2rem}input[type=range]:active{cursor:grabbing}input[type=range]::-webkit-slider-runnable-track{background:#eee;height:1rem;border-radius:.3rem;border:1px solid #888}input[type=range]::-moz-range-track{background:#eee;height:1rem;border-radius:.3rem;border:1px solid #888}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin-top:-8px;background-color:#ddd;height:2rem;width:2rem;border-radius:.2rem;border:1px solid #444}input[type=range]::-moz-range-thumb{border:none;border-radius:0;background-color:#ddd;height:2rem;width:2rem;border-radius:.2rem;border:1px solid #444}.modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#000;padding:20px;border-radius:10px;box-shadow:0 5px 15px #0000004d;max-width:90vw;max-height:100vh}.modal-content img{max-width:100%;max-height:60vh;object-fit:contain}button.help{border-radius:50%;width:1.5rem;height:1.5rem;padding:0}.sidebar_toggle{display:none}@media only screen and (max-width: 1000px){.sidebar_toggle{position:absolute;top:5px;left:5px;z-index:100;display:flex}#sidebar_container{position:absolute;top:0;z-index:30;background-color:#111c;height:100vh;height:100dvh;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.closed{display:none}.open{display:block}.Toolbox_container{position:absolute;top:5px;right:5px;z-index:100}.minhide{display:none}nav.Bottom{bottom:-3px;padding:3px}button{width:2.2rem;height:2.2rem;padding:0!important;margin:0}.modal-content button{width:auto}}.test{position:absolute;color:#000;pointer-events:none;z-index:100;-webkit-user-select:all;user-select:all}.toastmsg a,.toastmsg a:hover{color:#000}.on{background-color:#000}.off{background-color:#ccc}.vertical{width:200px;position:absolute;top:130px;transform:rotate(270deg)}.multiply{mix-blend-mode:darken}.pill{background:#fc0;color:#000;padding:.2rem .4rem;border-radius:1rem}.slider{-webkit-appearance:none;width:100%;height:25px;background:#888;outline:none;opacity:.7;-webkit-transition:.2s;transition:opacity .2s}.slider:hover{opacity:1}.slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:25px;height:25px;background:#000;cursor:pointer}.slider::-moz-range-thumb{width:25px;height:25px;background:#000;cursor:pointer}.Logo{display:flex;align-items:center}.Logo svg{width:80px;height:100%}.Logo .sitename{margin:0;padding:0;font-size:1.6rem;line-height:1.3rem}.Logo .color2{color:#888}.Logo .sitename:hover{color:#ccc}.Logo .titleblock{display:flex;flex-direction:column}.Logo .tagline{margin-top:.5rem}.Logo .tagline h2{margin:0;font-size:1rem}:root{font-family:Poppins,Arial,Helvetica,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;scrollbar-width:thin}*{box-sizing:border-box}a{font-weight:500;color:#fff;text-decoration:inherit}a:hover{color:#fff}body{margin:0;min-width:320px;min-height:100vh;overscroll-behavior-x:none;overscroll-behavior-y:none}h1{font-size:3.2em;line-height:1.1}.L{font-size:2.5rem}button{border-radius:.4rem;border:1px solid transparent;padding:.4em .8em;font-size:.9rem;font-weight:500;font-family:inherit;background-color:#3a3a3a;color:#fff;cursor:pointer;transition:border-color .25s}button:hover{border-color:#fff}button:focus,button:focus-visible{outline:2px auto -webkit-focus-ring-color}button:disabled{color:#888}