.exterior-viewer{margin-block:52px 64px}
.viewer-heading{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:18px}
.viewer-heading h2{margin:0}
.viewer-heading a{font-size:18px;white-space:nowrap}
.viewer-stage{position:relative;background:var(--viewer-stage,#1d191b);min-height:420px;height:clamp(400px,43vw,560px)}
.viewer-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.viewer-launch{position:absolute;inset:0;display:grid;place-items:center;background:rgb(20 17 19 / .16)}
.viewer-launch button{border:0;background:var(--spruce);color:var(--paper);padding:14px 24px;min-height:52px;font-size:18px}
.viewer-stage model-viewer{display:block;width:100%;height:100%;--poster-color:var(--viewer-stage,#1d191b);touch-action:none}
.viewer-stage:has(model-viewer)>.viewer-poster,.viewer-stage:has(model-viewer)>.viewer-launch{display:none}
.viewer-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;padding-block:16px}
.viewer-controls[hidden]{display:none}
.viewer-controls button{font-size:18px;min-height:46px;padding:8px 12px;background:transparent;border:0;text-decoration:underline;text-underline-offset:5px}
.viewer-controls button[aria-pressed=true]{background:var(--spruce);color:var(--paper);text-decoration:none}
#reset-exterior{margin-left:auto}
.viewer-status{position:absolute;bottom:20px;left:24px;right:24px;font-size:18px;background:var(--paper);color:var(--ivory);border:1px solid var(--line);padding:10px 16px;margin:0;max-width:none}
.viewer-status:empty{display:none}
@media(max-width:560px){.exterior-viewer{margin-block:36px 44px}.viewer-heading{display:block}.viewer-heading a{display:inline-flex;margin-top:12px;min-height:44px;align-items:center}.viewer-stage{height:340px;min-height:0;margin-inline:calc(-1 * var(--gutter))}.viewer-controls{gap:6px}.viewer-controls button{padding-inline:10px}#reset-exterior{margin-left:0}.viewer-status{left:16px;right:16px}}

html:not(.js) .viewer-launch{display:none}

.viewer-floor-control{display:flex;align-items:center;gap:12px;font-size:18px;margin-left:12px}
.viewer-floor-control select{background:transparent;color:var(--ink);border:1px solid var(--control-rule,#91856a);font-size:18px;min-height:46px;padding:7px 12px;max-width:160px}
#viewer-floor-plan{font-size:18px;min-height:44px;display:inline-flex;align-items:center}
#viewer-floor-plan[hidden]{display:none}
@media(max-width:560px){.viewer-floor-control{margin-left:0;flex-basis:100%;margin-top:8px}.viewer-floor-control select{flex:1;max-width:none}#viewer-floor-plan{margin-right:auto}}

.viewer-zoom{position:absolute;right:16px;bottom:16px;display:flex;gap:8px;z-index:1}
.viewer-zoom[hidden]{display:none}
.viewer-zoom button{width:46px;height:46px;border:1px solid var(--line);background:var(--paper);color:var(--ivory);font-size:30px;line-height:1}

.viewer-instructions{position:absolute;z-index:1;bottom:16px;left:20px;right:136px;max-width:66ch;margin:0;font-size:14px;color:var(--ivory);line-height:1.45;pointer-events:none;background:rgb(29 25 27 / .92);border:1px solid var(--line);padding:8px 10px}
.viewer-views{display:flex;gap:2px;padding:3px;background:rgba(201,169,110,.12)}
.viewer-views button{flex:1;text-decoration:none;min-width:72px}
.viewer-controls #reset-exterior{text-decoration:none;background:rgba(201,169,110,.12)}
@media(max-width:560px){
  .viewer-instructions{top:12px;bottom:auto;left:16px;right:16px;max-width:none;font-size:14px}
  .viewer-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding-block:14px}
  .viewer-views{grid-column:1/-1}
  .viewer-views button{min-height:44px}
  .viewer-floor-control{margin:0;min-width:0;gap:8px;font-size:16px}
  .viewer-floor-control select{width:0;min-width:0;min-height:46px;font-size:16px;padding-inline:8px}
  .viewer-controls #reset-exterior{font-size:16px;padding-inline:12px;white-space:nowrap}
  #viewer-floor-plan{grid-column:1/-1;grid-row:3;font-size:16px;min-height:36px}
}
.viewer-instructions[hidden]{display:none}
@media(max-width:360px){
  .viewer-controls{grid-template-columns:minmax(0,1fr)}
  .viewer-floor-control{grid-column:1/-1}
  .viewer-controls #reset-exterior{justify-self:end}
  #viewer-floor-plan{grid-row:auto}
}

.viewer-playback{position:absolute;z-index:1;top:16px;left:20px;min-height:44px;padding:8px 14px;border:1px solid var(--line);background:var(--paper);color:var(--ivory);font-size:16px}
.viewer-playback[hidden]{display:none}
@media(max-width:560px){.viewer-playback{top:auto;bottom:16px;left:16px}}

.viewer-fullscreen{position:absolute;right:16px;top:12px;z-index:2;width:46px;height:46px;display:grid;place-items:center;border:1px solid var(--line);background:var(--paper);color:var(--ivory);padding:0}
.viewer-fullscreen[hidden]{display:none}
.fullscreen-contract{display:none}
.viewer-fullscreen[aria-pressed=true] .fullscreen-expand{display:none}
.viewer-fullscreen[aria-pressed=true] .fullscreen-contract{display:initial}
.viewer-fullscreen-dialog{position:fixed;inset:0;margin:0;border:0;padding:0;width:100%;height:100%;max-width:none;max-height:none;overflow:hidden;background:var(--paper);color:var(--ink)}
.viewer-fullscreen-dialog::backdrop{background:var(--paper)}
.viewer-workspace:is(:fullscreen,.is-expanded){box-sizing:border-box;display:flex;flex-direction:column;width:100%;height:100vh;height:100dvh;min-height:0;overflow:hidden;background:var(--paper);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
.viewer-workspace:is(:fullscreen,.is-expanded) .viewer-stage{flex:1;min-height:0;height:auto;margin:0}
.viewer-workspace:is(:fullscreen,.is-expanded) .viewer-controls{flex-shrink:0;margin:0;padding:12px 16px;max-height:40%;overflow-y:auto;overscroll-behavior:contain}
@media(max-width:560px){.viewer-instructions{right:78px}}