[type=checkbox]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}label{font-weight:700;cursor:pointer;display:grid}.controls{transform:translateZ(500vmin);z-index:2;position:fixed;bottom:10rem;right:10rem;display:grid;gap:1rem}label,button{padding:1rem;background:gray;font-weight:700;color:#fafafa}label span{display:block}:root:has(label span:nth-of-type(1):hover){--truck-turn: -10deg;--head-turn: -20deg}:root:has(label span:nth-of-type(2):hover){--truck-turn: -5deg;--head-turn: -10deg}:root:has(label span:nth-of-type(3):hover){--truck-turn: 0deg;--head-turn: 0deg}:root:has(label span:nth-of-type(4):hover){--truck-turn: 5deg;--head-turn: 10deg}:root:has(label span:nth-of-type(5):hover){--truck-turn: 10deg;--head-turn: 20deg}.optimus__head-reactor{height:100%;width:100%}:root:has(:checked) .optimus__head-reactor{transform:rotateY(var(--head-turn, 0deg));transition:transform .125s}:root:not(:has(:checked)) .scene-turner{transform:rotate(var(--truck-turn, 0deg));transition:transform .125s}*,*:after,*:before{box-sizing:border-box;transform-style:preserve-3d;touch-action:none}:root{--size: 4;--optimus-rotation-y: -24;--optimus-rotation-x: -32;--transition-speed: .2s;--blue-1: hsl(215, 100%, 45%);--blue-2: hsl(215, 100%, 40%);--blue-3: hsl(215, 100%, 35%);--blue-4: hsl(215, 100%, 30%);--blue-5: hsl(215, 100%, 25%);--grey-1: hsl(228, 3%, 65%);--grey-2: hsl(228, 3%, 60%);--grey-3: hsl(228, 3%, 55%);--grey-4: hsl(228, 3%, 50%);--grey-5: hsl(228, 3%, 45%);--red-1: hsl(0, 74%, 50%);--red-2: hsl(0, 74%, 45%);--red-3: hsl(0, 74%, 40%);--red-4: hsl(0, 74%, 35%);--red-5: hsl(0, 74%, 30%);--eye-blue: hsl(210 100% 70%);--orange: hsl(42, 99%, 45%);--size: 5;--cab-width: calc(var(--size) * 3.6vmin);--cab-multiplier: 3.6;--torso-depth: calc(var(--size) * 2.6);--core-height: calc((var(--size) * 1 / 3) * 1);--chest-depth: calc(var(--torso-depth) * .6);--fist-dimension: calc((var(--size) * var(--cab-multiplier) - var(--size)) / 2);--fist-width: calc(((var(--size) * var(--cab-multiplier) - var(--size)) / 2) * 1vmin);--grill-height: calc(((var(--size) / 3) * 3.5) * 1vmin);--cab-height: calc(var(--grill-height) * 1.4);--wheel-depth: calc(var(--size) * .4);--leg-height: calc(var(--size) * 6.4)}body{display:grid;place-items:center;min-height:100vh;overflow:hidden;background:#dae0e7}.scene{position:relative}.optimus *{position:absolute}.optimus__core{width:calc(var(--size) * 1vmin);aspect-ratio:3 / 1;translate:-50% -50%}.core{height:100%;width:100%}.optimus__torso{width:100%;height:400%;bottom:50%}.optimus__grill{--color: var(--grey-1);width:100%;bottom:100%;height:var(--grill-height);--depth: calc(var(--torso-depth) * 1)}.optimus__grill .cuboid__side:nth-of-type(6),.optimus__grill .cuboid__side:nth-of-type(5){background:repeating-linear-gradient(var(--grey-1) 0 10%,var(--grey-5) 15% 15%)}.optimus__top{width:var(--cab-width);height:var(--cab-height);bottom:100%;left:50%;translate:-50% 0}@keyframes breathe{50%{transform:translateY(-2%)}}.reference-box{height:100%;width:100%;--depth: var(--torso-depth);--color: hsl(0 100% 50% / .25)}.reference-box .cuboid__side{border:1px solid white}.exhaust{height:200%;bottom:10%;width:calc(var(--fist-width) * .2);--depth: calc(var(--fist-dimension) * .2);--color: var(--grey-3)}.arm--right .exhaust{left:100%}.arm--left .exhaust{right:100%}.chest{height:100%;width:100%;transform:translateZ(calc(var(--torso-depth) * .1vmin));--depth: var(--chest-depth);--color: var(--red-1)}.chest>.cuboid>.cuboid__side:nth-of-type(1){--h-stop-one: calc(50% - (var(--fist-width) * .5));--h-stop-two: calc(50% + (var(--fist-width) * .5));--v-stop-one: calc(var(--torso-depth) * .1vmin);--v-stop-two: calc(100% - (var(--torso-depth) * .1vmin));filter:none;background:linear-gradient(90deg,var(--red-1) 0 var(--h-stop-one),transparent var(--h-stop-one) var(--h-stop-two),var(--red-1) var(--h-stop-two)),linear-gradient(var(--red-1) 0 var(--v-stop-one),transparent var(--v-stop-one) var(--v-stop-two),var(--red-1) var(--v-stop-two))}.chest>.cuboid>.cuboid__side:nth-of-type(2),.chest>.cuboid>.cuboid__side:nth-of-type(4){background:linear-gradient(var(--red-1) 80%,var(--grey-1) 80%)}.chest>.cuboid>.cuboid__side:nth-of-type(2):after,.chest>.cuboid>.cuboid__side:nth-of-type(4):after{content:"";height:60%;left:4%;top:10%;position:absolute;background:var(--blue-5);border:calc(var(--torso-depth) * .05vmin) solid var(--grey-3)}.logo{width:75%;top:50%;left:50%;translate:-50% -50%;opacity:.8}.hood{height:20%;width:100%;bottom:0;--depth: calc(var(--torso-depth) * .1);--color: var(--grey-1);transform:translateZ(calc(var(--torso-depth) * .45vmin))}.cab{height:80%;width:100%;top:0;--depth: calc(var(--torso-depth) * .1);--color: var(--red-1);transform:translateZ(calc(var(--torso-depth) * .45vmin))}.cab-light{height:16%;width:20%;bottom:0%;transform:translateZ(calc(var(--torso-depth) * .05vmin));--depth: calc(var(--torso-depth) * .1);--color: var(--red-1)}.cab-light .cuboid__side:nth-of-type(3){background:radial-gradient(circle at 25% center,white 16%,transparent 16%),radial-gradient(circle at 75% center,white 16%,transparent 16%),var(--red-1)}.cab-light--left{left:10%}.cab-light--right{right:10%}.cab .cuboid .cuboid__side:nth-of-type(2),.cab .cuboid__side:nth-of-type(4){filter:none!important}.cab .cuboid__side:nth-of-type(2):after,.cab .cuboid__side:nth-of-type(4):after{content:"";position:absolute;height:40%;left:50%;width:80%;top:26%;background:var(--grey-2);transform-origin:0 50%;transform:rotateY(-70deg)}.cab .cuboid__side:nth-of-type(4):after{transform:rotateY(70deg)}.cab .cuboid__side:nth-of-type(5):after,.cab .cuboid__side:nth-of-type(5):before{position:absolute;content:"";width:40%;height:70%;top:50%;translate:0 -50%;background:var(--blue-5);border:calc(var(--cab-height) * .05) solid var(--grey-1)}.cab .cuboid__side:nth-of-type(5):after{left:55%}.cab .cuboid__side:nth-of-type(5):before{background:linear-gradient(-40deg,transparent 0 50%,hsl(0 0% 100% / .75) 50% 70%,transparent 70% 80%,hsl(0 0% 100% / .75) 80% 90%,transparent 90%),var(--blue-5);right:55%}.cab .cuboid__side:nth-of-type(6){display:none}.optimus__spine{height:100%;width:calc(100% - (2 * var(--fist-width)));left:50%;translate:-50% 0;transform:translateZ(calc(var(--torso-depth) * -.35vmin));--depth: calc(var(--torso-depth) * .3);--color: var(--red-2)}.optimus__head{width:var(--fist-width);height:var(--cab-height);left:50%;translate:-50% 0;top:0}.optimus__helmet{height:100%;width:100%}.optimus__neck{bottom:0;left:50%;height:12%;width:50%;translate:-50% 0;--depth: calc(var(--head-depth) * .5);--color: var(--grey-4)}.optimus__face{bottom:12%;width:60%;height:46%;left:50%;translate:-50% 0;--depth: calc(var(--head-depth) * .5);--color: var(--grey-5)}.optimus__face .cuboid__side:nth-of-type(5):after{content:"";height:14%;left:50%;translate:-50% -50%;background:linear-gradient(90deg,var(--eye-blue) 0 40%,transparent 20% 60%,var(--eye-blue) 60%);top:20%;position:absolute;width:80%}.optimus__mouth{top:58%;width:60%;height:32%;left:50%;translate:-50% 0;transform:translateZ(calc(var(--head-depth) * .3vmin));--depth: calc(var(--head-depth) * .2);--color: var(--grey-2)}.optimus__mouth .cuboid__side:nth-of-type(5){background:linear-gradient(-90deg,var(--grey-2) 50%,var(--grey-4) 50.5%)}.optimus__ear{height:80%;top:1%;width:10%;--depth: calc(var(--head-depth) * .2);--color: var(--blue-4)}.optimus__ear--left{left:0%}.optimus__ear--right{right:0%}.optimus__mohawk{width:25%;height:25%;left:50%;translate:-50% 0;bottom:58%;--depth: calc(var(--head-depth) * 1);--color: var(--blue-2)}.optimus__helmet-side-guard{width:100%;height:100%;transform:translateZ(calc(var(--head-depth) * -.15vmin));--depth: calc(var(--head-depth) * .6);--color: var(--blue-3)}.optimus__helmet-mouth-guard{width:100%;bottom:0;height:50%;--depth: calc(var(--head-depth) * 1);--color: var(--blue-4)}.optimus__helmet-back{width:70%;bottom:12%;height:58%;left:50%;translate:-50% 0;transform:translateZ(calc(var(--head-depth) * -.36vmin));--depth: calc(var(--head-depth) * .2);--color: var(--blue-3)}.optimus__helmet-top{height:12%;width:70%;left:50%;translate:-50% 0;bottom:58%;--depth: calc(var(--head-depth) * .8);--color: var(--blue-1)}.optimus__helmet-side{bottom:12%;width:10%;height:50%}.optimus__helmet-side--left{left:10%}.optimus__helmet-side--right{right:10%}.optimus__head{--head-depth: calc(var(--torso-depth) * .4)}.optimus__head .reference-box{--depth: calc(var(--torso-depth) * .4)}.arms{height:100%;width:100%;transform:translateZ(calc(var(--torso-depth) * .1vmin))}.arm{height:20%;width:var(--fist-width);top:calc(var(--fist-width) * .5)}.arm-bar{position:absolute;left:0;height:100%;width:100%}.arm-cube{height:100%;width:100%;--depth: calc(var(--torso-depth) * .1);--color: var(--grey-4)}.arm--right .arm-bar{left:0}.arm--left .arm-bar{right:0}.shoulder-port{width:var(--fist-width);aspect-ratio:1;top:50%;transform-origin:0 50%}.shoulder-gesture{height:100%;width:100%}.arm--right .shoulder-port{left:100%}.arm--left .shoulder-port{right:100%}.shoulder{height:100%;width:100%;--depth: var(--fist-dimension);--color: var(--red-1)}.bicep{width:100%;height:calc(var(--cab-height) + var(--grill-height));top:0%;left:50%;translate:-50% 0}.bicep__strut{--depth: calc(var(--fist-dimension) * .4);--color: var(--grey-2);width:40%;height:calc(100% - (var(--fist-width) * .6));left:50%;top:calc(var(--fist-width) * .2);translate:-50% 0}.arm--right .forearm{right:0}.arm--left .forearm{left:0}.forearm{height:calc(var(--grill-height) * 1);bottom:0;width:calc((var(--torso-depth) * .7vmin) + var(--fist-width))}:is(.forearm-cradle,.forearm-gesture){height:100%;width:100%}.forearm-cap{width:18%;height:100%;left:62%;--depth: calc(var(--fist-dimension) * .75);--color: var(--red-5)}.forearm-shell{width:90%;height:100%;right:0;z-index:2;--color: var(--red-1);--depth: var(--fist-dimension)}.forearm-shell .cuboid__side:nth-of-type(4){display:none}.forearm-shell .cuboid__side:nth-of-type(3){-webkit-mask:linear-gradient(90deg,white 10%,transparent 10% 58%,white 58%);mask:linear-gradient(90deg,white 10%,transparent 10% 58%,white 58%)}.forearm-shell .cuboid__side:nth-of-type(6),.forearm-shell .cuboid__side:nth-of-type(5){clip-path:polygon(0 0,0% 100%,12% 100%,16% 55%,54% 55%,58% 100%,100% 100%,100% 0)}.forearm-shell .cuboid__side:nth-of-type(6){--b: .7;clip-path:polygon(100% 0,100% 100%,88% 100%,84% 55%,46% 55%,42% 100%,0% 100%,0 0)}.forearm-strut{width:70%;height:calc(var(--fist-width) * .32);right:calc(var(--fist-width) * .5);top:50%;translate:0 -50%;--depth: calc(var(--fist-dimension) * .32);--color: var(--grey-3)}.fist{height:100%;left:10%;width:10%;top:0%;transform-origin:0 50%;--depth: var(--fist-dimension);--color: var(--red-2)}.fist>.cuboid>.cuboid__side:nth-of-type(3){--b: 1.1;background:var(--red-1)}.fist>.cuboid>.cuboid__side:nth-of-type(2):after{content:"";position:absolute;height:30%;width:60%;top:50%;left:50%;translate:-50% -50%;border:calc(var(--cab-height) * .05) solid var(--grey-1)}.hand{top:50%;left:50%;width:50%;aspect-ratio:1;translate:-50% -50%;rotate:-20deg;transform:translateZ(calc(var(--fist-dimension) * -.25vmin));--depth: calc(var(--fist-dimension) * .5);--color: var(--blue-5)}.arm--left .hand{rotate:20deg}.core--lower{width:var(--cab-width);height:100%;translate:-50% 0;left:50%}.optimus__hips{width:100%;height:100%}.hip{position:absolute;width:var(--fist-width);aspect-ratio:1;bottom:50%}.optimus__axle{height:100%;width:calc(100% - (var(--size) * .4vmin));background:#ff0;left:50%;translate:-50% 0;--depth: var(--core-height);--color: var(--grey-4)}.hip__grill{height:calc(var(--core-height) * 1vmin);width:100%;transform:translateZ(calc(var(--core-height) * .5vmin));top:0;--depth: calc(var(--core-height) * 2);--color: var(--grey-4)}.hip__grill .cuboid__side:nth-of-type(1):after{content:"";height:25%;width:25%;background:var(--orange);position:absolute;top:50%;translate:0 -50%}.hip--left .hip__grill .cuboid__side:nth-of-type(1):after{left:10%}.hip--right .hip__grill .cuboid__side:nth-of-type(1):after{right:10%}.hip__flexor{top:calc(var(--core-height) * 1vmin);height:calc(var(--core-height) * .9vmin);transform:translateZ(calc(var(--core-height) * .5vmin));width:100%;--depth: calc(var(--core-height) * 2);--color: var(--red-4)}.hip__flexor .cuboid__side:nth-of-type(2),.hip__flexor .cuboid__side:nth-of-type(4){background:var(--grey-4)}.hip__flexor-low{top:calc(var(--core-height) * 1vmin);width:60%;bottom:0;--depth: var(--core-height);--color: var(--red-4)}.hip--right .hip__flexor-low{left:0}.hip--left .hip__flexor-low,.hip--right{right:0}.hip--left{left:0}.holster-wheel{width:calc(var(--size) * 1.25vmin);aspect-ratio:1;top:calc(var(--core-height) * .5vmin);transform:translateY(0) rotateY(90deg);--depth: var(--wheel-depth)}.holster-wheel--rear-one{top:40%}.holster-wheel--rear-two{top:75%}.wheel{transform:translateZ(calc(var(--depth) * .5vmin));height:100%;width:100%}.leg__bottom .holster-wheel--left .wheel{transform:translateZ(calc(var(--depth) * 1vmin))}.leg__bottom .holster-wheel--right .wheel{transform:translateZ(calc(var(--depth) * -0vmin))}.wheel__side{height:100%;width:100%;background:#000;border-radius:50%;transform:translateZ(calc((var(--depth) * -.1vmin) * var(--index)))}.wheel:before,.wheel:after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at center,var(--grey-1) 30%,transparent 30.5%),radial-gradient(circle at center,silver 40%,#000 40.5%) #000}.wheel:before{transform:translateZ(calc(var(--depth) * -1vmin))}.holster-wheel--right{left:0;translate:-50% -50%}.holster-wheel--left{right:0;translate:50% -50%}.optimus__leg{transform-origin:50% 0;height:calc(var(--leg-height) * 1vmin);width:50%}.optimus__leg--left{left:0}.optimus__leg--right{right:0}.optimus__grill-hinge{width:calc(var(--size) * 1vmin);height:100%;translate:-50% 0;transform-origin:50% 50%;left:50%}.optimus__plate{width:100%;height:200%;transform:translateZ(calc((var(--torso-depth) * .45vmin) - (var(--core-height) * .5vmin))) rotateX(0);--depth: calc(var(--core-height) * 2);--color: var(--grey-1)}.optimus__plate .cuboid__side:nth-of-type(5):after{content:"JH3YY";font-family:monospace;font-weight:700;padding:calc(var(--core-height) * .2vmin);background:var(--blue-5);color:var(--orange);position:absolute;top:50%;left:50%;translate:-50% -50%}.tank{height:24%;width:calc(var(--wheel-depth) * 1vmin);top:0;translate:0 -25%;--depth: calc(var(--wheel-depth) * 1);--color: var(--grey-4)}.tank .cuboid__side:nth-of-type(2),.tank .cuboid__side:nth-of-type(4){background:repeating-linear-gradient(90deg,var(--grey-3) 0 15%,var(--grey-5) 15% 20%)}.optimus__leg--left .tank{right:100%}.optimus__leg--right .tank{left:100%}.boot{width:100%;height:16%;bottom:0;left:50%;translate:-50% 0;--depth: calc(var(--size) * 1);--color: var(--blue-5)}.foot{height:100%;width:100%;transform:translateZ(calc(var(--size) * -.5vmin))}.optimus__belt{width:calc(100% - (var(--wheel-depth) * 1.5vmin));height:260%;left:50%;translate:-50% 0;transform:translateZ(calc(var(--size) * -.5vmin));--depth: calc(var(--size) * 1);--color: var(--grey-4)}.belt__segments{height:100%;width:100%;display:grid;grid-template:1fr 1fr / 1fr 2fr 1fr;gap:calc(var(--core-height) * .25vmin);padding:calc(var(--core-height) * .5vmin)}.belt__segment{position:static;background:var(--orange);width:100%;height:100%;max-width:100%}.belt__segment:nth-of-type(2){grid-row:span 2}.belt__segment:nth-of-type(4){clip-path:polygon(0 0,100% 0,100% 100%,0 40%)}.belt__segment:nth-of-type(5){clip-path:polygon(0 0,100% 0,100% 40%,0 100%)}.wheel-arch{height:75%;width:100%;top:20%;transform:translateZ(calc(var(--size) * -.65vmin));--color: var(--blue-5);--depth: calc(var(--size) * .5)}.wheel-arch .cuboid__side:nth-of-type(5){display:none}.optimus__leg--right .wheel-arch .cuboid__side:nth-of-type(2),.optimus__leg--left .wheel-arch .cuboid__side:nth-of-type(4){background:linear-gradient(270deg,var(--blue-5) 45%,transparent 20%),linear-gradient(var(--blue-5) 5%,transparent 5% 95%,var(--blue-5) 95%)}.optimus__leg--right .wheel-arch .cuboid__side:nth-of-type(6):after,.optimus__leg--left .wheel-arch .cuboid__side:nth-of-type(6):after{content:"";width:40%;height:70%;background:repeating-linear-gradient(var(--grey-4) 0 2%,var(--grey-1) 2% 10%),var(--grey-1);position:absolute;top:50%;left:50%;translate:-50% -60%}.optimus__leg--left .wheel-arch{translate:calc(var(--wheel-depth) * -.5vmin) 0;left:0}.optimus__leg--right .wheel-arch{translate:calc(var(--wheel-depth) * .5vmin) 0;right:0}.leg__top{width:calc(100% - (var(--wheel-depth) * 2vmin));width:calc(var(--size) * .9vmin);height:40%;left:50%;translate:-50% 0;--depth: calc(var(--size) * .9);--color: var(--grey-2)}.leg__bottom{top:40%;width:calc(100% - (var(--wheel-depth) * 1vmin));height:60%;left:50%;translate:-50% 0;--depth: calc(var(--size) * 1.1);--color: var(--blue-4)}.sock{height:100%;width:100%}.cuboid{width:100%;height:100%;position:relative}.cuboid__side--no-filter{filter:none!important}.cuboid__side{background:var(--color);filter:brightness(var(--b, 1));position:absolute}.cuboid__side:nth-of-type(1){--b: 1.1;height:calc(var(--depth, 20) * 1vmin);width:100%;top:0;transform:translateY(-50%) rotateX(90deg)}.cuboid__side:nth-of-type(2){--b: .9;height:100%;width:calc(var(--depth, 20) * 1vmin);top:50%;right:0;transform:translate(50%,-50%) rotateY(90deg)}.cuboid__side:nth-of-type(3){--b: .5;width:100%;height:calc(var(--depth, 20) * 1vmin);bottom:0;transform:translateY(50%) rotateX(90deg)}.cuboid__side:nth-of-type(4){--b: 1;height:100%;width:calc(var(--depth, 20) * 1vmin);left:0;top:50%;transform:translate(-50%,-50%) rotateY(90deg)}.cuboid__side:nth-of-type(5){--b: .8;height:100%;width:100%;transform:translateZ(calc(var(--depth, 20) * .5vmin));top:0;left:0}.cuboid__side:nth-of-type(6){--b: 1.2;height:100%;width:100%;transform:translateZ(calc(var(--depth, 20) * -.5vmin)) rotateY(180deg);top:0;left:0}.optimus__head-door{background:var(--red-1);height:calc(var(--torso-depth) * .42vmin);width:102%;transform-origin:50% 0;transform:rotateX(90deg) translateY(calc(var(--torso-depth) * -.1vmin))}.optimus__head-base{height:calc(var(--torso-depth) * .4vmin);width:100%;background:var(--red-5);transform-origin:50% 100%;transform:rotateX(90deg) translateY(50%);bottom:0}.arm--right{translate:50% -50%;right:0;transform-origin:0 50%}.arm--left{left:0;transform-origin:100% 50%;translate:-50% -50%}.arm--right{--arm-destination: 90deg;--arm-tilt: 89deg;--shoulder-multiplier: -.1vmin;--bar-multiplier: -.1}.arm--left{--arm-destination: -90deg;--arm-tilt: -89deg;--shoulder-multiplier: .1vmin;--bar-multiplier: .1}.arm--right .forearm{transform-origin:calc(100% - (var(--fist-width) * .5)) 50%}.arm--left .forearm{transform-origin:calc(var(--fist-width) * .5) 50%}.forearm-flip{height:100%;width:100%;transform:rotateY(180deg)}.bracket{width:25%;rotate:90deg;top:50%;left:50%;translate:-100% -50%;opacity:.8}.arm--right :is(.forearm-cradle,.forearm-gesture){transform-origin:calc(100% - (var(--fist-width) * .5)) 50%}.arm--left :is(.forearm-cradle,.forearm-gesture){transform-origin:calc(var(--fist-width) * .5) 50%}:root{--transform: 1}:root:has(:checked){--transform: 0}:root{--transition-speed: .35s}.scene--optimus{transform:translate3d(0,calc(((1 - var(--transform)) * (var(--leg-height)) * .45) * -1vmin),200vmin) rotateX(calc(var(--optimus-rotation-y, 0) * 1deg)) rotateY(calc(var(--optimus-rotation-x, 0) * 1deg)) rotateX(calc(var(--transform, 0) * -90deg)) scale(var(--optimus-scale, 1)) scaleZ(var(--optimus-scale, 1))}.core--lower{transform:rotateY(calc((1 - var(--transform)) * -180deg))}.fist>.cuboid>.cuboid__side:nth-of-type(2):after{background:hsl(0 0% calc(((80 + (var(--transform) * 20)) * 1%)))}.boot{transform:translateZ(calc(var(--size) * -.5vmin)) rotateX(calc(var(--transform) * 120deg))}.chest .cuboid__side:nth-of-type(2):after,.chest .cuboid__side:nth-of-type(4):after{width:calc(30% + (var(--transform) * 20%))}.forearm-cradle{transform:rotate(calc((1 - var(--transform, 0)) * (var(--arm-destination) * -1)))}.forearm-shell .cuboid__side:nth-of-type(2){clip-path:inset(calc((1 - var(--transform, 0)) * 100%) 0 0 0)}.forearm-shell .cuboid__side:nth-of-type(1){--b: .9;clip-path:inset(0 calc((1 - var(--transform)) * 25%) 0 0)}.fist{rotate:calc(var(--transform) * -180deg)}.shoulder-port{translate:calc((var(--torso-depth) * (var(--transform, 0) * var(--bar-multiplier))) * 1vmin) -50%}.arm{transform:rotateY(calc(var(--transform) * var(--arm-destination)))}.arm-bar{translate:calc((var(--torso-depth) * (var(--transform) * var(--bar-multiplier))) * 1vmin)}.forearm{transform:rotateY(calc((1 - var(--transform, 0)) * (var(--arm-tilt))))}.optimus__head-door{clip-path:inset(0 0 calc((1 - var(--transform, 0)) * 100%) 0)}.optimus__helmet{transform:translateZ(calc(var(--torso-depth) * .1vmin)) translateY(calc((1 - var(--transform, 0)) * -100%))}.optimus__head-twist{height:100%;width:100%;transform:rotateY(calc((1 - var(--transform)) * 25deg))}.core--upper{transform-origin:50% 50%;transform:rotateX(calc(var(--transform) * 90deg))}.arm--right .forearm-gesture{rotate:calc((1 - var(--transform)) * 70deg)}.arm--right .shoulder-gesture{transform:rotateX(calc((1 - var(--transform)) * 20deg)) rotateY(calc((1 - var(--transform)) * 20deg)) rotate(calc((1 - var(--transform)) * -10deg))}.arm--right .hand{rotate:calc(-20deg + ((1 - var(--transform)) * -80deg))}.arm--left .shoulder-gesture{transform:rotateX(calc((1 - var(--transform)) * 10deg)) rotateY(calc((1 - var(--transform)) * -20deg)) rotate(calc((1 - var(--transform)) * 16deg))}.arm--left .forearm-gesture{rotate:calc((1 - var(--transform)) * -20deg)}.hand__fist{height:100%;width:100%}main{transition:scale .25s}[data-command=true] main{scale:1.25;transform-origin:50% -25%}.hand__fingers{width:150%;height:25%;background:orange;left:50%;translate:-50% 50%;--depth: calc(var(--fist-dimension) * .25)}.optimus__grill-hinge{transform:rotateX(calc(var(--transform) * 90deg))}:root:has(:checked) :is(.scene-roller){transition:transform var(--transition-speed) calc(var(--transition-speed) * 0)}:root:has(:checked) .fist>.cuboid>.cuboid__side:nth-of-type(2):after{transition:transform var(--transition-speed) calc(var(--transition-speed) * 1),clip-path var(--transition-speed) calc(var(--transition-speed) * 1),rotate var(--transition-speed) calc(var(--transition-speed) * 1),translate var(--transition-speed) calc(var(--transition-speed) * 1)}:root:has(:checked) :is(.arm-bar,.forearm){transition:transform var(--transition-speed) calc(var(--transition-speed) * 1),clip-path var(--transition-speed) calc(var(--transition-speed) * 1),rotate var(--transition-speed) calc(var(--transition-speed) * 1),translate var(--transition-speed) calc(var(--transition-speed) * 1)}:root:has(:checked) .chest .cuboid__side:nth-of-type(2):after,:root:has(:checked) .chest .cuboid__side:nth-of-type(4):after{transition:width var(--transition-speed) calc(var(--transition-speed) * 1.5)}:root:has(:checked) :is(.arm,.shoulder-port,.optimus__head-door,.fist,.forearm-shell .cuboid__side:nth-of-type(1),.forearm-shell .cuboid__side:nth-of-type(2),.boot){transition:transform var(--transition-speed) calc(var(--transition-speed) * 1.5),clip-path var(--transition-speed) calc(var(--transition-speed) * 1.5),rotate var(--transition-speed) calc(var(--transition-speed) * 1.5),translate var(--transition-speed) calc(var(--transition-speed) * 1.5)}:root:has(:checked) :is(.optimus__helmet,.optimus__grill-hinge,.core--upper){transition:transform var(--transition-speed) calc(var(--transition-speed) * 2),clip-path var(--transition-speed) calc(var(--transition-speed) * 2),rotate var(--transition-speed) calc(var(--transition-speed) * 2),translate var(--transition-speed) calc(var(--transition-speed) * 2)}:root:has(:checked) :is(.forearm-cradle,.core--lower,.scene--optimus){transition:transform var(--transition-speed) calc(var(--transition-speed) * 2.5),clip-path var(--transition-speed) calc(var(--transition-speed) * 2.5),rotate var(--transition-speed) calc(var(--transition-speed) * 2.5),translate var(--transition-speed) calc(var(--transition-speed) * 2.5)}:root:has(:checked) :is(.arm--right .forearm-gesture,.arm--right .shoulder-gesture,.arm--left .shoulder-gesture,.arm--left .forearm-gesture,.arm--right .hand,.optimus__head-twist){transition:transform var(--transition-speed) calc(var(--transition-speed) * 3.5),clip-path var(--transition-speed) calc(var(--transition-speed) * 3.5),rotate var(--transition-speed) calc(var(--transition-speed) * 3.5),translate var(--transition-speed) calc(var(--transition-speed) * 3.5)}:is(.forearm-cradle,.core--lower,.scene--optimus,.arm--right .forearm-gesture,.arm--right .shoulder-gesture,.arm--right .hand,.arm--left .shoulder-gesture,.arm--left .forearm-gesture,.optimus__head-twist){transition:transform var(--transition-speed) calc(var(--transition-speed) * 0),clip-path var(--transition-speed) calc(var(--transition-speed) * 0),rotate var(--transition-speed) calc(var(--transition-speed) * 0),translate var(--transition-speed) calc(var(--transition-speed) * 0)}:is(.optimus__helmet,.optimus__grill-hinge,.core--upper){transition:transform var(--transition-speed) calc(var(--transition-speed) * 1),clip-path var(--transition-speed) calc(var(--transition-speed) * 1),rotate var(--transition-speed) calc(var(--transition-speed) * 1),translate var(--transition-speed) calc(var(--transition-speed) * 1)}.chest .cuboid__side:nth-of-type(2):after,.chest .cuboid__side:nth-of-type(4):after{transition:width var(--transition-speed) calc(var(--transition-speed) * 1.5)}:is(.arm,.shoulder-port,.optimus__head-door,.fist,.forearm-shell .cuboid__side:nth-of-type(1),.forearm-shell .cuboid__side:nth-of-type(2),.boot){transition:transform var(--transition-speed) calc(var(--transition-speed) * 1.5),clip-path var(--transition-speed) calc(var(--transition-speed) * 1.5),rotate var(--transition-speed) calc(var(--transition-speed) * 1.5),translate var(--transition-speed) calc(var(--transition-speed) * 1.5)}:is(.arm-bar,.forearm){transition:transform var(--transition-speed) calc(var(--transition-speed) * 2),clip-path var(--transition-speed) calc(var(--transition-speed) * 2),rotate var(--transition-speed) calc(var(--transition-speed) * 2),translate var(--transition-speed) calc(var(--transition-speed) * 2)}.fist>.cuboid>.cuboid__side:nth-of-type(2):after{transition:background var(--transition-speed) calc(var(--transition-speed) * 4),transform var(--transition-speed) calc(var(--transition-speed) * 4),clip-path var(--transition-speed) calc(var(--transition-speed) * 4),rotate var(--transition-speed) calc(var(--transition-speed) * 4),translate var(--transition-speed) calc(var(--transition-speed) * 4)}.scene-roller{transition:transform var(--transition-speed) calc(var(--transition-speed) * 4.5)}.scene-roller{transform:translate3d(0,calc((var(--transform)) * (var(--leg-height) * -.4vmin)),0)}:root:has(:checked)[data-transformed] .scene-jumper{animation:jump var(--transition-speed) calc(var(--transition-speed) * 2.5)}:root:has(:checked) .arm--right .hand{animation:ehhh 1s calc(var(--transition-speed) * 6) infinite linear}@keyframes ehhh{50%{transform:rotate(-35deg)}}@keyframes jump{50%{transform:translateY(calc(var(--core-height) * -10vmin))}}.optimus__mouth{animation:mouth-breathe 3s infinite linear}.optimus__face .cuboid__side:nth-of-type(5):after{animation:blink 6s -2s infinite}@keyframes mouth-breathe{50%{translate:-50% 5%}}@keyframes blink{0%,46%,48%,50%,to{scale:1 1}47%,49%{scale:1 .01}}div.tp-dfwv{z-index:9999}div.tp-dfwv .tp-rotv{max-height:calc(100vh - 16px);overflow:auto;border-radius:var(--bs-br)}div.tp-dfwv .tp-rotv>.tp-rotv_b{position:sticky;top:0;z-index:2;background:#45474c}