/* Animate layers of the original pixel artwork without redrawing its geometry. */
.machine-stage{--cycle:3.6s}
.processing .machine-stage{--cycle:1.2s}
.machine,.processing .machine{animation:none;overflow:visible;aspect-ratio:1;transform:none}
.machine-head{animation:machine-stroke var(--cycle) steps(8,end) infinite}
.machine-rod{transform-origin:626px 514px;animation:machine-extension var(--cycle) steps(8,end) infinite}
.process-meter i,.process-meter i:nth-child(-n+3),.processing .process-meter i{background:var(--pale);animation:machine-meter var(--cycle) steps(1,end) infinite;animation-delay:calc(var(--cycle) * var(--index) / 8)}
.process-meter i:nth-child(1){--index:0}.process-meter i:nth-child(2){--index:1}.process-meter i:nth-child(3){--index:2}.process-meter i:nth-child(4){--index:3}.process-meter i:nth-child(5){--index:4}.process-meter i:nth-child(6){--index:5}.process-meter i:nth-child(7){--index:6}.process-meter i:nth-child(8){--index:7}
.machine-actions{display:flex;justify-content:center;align-items:center;gap:15px;flex-wrap:wrap;margin-top:4px}
.machine-actions .text-button{font-size:12px}
.machine-actions #machine-motion{color:var(--muted)}
.machine-actions button:disabled{cursor:default;opacity:1}
.machine-paused .machine-head,.machine-paused .machine-rod,.machine-paused .process-meter i,.machine-outside .machine-head,.machine-outside .machine-rod,.machine-outside .process-meter i,.entering .machine-head,.entering .machine-rod,.entering .process-meter i{animation-play-state:paused!important}
@keyframes machine-stroke{0%,18%,84%,100%{transform:translateY(0)}46%,59%{transform:translateY(44px)}}
@keyframes machine-extension{0%,18%,84%,100%{transform:scaleY(1)}46%,59%{transform:scaleY(2.7)}}
@keyframes machine-meter{0%,22%{background:var(--purple)}23%,100%{background:var(--pale)}}
@media(max-width:800px){.machine-actions{gap:8px}.machine-actions .text-button{font-size:11px}}
@media(max-width:580px){.machine-actions{grid-column:2;grid-row:2;display:grid;gap:7px;justify-items:center}.machine-stage .machine-wrap{grid-column:1}.stage-tag{grid-column:2;grid-row:1}}
@media(prefers-reduced-motion:reduce){.machine-head,.machine-rod,.process-meter i,.processing .process-meter i{animation:none!important;transform:none!important}.process-meter i:nth-child(-n+3){background:#a07df1}}