fix: round caps/joins on background-editor lines (HP-1553)

Lines drawn in the background (decor) editor showed notched 'teeth' where
two segments met at an angle. Decor <line> elements — both the saved render
and the live drawing preview — now carry stroke-linecap/linejoin=round, so
every line end reads as a circle of the stroke width and joints are smooth.
smoke_decor asserts the round attributes on the draft and the saved lines.

demo/smoke_decor.mjs

@@ -25,10 +25,22 @@ const res = await page.evaluate(async () => {
   out.rectRendered = !!sr().querySelector('.decorlayer rect.dshape');
   // 3) линия и овал
   c._decorDraft = { kind: 'line', a: [g * 2, g * 2], b: [g * 8, g * 2], pid: 1 };
+  await c.updateComplete;
+  // превью рисуемой линии уже с круглыми концами (зубцы на стыках)
+  const draftLine = sr().querySelector('.decorlayer line.ddraft');
+  out.draftLineRound = !!draftLine
+    && draftLine.getAttribute('stroke-linecap') === 'round'
+    && draftLine.getAttribute('stroke-linejoin') === 'round';
   c._decorCommitDraft();
   c._decorDraft = { kind: 'ellipse', a: [g * 30, g * 30], b: [g * 40, g * 36], pid: 1 };
   c._decorCommitDraft(); await c.updateComplete;
   out.threeShapes = c._decorList.length === 3;
+  // сохранённые линии рендерятся с круглыми концами: диаметр = толщине линии,
+  // стык двух линий под углом — без зубца (скриншот владельца)
+  await c.updateComplete;
+  const lines = [...sr().querySelectorAll('.decorlayer line.dshape')];
+  out.savedLineRound = lines.length > 0 && lines.every((l) =>
+    l.getAttribute('stroke-linecap') === 'round' && l.getAttribute('stroke-linejoin') === 'round');
   // вырожденная фигура не сохраняется
   c._decorDraft = { kind: 'line', a: [g, g], b: [g, g], pid: 1 };
   c._decorCommitDraft();

src/houseplan-card.ts

@@ -2689,8 +2689,10 @@ class HouseplanCard extends LitElement {
       const down = (e: PointerEvent) => this._decorShapeDown(e, sh);
       const dbl = () => this._decorShapeDbl(sh);
       if (sh.kind === 'line')
+        // round caps: line ends read as circles of the stroke width, so two
+        // lines meeting at an angle join without the notch (owner's screenshot)
         return svg`<line class="${cls}" x1="${sh.x1 * W}" y1="${sh.y1 * H}" x2="${sh.x2 * W}" y2="${sh.y2 * H}"
-          stroke="${sh.color}" stroke-width="${sh.width}" @pointerdown=${down}></line>`;
+          stroke="${sh.color}" stroke-width="${sh.width}" stroke-linecap="round" stroke-linejoin="round" @pointerdown=${down}></line>`;
       if (sh.kind === 'rect')
         return svg`<rect class="${cls}" x="${sh.x * W}" y="${sh.y * H}" width="${sh.w * W}" height="${sh.h * H}"
           stroke="${sh.color}" stroke-width="${sh.width}"
@@ -2711,7 +2713,7 @@ class HouseplanCard extends LitElement {
       const st = this._decorStyle;
       if (d.kind === 'line')
         draft = svg`<line class="ddraft" x1="${d.a[0]}" y1="${d.a[1]}" x2="${d.b[0]}" y2="${d.b[1]}"
-          stroke="${st.color}" stroke-width="${st.width}"></line>`;
+          stroke="${st.color}" stroke-width="${st.width}" stroke-linecap="round" stroke-linejoin="round"></line>`;
       else {
         const x = Math.min(d.a[0], d.b[0]), y = Math.min(d.a[1], d.b[1]);
         const w = Math.abs(d.b[0] - d.a[0]), h = Math.abs(d.b[1] - d.a[1]);