/* c17 — lighter shared geometry and interruptible, coordinated transitions. */
.product-scene--assembly { --assembly-line: #919698; --assembly-faint: #3e4244; --assembly-face: #101213; --assembly-time: 620ms; }
.product-scene--assembly .product-scene__body { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(270px,1fr); align-items: center; gap: 18px; padding: 25px 32px 28px 16px; }
.product-scene--assembly .product-scene__context { min-width: 0; padding-left: 20px; border-left: 1px solid #ffffff12; }
.product-scene--assembly .product-record { margin: 0; width: 100%; background: none; border: 0; box-shadow: none; border-radius: 0; }
.product-scene--assembly .product-record__head { padding: 0 0 15px; min-height: 35px; }
.product-scene--assembly .product-record__body { min-height: 240px; }
.product-scene--assembly .product-panel { padding: 22px 0; transition: opacity 450ms ease, transform 650ms var(--ease-geo); }
.product-scene--assembly .product-record__footer { padding: 14px 0; }
.product-scene--assembly .product-scene__log { position: static; display: grid; margin-top: 18px; width: 100%; }
.product-scene--assembly .product-scene__log li { min-height: 26px; font-size: 10px; }
.product-scene--assembly .product-scene__bottom { background: #ffffff02; }
.assembly { min-width: 0; position: relative; align-self: center; }
.assembly__drawing { display: block; width: 100%; height: auto; overflow: visible; stroke: var(--assembly-line); stroke-width: .85; stroke-linejoin: round; stroke-linecap: round; }
.assembly__drawing text { stroke: none; fill: #a2a6a8; font: 10px var(--mono); letter-spacing: .045em; }
.assembly__floor { stroke: var(--assembly-faint); opacity: .28; }
.assembly__foundation { stroke: #62696c; fill: var(--assembly-face); }
.assembly__object { transition: transform 700ms var(--ease-geo); }
.assembly__layer { transition: transform var(--assembly-time) var(--ease-geo), opacity 320ms ease; }
.assembly__layer--0 { transform: translate(0,0); }
.assembly__layer--1 { transform: translate(0,-24px); opacity: 0; transition-delay: 35ms; }
.assembly__layer--2 { transform: translate(0,-48px); opacity: 0; transition-delay: 70ms; }
.assembly__surface { fill: var(--assembly-face); stroke: var(--assembly-line); }
.assembly__edge { fill: #101213; stroke: #666d70; }
.assembly__print { stroke: #747b7e; stroke-width: .7; }
.assembly__signal { fill: #b2c2b8; stroke: none; }
.assembly__check { stroke: #99c8ab; stroke-width: 1.3; }
.assembly__leader { stroke: #51595c; }
.assembly__drawing .assembly__label { fill: #adb1b2; font-size: 10px; }
.assembly__guides { opacity: 0; stroke: #71797d; stroke-dasharray: 2 6; transition: opacity 550ms ease; }
.assembly__input { stroke: #596164; transition: opacity 650ms; }
.product-scene--assembly:not([data-step="0"]) .assembly__input { opacity: .18; }
.assembly__input-route { stroke: #969f9f; stroke-dasharray: 2 4; }
.assembly__packet { stroke: #b7bebe; fill: #101213; }
.assembly__destination { stroke: #747e7e; stroke-dasharray: 3 6; opacity: .08; transition: opacity 800ms ease; }
.assembly__human { stroke: #adb6b3; opacity: .28; transition: opacity 800ms ease; }
.assembly__human text { fill: #b5bdb8; }
.assembly__input text, .assembly__human text { transition: opacity 450ms ease; }
.product-scene--assembly:not([data-step="0"]) .assembly__input text,
.product-scene--assembly:not([data-step="3"]) .assembly__human text { opacity: 0; }
.assembly__question { opacity: 0; fill: var(--assembly-face); stroke: #e0c16a; transition: opacity 280ms ease, transform 620ms var(--ease-geo); transform: translateY(15px); }
.assembly__question-link { opacity: .45; }
.assembly__question text { fill: #d8c492; }
.assembly__handoff-mark { opacity: 0; stroke: #abc9b5; fill: #101213; transition: opacity 220ms ease; }
.assembly__caption { display: flex; justify-content: space-between; gap: 20px; padding: 6px 16px 0; min-height: 36px; color: #a0a6a7; font-size: 11px; line-height: 1.6; }
.assembly__counter { font: 9px/1.7 var(--mono); color: #747c7f; white-space: nowrap; }
.assembly__caption-build { display: none; }
.product-scene--assembly[data-step="0"].is-visible .assembly__packet { animation: assembly-arrive 700ms var(--ease-geo) both; }
@keyframes assembly-arrive { 0% { transform: translate(-16px,-8px); opacity: 0; } 18% { opacity: 1; } 85%,100% { transform: translate(184px,92px); opacity: 0; } }
.product-scene--assembly:not([data-step="0"]) .assembly__packet { opacity: 0; }
.product-scene--assembly[data-step="1"] .assembly__layer--0 { transform: translateY(0); }
.product-scene--assembly[data-step="1"] .assembly__layer--1 { transform: translateY(-64px); opacity: 1; }
.product-scene--assembly[data-step="1"] .assembly__layer--2 { transform: translateY(-110px); opacity: 0; }
.product-scene--assembly[data-step="1"] .assembly__guides { opacity: .42; }
.product-scene--assembly[data-step="1"] .assembly__question { opacity: 1; transform: translateY(-10px); }
.product-scene--assembly[data-step="2"] .assembly__layer--1,
.product-scene--assembly[data-step="3"] .assembly__layer--1 { opacity: 1; }
.product-scene--assembly[data-step="2"] .assembly__layer--2,
.product-scene--assembly[data-step="3"] .assembly__layer--2 { opacity: 1; }
.product-scene--assembly[data-step="2"] .assembly__signal { fill: #99c8ab; }
.product-scene--assembly[data-step="2"] .assembly__caption-still { display: none; }
.product-scene--assembly[data-step="2"] .assembly__caption-build { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 20px; }
.assembly__scrub { display: inline-flex; align-items: center; gap: 10px; color: #bac0c1; font: 10px var(--mono); }
.assembly__scrub input { appearance: none; width: 84px; height: 2px; margin: 10px 0; background: #50595a; accent-color: #b9c7be; cursor: ew-resize; }
.assembly__scrub input::-webkit-slider-thumb { appearance: none; width: 7px; height: 7px; border: 1px solid #b9c7be; border-radius: 50%; background: #b9c7be; }
.assembly__scrub input::-moz-range-thumb { width: 7px; height: 7px; border: 0; border-radius: 50%; background: #b9c7be; }
.assembly__scrub input:focus-visible { outline: 1px solid #b9c7be; outline-offset: 6px; }
.product-scene--assembly[data-step="3"] .assembly__object { transform: translate(110px,-30px); }
.product-scene--assembly[data-step="3"] .assembly__destination,
.product-scene--assembly[data-step="3"] .assembly__human { opacity: .85; }
.product-scene--assembly[data-step="3"] .assembly__handoff-mark { opacity: 1; transition-delay: 420ms; }
.product-scene--assembly[data-step="3"] .assembly__input { opacity: .2; }
.product-scene--assembly[data-step="3"] .assembly__leader,
.product-scene--assembly[data-step="3"] .assembly__label { opacity: .45; }
.product-scene--assembly[data-step="2"] .assembly[data-preview="true"] .assembly__layer { transition-duration: 180ms; transition-delay: 0ms; }
.product-scene--assembly[data-step="2"] .assembly[data-preview="true"] .assembly__layer--0 { opacity: var(--assembly-alpha-0); transform: translateY(var(--assembly-y-0)); }
.product-scene--assembly[data-step="2"] .assembly[data-preview="true"] .assembly__layer--1 { opacity: var(--assembly-alpha-1); transform: translateY(var(--assembly-y-1)); }
.product-scene--assembly[data-step="2"] .assembly[data-preview="true"] .assembly__layer--2 { opacity: var(--assembly-alpha-2); transform: translateY(var(--assembly-y-2)); }
.product-scene--assembly.product-scene--compact .product-scene__body { grid-template-columns: 1fr; padding: 12px 26px 18px; gap: 10px; }
.product-scene--assembly.product-scene--compact .assembly__drawing { height: 220px; }
.product-scene--assembly.product-scene--compact :is(.assembly__label,.assembly__leader,.assembly__input text,.assembly__human text) { display: none; }
.product-scene--assembly.product-scene--compact .assembly__caption { padding: 0; font-size: 10px; min-height: 24px; }
.product-scene--assembly.product-scene--compact .assembly__counter { display: none; }
.product-scene--assembly.product-scene--compact .product-scene__context { border: 0; padding: 0; }
.product-scene--assembly.product-scene--compact .product-record__body { min-height: 180px; }
.product-scene--assembly.product-scene--compact .product-record__head { font-size: 9px; padding-bottom: 10px; }
.product-scene--assembly.product-scene--compact .product-panel { padding: 15px 0; }
.product-scene--assembly.product-scene--compact .product-record__footer { display: none; }
.product-scene--assembly.product-scene--compact .product-scene__log { display: none; }
.product-scene--assembly.product-scene--compact .product-panel--handoff { justify-content: flex-start; }
.product-scene--assembly.product-scene--compact .product-panel--handoff ul { padding-top: 12px; }
.product-scene--assembly.product-scene--compact .product-handoff-action { margin: 14px 0; }
html[data-motion="reduced"] .product-scene--assembly .assembly__hover-hint { display: none; }
@media(prefers-reduced-motion:reduce) {
 .product-scene--assembly .assembly__hover-hint { display: none; }
}
