/* Wide screens: a persistent large model and an independently scrolling panel. */
@media (min-width:801px), (orientation:landscape) and (max-height:540px) and (pointer:coarse){
 body{--panel-width:30%;grid-template-columns:minmax(0,1fr) var(--panel-width);grid-template-rows:62px minmax(0,1fr)}
 .site-header{grid-column:1/-1;grid-row:1;height:62px;padding:0 24px}
 .fixed-viewer{grid-column:1;grid-row:2;min-width:0;border-bottom:0;border-right:1px solid var(--line)}
 .control-scroll{grid-column:2;grid-row:2;min-width:0;scroll-behavior:smooth}
 .viewer-heading{padding:14px 20px;flex-wrap:wrap;gap:8px}
 .viewer-heading h1{font-size:22px}.viewer-heading>span{font-size:14px}
 .temporary-chip{left:20px}.view-caption{right:20px}
 .control-scroll .section{padding:24px 20px}
 .control-scroll .section-head{display:block}.control-scroll .section-head>p{padding:0;margin:8px 0}
 .control-scroll .section h2{font-size:24px}
 .control-scroll .view-controls{grid-template-columns:repeat(2,minmax(0,1fr))}
 .control-scroll .view-controls button{min-height:46px}
 .control-scroll .color-options,.control-scroll .plan-layout,.control-scroll .material-grid{display:block}
 .control-scroll .color-option{margin:8px 0;align-items:center}
 .control-scroll .compare-panel{padding:16px}.control-scroll .model-notes{margin:0 20px}
 .control-scroll .floor-tabs{gap:8px}.control-scroll .floor-tabs button{min-width:0;font-size:16px;padding:12px 6px}
 .control-scroll .floor-tabs span{display:block;margin:0}
 .control-scroll .material-card,.control-scroll .material-card:nth-child(n){border-right:0;padding:18px 0;grid-template-columns:48px minmax(0,1fr);gap:12px}
 .control-scroll .material-visual{height:48px}.control-scroll .status{grid-column:2;text-align:left}
 .control-scroll .legend{flex-wrap:wrap;gap:12px}.control-scroll footer{display:block;padding:20px}
 .control-scroll footer span{display:block}
 #interior{top:62px}
}

@media (orientation:landscape) and (max-height:540px) and (pointer:coarse){
 body{--panel-width:34%;grid-template-rows:44px minmax(0,1fr)}
 .site-header{height:44px;padding:0 14px}
 .site-header .nav{gap:12px}
 .viewer-heading{padding:6px 12px;gap:4px 8px}
 .viewer-heading h1{font-size:17px}
 .control-scroll .section{padding:12px}
 .control-scroll .section h2{font-size:18px}
 #interior{top:44px;grid-template-rows:36px minmax(0,1fr)}
 .interior-bar{padding:2px 12px}
 .interior-bar button{padding:2px 8px}
}

@media (orientation:landscape) and (max-height:540px) and (pointer:coarse){
 #interior:not([hidden]){top:0;z-index:21;grid-template-rows:minmax(0,1fr)}
 .interior-bar{position:absolute;top:6px;left:8px;z-index:2;width:auto;padding:0;
  background:transparent;border:0}
 .interior-bar>strong{display:none}
 .interior-bar button{min-height:32px;padding:4px 9px;font-size:13px}
}