.teardown-viewer{margin:3rem 0;border-top:1px solid #aaa;padding-top:2rem;color:#202020;scroll-margin-top:100px}.teardown-viewer *{box-sizing:border-box}.teardown-viewer header{max-width:80ch}.teardown-viewer h2{font-size:clamp(1.7rem,3.5vw,2.7rem);line-height:1.1;margin:.5rem 0 1rem}.teardown-eyebrow{text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;font-weight:700}.teardown-viewer p{line-height:1.6}.teardown-toolbar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:1.5rem 0 .8rem}.teardown-states{display:flex;flex-wrap:wrap;gap:.4rem;margin-right:auto}.teardown-viewer button{font:inherit;background:#fff;color:#222;border:1px solid #aaa;padding:.65rem .8rem;min-height:44px;cursor:pointer;border-radius:2px}.teardown-viewer button:hover,.teardown-viewer button[data-preview=true]{background:#ddd}.teardown-viewer button[aria-pressed=true]{background:#222;color:#fff;border-color:#222}.teardown-viewer button:disabled{opacity:.5;cursor:default}.teardown-viewer button:focus-visible,.teardown-viewer canvas:focus-visible,.teardown-viewer summary:focus-visible{outline:3px solid #111;outline-offset:3px}.teardown-layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr);border:1px solid #bbb}.teardown-stage{position:relative;min-width:0;background:#f3f3f3;display:flex;flex-direction:column}.teardown-stage canvas{display:block;width:100%;height:430px;touch-action:pan-y;cursor:grab}.teardown-stage-label{position:absolute;top:14px;left:16px;font-size:12px;color:#555;pointer-events:none}.teardown-hover-label{position:absolute;z-index:2;background:#222;color:#fff;font-size:12px;padding:7px 10px;max-width:150px;pointer-events:none;box-shadow:0 2px 9px #0003}.teardown-camera{display:flex;flex-wrap:wrap;gap:4px;padding:12px;margin-top:auto}.teardown-camera button{padding:.5rem .7rem;background:#fafafa;font-size:14px}.teardown-panel{padding:1.2rem;border-left:1px solid #bbb;background:#fff;min-width:0}.teardown-parts{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.4rem}.teardown-parts button{text-align:left;font-size:.82rem;overflow-wrap:anywhere}.teardown-detail{margin-top:1.4rem;border-top:1px solid #ddd;padding-top:1rem}.teardown-detail h3{font-size:1.1rem;margin:0}.teardown-detail p{font-size:.9rem}.teardown-selection{font-size:.68rem!important;text-transform:uppercase;letter-spacing:.09em;color:#666;margin:0 0 .4rem}.teardown-limit{color:#555}.teardown-detail-source{font-size:.8rem;color:#333}.teardown-status,.teardown-source{font-size:.82rem;color:#555}.teardown-boundary{font-size:.85rem;padding:1rem;background:#f5f5f5;border-left:2px solid #777}.teardown-static{margin:1.25rem 0;border-top:1px solid #ccc;padding-top:1rem}.teardown-static summary{font-weight:600;cursor:pointer;padding:.5rem 0;min-height:44px}.teardown-static dl{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.teardown-static dt{font-weight:700}.teardown-static dd{margin:.4rem 0;line-height:1.5}.teardown-static dd span{color:#555}.teardown-static ol{padding-left:1.2rem;line-height:1.6}.teardown-viewer [hidden]{display:none!important}.teardown-source a{color:inherit}.teardown-viewer{-webkit-tap-highlight-color:rgba(0,0,0,.12)}@media(max-width:900px){.teardown-layout{grid-template-columns:1fr}.teardown-panel{border-left:0;border-top:1px solid #bbb}.teardown-stage canvas{height:350px}.teardown-static dl{grid-template-columns:1fr}.teardown-toolbar button{font-size:.8rem;padding:.55rem}.teardown-stage-label{font-size:11px}}@media(max-width:480px){.teardown-stage canvas{height:310px}.teardown-parts{grid-template-columns:1fr 1fr}.teardown-panel{padding:1rem}.teardown-camera{gap:3px;padding:9px}.teardown-camera button{padding:.4rem .6rem}}@media(max-width:360px){.teardown-parts{grid-template-columns:1fr}}
/* Reference-led studio and a transport directly attached to the scene. */
.teardown-layout{grid-template-columns:minmax(0,2.6fr) minmax(250px,1fr);border-color:#c7c7c7}
.teardown-stage{background:#ececec}
.teardown-stage canvas{height:530px}
.teardown-stage-label{letter-spacing:.08em;text-transform:uppercase;font-size:10px}
.teardown-panel{background:#f9f9f9;padding:1.4rem}
.teardown-parts{grid-template-columns:1fr}
.teardown-parts button{background:transparent;border-width:0 0 1px;border-color:#d6d6d6;border-radius:0;padding:.75rem .6rem;font-size:.85rem;display:block}
.teardown-parts button[aria-pressed=true]{background:#222}
.teardown-transport{padding:14px 18px;background:#f7f7f7;border-top:1px solid #d1d1d1}
.teardown-transport-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.teardown-transport-row button{font-size:12px;font-weight:650;min-height:40px}
.teardown-transport-row [data-tour-play]{background:#222;color:white;min-width:145px;border-color:#222}
.teardown-transport-row label{font-size:11px;margin-left:auto;display:flex;align-items:center;gap:5px}
.teardown-transport select{font:inherit;background:white;color:#222;border:1px solid #bbb;padding:8px;min-height:40px}
.teardown-transport output{font:11px monospace;min-width:65px;text-align:right}
.teardown-scrub-label{font-size:10px;letter-spacing:.08em;text-transform:uppercase;display:block;margin-top:12px;color:#555}
.teardown-scrub-label input{width:100%;display:block;margin:8px 0;accent-color:#222;min-height:24px;cursor:pointer}
.teardown-current-step{font-size:13px;font-weight:700;margin:6px 0!important}
.teardown-tour-caption{font-size:13px;line-height:1.5!important;min-height:3em;margin:5px 0 10px!important;max-width:75ch}
.teardown-chapters{display:flex;gap:5px;overflow-x:auto;padding-bottom:4px}
.teardown-chapters button{font-size:10px;white-space:nowrap;padding:5px 8px;min-height:32px;border-color:#ccc;background:transparent}
.teardown-chapters button[aria-current=true]{background:#333;color:white;border-color:#333}
.teardown-camera{border-top:1px solid #ddd;background:#f7f7f7;padding:8px 18px}
.teardown-camera button{font-size:11px;min-height:36px;padding:5px 10px}
@media(max-width:1000px){.teardown-layout{grid-template-columns:1fr}.teardown-panel{border-left:0;border-top:1px solid #bbb}.teardown-parts{grid-template-columns:repeat(3,minmax(0,1fr))}.teardown-stage canvas{height:470px}}
@media(max-width:600px){.teardown-stage canvas{height:340px}.teardown-transport{padding:12px}.teardown-transport-row{gap:5px}.teardown-transport-row button{padding:8px;font-size:11px}.teardown-transport-row [data-tour-play]{min-width:126px}.teardown-transport-row label{margin-left:0}.teardown-transport output{margin-left:auto}.teardown-parts{grid-template-columns:1fr 1fr}.teardown-panel{padding:1rem}.teardown-tour-caption{font-size:12px;min-height:4.5em}.teardown-stage-label{max-width:85%;font-size:9px}.teardown-camera{padding:8px}.teardown-chapters button{min-height:40px}}
@media(prefers-reduced-motion:reduce){.teardown-viewer *{scroll-behavior:auto!important}}
.teardown-stage{scroll-margin-top:100px}
.teardown-annotation{position:absolute;pointer-events:none;max-width:162px;padding:5px 7px;border-left:1px solid #555;background:#f7f7f7e8;color:#333;font:10px/1.35 Arial,sans-serif;z-index:1}
.teardown-chapters button,.teardown-camera button{font-size:12px;min-height:44px}.teardown-transport select{font-size:12px;min-height:44px}.teardown-transport-row button{min-height:44px}.teardown-annotation{font-size:11px}.teardown-transport-row label{font-size:12px}
.teardown-stage canvas{height:clamp(260px,40svh,380px)}.teardown-panel{padding:1rem}.teardown-parts{grid-template-columns:1fr 1fr}.teardown-parts button{font-size:12px;padding:.5rem;min-height:44px}.teardown-detail{margin-top:.7rem;padding-top:.7rem}.teardown-detail p{font-size:12px;line-height:1.5}.teardown-detail h3{font-size:15px}.teardown-tour-caption{min-height:0;font-size:12px;margin-bottom:8px!important}.teardown-transport{padding:10px 12px}.teardown-current-step{font-size:12px}.teardown-scrub-label{margin-top:7px}.teardown-chapters{max-width:100%}.teardown-active-callout{position:absolute;pointer-events:none;max-width:162px;padding:5px 8px;background:#222;color:#fff;font:600 11px/1.35 Arial,sans-serif;z-index:2}.teardown-camera{padding:5px 12px}.teardown-camera button{padding:4px 8px}.teardown-panel>.teardown-eyebrow{font-size:10px}.teardown-boundary{margin-top:12px}@media(max-width:600px){.teardown-stage canvas{height:clamp(220px,33svh,300px)}.teardown-transport-row [data-tour-play]{min-width:120px}.teardown-transport-row button{font-size:12px}.teardown-tour-caption{min-height:0}.teardown-transport{padding:8px}.teardown-camera{gap:2px;flex-wrap:nowrap;overflow-x:auto}.teardown-camera button{flex-shrink:0}.teardown-panel{padding:12px}}
@media(max-width:600px){.teardown-stage canvas{height:clamp(180px,28svh,250px)}.teardown-transport-row label{font-size:0}.teardown-transport-row select{font-size:12px}.teardown-transport-row output{font-size:10px}.teardown-tour-caption{font-size:12px}}.teardown-expanded .teardown-stage canvas{height:min(65svh,640px)}
.teardown-inset-note{display:block;margin:0 0 6px;font:11px/1.35 Arial,sans-serif;color:#444}
.teardown-role-legend{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px}.teardown-role-note{font:11px/1.4 Arial,sans-serif;color:#333;position:static!important}
.teardown-role-index{position:absolute;pointer-events:none;width:22px;height:22px;border-radius:50%;background:#222;color:white;text-align:center;font:600 12px/22px Arial,sans-serif;z-index:1}
.teardown-tour-why,.teardown-tour-next{font-size:12px;line-height:1.4!important;margin:5px 0!important;max-width:75ch}.teardown-tour-why{font-weight:600}.teardown-tour-next{color:#555}.teardown-purpose{font-weight:600}
.teardown-transport-row [data-tour-play]:hover{background:#444;color:#fff}
/* Height-aware composition: the scene, current explanation and primary transport stay together. */
.teardown-stage{scroll-margin-top:calc(var(--teardown-nav-offset,80px) + 12px)}
.teardown-transport{display:flex;flex-direction:column;padding:0;min-width:0}
.teardown-narrative{padding:12px 16px;min-width:0;min-height:0}
.teardown-narrative:focus-visible{outline:2px solid #333;outline-offset:-3px}
.teardown-current-step{font-size:14px;margin:0 0 6px!important;line-height:1.35!important}
.teardown-tour-caption,.teardown-tour-why,.teardown-tour-next{font-size:14px;line-height:1.4!important;margin:6px 0!important;max-width:none}
.teardown-narrative .teardown-inset-note,.teardown-role-note{font-size:12px}
.teardown-transport-row{position:relative;display:grid;grid-template-columns:auto minmax(90px,1fr) auto auto;gap:8px;padding:8px 12px;border-top:1px solid #d5d5d5;background:#f7f7f7;align-items:center}
.teardown-transport-row button,.teardown-more summary,.teardown-camera button,.teardown-chapters button{min-width:44px;min-height:44px;font-size:13px}
.teardown-transport-row [data-tour-play]{min-width:142px;white-space:nowrap;padding:8px 10px}
.teardown-transport-row output{font-size:11px;min-width:60px;margin:0}
.teardown-scrub-label{min-width:0;margin:0;position:relative}
.teardown-scrub-label>span{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
.teardown-scrub-label input{min-height:44px;height:44px;margin:0;width:100%}
.teardown-more{position:static;margin:0;min-width:0}
.teardown-more summary{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 10px;border:1px solid #aaa;border-radius:2px;background:#fff;font-weight:600;cursor:pointer;list-style:none}
.teardown-more summary::-webkit-details-marker{display:none}
.teardown-more summary:after{content:'+';font-size:16px;line-height:1}
.teardown-more[open] summary:after{content:'−'}
.teardown-more-panel{position:absolute;z-index:5;bottom:calc(100% - 1px);right:0;width:min(100%,540px);max-height:min(410px,calc(100svh - var(--teardown-nav-offset,80px) - 88px));overflow-y:auto;overscroll-behavior:contain;padding:12px;border:1px solid #aaa;background:#fff;box-shadow:0 -8px 25px #0002}
.teardown-options{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.teardown-options label{font-size:13px;display:flex;gap:6px;align-items:center;margin:0}
.teardown-options [data-controls-close]{margin-left:auto}
.teardown-controls-label{font-size:12px;font-weight:700;margin:14px 0 6px!important}
.teardown-chapters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;overflow:visible;padding:0}
.teardown-chapters button{white-space:normal;text-align:left;padding:8px;line-height:1.3}
.teardown-camera{display:grid;grid-template-columns:repeat(3,minmax(44px,1fr));gap:6px;padding:12px 0 0;margin:12px 0 0;background:#fff;overflow:visible}
.teardown-camera button{font-size:14px;padding:8px;background:#f7f7f7}
.teardown-viewer select:focus-visible,.teardown-viewer input:focus-visible{outline:3px solid #111;outline-offset:2px}
@media(max-width:600px){
 .teardown-stage canvas{height:clamp(180px,28svh,250px)}
 .teardown-narrative{padding:10px 12px}
 .teardown-transport-row{grid-template-columns:1fr auto auto;gap:4px 8px;padding:6px 10px}
 .teardown-transport-row [data-tour-play]{min-width:0;font-size:12px}
 .teardown-transport-row output{min-width:56px}
 .teardown-scrub-label{grid-column:1/-1;grid-row:2}
 .teardown-more summary{padding:8px;font-size:12px}
 .teardown-more-panel{width:100%}
 .teardown-chapters{grid-template-columns:1fr}
}
@media(max-height:500px) and (min-width:600px) and (orientation:landscape){
 .teardown-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,1.15fr);grid-template-rows:minmax(0,1fr) 60px;height:calc(100svh - var(--teardown-nav-offset,80px) - 24px);min-height:190px;max-height:420px}
 .teardown-stage canvas,.teardown-expanded .teardown-stage canvas{grid-column:1;grid-row:1;width:100%;height:100%;min-height:0}
 .teardown-transport{display:contents}
 .teardown-narrative{grid-column:2;grid-row:1;border-left:1px solid #d5d5d5;background:#f7f7f7;overflow-y:auto;overscroll-behavior:contain;padding:10px 14px}
 .teardown-transport-row{grid-column:1/-1;grid-row:2;grid-template-columns:auto minmax(80px,1fr) auto auto;padding:8px 12px;gap:8px}
 .teardown-scrub-label{grid-column:auto;grid-row:auto}
 .teardown-stage-label{max-width:40%;font-size:9px;left:12px;top:10px}
 .teardown-current-step{font-size:14px}
 .teardown-tour-caption,.teardown-tour-why,.teardown-tour-next{font-size:14px;line-height:1.35!important;margin:5px 0!important}
 .teardown-more-panel{max-height:calc(100svh - var(--teardown-nav-offset,80px) - 88px)}
}
@media(max-height:350px) and (min-width:600px) and (orientation:landscape){.teardown-narrative{padding-top:8px;padding-bottom:8px}}
.teardown-transport-row .teardown-scrub-label{margin:0;display:block}
@media(max-width:600px){
 .teardown-transport-row{grid-template-columns:minmax(142px,1fr) auto}
 .teardown-transport-row [data-tour-play]{grid-column:1;grid-row:1}
 .teardown-more{grid-column:2;grid-row:1}
 .teardown-transport-row output{grid-column:2;grid-row:2;text-align:center}
 .teardown-scrub-label{grid-column:1;grid-row:2}
}
/* Text enlargement must reflow controls, never crop a fixed-width playback label. */
.teardown-transport-row{display:flex;flex-wrap:wrap}
.teardown-transport-row [data-tour-play]{flex:1 1 9em;min-width:min(100%,9em);max-width:100%;white-space:normal;overflow-wrap:anywhere}
.teardown-transport-row .teardown-scrub-label{flex:1 1 90px}
.teardown-transport-row output{flex:0 1 auto;overflow-wrap:anywhere;max-width:100%}
.teardown-more{flex:0 1 auto;max-width:100%}
.teardown-more summary{white-space:normal;overflow-wrap:anywhere}
@media(max-width:600px){
 .teardown-transport-row [data-tour-play]{order:1}
 .teardown-more{order:2}
 .teardown-transport-row .teardown-scrub-label{order:3;flex-basis:calc(100% - 80px)}
 .teardown-transport-row output{order:4}
}
@media(max-height:500px) and (min-width:600px) and (orientation:landscape){.teardown-stage{grid-template-rows:minmax(0,1fr) auto}}
.teardown-transport-row [data-tour-play]{flex:0 1 auto}
@media(max-width:600px){.teardown-transport-row [data-tour-play]{flex:1 1 9em}}
.teardown-camera{grid-template-columns:repeat(auto-fit,minmax(min(100%,5em),1fr))}
.teardown-more-panel button{max-width:100%;white-space:normal;overflow-wrap:anywhere}
.teardown-options label{min-width:0;max-width:100%;flex-wrap:wrap}
