body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#09090b;background:linear-gradient(135deg,#fff,#f5f5f5);margin:0;transition:background-color .3s ease}*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid}.full-screen{position:fixed;width:100%;height:100%;overflow:hidden}.loadui{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;z-index:2;padding:2rem;background-color:linear-gradient(135deg,hsl(0,0%,100%),hsl(0,0%,96%));background-position:center;background-size:cover;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}h4{font-size:1.25rem;line-height:1.75rem;font-weight:600;margin:0 0 .5rem;color:#3d3d43}h2{font-size:2rem;line-height:2.5rem;font-weight:700;margin:0 0 1rem;color:#18181b;text-shadow:1px 1px 2px hsla(0,0%,0%,.1)}p{font-weight:500;margin:0 0 1.5rem;color:#61616b;max-width:600px}.button{width:3rem;height:3rem;padding:.5rem;border-radius:.75rem;color:#fafafa;background-color:#18181b99;transition:all .2s ease;cursor:pointer}.button:hover{background-color:#18181bcc;transform:scale(1.05)}input.button[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0}.checkbox{background-position:center;background-size:2.5rem;background-repeat:no-repeat;transition:all .3s ease}.icon{width:100%;height:100%;color:inherit;background-color:currentColor;background-size:contain;transition:all .3s ease}#outfit-switch{background-image:url(../avatar.svg)}#outfit-switch:checked{background-image:url(../apparel.svg);transform:rotate(360deg)}.carousel{position:fixed;width:100%;height:5rem;bottom:1.5rem;z-index:1;display:flex;justify-content:center;align-items:center;gap:.5rem}.carousel-item{height:4.5rem;width:4.5rem;margin:auto 4px;overflow:hidden;border-radius:.75rem;background-position:center;background-size:cover;background-color:#18181b66;background-repeat:no-repeat;transition:all .3s ease;cursor:pointer}.carousel input[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0}.carousel-item:checked{border:solid 3px hsl(0,0%,100%);transform:scale(1.1);box-shadow:0 0 15px #ffffff80}.carousel-item:hover{border-color:#fff;transform:translateY(-5px)}.cube-container{width:200px;height:200px;padding:40px;margin:auto;perspective:600px}.cube{position:relative;width:120px;height:120px;animation:cube 8s infinite ease-in-out;transform-style:preserve-3d}.cube>div{width:100%;height:100%;position:absolute;border:2px solid hsl(240,6%,10%);background-color:#18181b4d;backface-visibility:visible;transition:all .3s ease}.cube div:nth-of-type(1){transform:translateZ(-60px) rotateY(180deg)}.cube div:nth-of-type(2){transform:rotateY(-270deg) translate(50%);transform-origin:top right}.cube div:nth-of-type(3){transform:rotateY(270deg) translate(-50%);transform-origin:center left}.cube div:nth-of-type(4){transform:rotateX(90deg) translateY(-50%);transform-origin:top center}.cube div:nth-of-type(5){transform:rotateX(-90deg) translateY(50%);transform-origin:bottom center}.cube div:nth-of-type(6){transform:translateZ(60px)}@keyframes cube{0%,to{transform:rotate(0) rotateX(0) rotateY(0)}25%{transform:rotate(45deg) rotateX(-180deg) rotateY(45deg)}50%{transform:rotate(90deg) rotateX(-360deg) rotateY(90deg)}75%{transform:rotate(45deg) rotateX(-540deg) rotateY(45deg)}}.boxes{--size: 60px;--duration: 2s;height:calc(2 * var(--size));width:calc(3 * var(--size));position:absolute;top:50%;left:50%;margin-top:calc(-1.5 * var(--size));transform-style:preserve-3d;transform-origin:-25% -25%;transform:rotateX(60deg) rotate(45deg) rotateY(0) translateZ(0)}.boxes .box{width:var(--size);height:var(--size);position:absolute;top:0;left:0;transform-style:preserve-3d;transition:all .3s ease}.boxes .box>div{--top: auto;--right: auto;--bottom: auto;--left: auto;--translateZ: calc(.5 * var(--size));--rotateY: 0deg;--rotateX: 0deg;width:100%;height:100%;position:absolute;top:var(--top);right:var(--right);bottom:var(--bottom);left:var(--left);transform:rotateY(var(--rotateY)) rotateX(var(--rotateX)) translateZ(var(--translateZ));background-color:#18181b4d;border:1px solid hsl(240,6%,10%);transition:all .3s ease}.boxes .box:nth-child(1){transform:translate(100%);animation:box1 var(--duration) infinite ease-in-out}.boxes .box:nth-child(2){transform:translateY(100%);animation:box2 var(--duration) infinite ease-in-out}.boxes .box:nth-child(3){transform:translate(100%,100%);animation:box3 var(--duration) infinite ease-in-out}.boxes .box:nth-child(4){transform:translate(200%);animation:box4 var(--duration) infinite ease-in-out}.boxes .box>div:nth-child(1){--top: 0;--left: 0}.boxes .box>div:nth-child(2){--right: 0;--rotateY: 90deg}.boxes .box>div:nth-child(3){--rotateX: -90deg}.boxes .box>div:nth-child(4){--top: 0;--left: 0;--translateZ: calc(-1.5 * var(--size));background-color:#18181b1a;border:1px solid hsla(240,6%,10%,.05)}@keyframes box1{0%,50%{transform:translate(100%)}25%,75%{transform:translate(150%,50%)}to{transform:translate(200%)}}@keyframes box2{0%{transform:translateY(100%)}25%{transform:translate(50%,50%)}50%{transform:translate(0)}75%{transform:translate(50%,50%)}to{transform:translate(100%)}}@keyframes box3{0%,50%{transform:translate(100%,100%)}25%,75%{transform:translate(50%,150%)}to{transform:translateY(100%)}}@keyframes box4{0%{transform:translate(200%)}25%{transform:translate(150%,50%)}50%{transform:translate(200%,100%)}75%{transform:translate(150%,50%)}to{transform:translate(100%,100%)}}@media (prefers-reduced-motion: reduce){.cube,.boxes .box{animation:none}}@media (max-width: 768px){.carousel{flex-wrap:wrap}.carousel-item{height:4rem;width:4rem}.cube-container,.boxes{transform:scale(.8)}}
