/* A production diagram that follows the adjacent steps, not separate image planes. */
.compact-production{align-items:start;position:relative}.workflow-study{position:sticky;top:110px;margin:0;border:1px solid #aac0b039;background:#142f34;overflow:hidden;border-radius:3px;box-shadow:0 24px 65px #0002}.workflow-tabs{display:flex;border-bottom:1px solid #aac0b039;padding:7px 10px;gap:2px;justify-content:space-between}.workflow-tabs button{font-size:14px;padding:12px 7px;line-height:1.3;color:#bdcdc5;border-bottom:2px solid transparent;min-height:44px;white-space:nowrap}.workflow-tabs button[aria-pressed=true]{color:#e4ad83;border-bottom-color:#e4ad83}.workflow-tabs button:hover{background:#ffffff09}.workflow-art{padding:0 12px}.workflow-art>svg{display:block;width:100%;height:auto;aspect-ratio:600/430;fill:none;stroke:none;overflow:visible}.workflow-art text{fill:#b4c8bd;font-size:13px;font-family:var(--sans);letter-spacing:.04em;stroke:none}.wf-faint{fill:none;stroke:#64817c;stroke-width:1.2}.wf-copper{fill:none;stroke:#e4ad83;stroke-width:1.5}.wf-panel{opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .5s,transform .6s,visibility .5s}.workflow-study[data-stage="0"] .wf-sources,.workflow-study[data-stage="1"] .wf-city,.workflow-study[data-stage="2"] .wf-city,.workflow-study[data-stage="3"] .wf-film,.workflow-study[data-stage="4"] .wf-headset{opacity:1;visibility:visible;transform:none}.wf-actors{opacity:0;transition:opacity .7s}.workflow-study[data-stage="2"] .wf-actors{opacity:1}.workflow-study[data-stage="2"] .wf-sphere{opacity:.25}.workflow-study[data-stage="2"] .wf-camera>path{opacity:0}.workflow-study[data-stage="0"] .wf-photo{animation:sourceAlign 1.4s ease-out both}.workflow-study[data-stage="0"] .wf-match{animation:sourceTrace 2s ease-out both;stroke-dasharray:6 7}.workflow-study[data-stage="1"] .wf-buildings{animation:buildLines 1.8s ease-out both}.workflow-study[data-stage="2"] .wf-walker{animation:actorWalk 6s ease-in-out infinite alternate}.workflow-study[data-stage="2"] .wf-car{animation:actorDrive 8s ease-in-out infinite alternate}.workflow-study[data-stage="3"] .wf-playhead{animation:filmScan 7s linear infinite}.workflow-study[data-stage="4"] .wf-head-turn{transform-box:fill-box;transform-origin:center;animation:headLook 6s ease-in-out infinite alternate}.workflow-study figcaption{padding:20px 24px 0;border-top:1px solid #aac0b025}.workflow-study figcaption strong{display:block;font-family:var(--serif);font-size:28px;font-weight:400;color:#efeada}.workflow-study figcaption p{font-size:17px;line-height:1.6;color:#c1cec6;margin:12px 0 0;min-height:82px}.workflow-hint{font-size:12px;line-height:1.6;color:#9cb2ab;padding:15px 24px 22px;margin:0}.production-notes button{padding:0;text-align:left;font-weight:500;font-size:22px;color:inherit;line-height:1.3}.production-notes button:hover{color:#e4ad83}.production-notes li{transition:color .3s,border-color .3s}.production-notes li.production-active{border-left-color:#e4ad83}.production-notes li.production-active button{color:#e4ad83}.production-notes:after{display:none!important}.workflow-study:not(.workflow-visible) *{animation-play-state:paused!important}.reduce-motion .workflow-study *{animation:none!important;transition:none!important}
@keyframes sourceAlign{from{transform:translate(30px,-15px) rotate(4deg)}to{transform:none}}@keyframes sourceTrace{from{stroke-dashoffset:110}to{stroke-dashoffset:0}}@keyframes buildLines{from{stroke-dasharray:800;stroke-dashoffset:800;fill-opacity:0}to{stroke-dasharray:800;stroke-dashoffset:0;fill-opacity:1}}@keyframes actorWalk{from{transform:translateX(0)}to{transform:translateX(50px)}}@keyframes actorDrive{from{transform:translateX(0)}to{transform:translateX(195px)}}@keyframes filmScan{from{transform:translateX(0)}to{transform:translateX(380px)}}@keyframes headLook{from{transform:perspective(700px) rotateY(-15deg)}to{transform:perspective(700px) rotateY(15deg)}}
@media(max-width:1100px){.workflow-tabs button{font-size:12px;padding-inline:4px}.workflow-study figcaption{padding-inline:18px}.workflow-study figcaption strong{font-size:25px}.workflow-study figcaption p{font-size:16px}.workflow-hint{padding-inline:18px}}
@media(max-width:800px){.compact-production{grid-template-columns:1fr}.workflow-study{position:relative;top:auto;grid-row:1;max-width:600px;width:100%;margin-inline:auto}.workflow-art{padding:0 8px}.workflow-tabs button{font-size:13px}.workflow-study figcaption p{min-height:0;font-size:17px}.workflow-hint{font-size:12px}.production-notes button{font-size:20px}}
@media(prefers-reduced-motion:reduce){.workflow-study *{animation:none!important;transition:none!important}}
