.roof-tool{max-width:1120px;margin:auto;font-size:18px;line-height:1.5}
.roof-tool *{box-sizing:border-box;min-width:0}
.roof-tool [hidden]{display:none!important}
.rf-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:32px;align-items:start}
.rf-editor{grid-column:1;grid-row:1}.rf-output{grid-column:2;grid-row:1;padding:24px}
.rf-total{display:block;font-size:clamp(2rem,5.5vw,3rem);line-height:1.2;margin:8px 0}
.roof-tool p{margin:12px 0}.roof-tool h2{font-size:1.2em;margin:0 0 16px}.roof-tool h3{font-size:1.1em;margin:20px 0 12px}
.rf-editor>h2:not(:first-child){margin-top:32px}
.rf-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,max(8em,calc((100% - 24px)/2))),1fr));gap:8px 24px;margin:20px 0 28px}
.rf-field{display:grid;grid-template-rows:subgrid;grid-row:span 3;gap:8px}.rf-field>span:first-child{align-self:end}.rf-full{grid-column:1/-1}
.rf-hint,.roof-tool small,.roof-tool figcaption{font-size:16px;line-height:1.5}.public-app-shell .roof-tool :is(p,small,figcaption){color:inherit}
.rf-toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:20px 0}
.rf-toolbar .km-btn{white-space:normal}.rf-edit{display:none}
.rf-measures{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,12em),1fr));gap:12px 20px;margin:20px 0}.rf-measures>div{min-width:0}.rf-measures dt{font-size:16px}.rf-measures dd{margin:4px 0 0;font-weight:650}
.public-app-shell .roof-tool figure.rf-figure{display:block;margin:24px 0}.rf-figure>#rf-diagram{width:100%}.rf-figure svg{display:block;width:100%;height:auto;aspect-ratio:18/10}
.rf-figure :is(path,line,polygon){stroke:currentColor;stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.rf-face{fill:var(--color-primary);fill-opacity:.18}.rf-face.rf-selected{fill-opacity:.48}.rf-face.rf-muted{fill-opacity:.07}
.rf-edge{fill:none}.rf-dimension{fill:none;stroke-dasharray:5 5;opacity:.65}.rf-figure text{font-family:inherit;fill:currentColor;font-weight:600;paint-order:stroke;stroke:var(--color-base-100);stroke-width:5px;stroke-linejoin:round}
.rf-help{margin:28px 0}.rf-table-wrap{container-type:inline-size;overflow:auto;max-width:100%;margin:20px 0}.rf-table-wrap table{width:100%;border-collapse:collapse}.rf-table-wrap :is(th,td){padding:12px;text-align:start;vertical-align:top;word-break:normal;overflow-wrap:normal}.rf-table-wrap tr+tr{border-top:1px solid var(--color-base-300)}
.rf-example-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15em),1fr));gap:12px}.rf-example-grid button{display:block;text-align:start;white-space:normal}.rf-example-grid :is(strong,span){display:block}.rf-example-grid span{font-size:16px;margin-top:8px}
.rf-print{display:none}
@media(max-width:767px){.rf-layout{grid-template-columns:1fr;gap:32px}.rf-output{grid-column:1;grid-row:1;padding:0;border:0;background:none;box-shadow:none}.rf-editor{grid-column:1;grid-row:2}.rf-edit{display:inline-flex}.rf-help>.km-collapse-content{padding-inline:0}}
@media(max-width:360px){.rf-fields{grid-template-columns:1fr}}
@media print{.roof-tool .rf-print{display:block;white-space:pre-wrap;font:inherit;color:#000;background:#fff}.roof-tool :is(.rf-layout,.rf-help,.rf-screen){display:none!important}}

@container(max-width:14em){.rf-table-wrap thead{display:none}.rf-table-wrap :is(table,tbody,tr,td){display:block;width:100%}.rf-table-wrap td{padding:8px 0}.rf-table-wrap td+td::before{content:"Surface réelle : ";display:block;font-size:.8em}.rf-table-wrap td+td{padding-top:0}}
