/* The applied compound study fits the desktop; expanded editing stays scrollable.
   Quick creation and narrow stacked layouts retain normal document scrolling. */
.command-compound-switches{display:flex;flex-wrap:wrap;align-items:flex-start;gap:3px 12px;min-width:0}
.command-compound-switches>details{margin:0!important;padding:0!important;border:0;min-width:0}
.command-compound-switches>details>summary{font-size:12px;min-height:26px;padding:3px 0}
.command-compound-switches>details[open]{flex-basis:100%;width:100%}
.command-compound-switches .toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:4px 7px}
.command-compound-switches .toolbar>.actions{margin:0;gap:4px}
.command-compound-switches .toolbar label{margin:0;font-size:12px!important;display:flex}
.command-compound-switches .toolbar button{min-height:28px;font-size:12px;padding:3px 7px}
.command-compound-switches .surface-preview>.metrics{margin:3px 0;padding:3px 0}
.command-compound-switches .surface-preview>.clean-note{margin:2px 0;padding:0}
.intro>#quick-create-panel{order:3;margin:0;padding:0;border:0}
.intro>#quick-create-panel>summary{font-size:12px;min-height:26px;padding:3px 0}
.intro>#quick-create-panel[open]{flex-basis:100%;width:100%}
.framing-exploded-toolbar [data-command-menu=framing-views]>.command-popover{left:0;right:auto}

@supports selector(details::details-content){
@media screen and (min-width:851px) and (min-height:500px){
 body:has(#layout-workspace-panel[open]):has(#quick-create-panel:not([open])){height:100dvh;min-height:0;display:flex;flex-direction:column}
 body:has(#layout-workspace-panel[open]):has(#quick-create-panel:not([open]))>header{flex:none}
 body:has(#layout-workspace-panel[open]):has(#quick-create-panel:not([open]))>main{flex:1;min-height:0;width:100%;display:flex;flex-direction:column;padding-bottom:8px}
 body:has(#quick-create-panel:not([open])) #layout-workspace-panel[open]{display:flex;flex-direction:column;flex:1;min-height:0;margin-bottom:0}
 #layout-workspace-panel[open]::details-content{display:flex;flex-direction:column;flex:1;min-height:0}
 #layout-workspace-panel[open]>.workspace{flex:1;min-height:0;grid-template-rows:minmax(0,1fr);align-items:stretch}
 #layout-workspace-panel[open]>.workspace>aside{min-height:0;overflow:auto;overscroll-behavior:contain}
 #layout-workspace-panel[open]>.workspace>.preview{min-width:0;min-height:0;display:flex;flex-direction:column;gap:4px;overflow:auto;overscroll-behavior:contain}
 .command-compound-switches{flex:none}
 .preview:not(:has(.surface-preview[open],.layout-work-tools[open],.study-more[open],.command-structure-edits[open],.technical-results[open],.framing-more-actions[open],.roof-piece-inspection details[open]))>#layout-framing-detail:not([hidden]){flex:1;min-height:0;display:flex;flex-direction:column;margin:0;padding:6px}
 #layout-framing-detail>.command-framing-title,#layout-framing-detail>#framing-status,#layout-framing-detail>#framing-error,#layout-framing-detail>.command-structure-edits,#layout-framing-detail>.technical-results{flex:none}
 #layout-framing-detail>.technical-results{margin:2px 0;padding:1px 5px}
 #layout-framing-detail>.technical-results>summary{font-size:12px;min-height:26px;padding:3px 0}
 #layout-framing-detail>.framing-sales-workspace{flex:1;min-height:min-content;margin:3px 0;align-items:stretch}
 .framing-model-pane{display:flex;flex-direction:column;min-width:0;min-height:min-content}
 .framing-model-pane>.framing-exploded-toolbar{flex:none;margin:0 0 3px}
 .framing-model-pane>#framing-canvas,.framing-wide-view .framing-model-pane>#framing-canvas{flex:1;min-height:160px;height:160px;max-height:none;contain:size}
 #framing-piece-inspection{flex:none;min-height:0}
 .roof-piece-inspection:not(:has([data-piece-actions]:not([hidden]))){margin:0;padding:0;border:0}
 .roof-piece-inspection:not(:has([data-piece-actions]:not([hidden])))>[data-piece-title]{display:none}
 .roof-piece-inspection>details{margin:2px 0;padding:0}
 .roof-piece-inspection>details>summary{font-size:12px;min-height:26px;padding:3px 0}
 .roof-piece-inspection>[data-piece-error]:empty{display:none}
 .framing-sales-workspace>#framing-sales-list{height:100%;max-height:none;min-height:0;padding:6px;contain:size}
 .framing-model-pane .command-popover{max-height:min(340px,calc(100dvh - 300px))}
 /* A long expanded editor may scroll; it must not expand the WebGL target or
    turn the complete materials list into thousands of pixels of page content. */
 .preview:has(.surface-preview[open],.layout-work-tools[open],.study-more[open],.command-structure-edits[open],.technical-results[open],.framing-more-actions[open],.roof-piece-inspection details[open]) #framing-sales-list{height:auto;max-height:340px;contain:none}
 .preview:has(.surface-preview[open],.layout-work-tools[open],.study-more[open],.command-structure-edits[open],.technical-results[open],.framing-more-actions[open],.roof-piece-inspection details[open]) #framing-canvas{flex:none;height:230px;min-height:230px}
 /* The surface preview takes the same space when the physical assembly is closed. */
 .preview:has(#layout-framing-detail[hidden]):has(.surface-preview[open]):not(:has(.layout-work-tools[open],.study-more[open]))>.command-compound-switches{flex:1;min-height:0;flex-direction:column;flex-wrap:nowrap}
 .preview:has(#layout-framing-detail[hidden]) .command-compound-switches>.surface-preview[open]{display:flex;flex-direction:column;flex:1;min-height:0}
 .preview:has(#layout-framing-detail[hidden]) .surface-preview[open]::details-content{display:flex;flex-direction:column;flex:1;min-height:0}
 .command-compound-switches>.surface-preview[open]>#layout-canvas{flex:1;min-height:180px;height:180px}
}
}