*{box-sizing:border-box;margin:0;padding:0;-webkit-user-select:none;user-select:none}html{font-size:62.5%;text-rendering:geometricPrecision}body{background:var(--grey);color:var(--white);overflow:hidden;-ms-overflow-style:none;scrollbar-width:none}ul li{list-style:none}svg{display:flex;fill:none;height:2.4rem;width:2.4rem}svg path{fill:none;stroke:var(--white);stroke-width:.12rem}a{text-decoration:none;color:var(--white)}canvas{left:0;position:fixed;top:0;z-index:-10}section{display:flex;flex-direction:column;justify-content:space-between;height:100svh;padding:2rem}.actions,nav,menu{display:flex;background:var(--oil);border-radius:4rem;padding:0 .4rem}:root{--oil: #080809;--grey: #16171a;--white: #ffffff}@font-face{font-family:SuisseIntl;src:url(/fonts/SuisseIntl.woff2) format("woff2")}h1,h2,h3,h4,h5,h6,span,p,legend,label,button,input,div,summary,textarea,a{font-family:SuisseIntl,sans-serif;font-style:normal;font-weight:300;text-rendering:geometricPrecision;letter-spacing:.02em}h1{font-size:3.2rem;line-height:1.4}h2,h3,h4,h5,h6,span,p,legend,label,button,input,div,summary,textarea,a{font-family:SuisseIntl,sans-serif;font-style:normal;font-size:1.2rem;font-weight:300;text-rendering:geometricPrecision;letter-spacing:.02em}button{align-items:center;background:var(--oil);border:none;color:var(--white);cursor:pointer;display:flex;justify-content:center;padding:.8rem}button svg path{opacity:.6}button:hover svg path{opacity:1}button:focus-visible{outline:0}button img{aspect-ratio:1 / 1;border-radius:50%;width:2.4rem}button:has(svg):not(:has(span)),button:has(img):not(:has(span)){border-radius:50%;height:6rem;width:6rem}button svg{pointer-events:none}button:not(:has(svg)):not(:has(img)){padding:2rem 4rem}button:has(span):has(svg){gap:.4rem;padding:1.9rem 1.9rem 1.9rem 2.4rem}button:has(span):has(svg) svg{width:1.4rem}button:has(span):has(svg) svg path{stroke-width:.2rem}.button-disabled{cursor:not-allowed}.button-disabled svg path{opacity:.3}.button-active svg path{opacity:1}.btn-secondary{background:var(--white);color:var(--oil)}.btn-secondary svg path{stroke:var(--oil)}.color-picker{background:var(--oil);border-radius:.8rem;width:40rem;padding:1.6rem;-webkit-user-select:none;user-select:none;position:fixed;bottom:2rem;left:50%;transform:translate(-50%);z-index:20}.saturation-box{width:100%;height:20rem;position:relative;cursor:crosshair}.saturation-box:before{content:"";position:absolute;inset:0;background:linear-gradient(to right,#fff,transparent)}.saturation-box:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,#000,transparent)}.saturation-thumb{position:absolute;width:2.2rem;height:2.2rem;border:.2rem solid white;border-radius:50%;transform:translate(-50%,50%);pointer-events:none;z-index:10}.color-slider{width:100%;height:.2rem;position:relative;cursor:pointer;margin:2rem 0;padding:1.6rem}.hue-slider{background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}.slider-thumb{position:absolute;top:50%;width:1.8rem;height:1.8rem;background:var(--white);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}.input-container{background:var(--grey);display:flex;align-items:center}.input-container button{background:none}.hex-input{background:var(--grey);border:none;color:var(--white);flex:1;padding:2rem;letter-spacing:.4rem}@media(max-width:768px){.color-picker{border-radius:.8rem .8rem 0 0;bottom:0;width:100vw;left:50%;transform:translate(-50%)}}details{align-items:center;cursor:pointer}details>summary{list-style:none;padding:2rem}details>summary::-webkit-details-marker{display:none}header{align-items:center;display:flex;justify-content:space-between;width:100%}.preview{background:#1e14f00a;border:.1rem solid blue;position:absolute;top:0;pointer-events:none;right:0;height:0;width:0}.shader-code{background:var(--grey);display:none}.shader-code summary{color:var(--white)}.shader-cards{display:flex;overflow-x:scroll}.shader-card{background:var(--grey);cursor:pointer;padding:2rem;text-align:center;min-width:15rem}.shader-card h4{color:var(--white)}.shader-card.active{background:var(--white)}.shader-card.active h4{color:var(--grey)}.ai-shader-card{display:grid}.ai-shader-card input,.ai-shader-card button{grid-area:1 / 1}.ai-shader-input{background:var(--grey);padding:2rem}.ai-shader-card button{justify-self:right;background:none}.shader-uniform-slider{align-items:center;background:var(--grey);display:grid;gap:2rem;grid-template-columns:repeat(2,1fr);padding:2rem}.shader-uniform-slider label{justify-content:space-between}.shader-uniforms:empty{display:none}label{gap:.4rem;display:flex}::-webkit-input-placeholder{text-rendering:geometricPrecision}label svg{margin:.8rem 0;min-width:fit-content}textarea{border:none;background:var(--grey);color:var(--white);font-family:monospace;letter-spacing:.1rem;line-height:3;text-rendering:geometricPrecision;min-height:12rem;padding:2rem;resize:none;margin-bottom:2rem;width:100%}textarea::selection{background:orange}select{-moz-appearance:none;-webkit-appearance:none;-ms-appearance:none;-o-appearance:none;appearance:none;cursor:pointer;font-family:monospace;letter-spacing:.1rem;text-rendering:geometricPrecision;color:var(--white);background:var(--white);border:none;padding:1.2rem;resize:none;width:100%}select:focus-visible{outline:none}input{background:none;border:none;color:var(--white);width:100%}input:focus-visible,textarea:focus-visible{outline:none}input[type=color]{appearance:none;border-radius:50%;height:2.4rem;padding:0;width:2.4rem}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-background-clip:text;-webkit-text-fill-color:var(--white);transition:background-color 5000s ease-in-out 0s;box-shadow:inset 0 0 2rem 2rem #23232329}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.slidecontainer{width:100%}.slider{appearance:none;width:100%;height:.14rem;background:#ffffff20;outline:none}.slider:hover{opacity:1}.slider::-webkit-slider-thumb{appearance:none;width:1.6rem;height:1.6rem;background:var(--white);cursor:pointer}@media(max-width:768px){textarea,input{font-size:1.6rem}}.modal{align-items:end;height:100svh;left:0;bottom:0;display:flex;justify-content:center;position:fixed;width:100svw;z-index:1000}.modal-content{background:var(--oil);border-radius:.8rem;display:flex;flex-direction:column;gap:2rem;margin:2rem;min-width:40rem;max-width:60rem;overflow-y:scroll;padding:2.4rem;width:90vw}.modal-content footer{display:flex;gap:1.2rem;justify-content:flex-end}.modal-ul{display:flex;flex-direction:column;padding-bottom:4rem}.modal-ul:last-child{padding:0}.modal-ul li{align-items:center;border-bottom:.1rem solid var(--white);display:flex;justify-content:space-between;padding:2rem 0}.modal-ul li:first-child{padding:0 0 2rem}.modal-ul li:last-child{border-bottom:0;padding:2rem 0 0}@media(max-width:768px){.modal{padding:0}.modal-content{border-radius:.8rem .8rem 0 0;margin:0;max-width:100%;min-width:auto;width:100%;padding:.8rem}}.layers-container{max-height:20vh;overflow-y:auto}.layers-list{display:flex;flex-direction:column;gap:.2rem}.layer-item{background:var(--grey);display:flex;align-items:center}.layer-item:hover .layer-actions{opacity:1}.layer-item:hover{cursor:grab}.layer-item.dragging{opacity:.2;cursor:grab}.layer-item[draggable=true]{cursor:grabbing}.layer-name{flex:1;padding:2rem}.layer-name h4{border-bottom:1px dashed #ffffff50;cursor:text;outline:none;width:fit-content}.layer-name h4[contenteditable=true]{cursor:text}.layer-actions{display:flex;align-items:center;gap:.8rem}.layer-actions button{background:none}.layer-input{background:var(--oil);color:var(--white);font-size:1.2rem;padding:.4rem .8rem;text-align:center;width:6rem}.layers-empty{text-align:center}@media(max-width:768px){.layers-content{min-width:auto;max-width:100%;width:100%}.layer-item{flex-wrap:wrap;padding:1rem}.layer-name{overflow:hidden;padding:0;white-space:nowrap}.layer-actions{flex:1;gap:0;justify-content:space-between;opacity:1}}.onboarding{align-items:flex-end;display:flex;height:100svh;justify-content:center;position:fixed;width:100svw;z-index:1000}.onboarding-content{background:var(--oil);border-radius:.8rem;padding:2.4rem 0;margin:2rem;max-width:120rem;overflow-x:auto;overflow-y:hidden}.onboarding ul{display:flex;gap:.8rem;overflow-x:visible;width:min-content}.onboarding ul li{background:var(--grey);display:flex;gap:1.2rem;flex-direction:column;padding:2rem;max-width:22rem;min-width:20rem;width:20vw}.onboarding ul li h3{opacity:.5}.onboarding ul li:first-child{margin-left:2rem}.onboarding ul li:last-child{margin-right:2rem}@media(max-width:768px){.onboarding-content{border-radius:.8rem .8rem 0 0;margin:0;min-width:auto;max-width:100%;width:100%;padding:2rem 0}.onboarding ul li{min-width:60vw;width:80vw}}.popover{background:var(--oil);border-radius:.8rem;padding:1.2rem 0;position:fixed;top:2rem;right:2rem;width:22rem;z-index:20}.popover li{cursor:pointer;opacity:.4;padding:1.4rem 2rem}.popover li:hover,.popover li.selected{opacity:1}@media(max-width:768px){.popover{bottom:0;border-radius:.8rem .8rem 0 0;top:auto;right:auto;width:100svw}.popover li{padding:.8rem 1.8rem}}.toast{background:var(--oil);left:50%;top:2rem;transform:translate(-50%);text-align:center;padding:2rem;position:fixed;z-index:20}@media(max-width:768px){.toast{width:calc(100% - 4rem)}}.modal-transform{display:flex;flex-direction:row!important;flex-wrap:wrap;width:fit-content;max-width:max-content;gap:.4rem}.transform-actions{display:flex;gap:.4rem;justify-content:center}.transform-actions button{background:var(--grey);border-radius:0}.size-input-wrapper{align-items:center;background:var(--grey);display:flex;padding-left:2rem}.size-input-wrapper input[type=number]{padding:2rem}.uploading{background:var(--oil);border-radius:50%;left:50%;top:2rem;transform:translate(-50%);padding:2rem;position:fixed;z-index:20}.uploading svg{animation:spin 3s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.dashboard aside{align-items:center;display:flex;flex:1}.dashboard aside ul{display:flex;gap:2rem}.dashboard aside ul li{align-items:center;align-content:space-between;aspect-ratio:3 / 4;background:var(--oil);display:flex;flex-wrap:wrap;justify-content:space-around;width:28rem;min-width:28rem;max-width:28rem}.dashboard aside ul li h2{padding:2rem;width:inherit}.dashboard aside ul li h2:focus-visible{outline:none;background:#ffffff05}.dashboard aside ul li:first-child{align-content:center}.dashboard aside ul li:first-child button{border-radius:0;height:100%;width:100%}@media(max-width:768px){.dashboard aside ul{flex-direction:column;gap:.8rem;width:100%}.dashboard aside ul li{aspect-ratio:16 / 9;justify-content:space-between;max-width:none;width:100%}}.home aside button{margin-top:.8rem}.home aside h3{color:var(--white);opacity:.5}.home aside h1,.home aside h3{mix-blend-mode:difference}nav,menu{position:fixed;bottom:2rem;left:50%;transform:translate(-50%);z-index:10}nav button{border:0}.letter-spacing-wrapper{display:flex;align-items:center;gap:.4rem;padding:.4rem .8rem;background:var(--oil);border-radius:2rem}.letter-spacing-wrapper span{display:flex;align-items:center;opacity:.6}.letter-spacing-wrapper input{width:4rem;background:#ffffff0d;border:none;color:var(--white);font-size:.875rem;padding:.2rem .4rem;text-align:center}.letter-spacing-wrapper input:focus{outline:none;border-radius:.25rem}.settings{bottom:2rem;position:fixed;right:2rem;z-index:10}.studio-extras{display:flex;gap:.8rem;top:2rem;position:fixed;right:2rem;z-index:10}@media(max-width:768px){.settings{top:2rem}}