/* 261 pass 5: "How it was built", Section A-A construction drawing (svg from tools/section-aa.py, motion in js/blueprint.js).
   Three line weights (.6 / 1 / 1.8), cut lines heaviest, all solid; acid only for spray foam and callout numbers. */
.bp5-bd{min-width:0;grid-template-columns:minmax(0,1fr)}
@media (min-width:960px){.bp5-bd{grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:56px}}
.bp5-fig{margin:0;min-width:0}
.bp5{display:block;width:100%;height:auto;background:var(--ink);border:1px solid var(--line-2);border-radius:4px}

/* line work */
.bp5 g :is(path,rect,circle){vector-effect:non-scaling-stroke}
.bp5 g path{fill:none}
.bp5 .bg{fill:var(--ink)}
.bp5 .s1{stroke:var(--muted);stroke-width:.6}
.bp5 .s2{stroke:var(--text);stroke-width:1}
.bp5 .s3{stroke:var(--paper);stroke-width:1.8}
.bp5 .cl{stroke:var(--muted);stroke-width:.6;stroke-opacity:.55;stroke-dasharray:14 3 2 3}
.bp5 .gh{stroke:var(--muted);stroke-width:.6;stroke-opacity:.45}
.bp5 .grain{stroke-opacity:.45}
.bp5 .dc{fill:none}
.bp5 .fk{fill:var(--ink)}
.bp5 .fh{fill:url(#bp5Blk)}
.bp5 .fc{fill:url(#bp5Con)}
.bp5 .fs{fill:url(#bp5Stu)}
.bp5 .fe{fill:url(#bp5Ear);opacity:.7}
.bp5 .rb,.bp5 .ldot{fill:var(--muted)}
.bp5 .tri,.bp5 .sb{fill:var(--muted)}
.bp5 .na{fill:var(--text)}
.bp5 .bb{fill:var(--ink);stroke:var(--text);stroke-width:1}
.bp5 .fo{fill:var(--acid);fill-opacity:.2;stroke:var(--acid);stroke-width:1;stroke-linejoin:round}
.bp5 .od{fill:var(--acid);opacity:.6}
/* patterns (user units, scale with the drawing) */
.bp5 .pg{fill:none;stroke:var(--text);stroke-opacity:.06;stroke-width:.5}
.bp5 .pb{fill:none;stroke:var(--text);stroke-opacity:.5;stroke-width:.45}
.bp5 .pb2{fill:none;stroke:var(--text);stroke-opacity:.16;stroke-width:.45}
.bp5 .pc{fill:var(--muted);fill-opacity:.7}
.bp5 .pe{fill:none;stroke:var(--muted);stroke-opacity:.5;stroke-width:.5}

/* plan sheet text: 10.5 user units stays >= 9px at 390px wide */
.bp5 text{font:400 10.5px/1 ui-monospace,'DM Mono',SFMono-Regular,Menlo,monospace;fill:var(--text);letter-spacing:.02em}
.bp5 .tm{fill:var(--muted)}
.bp5 .tgh{fill:var(--muted);fill-opacity:.7}
.bp5 .tg{font-weight:600}
.bp5 .tn{font-weight:600;fill:var(--acid)}
.bp5 .tt{font:400 15.5px/1 var(--serif);fill:var(--paper);letter-spacing:.01em}

/* stepper: layers dim / hide */
.bp5 .ly{transition:opacity .35s var(--ease)}
.bp5 .ly.dim{opacity:.35}
.bp5 .ly.off{opacity:0;visibility:hidden}

/* construction sequence: .pre = start state, .run = transition to the final state; no class = final (no-JS default) */
.bp5 .pop{transform-box:fill-box;transform-origin:center}
/* pathLength dashes ignore non-scaling-stroke in Chrome, so scale strokes by --k (1/drawing scale, set in JS) while drawing */
.bp5.pre .dr,.bp5.run .dr{stroke-dasharray:1;vector-effect:none}
.bp5:is(.pre,.run) .s1.dr{stroke-width:calc(.6px*var(--k,1))}
.bp5:is(.pre,.run) .s2.dr{stroke-width:calc(1px*var(--k,1))}
.bp5:is(.pre,.run) .s3.dr{stroke-width:calc(1.8px*var(--k,1))}
.bp5.pre .dr{stroke-dashoffset:1}
.bp5.pre .fd{opacity:0}
.bp5.pre .wp{clip-path:inset(0 100% 0 0)}
.bp5.pre .wpu{clip-path:inset(100% 0 0 0)}
.bp5.pre .pop{opacity:0;transform:scale(.4)}
.bp5.run .dr{stroke-dashoffset:0;transition:stroke-dashoffset var(--d,.9s) var(--ease) var(--t,0s)}
.bp5.run .fd{transition:opacity var(--d,.6s) var(--ease) var(--t,0s)}
.bp5.run .wp,.bp5.run .wpu{clip-path:inset(0);transition:clip-path var(--d,1s) var(--ease) var(--t,0s)}
.bp5.run .pop{transition:opacity .3s var(--ease) var(--t,0s),transform .45s cubic-bezier(.3,1.6,.5,1) var(--t,0s)}
.bp5.run .foam{transition-timing-function:cubic-bezier(.45,.05,.3,1)}
@media (prefers-reduced-motion:reduce){.bp5 .ly{transition:none}}

/* controls */
.bp5-ctl{margin-top:14px}
.bp5-ctl[hidden],.bp5-ly[hidden]{display:none}
.bp5-bar{display:flex;align-items:center;gap:8px;min-width:0}
.bp5-steps{flex:1;min-width:0;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:3px;scroll-snap-type:x proximity}
.bp5-steps::-webkit-scrollbar{display:none}
.bp5-steps button,.bp5-ly button,.bp5-btn{flex:none;min-height:44px;padding:0 14px;border:1px solid var(--line-2);border-radius:999px;font:500 12px/1 var(--sans);letter-spacing:.04em;color:var(--muted);white-space:nowrap;scroll-snap-align:start;transition:background-color .2s,color .2s,border-color .2s}
.bp5-steps button:hover,.bp5-ly button:hover,.bp5-btn:hover{border-color:rgba(233,240,86,.5);color:var(--paper)}
.bp5-steps button[aria-current="step"]{background:var(--paper);border-color:var(--paper);color:var(--ink)}
.bp5-bar .icon-btn[disabled]{opacity:.35;cursor:default}
.bp5-bar2{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.bp5-ly{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.bp5-ly button[aria-pressed="true"]{color:var(--paper);border-color:var(--text)}
.bp5-ly button[aria-pressed="false"]{border-style:dashed;text-decoration:line-through}
.bp5-live{margin-top:10px;min-height:2.8em;font-size:14px;line-height:1.4;color:var(--text)}

/* legend */
.bp5-leg{margin-top:14px;display:grid;gap:6px;font-size:12px;line-height:1.35;color:var(--muted)}
.bp5-leg li{display:flex;align-items:center;gap:10px}
.bp5-leg svg{flex:none;width:28px;height:8px}
.bp5-leg .lg-v{stroke:var(--paper);stroke-width:1.8}
.bp5-leg .lg-h{fill:url(#bp5Blk);stroke:var(--text);stroke-width:.6}
.bp5-leg .lg-f{fill:rgba(233,240,86,.25);stroke:var(--acid)}
.bp5-fig figcaption{margin-top:12px;font-size:12px;color:var(--muted)}

/* key list (real HTML) */
.bp5-key{counter-reset:none;margin-bottom:40px;display:grid;gap:0}
.bp5-key li{display:grid;grid-template-columns:28px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--line-2);font-size:14px;line-height:1.45;color:var(--text);transition:opacity .3s var(--ease)}
.bp5-key b{display:block;font-weight:500;color:var(--paper)}
.bp5-n{display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--text);border-radius:50%;font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--acid)}
.bp5-key.stepping li:not(.cur){opacity:.45}