[data-production-sequence] figure{transition:opacity .3s ease}
[data-production-sequence].is-sequenced figure{opacity:.56}
[data-production-sequence].is-sequenced figure.is-current{opacity:1}
[data-production-sequence] figure svg{display:block;width:100%;height:auto}
[data-production-sequence] figcaption{position:relative}
[data-production-sequence].is-sequenced figure.is-current figcaption::before{content:"";position:absolute;top:-1px;left:0;right:0;height:1px;background:#fff;transform-origin:left;animation:production-progress var(--stage-duration) linear both;animation-play-state:paused}
[data-production-sequence].is-sequenced figure.is-current::after{color:#fff}
[data-production-sequence] .production-spark{opacity:.25}
[data-production-sequence].is-sequenced figure.is-current .production-spark{animation:production-weld .6s ease-in-out infinite;animation-play-state:paused}
[data-production-sequence] figure:nth-child(2).is-current .production-hoist,
[data-production-sequence] figure:nth-child(2).is-current .production-load{animation:production-lift 1.5s ease-in-out infinite;animation-play-state:paused}
[data-production-sequence] figure:nth-child(3).is-current .production-arms{animation:production-celebrate 1.25s ease-in-out infinite;animation-delay:var(--gesture-delay,0s);animation-play-state:paused}
[data-production-sequence].is-running figure.is-current figcaption::before,
[data-production-sequence].is-running figure.is-current .production-spark,
[data-production-sequence].is-running figure.is-current .production-hoist,
[data-production-sequence].is-running figure.is-current .production-load,
[data-production-sequence].is-running figure.is-current .production-arms{animation-play-state:running}
.production-motion-control{justify-self:end;grid-column:1/-1;border:1px solid #555;padding:8px 12px;color:#bbb;background:transparent;font-family:inherit;font-size:12px;line-height:1.4;cursor:pointer;min-height:36px}
.production-motion-control:hover{color:#fff;border-color:#aaa}
.production-motion-control:focus-visible{outline:2px solid #fff;outline-offset:4px}
.production-motion-control[hidden]{display:none}
@keyframes production-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes production-weld{0%,100%{opacity:.15}35%,60%{opacity:1}48%{opacity:.5}}
@keyframes production-lift{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes production-celebrate{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(7deg)}}
@media(prefers-reduced-motion:reduce){
  [data-production-sequence] figure{opacity:1!important;transition:none}
  [data-production-sequence] .production-spark{opacity:.7}
  [data-production-sequence] *{animation:none!important}
  [data-production-sequence] figcaption::before{display:none}
  .production-motion-control{display:none}
}
