.isometric-container,.isometric-container *,.isometric-container :before,.isometric-container :after{box-sizing:border-box}.isometric-container{overflow:hidden}.isometric{width:0;height:0;transform-style:preserve-3d;position:absolute;top:50%;left:50%;transform:rotateX(60deg)rotateY(0)rotate(45deg)}.isometric *{transform-style:preserve-3d}.isometric-cube{width:var(--isometric-cube-width,0rem);height:var(--isometric-cube-height,0rem);transform-origin:50%;position:absolute}.isometric-cube>*{border-width:var(--isometric-border-size-cube,0px);border-color:color-mix(in srgb, var(--isometric-border-color-cube,#fff), #000 20%);border-style:var(--isometric-border-style-cube,solid);box-sizing:border-box;position:absolute}.isometric-cube-top{width:var(--isometric-cube-width,0rem);height:var(--isometric-cube-height,0rem);transform:translateZ(var(--isometric-cube-depth,0rem))}.isometric-cube-front-left{width:var(--isometric-cube-width,0rem);height:var(--isometric-cube-depth,0rem);transform:translateY(calc(var(--isometric-cube-height,0rem) - var(--isometric-cube-depth,0rem) / 2)) translateZ(calc(var(--isometric-cube-depth,0rem) / 2)) rotateX(-90deg)}.isometric-cube-front-right{width:var(--isometric-cube-height,0rem);height:var(--isometric-cube-depth,0rem);transform:translateX(calc(var(--isometric-cube-width,0rem) - var(--isometric-cube-height,0rem) / 2)) translateY(calc(var(--isometric-cube-height,0rem) / 2 - var(--isometric-cube-depth,0rem) / 2)) translateZ(calc(var(--isometric-cube-depth,0rem) / 2)) rotateX(-90deg) rotateY(90deg)}.isometric-cube-bottom{width:var(--isometric-cube-width,0rem);height:var(--isometric-cube-height,0rem);transform:initial}.isometric-cube-back-right{width:var(--isometric-cube-width,0rem);height:var(--isometric-cube-depth,0rem);transform:translateY(calc(-1 * var(--isometric-cube-depth,0rem) / 2)) translateZ(calc(var(--isometric-cube-depth,0rem) / 2)) rotateX(-90deg)}.isometric-cube-back-left{width:var(--isometric-cube-height,0rem);height:var(--isometric-cube-depth,0rem);transform:translateX(calc(-1 * var(--isometric-cube-height,0rem) / 2)) translateY(calc(var(--isometric-cube-height,0rem) / 2 - var(--isometric-cube-depth,0rem) / 2)) translateZ(calc(var(--isometric-cube-depth,0rem) / 2)) rotateX(-90deg) rotateY(90deg)}.isometric-grid{background-image:linear-gradient(var(--isometric-grid-color,#000) var(--isometric-grid-lineweight,1%), transparent var(--isometric-grid-lineweight,1%), transparent calc(100% - var(--isometric-grid-lineweight,1%)), var(--isometric-grid-color,#000) calc(100% - var(--isometric-grid-lineweight,1%))),linear-gradient(90deg, var(--isometric-grid-color,#000) var(--isometric-grid-lineweight,1%), transparent var(--isometric-grid-lineweight,1%), transparent calc(100% - var(--isometric-grid-lineweight,1%)), var(--isometric-grid-color,#000) calc(100% - var(--isometric-grid-lineweight,1%)));background-size:var(--isometric-grid-size,1rem) var(--isometric-grid-size,1rem);width:calc(var(--isometric-grid-size,1rem)*var(--isometric-grid-width,1));height:calc(var(--isometric-grid-size,1rem)*var(--isometric-grid-height,1));position:absolute}.isometric-plane{width:var(--isometric-plane-width,0rem);height:var(--isometric-plane-height,0rem);background:var(--isometric-plane-color,#000);position:absolute}.isometric-border{border:var(--isometric-border-size,0px) var(--isometric-border-style,solid) var(--isometric-border-color,#000);box-sizing:border-box}.isometric-edge:before{content:"";border-radius:inherit;background:color-mix(in srgb, var(--isometric-edge-color,#fff), #000 20%);width:100%;height:100%;box-shadow:0px 0px color-mix(in srgb, var(--isometric-edge-color,#fff), #000 20%);transform:translateZ(calc(-1 * var(--isometric-edge-depth,0px)));display:block;position:absolute;top:0;left:0}.isometric-position{top:var(--isometric-position-top,0rem);left:var(--isometric-position-left,0rem);transform:translateZ(calc(var(--isometric-position-elevation,0rem) * .5))}.isometric-rotation{transform-origin:50%;transform:rotateZ(var(--isometric-rotate-from,0deg));animation:isometric-rotation var(--isometric-rotation-duration,1s) linear forwards infinite;animation-delay:var(--isometric-rotation-delay,0s)}@keyframes isometric-rotation{0%{transform:rotateZ(var(--rotation-from,0deg))}to{transform:rotateZ(var(--rotation-to,360deg))}}.isometric-shadow:after{content:"";border-radius:inherit;background:rgba(0, 0, 0, calc(.2 / (1 + var(--isometric-shadow-distance,0) / 10)));border-color:rgba(0, 0, 0, calc(.2 / (1 + var(--isometric-shadow-distance,0) / 10)));width:100%;height:100%;transform:translateX(calc(var(--isometric-shadow-distance-with-unit,1rem) * var(--isometric-shadow-spacing-x,0))) translateY(calc(var(--isometric-shadow-distance-with-unit,1rem) * var(--isometric-shadow-spacing-y,0))) translateZ(calc(-1 * var(--isometric-shadow-distance-with-unit,1rem)));box-shadow:0 0 calc(var(--isometric-shadow-distance-with-unit,1rem)/10) #0003;filter:blur(calc(var(--isometric-shadow-distance-with-unit,1rem) / 10));display:block;position:absolute;top:0;left:0}.isometric-shadow-animation:after{animation:isometric-shadow-animation var(--isometric-shadow-animation-duration,1s) ease-in-out forwards var(--isometric-shadow-animation-options);animation-delay:var(--isometric-shadow-animation-delay,0s)}@keyframes isometric-shadow-animation{0%{background:rgba(0, 0, 0, calc(.2 / (1 + var(--isometric-shadow-animation-from,0) / 10)));border-color:rgba(0, 0, 0, calc(.2 / (1 + var(--isometric-shadow-animation-from,0) / 10)));transform:translateX(calc(var(--isometric-shadow-animation-from-with-unit,0rem) * var(--isometric-shadow-spacing-x,0))) translateY(calc(var(--isometric-shadow-animation-from-with-unit,0rem) * var(--isometric-shadow-spacing-y,0))) translateZ(calc(-1 * var(--isometric-shadow-animation-from-with-unit,0rem)));box-shadow:0 0 calc(var(--isometric-shadow-animation-from-with-unit,0rem)*10) #0003;filter:blur(calc(var(--isometric-shadow-animation-from-with-unit,0rem) / 10))}to{background:rgba(0, 0, 0, calc(.2 / (1 + var(--isometric-shadow-animation-to,0) / 10)));border-color:rgba(0, 0, 0, calc(.2 / (1 + var(--isometric-shadow-animation-to,0) / 10)));transform:translateX(calc(var(--isometric-shadow-animation-to-with-unit,0rem) * var(--isometric-shadow-spacing-x,0))) translateY(calc(var(--isometric-shadow-animation-to-with-unit,0rem) * var(--isometric-shadow-spacing-y,0))) translateZ(calc(-1 * var(--isometric-shadow-animation-to-with-unit,0rem)));box-shadow:0 0 calc(var(--isometric-shadow-animation-to-with-unit,0rem)*10) #0003;filter:blur(calc(var(--isometric-shadow-animation-to-with-unit,0rem) / 10))}}
