/* v12 — area fractions as quiet header notes, the insulation column as a layer list */
/* area hint in the two-column headers */
.ck{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.areahint{position:relative;font:500 10.5px/1.4 Inter;letter-spacing:0;text-transform:none;color:var(--text-3);cursor:help;white-space:nowrap}
.areahint .tip{position:absolute;right:0;top:calc(100% + 6px);width:max-content;max-width:230px;padding:7px 10px;border-radius:8px;background:var(--surface-3);border:1px solid var(--border-strong);box-shadow:0 10px 24px rgba(0,0,0,.28);font:500 11px/1.5 'JetBrains Mono',monospace;color:var(--text-2);opacity:0;visibility:hidden;transition:opacity .14s;z-index:8}
.areahint:hover .tip,.areahint:focus-visible .tip{opacity:1;visibility:visible}
/* the layer list */
.ilist{display:flex;flex-direction:column;gap:7px}
.irow{position:relative;display:grid;grid-template-columns:12px minmax(0,1fr) auto auto 26px;align-items:center;gap:6px 9px;padding:9px 10px 9px 9px;border-radius:11px;background:var(--surface);border:1px solid var(--hairline);border-left:3px solid transparent;cursor:pointer}
.irow:hover{border-color:var(--border-strong)}
.irow.sel{border-left-color:var(--brand);background:var(--surface-3)}
.irow:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.irow.last{margin-top:9px}
.irow.last::before{content:"";position:absolute;left:10px;right:10px;top:-9px;border-top:1px solid var(--hairline)}
.sw{width:12px;height:22px;border-radius:3px;background:var(--mat-insul);border:1px solid var(--border-strong)}
.sw-perim{background:var(--review-soft);border-color:var(--review)}
.irow .inm{font:700 12.5px/1.35 Inter;color:var(--text);min-width:0}
.irow .inm .cchip{margin-left:6px}
.irow .ipr{font:700 12px/1 'JetBrains Mono',monospace;color:var(--text-2);white-space:nowrap}
.irow .lk{font-size:13px;color:var(--text-3)}
.idots{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:transparent;border:1px solid transparent;color:var(--text-3);cursor:pointer}
.idots:hover{border-color:var(--border);color:var(--text)}
.idots .ms{font-size:17px}
.irow .isub{grid-column:2/-1;font:500 11px/1.45 Inter;color:var(--text-3)}
.irow .lowerwarn{grid-column:1/-1;margin-top:2px}
/* + and its menu */
.iaddwrap{position:relative;display:flex}
.addbtn{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--bg-el);border:1px dashed var(--border-strong);color:var(--text-2);cursor:pointer}
.addbtn:hover{border-style:solid;border-color:var(--brand);color:var(--brand-on)}
.imenu{position:absolute;left:0;top:calc(100% + 6px);width:330px;padding:5px;border-radius:12px;background:var(--surface-3);border:1px solid var(--border-strong);box-shadow:0 18px 40px rgba(0,0,0,.36);z-index:12;display:flex;flex-direction:column;gap:2px}
.imenu.right{left:auto;right:6px;top:34px;width:270px}
.imenu button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;padding:8px 10px;border-radius:9px;background:transparent;border:0;text-align:left;font:700 12px/1.35 Inter;color:var(--text);cursor:pointer}
.imenu button:hover{background:var(--brand-soft);color:var(--brand-on)}
.imenu button em{font:500 11px/1.4 Inter;color:var(--text-3);font-style:normal}
.imenu .mnm{display:flex;align-items:center;gap:6px}
.imenu button.dis{color:var(--text-3);cursor:not-allowed}
.imenu button.dis:hover{background:transparent;color:var(--text-3)}
.imenu .tick{font-size:14px;color:var(--pass-on,var(--brand-on))}
/* the shared row for the upper layer is a pointer back to its row */
.szrow[data-act="torow"]{cursor:pointer}
.szrow[data-act="torow"]:hover{border-color:var(--brand)}
/* section: a layer grows in when added, fades out when removed */
.secsvg g[data-part].grew{transform-box:fill-box;transform-origin:center bottom;animation:igrow .2s ease-out}
.secsvg g[data-part].grew polygon,.secsvg g[data-part].grew rect,.secsvg g[data-part].grew path{stroke:var(--brand);stroke-width:1.5}
.secsvg g[data-part].gone{opacity:0;transition:opacity .15s ease-in}
@keyframes igrow{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}