.assembly-stage { height: 280svh; --assembly-progress: 0; }
.assembly-stage .stage-pin { height: calc(100svh - 62px - var(--notice-h, 0px)); min-height: 540px; top: 62px; }
.assembly-stage .stage-art-wrap { position: relative; width: min(1200px, 100%); }
.assembly-view { position: absolute; inset: 0; container-type: size; }
.assembly-view canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; opacity: 0; transition: opacity .18s ease; }
.assembly-poster { position: absolute; inset: 0; background: var(--assembly-loading-image, url('/static/models/poster-desktop.webp?v=10')) center / contain no-repeat; }
.assembly-ready .assembly-view canvas { opacity: 1; }
.assembly-ready .assembly-poster { visibility: hidden; transition: visibility 0s linear .18s; }
.assembly-restoring .assembly-stage { --assembly-progress: var(--assembly-restore-progress, 0); }
.assembly-stage:not(.assembly-ready) :is([data-assembly-toggle], [data-assembly-effects], .assembly-scrub, .assembly-callouts) { visibility: hidden; }
@container (max-aspect-ratio: 1.15) {
  .assembly-poster { background-image: var(--assembly-loading-image, url('/static/models/poster-portrait.webp?v=10')); }
}
.assembly-stage .copy-a, .assembly-stage .copy-b { animation: none; }
.assembly-stage .copy-a { opacity: calc(1 - var(--assembly-progress)); }
.assembly-stage .copy-b { opacity: var(--assembly-progress); }
.assembly-key { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 26px; font: 12px var(--f-mono); padding: 9px 0 16px; }
.assembly-key a { color: var(--ink); }
.assembly-key b { color: var(--violet); margin-right: 5px; }
.assembly-key a:hover { text-decoration: underline; text-underline-offset: 4px; }
.assembly-scrub { display: flex; align-items: center; gap: 10px; font: 10px var(--f-mono); color: var(--muted); }
.assembly-scrub input { width: 130px; accent-color: var(--violet); cursor: ew-resize; }
.assembly-stage .stage-foot label { padding: 0; height: auto; border: 0; }
.assembly-stage .stage-foot label input { position: static; width: 130px; height: 24px; opacity: 1; }
.assembly-stage .stage-foot button { display: inline-flex; }
.assembly-stage [data-assembly-toggle] { min-width: 142px; }
.assembly-stage [data-assembly-effects] { min-width: 132px; }
.assembly-stage [hidden], .assembly-fallback .assembly-scrub, .assembly-fallback [data-assembly-toggle] { display: none !important; }
@media (max-width: 900px) {
  .assembly-stage { height: 240svh; }
  .assembly-stage .stage-pin { position: sticky; min-height: 500px; padding-inline: 16px; }
  .assembly-stage .stage-head .lockup { font-size: clamp(3rem, 10vw, 6rem); }
  .assembly-stage .stage-head .origin { font-size: 9px; letter-spacing: .06em; }
  .assembly-key { gap: 8px 16px; font-size: 10px; padding-bottom: 10px; }
  .assembly-stage .stage-foot { gap: 8px 12px; }
}
@media (max-height: 650px) and (min-width: 700px) {
  .assembly-stage .stage-pin { min-height: 380px; }
  .assembly-stage .stage-head .lockup { font-size: 3rem; }
}
@media (prefers-reduced-motion: reduce) {
  .assembly-stage { height: auto; }
  .assembly-stage .stage-pin { position: relative; top: auto; height: 85svh; }
  .assembly-stage .copy-a { opacity: 0; }
  .assembly-stage .copy-b { opacity: 1; }
  .assembly-poster { background-image: var(--assembly-loading-image, url('/static/models/poster-desktop-reduced.webp?v=10')); }
  .assembly-view canvas, .assembly-ready .assembly-poster { transition: none; }
  @container (max-aspect-ratio: 1.15) {
    .assembly-poster { background-image: var(--assembly-loading-image, url('/static/models/poster-portrait-reduced.webp?v=10')); }
  }
}

/* Labels follow named 3D roots, ready for expanded descriptions. */
.assembly-callouts { position:absolute; inset:0; pointer-events:none; opacity:clamp(0, calc((var(--assembly-progress) - .84) * 8), 1); }
.assembly-callouts span { position:absolute; transform:translateX(-50%); white-space:nowrap; font:10px var(--f-mono); letter-spacing:.08em; color:var(--muted); border-top:1px solid var(--hair-md); padding-top:5px; }
.assembly-fallback [data-assembly-effects] { display:none !important; }
@media(max-width:600px) { .assembly-callouts span { font-size:8px; letter-spacing:.02em; padding-top:3px; } }