/* One workspace: original house artwork, directly selectable parts, and adjacent details. */
.roof-system-v5{overflow:visible;background:#fff;color:#282c2d}
.roof-system-v5 [hidden]{display:none!important}
.roof-lab{display:grid;grid-template-columns:minmax(310px,32%) minmax(0,1fr);height:clamp(690px,calc(100svh - 115px),860px);max-width:1800px;margin:0 auto;position:relative}
.lab-sidebar{min-width:0;min-height:0;padding:28px 30px 28px clamp(30px,5.6vw,102px);position:relative;z-index:3}
.lab-intro{padding-top:65px}.lab-eyebrow{font-size:.61rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:#7a8284;line-height:1.6}
.roof-system-v5 h1{font-family:var(--body);font-size:clamp(2.8rem,3.85vw,4.7rem);font-weight:600;line-height:1.025;letter-spacing:-.06em;margin:23px -20px 25px 0;overflow-wrap:normal}.roof-system-v5 h1>span{display:block}
.lab-intro-copy{font-size:clamp(.85rem,1.05vw,1.07rem);line-height:1.7;color:#6e7375;max-width:340px;white-space:pre-line}.lab-intro-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:27px}.lab-intro-actions .roof-primary,.lab-intro-actions .roof-secondary{font-size:.7rem;padding:12px 19px;min-height:45px;gap:12px}
.lab-location{font-size:.62rem;color:#8a9091;margin-top:24px!important;line-height:1.6}.lab-work{display:inline-block;font-size:.67rem;color:#5d6669;margin-top:17px;text-decoration:none}.lab-work:hover{text-decoration:underline;text-underline-offset:4px}
.lab-intro-hint{display:flex;gap:13px;align-items:center;border-top:1px solid #e8ebeb;padding-top:22px;margin-top:44px;max-width:280px}.lab-intro-hint>span{font-size:1.2rem;width:31px;height:31px;display:grid;place-items:center;border:1px solid #dce2e3;border-radius:50%;flex-shrink:0;color:#536970}.lab-intro-hint p{font-size:.74rem;line-height:1.6;color:#818789}
.lab-stage{display:flex;flex-direction:column;position:relative;min-width:0;min-height:0;padding:27px clamp(26px,4.5vw,85px) 24px 0}
.lab-stage-top{display:flex;align-items:center;gap:12px;position:relative;z-index:8;min-height:40px;padding-left:9px}
.lab-presentation{display:flex;border:1px solid #e4e8e8;border-radius:30px;padding:3px;background:#f8f9f9;flex-shrink:0}.lab-presentation button{border:0;background:none;border-radius:30px;color:#7a8284;font-size:.65rem;min-height:32px;padding:8px 15px}.lab-presentation button[aria-pressed=true]{background:#3b474b;color:#fff;box-shadow:0 2px 7px #21313414}
.lab-camera{min-width:0}.lab-camera select{font:400 .63rem var(--body);border:0;color:#616a6d;background:#fff;max-width:145px;padding:9px 3px}
.lab-reset{margin-left:auto;border:0;background:none;color:#80878a;font-size:.62rem;padding:10px 4px;white-space:nowrap}
.lab-artwork-frame{position:relative;flex:1;min-height:330px;isolation:isolate;touch-action:pan-y pinch-zoom}
.lab-photo-perspective{position:absolute;inset:18px 1% 4px 0;perspective:1600px;perspective-origin:50% 50%}
.lab-photo-motion,.lab-photo-zoom{position:absolute;inset:0;width:100%;height:100%;transform-origin:50% 55%;touch-action:pan-y pinch-zoom}
.lab-photo-motion{transform-style:preserve-3d}.lab-photo-motion.is-tracking{will-change:transform}.lab-photo-zoom{transform:scale(var(--photo-zoom,1));transition:transform .25s ease}
.lab-photo-zoom>svg{display:block;width:100%;height:100%;overflow:visible}
.lab-model-host{position:absolute;inset:0;width:100%;height:100%}.lab-model-host canvas{display:block;width:100%;height:100%;outline-offset:-5px;touch-action:pan-y pinch-zoom}
.lab-company-photo{position:absolute;inset:5%;width:90%;height:90%;object-fit:contain;transform-origin:center}
.lab-model-status{position:absolute;inset:38% 15% auto;text-align:center;color:#7d8789;font-size:.76rem;line-height:1.7;padding:18px;background:#fffffff4;border:1px solid #e6eaea;border-radius:12px;z-index:9}
.lab-stage-bottom{position:relative;flex-shrink:0;padding:0 4px 0 8px;z-index:7}
.lab-interaction-hint{text-align:center;font-size:.67rem;color:#8a9294;margin-bottom:18px!important;letter-spacing:.005em;line-height:1.5}
.lab-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-top:1px solid #e6ebeb;padding-top:16px;justify-content:space-between}
.lab-component-picker{flex:1;min-width:185px;max-width:280px}.lab-component-picker select{width:100%;border:1px solid #dfe6e7;border-radius:8px;padding:10px 26px 10px 12px;font:500 .69rem var(--body);background:#fff;color:#465155;min-height:40px}
.lab-view-modes{display:flex;padding:3px;border:1px solid #e4e8e9;border-radius:24px;background:#f8f9f9}.lab-view-modes button{border:0;border-radius:22px;font-size:.63rem;padding:9px 12px;background:none;color:#778084;white-space:nowrap}.lab-view-modes button[aria-pressed=true]{background:#3c494e;color:white}
.lab-zoom{display:flex;align-items:center;gap:0;padding:2px;border:1px solid #e5e9e9;border-radius:24px;background:#fff}.lab-zoom button{width:29px;height:34px;border:0;background:none;color:#586267;border-radius:50%;font-size:1.1rem}.lab-zoom button:hover:not(:disabled){background:#edf2f3}.lab-zoom button:disabled{opacity:.3}.lab-zoom output{font-size:.64rem;width:39px;text-align:center;color:#667276}
.lab-layer-controls{display:flex;align-items:center;gap:22px;margin-top:17px;position:relative;padding-right:150px}.lab-separation{display:flex;align-items:center;gap:11px;flex:1;max-width:440px}.lab-separation label,.lab-separation output{font-size:.63rem;color:#7b8589;white-space:nowrap}.lab-separation input{width:100%;min-width:55px;height:25px;accent-color:#607b87;cursor:ew-resize}.lab-separation output{width:30px}
.lab-layer-menu-button{margin-left:auto;border:0;background:none;color:#53666f;font-size:.64rem;white-space:nowrap;padding:9px 0}.lab-layer-menu-button span{margin-left:8px}
.lab-caption{text-align:center;font-size:.53rem;color:#a0a6a8;margin-top:14px!important;line-height:1.5}
.lab-layer-menu{position:absolute;bottom:40px;left:0;right:0;max-width:620px;margin-left:auto;background:#fff;border:1px solid #dbe3e6;border-radius:16px;box-shadow:0 18px 60px #263c4a24;padding:18px;z-index:20;max-height:370px;overflow:auto}
.lab-layer-menu-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.lab-layer-menu-head strong{font-size:.77rem;font-weight:500}.lab-layer-menu-head button{width:30px;height:30px;background:none;border:0;color:#53656b;font-size:1.3rem}
.lab-layer-buttons{display:grid;grid-template-columns:1fr 1fr;gap:7px}.lab-layer-buttons button{border:1px solid #e0e6e8;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;color:#4f5d63;padding:10px 11px;font-size:.68rem;min-height:41px}.lab-layer-buttons button[aria-pressed=true]{background:#edf3f5;border-color:#9caeb6}.lab-layer-buttons small{font-size:.57rem;color:#8b9598}
.lab-layer-menu-footer{display:flex;justify-content:space-between;gap:12px;margin-top:14px}.lab-layer-menu-footer button{border:0;background:none;font-size:.66rem;color:#5c737e;padding:6px 0}.lab-layer-menu-footer button:disabled{opacity:.4}.lab-layer-menu>p{font-size:.6rem;line-height:1.5;color:#8d979b;margin-top:8px!important}
.lab-inspector{height:100%;display:flex;flex-direction:column;min-height:0;background:#fff}
.lab-inspector-top{display:flex;justify-content:space-between;gap:15px;align-items:center;min-height:37px;margin-bottom:18px}.lab-inspector-top button,.lab-inspector-top a{border:0;background:none;color:#60747d;font-size:.64rem;padding:8px 0;text-decoration:none;line-height:1.5}.lab-inspector-top a{white-space:nowrap;color:#819097}
.lab-inspector-tabs{display:flex;gap:3px;background:#f2f5f6;padding:4px;border-radius:9px;flex-shrink:0}.lab-inspector-tabs button{flex:1;min-width:0;padding:10px 6px;font-size:.64rem;border:0;border-radius:6px;background:none;color:#7a8990;white-space:nowrap}.lab-inspector-tabs button[aria-selected=true]{background:white;color:#394d57;box-shadow:0 2px 5px #203f4f0d}
.lab-inspector-scroll{min-height:0;flex:1;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d3dee3 transparent;padding:23px 5px 12px 0;margin-right:-5px}
.lab-article h2{font:600 clamp(1.55rem,2.05vw,2.55rem)/1.12 var(--body);letter-spacing:-.045em;color:#303b40;margin:9px 0 14px}
.lab-summary{font-size:.77rem;line-height:1.7;color:#7e8a90;margin-bottom:14px!important}.lab-detail-drawing{border:1px solid #e4e9eb;border-radius:12px;background:linear-gradient(145deg,#fff,#f8fafb);padding:12px 4px;overflow:hidden;margin:15px 0}.lab-detail-drawing svg{display:block;width:100%;height:auto}
.lab-install-takeaway{font-size:.76rem;line-height:1.7;color:#677b85}.lab-drawing-caption{font-size:.56rem;color:#a0acb2;margin-top:12px!important;line-height:1.5}
.lab-installation details{border-top:1px solid #e4eaed;padding:14px 0}.lab-installation summary{cursor:pointer;color:#465d69;font-size:.77rem;font-weight:500;line-height:1.5}.lab-installation details p{font-size:.75rem;line-height:1.8;color:#7d8e98;margin-top:12px!important}.lab-source{font-size:.63rem;line-height:1.6;color:#668090;text-underline-offset:3px;display:inline-block;margin-top:8px}
.lab-product{margin:12px 0 0}.lab-product-photo{height:clamp(150px,23svh,230px);border:1px solid #e6ebef;border-radius:12px;padding:14px;background:#fff}.lab-product-photo img{width:100%;height:100%;object-fit:contain}.lab-product figcaption{padding:16px 2px 0}.lab-product figcaption>span{display:block;font-size:.57rem;color:#8297a3;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}.lab-product figcaption a{display:block;color:#445e6c;font-size:.82rem;font-weight:500;text-decoration:none;line-height:1.5}.lab-product figcaption p{font-size:.73rem;line-height:1.7;color:#8195a0;margin-top:10px!important}.lab-product-navigation{display:flex;align-items:center;justify-content:center;gap:15px;margin:12px 0}.lab-product-navigation button{border:1px solid #dfe8ed;width:34px;height:32px;border-radius:6px;background:white;color:#698591}.lab-product-navigation output{font-size:.64rem;color:#8ca0aa}.lab-product-disclaimer{font-size:.58rem;color:#a0adb5;line-height:1.6;margin-top:13px!important}
.lab-component-options{border-top:1px solid #e2e9ed;padding:12px 0;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0}.lab-component-options>span{font-size:.62rem;color:#8297a3}.lab-component-options>div{display:flex;gap:4px}.lab-component-options button{border:1px solid #e0e9ee;border-radius:6px;background:white;color:#7894a4;font-size:.61rem;padding:8px 10px}.lab-component-options button[aria-pressed=true]{background:#eaf1f6;color:#465f6d;border-color:#bacbd5}
.lab-inspector-actions{display:flex;gap:8px;border-top:1px solid #e2e9ed;padding-top:14px;flex-shrink:0}.lab-inspector-actions button{flex:1;border:1px solid #bacbd5;border-radius:7px;background:#eef3f7;color:#435f70;font-size:.65rem;padding:11px 8px;line-height:1.5}.lab-inspector-actions button:last-child{background:white;color:#8aa0ad;border-color:#d8e4eb}
.roof-system-v5 button:focus-visible,.roof-system-v5 select:focus-visible,.roof-system-v5 input:focus-visible,.roof-system-v5 a:focus-visible{outline:2px solid #6e94aa;outline-offset:3px}.roof-system-v5 select,.roof-system-v5 button{cursor:pointer}
@media(min-width:1550px){.roof-lab{grid-template-columns:minmax(365px,29%) minmax(0,1fr)}.lab-sidebar{padding-right:42px}.lab-stage{padding-left:10px}.lab-intro{padding-top:85px}.lab-artwork-frame{min-height:420px}}
@media(max-width:1150px) and (min-width:851px){.roof-lab{grid-template-columns:320px 1fr;height:740px}.lab-sidebar{padding-left:30px;padding-right:23px}.lab-stage{padding-right:28px}.lab-intro{padding-top:58px}.roof-system-v5 h1{font-size:3rem}.lab-toolbar{gap:8px;justify-content:flex-start}.lab-component-picker{max-width:none;flex-basis:100%}.lab-stage-top{gap:7px}.lab-presentation button{padding-inline:10px}.lab-camera select{max-width:92px}.lab-separation{max-width:270px}}
@media(max-width:850px){.roof-lab{display:flex;flex-direction:column;height:auto;max-width:780px}.lab-sidebar{padding:38px 7% 0}.lab-intro{padding-top:0}.roof-system-v5 h1{font-size:clamp(2.8rem,6.3vw,4.2rem);margin:17px 0 20px}.lab-intro-copy{max-width:530px;font-size:.92rem}.lab-intro-actions{margin-top:22px}.lab-intro-hint{display:none}.lab-location{margin-top:18px!important}.lab-work{margin-top:12px}.lab-stage{height:620px;padding:27px 6% 25px}.lab-artwork-frame{min-height:290px}.lab-sidebar:has([data-roof-inspector]:not([hidden])){padding:0}.lab-interaction-hint{font-size:.64rem}.lab-layer-menu{max-height:310px}.lab-product-photo{height:180px}
 .roof-system-v5[data-inspector-open] .roof-lab{position:fixed;inset:0;z-index:1000;max-width:none;background:#fff;height:100dvh;display:grid;grid-template-columns:1fr;grid-template-rows:46% 54%;box-shadow:0 0 0 100vmax #1d30384d;isolation:isolate}
 .roof-system-v5[data-inspector-open] .lab-stage{grid-row:1;height:auto;min-height:0;padding:12px 5% 7px;border-bottom:1px solid #dfe8ed}
 .roof-system-v5[data-inspector-open] .lab-sidebar{grid-row:2;min-height:0;padding:0 5% 13px;height:100%;background:#fbfcfd;overflow:hidden}
 .roof-system-v5[data-inspector-open] .lab-inspector{background:transparent}.roof-system-v5[data-inspector-open] .lab-artwork-frame{min-height:0}.roof-system-v5[data-inspector-open] .lab-photo-perspective{inset:1px 6%}
 .roof-system-v5[data-inspector-open] .lab-stage-top{min-height:32px;padding-left:0}.roof-system-v5[data-inspector-open] .lab-stage-bottom{padding:0}.roof-system-v5[data-inspector-open] .lab-interaction-hint{display:none}.roof-system-v5[data-inspector-open] .lab-caption{display:none}
 .roof-system-v5[data-inspector-open] .lab-toolbar{padding-top:6px;gap:5px;border-top:0;flex-wrap:nowrap}.roof-system-v5[data-inspector-open] .lab-component-picker{min-width:0;max-width:none}.roof-system-v5[data-inspector-open] .lab-component-picker select{font-size:.62rem;min-height:34px;padding:8px 14px 8px 8px}.roof-system-v5[data-inspector-open] .lab-view-modes button{padding:7px 8px;font-size:.57rem}.roof-system-v5[data-inspector-open] .lab-zoom{display:none}
 .roof-system-v5[data-inspector-open] .lab-layer-controls{margin-top:3px;gap:12px}.roof-system-v5[data-inspector-open] .lab-separation input{height:19px}.roof-system-v5[data-inspector-open] .lab-layer-menu-button{font-size:.59rem;padding:5px 0}.roof-system-v5[data-inspector-open] .lab-separation label,.roof-system-v5[data-inspector-open] .lab-separation output{font-size:.57rem}
 .roof-system-v5[data-inspector-open] .lab-inspector-top{min-height:34px;margin-bottom:1px}.roof-system-v5[data-inspector-open] .lab-inspector-tabs button{padding:8px;font-size:.66rem}.roof-system-v5[data-inspector-open] .lab-inspector-scroll{padding-top:14px}.roof-system-v5[data-inspector-open] .lab-article h2{font-size:1.45rem;margin:5px 0 10px}.roof-system-v5[data-inspector-open] .lab-summary{font-size:.73rem;margin-bottom:10px!important}.roof-system-v5[data-inspector-open] .lab-detail-drawing{float:right;width:46%;margin:0 0 12px 13px;padding:3px}.roof-system-v5[data-inspector-open] .lab-install-takeaway{font-size:.73rem}.roof-system-v5[data-inspector-open] .lab-product-photo{height:145px}.roof-system-v5[data-inspector-open] .lab-products>.lab-eyebrow{display:none}.roof-system-v5[data-inspector-open] .lab-product{margin-top:6px}.roof-system-v5[data-inspector-open] .lab-product-photo{float:left;width:43%;margin:0 13px 8px 0}.roof-system-v5[data-inspector-open] .lab-product figcaption{padding-top:2px}.roof-system-v5[data-inspector-open] .lab-product-navigation{clear:both}.roof-system-v5[data-inspector-open] .lab-product-disclaimer{clear:both}.roof-system-v5[data-inspector-open] .lab-component-options{padding:7px 0}.roof-system-v5[data-inspector-open] .lab-inspector-actions{padding-top:8px}.roof-system-v5[data-inspector-open] .lab-inspector-actions button{padding:9px 6px;font-size:.63rem}
 body:has(.roof-system-v5[data-inspector-open]){overflow:hidden}body:has(.roof-system-v5[data-inspector-open]) #chat-launch,body:has(.roof-system-v5[data-inspector-open]) .mobile-cta{visibility:hidden}
}
@media(max-width:520px){.lab-sidebar{padding-top:34px}.roof-system-v5 h1{font-size:2.9rem}.lab-intro-copy{font-size:.85rem}.lab-intro-actions .roof-primary,.lab-intro-actions .roof-secondary{font-size:.65rem;padding:11px 14px}.lab-stage{height:535px;padding:24px 5%}.lab-artwork-frame{min-height:240px}.lab-stage-top{padding-left:0;gap:8px}.lab-presentation button{font-size:.61rem;padding:8px 12px}.lab-toolbar{gap:8px}.lab-component-picker{max-width:none;flex-basis:100%}.lab-layer-controls{gap:12px;margin-top:13px}.lab-separation{gap:7px}.lab-interaction-hint{font-size:.6rem;margin-bottom:12px!important}.lab-layer-menu{padding:13px;max-height:315px}.lab-layer-buttons button{font-size:.63rem;min-height:37px;padding:9px}.lab-layer-menu-head strong{font-size:.69rem}.lab-camera select{max-width:80px;font-size:.56rem}.lab-reset{font-size:.58rem}.roof-system-v5[data-inspector-open] .lab-stage-top{gap:6px}.roof-system-v5[data-inspector-open] .lab-presentation button{font-size:.58rem;padding:7px 9px;min-height:28px}}
@media(prefers-reduced-motion:reduce){.lab-photo-motion{transform:none!important}.lab-photo-zoom{transition:none}}
html:not(.motion-on) .lab-photo-motion{transform:none!important}

.roof-system-v5[data-inspector-open] .lab-layer-controls{padding-right:0}body:has(.roof-system-v5[data-inspector-open]) #chat-launch{visibility:hidden}
@media(max-width:850px){.lab-layer-controls{padding-right:0}}
html:not(.motion-on) .roof-photo-assembly *{transition:none!important}
.lab-installation summary{padding:0}
.lab-installation details p{margin:10px 0 0!important}
@media(max-width:850px){
 .roof-system-v5[data-inspector-open]{z-index:1100}
 body:has(.roof-system-v5[data-inspector-open]) .mobile-dock{visibility:hidden}
 .roof-system-v5[data-inspector-open] .lab-toolbar{flex-wrap:wrap;justify-content:space-between}
 .roof-system-v5[data-inspector-open] .lab-component-picker{flex-basis:100%}
 .roof-system-v5[data-inspector-open] .lab-zoom{display:flex}
 .roof-system-v5[data-inspector-open] .lab-zoom button{height:27px;width:28px}
 .roof-system-v5[data-inspector-open] .lab-zoom output{font-size:.6rem;width:36px}
 .lab-inspector:has([data-inspector-tab=installation][aria-selected=true]) .lab-summary{display:none}
}
.lab-system-name{font-size:.77rem;font-weight:600;letter-spacing:.08em;color:#526a76}
.lab-system-promise{max-width:300px;margin-top:16px!important;font-size:.78rem;line-height:1.6;color:#405963}
.lab-vent-selector{display:grid;grid-template-columns:1fr;gap:7px}
.lab-vent-selector label{font-size:.65rem;color:#5d7481;font-weight:500}
.lab-vent-selector select{width:100%;min-height:37px;border:1px solid #c8d7df;border-radius:7px;padding:8px 10px;font-size:.69rem;background:#fff;color:#435d6c}
.lab-vent-selector small{font-size:.59rem;color:#869ba6;line-height:1.5}
.lab-vent-rule{border:1px solid #d8e4ea;background:#eff5f8;padding:14px;border-radius:10px;margin:15px 0}
.lab-vent-rule strong{font-size:.8rem;font-weight:600;color:#405c6d;line-height:1.5;display:block}
.lab-vent-rule p{font-size:.7rem;line-height:1.75;color:#688290;margin-top:7px!important}
.lab-vent-details{clear:both;border-top:1px solid #e0e8ed;margin-top:17px;padding-top:15px}
.lab-vent-details h3{font-size:.96rem;line-height:1.4;color:#435f70;margin:0 0 10px;font-weight:500}
.lab-vent-details p{font-size:.73rem;line-height:1.75;color:#78909e;margin:0 0 12px!important}
@media(max-width:850px){.lab-system-promise{font-size:.77rem;max-width:420px}.roof-system-v5[data-inspector-open] .lab-vent-selector{gap:4px}.lab-vent-selector small{font-size:.55rem}.lab-vent-rule{padding:10px;margin:9px 0}.lab-vent-rule p{font-size:.69rem}.roof-system-v5[data-component=ventilation] .lab-detail-drawing{float:none;width:100%;max-width:330px;margin:12px auto}.lab-vent-details h3{font-size:.88rem}}
@media(min-width:851px) and (max-height:800px){
 .roof-lab{height:calc(100svh - 115px);min-height:550px}
 .lab-sidebar{padding-top:20px;padding-bottom:18px}
 .lab-intro{padding-top:16px}.lab-intro-hint{display:none}
 .lab-intro-actions{margin-top:20px}.lab-system-promise{margin-top:10px!important}
 .lab-stage{padding-top:16px;padding-bottom:16px}.lab-artwork-frame{min-height:220px}
 .lab-interaction-hint{margin-bottom:8px!important}.lab-toolbar{padding-top:10px}.lab-layer-controls{margin-top:10px}
 .lab-caption{margin-top:8px!important}.lab-inspector-top{margin-bottom:10px}.lab-inspector-scroll{padding-top:16px}
}
/* v7: readable component inspection and a cinematic, directly controlled assembly. */
.roof-system-v7[data-inspector-open] .roof-lab{grid-template-columns:minmax(365px,38%) minmax(0,1fr)}
.roof-system-v7 .lab-sidebar{padding-left:clamp(28px,4.2vw,76px)}
.roof-system-v7 .lab-inspector{filter:none;backdrop-filter:none;transform:none}
.roof-system-v7 .lab-summary,.roof-system-v7 .lab-install-takeaway,.roof-system-v7 .lab-installation details p,.roof-system-v7 .lab-product figcaption p,.roof-system-v7 .lab-vent-details p{font-size:1rem;line-height:1.65;color:#44545f;letter-spacing:0;font-weight:400}
.roof-system-v7 .lab-article h2{font-size:clamp(1.9rem,2.3vw,2.8rem);color:#263a45;line-height:1.14;letter-spacing:-.035em}
.roof-system-v7 .lab-eyebrow{font-size:.72rem;color:#617482}.roof-system-v7 .lab-system-name{font-size:.85rem;color:#38535f;letter-spacing:.06em}
.roof-system-v7 .lab-inspector-top button,.roof-system-v7 .lab-inspector-top a{font-size:.8rem;color:#405e6f;min-height:40px}
.roof-system-v7 .lab-inspector-tabs button{font-size:.8rem;color:#486171;min-height:43px;padding:10px 5px}
.roof-system-v7 .lab-detail-drawing{padding:16px 7px;background:#f7f9fa;border-color:#d7e0e5}
.roof-system-v7 .lab-installation summary{font-size:.94rem;color:#2e4b5c;min-height:32px}
.roof-system-v7 .lab-source{font-size:.8rem;color:#375f75;line-height:1.6}.roof-system-v7 .lab-drawing-caption,.roof-system-v7 .lab-product-disclaimer{font-size:.72rem;line-height:1.55;color:#687d8a}
.roof-system-v7 .lab-product figcaption a{font-size:1.05rem;color:#264b60}.roof-system-v7 .lab-product figcaption>span{font-size:.72rem;color:#5d7482}.roof-system-v7 .lab-product-photo{height:clamp(175px,25svh,260px)}
.roof-system-v7 .lab-vent-rule strong{font-size:1rem;color:#294d62}.roof-system-v7 .lab-vent-rule p{font-size:.88rem;color:#425e70}
.roof-system-v7 .lab-vent-selector label,.roof-system-v7 .lab-component-options>span{font-size:.78rem;color:#466070}.roof-system-v7 .lab-vent-selector select{font-size:.88rem;min-height:42px;color:#29495b}.roof-system-v7 .lab-vent-selector small{font-size:.72rem;color:#5d7482}
.roof-system-v7 .lab-component-options button{font-size:.77rem;min-height:38px;color:#456678}.roof-system-v7 .lab-inspector-actions{flex-wrap:wrap;gap:7px}.roof-system-v7 .lab-inspector-actions button{font-size:.8rem;min-height:43px;padding:9px 8px;color:#385b70;background:#edf4f8;flex-basis:40%}.roof-system-v7 .lab-inspector-actions [data-roof-selected-layer]{flex-basis:100%;background:#fff;color:#526b79}
.roof-system-v7 .lab-stage{padding-right:clamp(22px,3vw,55px)}
.roof-system-v7 .lab-presentation button{font-size:.73rem;min-height:36px;padding:8px 11px;color:#516670}.roof-system-v7 .lab-presentation button[aria-pressed=true]{color:white}
.lab-story-toggle{display:inline-flex;align-items:center;gap:8px;min-height:37px;border:1px solid #cfdae0;border-radius:24px;padding:8px 14px;font-size:.74rem;color:#2c5268;background:#fff;white-space:nowrap;box-shadow:0 2px 7px #21313408}.lab-story-toggle:hover{background:#edf4f8}.lab-story-toggle:disabled{opacity:.45;cursor:default}.lab-story-toggle [data-story-icon]{font-size:.72rem;width:12px}
.roof-system-v7 .lab-reset{font-size:.7rem}.roof-system-v7 .lab-camera select{font-size:.7rem}
.roof-system-v7 .lab-artwork-frame{isolation:isolate;overflow:hidden;border-radius:18px;background:radial-gradient(ellipse at 53% 60%,#f1f5f5 0,white 70%)}
.roof-system-v7 .lab-photo-perspective{inset:8px 0 18px;perspective:1800px}
.roof-system-v7 .lab-photo-zoom{transform-origin:50% 50%;transform:translate3d(var(--focus-x,0px),var(--focus-y,0px),0) scale(var(--photo-zoom,1));transition:transform 900ms cubic-bezier(.2,.65,.2,1)}
.roof-system-v7[data-detail-focused] .lab-photo-motion{transform:none!important}
.roof-system-v7[data-story-playing] .roof-photo-assembly [data-photo-layer],.roof-system-v7[data-story-playing] .roof-photo-assembly [data-photo-aperture],.roof-system-v7[data-story-playing] .roof-photo-assembly g{transition:none!important}
.lab-story-state{position:absolute;z-index:8;left:50%;bottom:12px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:.76rem;color:#466372;padding:8px 15px;background:#fffffff2;border:1px solid #e0e8ed;border-radius:25px;pointer-events:none;box-shadow:0 4px 15px #263c4a08}
.lab-story-state i{display:block;width:5px;height:5px;border-radius:50%;background:#58809a}.roof-system-v7[data-story-playing] .lab-story-state i{box-shadow:0 0 0 4px #dceaf1}
.lab-macro-host{position:absolute;inset:0;display:grid;place-items:center;background:#f6f4f0;overflow:hidden}.lab-macro-canvas{position:relative;flex:none;transform:translate3d(var(--focus-x,0px),var(--focus-y,0px),0) scale(var(--photo-zoom,1));transform-origin:50% 50%;transition:transform 850ms cubic-bezier(.2,.65,.2,1)}
.lab-macro-canvas>img{width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}.lab-macro-pick{position:absolute;z-index:3;transform:translate(-50%,-50%);width:33px;height:33px;border-radius:50%;background:#fffffff5;color:#284d62;border:1px solid #8aa4b4;box-shadow:0 3px 12px #172c4533;font-size:11px;font-weight:600;display:grid;place-items:center;padding:0}.lab-macro-pick[aria-pressed=true]{background:#274a60;color:white;border-color:white;box-shadow:0 0 0 4px #ffffff70}.lab-macro-pick:hover{background:#dceaf2;color:#23455a}
.roof-system-v7 .lab-interaction-hint{font-size:.76rem;color:#5c7585;margin-top:10px!important;margin-bottom:12px!important}.roof-system-v7 .lab-component-picker select{font-size:.8rem;color:#36566a;min-height:42px}.roof-system-v7 .lab-view-modes button{font-size:.75rem;padding:9px 13px}.roof-system-v7 .lab-separation label,.roof-system-v7 .lab-separation output,.roof-system-v7 .lab-layer-menu-button{font-size:.74rem;color:#547080}.roof-system-v7 .lab-zoom output{font-size:.76rem;width:46px}.roof-system-v7 .lab-zoom button{width:34px}.roof-system-v7 .lab-caption{font-size:.65rem;color:#748894}.roof-system-v7 .lab-layer-controls{padding-right:0}
body:has(.roof-system-v7) #chat-launch{bottom:28px}.roof-system-v7 .lab-layer-menu{font-size:.86rem}.roof-system-v7 .lab-layer-buttons button{font-size:.8rem;color:#36586c}.roof-system-v7 .lab-layer-buttons small{font-size:.7rem}.roof-system-v7 .lab-layer-menu-footer button{font-size:.78rem}
@media(min-width:851px) and (max-width:1150px){.roof-system-v7[data-inspector-open] .roof-lab{grid-template-columns:360px minmax(0,1fr)}.roof-system-v7 .lab-stage-top{flex-wrap:wrap;gap:7px}.roof-system-v7 .lab-story-toggle{margin-left:auto}.roof-system-v7 .lab-stage{padding-right:20px}.roof-system-v7 .lab-sidebar{padding-left:26px;padding-right:20px}}
@media(min-width:851px) and (max-height:800px){.roof-system-v7 .lab-inspector-scroll{padding-top:12px}.roof-system-v7 .lab-summary{font-size:.94rem}.roof-system-v7 .lab-inspector-actions{padding-top:9px}.roof-system-v7 .lab-interaction-hint{margin-block:7px!important}.roof-system-v7 .lab-artwork-frame{min-height:170px}.roof-system-v7 .lab-layer-controls{margin-top:7px}.roof-system-v7 .lab-stage-top{min-height:39px}}
@media(max-width:850px){
 .roof-system-v7[data-inspector-open] .roof-lab{grid-template-columns:1fr;grid-template-rows:43% 57%}
 .roof-system-v7 .lab-stage{padding-inline:5%;height:620px}.roof-system-v7 .lab-stage-top{gap:6px;flex-wrap:wrap}.roof-system-v7 .lab-presentation button{font-size:.69rem;padding:8px 10px;min-height:35px}.roof-system-v7 .lab-story-toggle{font-size:.7rem;padding:8px 11px;margin-left:auto}.roof-system-v7 .lab-reset{font-size:.65rem}
 .roof-system-v7 .lab-story-state{font-size:.66rem;bottom:8px;padding:7px 10px;max-width:95%;white-space:normal;text-align:center;line-height:1.4}.roof-system-v7 .lab-layer-controls{flex-wrap:wrap;gap:4px 12px}.roof-system-v7 .lab-separation{min-width:65%}.roof-system-v7 .lab-layer-menu-button{font-size:.69rem}
 .roof-system-v7[data-inspector-open] .lab-stage{height:auto;padding:9px 4% 6px}.roof-system-v7[data-inspector-open] .lab-sidebar{padding:0 5% 10px}.roof-system-v7[data-inspector-open] .lab-story-toggle,.roof-system-v7[data-inspector-open] .lab-story-state{display:none}.roof-system-v7[data-inspector-open] .lab-artwork-frame{min-height:0}.roof-system-v7[data-inspector-open] .lab-photo-perspective{inset:0}
 .roof-system-v7[data-inspector-open] .lab-inspector-top{min-height:35px}.roof-system-v7[data-inspector-open] .lab-inspector-top button,.roof-system-v7[data-inspector-open] .lab-inspector-top a{font-size:.78rem;min-height:34px}.roof-system-v7[data-inspector-open] .lab-inspector-tabs button{font-size:.8rem;min-height:39px;padding:8px 4px}
 .roof-system-v7[data-inspector-open] .lab-summary,.roof-system-v7[data-inspector-open] .lab-install-takeaway,.roof-system-v7[data-inspector-open] .lab-product figcaption p{font-size:.94rem;line-height:1.6;color:#3f5462}.roof-system-v7[data-inspector-open] .lab-article h2{font-size:1.75rem}.roof-system-v7[data-inspector-open] .lab-detail-drawing{float:none;width:100%;margin:14px 0;padding:10px}.roof-system-v7[data-inspector-open] .lab-installation details p{font-size:.94rem}
 .roof-system-v7[data-inspector-open] .lab-product-photo{float:none;width:100%;height:190px;margin:10px 0}.roof-system-v7[data-inspector-open] .lab-product figcaption{padding:10px 0}.roof-system-v7[data-inspector-open] .lab-inspector-actions button{font-size:.75rem;padding:8px 7px;min-height:36px}.roof-system-v7[data-inspector-open] .lab-inspector-actions{gap:5px;padding-top:7px}
 .roof-system-v7[data-inspector-open] .lab-vent-selector select{font-size:.84rem;min-height:35px}.roof-system-v7[data-inspector-open] .lab-vent-selector label{font-size:.73rem}.roof-system-v7[data-inspector-open] .lab-vent-selector small{font-size:.66rem}
 .roof-system-v7[data-inspector-open] .lab-toolbar{gap:4px}.roof-system-v7[data-inspector-open] .lab-component-picker select{font-size:.73rem;min-height:34px}.roof-system-v7[data-inspector-open] .lab-view-modes button{font-size:.66rem;padding:7px 11px}.roof-system-v7[data-inspector-open] .lab-separation label,.roof-system-v7[data-inspector-open] .lab-separation output{font-size:.64rem}.roof-system-v7[data-inspector-open] .lab-zoom output{font-size:.68rem}.roof-system-v7[data-inspector-open] .lab-layer-menu-button{font-size:.65rem}
}
@media(prefers-reduced-motion:reduce){.roof-system-v7 .lab-photo-zoom,.lab-macro-canvas{transition:none!important}}
html:not(.motion-on) .roof-system-v7 .lab-photo-zoom,html:not(.motion-on) .lab-macro-canvas{transition:none!important}
/* Keep the assistant clear of the roof controls on a short desktop. */
@media(min-width:851px) and (max-height:800px){body:has(.roof-system-v7) #chat-launch{bottom:18px;right:auto;left:26px}}
.roof-system-v7 .lab-view-modes[hidden]{display:none}
@media(max-width:850px){body:has(.roof-system-v7) #chat-launch{bottom:82px;right:18px;width:48px;height:48px;padding:0;font-size:0}body:has(.roof-system-v7) #chat-launch span{font-size:21px}}