html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}input,label,select,button,textarea{margin:0;border:0;padding:0;display:inline-block;vertical-align:middle;white-space:normal;background:none;line-height:1}input:focus{outline:0}input,textarea{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}button,input[type=reset],input[type=button],input[type=submit],input[type=checkbox],input[type=radio],select{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.no-scrollbar{overflow-y:scroll;scrollbar-width:none;-ms-overflow-style:none}:root{--black: #000;--white: #fafafa;--extra-red: #f1372d;--light-red: #e75952;--dark-grey: #4b4b4b;--darker-grey: #9d9d9d;--light-grey: #d4d4d4;--celeste: #58aeee;--font-family--text: "Mini";--font-family--title: "Mini Square";--modal-z-index: 10;--loader-z-index: 11;--renderer-exporting-z-index: 12;--mobile-overlay-z-index: 13}@font-face{font-family:Mini;src:url(/fonts/Kenney%20Mini.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:Mini Square;src:url(/fonts/Kenney%20Mini%20Square.ttf) format("truetype");font-weight:400;font-style:normal}.paxel-input input{width:100%;height:100%}.paxel-input.standard .paxel-input__input{padding:4px 0 4px 8px;box-shadow:0 0 0 1px var(--light-grey),inset 0 0 0 1px var(--light-grey),1px 2px 0 2px var(--darker-grey);border-radius:.3em;font-family:sans-serif;font-weight:700;font-size:.8rem;max-width:100%;background-color:var(--white);box-sizing:content-box}.paxel-input.retro label{margin-left:3px;font-size:.7rem;font-weight:600;margin-bottom:.4rem}.paxel-input.retro .paxel-input__input{padding:7px 0 7px 14px;border:3px solid var(--light-grey);box-shadow:0 0 0 1px var(--light-grey),inset 0 0 0 1px var(--light-grey),1px 2px 0 2px var(--darker-grey);border-radius:.3em;font-family:sans-serif;font-weight:700;font-size:.8rem;max-width:100%;background-color:var(--white);box-sizing:content-box}.paxel-input.retro .paxel-input__input:focus{border:3px solid rgb(150,150,150);box-shadow:0 0 0 1px var(--light-grey),inset 0 0 0 1px var(--light-grey),1px 2px 0 2px var(--darker-grey)}.paxel-checkbox{display:flex;gap:.2rem}.paxel-checkbox__label{font-size:.7rem}.paxel-select select{width:100%;height:100%}.paxel-select.standard .paxel-select__select{box-sizing:border-box;padding:4px 0 4px 8px;box-shadow:0 0 0 1px var(--light-grey),inset 0 0 0 1px var(--light-grey),1px 2px 0 2px var(--darker-grey);border-radius:.3em;font-family:sans-serif;font-weight:700;font-size:.8rem;max-width:100%;background-color:var(--white);outline:none;border:unset}.paxel-input label,.paxel-select label{font-size:.6rem;display:inline-block;margin-bottom:.2rem}.horizontal-space{width:100%}.horizontal-space.s{margin-bottom:.25rem}.horizontal-space.m{margin-bottom:.5rem}.horizontal-space.l{margin-bottom:.75rem}.paxel-button{padding:.5rem 1rem;border:3px solid var(--black);background-color:var(--light-grey);cursor:pointer}.paxel-button:hover{background-color:var(--darker-grey)}.paxel-button{font-size:.8rem;font-weight:600;white-space:nowrap;flex:1;box-sizing:content-box}.paxel-button.small{font-size:.6rem}.paxel-button.red{background-color:var(--light-red)}.paxel-button.red:hover{background-color:var(--extra-red)}.paxel-button.black{background-color:var(--black);color:var(--light-grey);border-color:var(--light-grey)}.paxel-button.black:hover{opacity:1;border-color:var(--white);color:var(--white)}.paxel-button.no-borders{border:unset}.tool-button{width:70px;height:70px;cursor:pointer}.tool-button.small{width:50px;height:50px}.tool-button__img{width:100%;height:100%;object-fit:contain}.draw-layers{width:100%;height:100%;display:flex;flex-direction:column;position:relative}.draw-layers__layers{display:flex;flex-direction:column-reverse;justify-content:flex-end;width:100%;flex:1;box-sizing:content-box;transition:width .3s linear}.draw-layers__actions{display:flex;justify-content:space-between;align-items:center;width:100%;bottom:0;left:0;position:sticky}.draw-layer{height:max-content;box-sizing:content-box;background-color:var(--light-grey);border-bottom:3px solid #000;border-top:unset;padding:.6rem 1rem}.draw-layer__head{display:flex;justify-content:space-between;position:relative}.draw-layer__head:hover .draw-layer__edit-name{display:block}.draw-layer__title{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.draw-layer__title.editing{white-space:normal;overflow:visible;text-overflow:unset}.draw-layer__name{max-width:100%}.draw-layer__edit-name{display:none;position:absolute;top:calc(50% - .5rem);left:-1rem;width:1rem;font-size:1rem;height:1rem;cursor:pointer;color:var(--dark-grey)}.draw-layer__edit-name:hover{color:var(--black)}.draw-layer__icons{flex-wrap:wrap;display:flex;align-items:center;gap:.3rem;opacity:.5}.draw-layer__icons span{width:1rem;font-size:.8rem;font-weight:600;cursor:pointer}.draw-layer__icons img{aspect-ratio:1;object-fit:contain;width:1.2rem;cursor:pointer}.draw-layer__clear{color:var(--light-red)}.draw-layer__clear:hover{color:var(--extra-red)}.draw-layer h2{position:relative;flex:1;opacity:.5;font-size:1.3rem;text-transform:uppercase;line-height:1.4;font-weight:400;font-style:normal;text-align:left;cursor:pointer}.draw-layer.active h2{opacity:1;font-weight:600}.draw-layer.active h2:before{transform:scale(1)}.draw-layer.active .draw-layer__icons{opacity:1}.force__header{display:flex;align-items:start;gap:.2rem;margin-bottom:.3rem}.force__remove{cursor:pointer;font-size:.7rem;color:var(--extra-red)}.force h3{font-size:.9rem;text-transform:uppercase;font-weight:400;font-style:normal;text-align:left}.force__inputs{width:100%;max-width:100%;display:flex;flex-direction:column;gap:.3rem;margin-bottom:.5rem}.force__input{max-width:100%;display:flex;gap:.5rem;flex:1}.force__input input{flex:1}.force__label{flex:0 1;display:flex;align-items:center;justify-content:flex-start;font-size:.8rem}.exporter{width:100%;max-width:100%}.exporter__label{font-size:.7rem;font-weight:600;margin-bottom:.4rem}.exporter__resolution-inputs{margin-bottom:.3rem}.exporter__duration,.exporter .paxel-checkbox{margin-left:.1rem}.exporter__resolution-inputs{display:flex;gap:1rem}.exporter__resolution-width,.exporter__resolution-height{flex:1;width:calc(50% - .5rem)}.tools{display:flex;flex-direction:column;gap:1rem;align-items:flex-start;justify-content:center;margin-top:2rem}.tools tool-button{flex:1}.tools tool-button .tool-button{opacity:.5}.tools tool-button.active .tool-button{opacity:1}.tools.disabled tool-button .tool-button{opacity:.5}.tools__color-picker{position:relative;flex:1}.tools color-select .color-select{position:absolute;top:0;left:0;z-index:-1}.motion-player{display:flex;align-items:center;gap:20px}.motion-player tool-button .tool-button{opacity:.5}.motion-player tool-button.active .tool-button{opacity:1}.motion-physics__container{display:flex;flex-direction:column;height:100%;max-height:100%;overflow:hidden}.motion-physics__layers{flex:1 1 auto;overflow:hidden}.motion-physics__layers h3{font-size:1rem;text-transform:uppercase;font-weight:400;font-style:normal;text-align:left;margin-bottom:.5rem}.motion-physics__layers-list{box-sizing:border-box;display:flex;flex-direction:column;overflow-y:scroll;max-height:calc(100% - 1.7rem)}.motion-physics__layers-list>motion-physics-layer:last-child .motion-layer{border-bottom:unset;margin-bottom:unset}.motion-physics__forces-list{box-sizing:border-box;display:flex;flex-wrap:wrap;overflow-y:scroll;max-height:calc(100% - 1.7rem)}.motion-physics__forces-list .force{width:100%}.motion-physics__forces-add{display:flex;justify-content:space-between;align-items:center;height:1.7rem}.motion-physics__forces-add button{font-size:.5rem;flex:0 0 auto}.motion-physics__add-force-icon{cursor:pointer;font-size:2rem}.motion-physics__forces{max-height:20%}.motion-physics__forces,.motion-physics__loop,.motion-physics__player{flex:0 0 auto;overflow:hidden;box-sizing:border-box}.section{background-color:#d4d4d4;border-bottom:3px solid #000;padding:.25rem .5rem;box-sizing:border-box}.paxel-app__player{margin-top:auto;box-sizing:border-box;padding:.5rem 0;display:flex;width:100%;justify-content:center;align-items:center;background-color:var(--light-grey);box-sizing:content-box}.loop{padding-bottom:1rem}.loop h3{margin-bottom:.3rem}.loop__inputs{display:flex;flex-direction:column;gap:.5rem}.modal__overlay{visibility:hidden}.modal__overlay.show{visibility:visible}.modal__overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#0000004d;z-index:var(--modal-z-index)}.modal__box{padding:1rem;border-radius:.5rem;border:3px solid var(--black);background-color:var(--white);width:20rem;height:10rem;display:flex;flex-direction:column;align-items:center;justify-content:start}.modal__title{flex-shrink:1;margin-bottom:1rem;font-size:1.5rem}.modal__content{flex:1;width:100%}.modal__actions{width:100%;display:flex;align-items:center;height:2rem;align-self:flex-end;gap:.5rem}.dev-notes{background-color:var(--black);width:100%;max-width:calc(100% - .5rem);box-sizing:border-box;padding:1rem;border:3px solid var(--white);border-radius:10px;display:flex;flex-direction:column;position:absolute;bottom:calc(2.5rem + 3px);left:0;z-index:4;transform:scaleY(0);transition:transform .2s linear}.dev-notes.show{transform:scaleY(1)}.dev-notes__title{font-size:1rem;text-align:center;color:var(--white);margin-bottom:.5rem}.dev-notes__list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.8rem;overflow:hidden}.dev-notes__cta{font-size:.6rem;text-align:center;color:var(--white)}.dev-notes__item{color:var(--white);font-size:.8rem}.dev-notes__item a{font-size:.6rem;font-style:italic}.dev-notes__icons{display:flex;gap:.5rem;position:absolute;bottom:0;right:.5rem;width:100%;height:2rem;justify-content:flex-end}.dev-notes__toggle-icon,.dev-notes__link{cursor:pointer;width:2rem;height:2rem;padding:.2rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;background-color:var(--black);border:3px solid var(--white)}.dev-notes__toggle-icon img,.dev-notes__link img{width:100%;height:100%;object-fit:contain}.app-loader{width:100%;height:100%;position:absolute;top:0;left:0;z-index:var(--loader-z-index);display:none}.app-loader.show{display:block}.app-loader.exporter{background-color:#00000080}.app-loader.exporter .loader{width:2rem;height:2rem;display:inline-block;position:absolute;top:calc(50% - 2rem);left:calc(50% - 2rem);background:var(--white);box-sizing:border-box;animation:exporter 2s linear infinite}@keyframes exporter{0%{transform:translate(0) rotateX(0) rotateY(0)}25%{transform:translate(100%) rotateX(0) rotateY(180deg)}50%{transform:translate(100%,100%) rotateX(-180deg) rotateY(180deg)}75%{transform:translateY(100%) rotateX(-180deg) rotateY(360deg)}to{transform:translate(0) rotateX(0) rotateY(360deg)}}.mobile-overlay{display:none;background-color:var(--black);width:100%;height:100%;z-index:var(--mobile-overlay-z-index);flex-direction:column;justify-content:center;align-items:center;position:absolute;top:0;left:0}.mobile-overlay.visible{display:flex}.mobile-overlay__content{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem;background-color:var(--dark-grey);border:3px solid var(--light-grey);width:100%;max-width:15rem;border-radius:1rem;gap:.5rem}.mobile-overlay__icon{margin:0 auto;width:3rem;height:3rem}.mobile-overlay__icon img{width:100%;height:100%;object-fit:contain}.mobile-overlay__text{margin-bottom:.5rem}.mobile-overlay__cta p,.mobile-overlay__text p{color:var(--white);font-size:.8rem;line-height:150%;text-align:center}.mobile-overlay__cta .mobile-overlay__cta-text,.mobile-overlay__text .mobile-overlay__cta-text{font-size:.9rem}.mobile-overlay__cta{display:flex;flex-direction:column;gap:.5rem}.mobile-overlay__cta-icons{display:flex;gap:1rem;width:100%;height:2rem;justify-content:center}.motion-layer{display:flex;flex-direction:column;gap:.3rem;border-bottom:2px solid var(--darker-grey);margin-bottom:.3rem;flex:1;width:100%}.motion-layer__accordion-header{width:100%;position:relative;cursor:pointer;margin-bottom:.3rem}.motion-layer__accordion-header:after{content:"->";position:absolute;right:0;top:0;width:1rem;height:1rem}.motion-layer__accordion-header.show:after{content:"<-"}.motion-layer__accordion-body{width:100%;display:none;flex-direction:column;gap:.3rem;margin-bottom:.3rem}.motion-layer__accordion-body.show{display:flex}.motion-layer__name{font-size:1rem;max-width:calc(100% - 1rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.motion-layer__section label{font-size:.7rem}.motion-layer__section-title{font-size:.8rem;font-weight:500;margin-bottom:.1rem}.motion-layer__input-group,.motion-layer__chips{display:flex;gap:.3rem;align-items:center;flex:1 1 50%;flex-wrap:wrap}.motion-layer__chips{margin-top:.3rem}.motion-layer__chip{padding:.3rem;font-size:.6rem;background-color:var(--dark-grey);color:var(--white);cursor:pointer;border:2px solid black;border-radius:5px;opacity:.4;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.motion-layer__chip.active{opacity:1}html{width:100%;height:100%;font-size:clamp(12px,2.5vh,20px);font-family:var(--font-family--text),sans-serif}html h1,html h2,html h3,html h4,html h5,html h6,html button{font-family:var(--font-family--title),sans-serif}html input{font-family:var(--font-family--text),sans-serif}body{width:100%;height:100%;overflow:hidden;position:relative}.paxel-app__renderer{position:relative;background-color:var(--white)}.paxel-app__draw-canvas{position:relative;z-index:2}.paxel-app{width:100%;height:100%;position:relative;box-sizing:content-box;max-height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-direction:column;background-color:var(--dark-grey)}.paxel-app__exporter{display:flex;padding:.5rem;justify-content:center;background-color:var(--light-grey);border-bottom:3px solid var(--black)}.paxel-app__header{width:100%;height:3rem;flex-shrink:0;display:flex;justify-content:space-between;align-items:center;box-sizing:border-box;background-color:var(--light-grey);border-bottom:3px solid var(--black);padding:0 1rem}.paxel-app__logo-container{display:flex;gap:.5rem;box-sizing:border-box}.paxel-app__logo-container img{width:100%;height:100%;flex-shrink:1;max-width:1.5rem;max-height:1.5rem;object-fit:contain}.paxel-app__header h1{display:inline-block;font-size:1.5rem}.paxel-app__main{width:100%;flex:1;height:calc(100% - 3rem);display:flex;justify-content:space-between;align-items:center}.paxel-app__right-bar,.paxel-app__left-bar{height:calc(100% - 6px);max-height:98%;align-self:center;width:20%;position:relative}.left-bar-tabs__slot{width:100%;height:100%}.left-bar-tabs__slot--physics{display:flex;flex-direction:column}.paxel-link{text-decoration:none}.paxel-link.white{color:var(--light-grey)}.paxel-link.white:hover{color:var(--white);text-decoration:underline}