/* Schematic construction: four layers, one twelve-second assembly cycle. */
.construction-diagram{--construction-ink:#171918;--construction-paper:#f2f0e9;--construction-orange:#fb5607;width:100%;position:relative;isolation:isolate;overflow:hidden;color:var(--construction-ink)}
.construction-svg{display:block;width:100%;height:auto;overflow:visible;font-family:Arial,Helvetica,sans-serif}
.construction-svg path,.construction-svg circle{vector-effect:non-scaling-stroke}
.construction-shadow{fill:var(--construction-ink);opacity:.035}
.construction-registration{fill:currentColor;font-size:9px;letter-spacing:1.25px;opacity:.5}
.construction-registration path{fill:none;stroke:currentColor;stroke-width:.65}
.construction-guides{fill:none;stroke:currentColor;stroke-width:.65;stroke-dasharray:3 5;opacity:.2}
.construction-layer{transform-box:view-box;transform-origin:center;will-change:translate}
.construction-plane{fill:#e7e8e0;stroke:var(--construction-ink);stroke-width:.9;stroke-linejoin:miter}
.construction-face-left{fill:#d4d7ce;stroke:var(--construction-ink);stroke-width:.75}
.construction-face-right{fill:#b9bfb5;stroke:var(--construction-ink);stroke-width:.75}
.construction-grid{fill:none;stroke:var(--construction-ink);stroke-width:.45;opacity:.15}
.construction-back-wall{fill:#d8dcd2;stroke:var(--construction-ink);stroke-width:.75}
.construction-back-wall-right{fill:#c6ccbf;stroke:var(--construction-ink);stroke-width:.75}
.construction-wall-left{fill:var(--construction-paper);stroke:var(--construction-ink);stroke-width:.85}
.construction-wall-right{fill:#d5d9ce;stroke:var(--construction-ink);stroke-width:.85}
.construction-edge{fill:none;stroke:var(--construction-ink);stroke-width:.8}
.construction-inner-edge{opacity:.4;stroke-width:.65}
.construction-roof-plane{fill:#e9ebe2}
.construction-roof-joint{fill:none;stroke:var(--construction-ink);stroke-width:.5;opacity:.2}
.construction-membrane-plane{fill:var(--construction-orange);stroke:var(--construction-ink);stroke-width:.65}
.construction-membrane-edge{fill:#ce4302;stroke:var(--construction-ink);stroke-width:.55}
.construction-membrane-seams{fill:none;stroke:var(--construction-ink);stroke-width:.6;opacity:.26}
.construction-membrane-trace{fill:none;stroke:var(--construction-ink);stroke-width:1.15;stroke-dasharray:12 88;animation:construction-trace 12s linear infinite;opacity:.62}
.construction-label{font-size:10px;font-weight:600;letter-spacing:.45px;fill:var(--construction-ink)}
.construction-label path{fill:none;stroke:var(--construction-ink);stroke-width:.65;opacity:.55}
.construction-label circle{fill:var(--construction-ink);stroke:none}
.construction-label-number{font-size:9px;font-weight:400;letter-spacing:1px;opacity:.55}
.construction-exploded-label{animation:construction-labels 12s ease-in-out infinite}
.construction-walls{animation:construction-walls 12s cubic-bezier(.45,0,.2,1) infinite}
.construction-roof{animation:construction-roof 12s cubic-bezier(.45,0,.2,1) infinite}
.construction-membrane{animation:construction-membrane 12s cubic-bezier(.45,0,.2,1) infinite}
@keyframes construction-walls{0%,17%,65%,100%{translate:0 0}35%,55%{translate:0 -50px}}
@keyframes construction-roof{0%,11%,71%,100%{translate:0 0}28%,55%{translate:0 -110px}}
@keyframes construction-membrane{0%,7%,77%,100%{translate:0 0}21%,55%{translate:0 -165px}}
@keyframes construction-labels{0%,29%,66%,100%{opacity:0}36%,55%{opacity:1}}
@keyframes construction-trace{0%{stroke-dashoffset:100}100%{stroke-dashoffset:0}}
.construction-diagram[data-assembly-state="paused"] .construction-layer,
.construction-diagram[data-assembly-state="paused"] .construction-exploded-label,
.construction-diagram[data-assembly-state="paused"] .construction-membrane-trace,
html[data-motion="paused"] .construction-layer,
html[data-motion="paused"] .construction-exploded-label,
html[data-motion="paused"] .construction-membrane-trace{animation-play-state:paused}
.construction-diagram[data-assembly-state="reduced"] .construction-layer,
.construction-diagram[data-assembly-state="reduced"] .construction-exploded-label,
.construction-diagram[data-assembly-state="reduced"] .construction-membrane-trace{animation:none;will-change:auto}
.construction-diagram[data-assembly-state="reduced"] .construction-walls{translate:0 -50px}
.construction-diagram[data-assembly-state="reduced"] .construction-roof{translate:0 -110px}
.construction-diagram[data-assembly-state="reduced"] .construction-membrane{translate:0 -165px}
.construction-diagram[data-assembly-state="reduced"] .construction-exploded-label{opacity:1}
.construction-diagram[data-assembly-state="reduced"] .construction-membrane-trace{stroke-dasharray:none;opacity:.25}

a.reference-door{translate:var(--reference-shift-x,0px) var(--reference-shift-y,0px);transition:translate .24s cubic-bezier(.2,.7,.3,1)}
a.reference-door .reference-arrow,a.reference-door [data-reference-arrow]{display:inline-block;transition:translate .32s cubic-bezier(.16,1,.3,1)}
a.reference-door:hover .reference-arrow,a.reference-door:hover [data-reference-arrow],
a.reference-door:focus-visible .reference-arrow,a.reference-door:focus-visible [data-reference-arrow]{translate:4px -4px}
html[data-motion="paused"] a.reference-door,
html[data-motion="paused"] a.reference-door .reference-arrow,
html[data-motion="paused"] a.reference-door [data-reference-arrow]{translate:0 0;transition:none}

.construction-diagram[data-compact="true"] .construction-label{font-size:16px;letter-spacing:-.2px}
.construction-diagram[data-compact="true"] .construction-label-number{font-size:13px;letter-spacing:.5px}
.construction-diagram[data-compact="true"] .construction-registration{display:none}
@media(prefers-reduced-motion:reduce){
  .construction-layer,.construction-exploded-label,.construction-membrane-trace{animation:none!important;will-change:auto}
  .construction-walls{translate:0 -50px!important}
  .construction-roof{translate:0 -110px!important}
  .construction-membrane{translate:0 -165px!important}
  .construction-exploded-label{opacity:1!important}
  .construction-membrane-trace{stroke-dasharray:none;opacity:.25}
  a.reference-door,a.reference-door .reference-arrow,a.reference-door [data-reference-arrow]{translate:0 0!important;transition:none!important}
}
