Merge fix/BUG-03-span-geometry: CSS-Grid-Span-Geometrie im Initial-Render

Konflikt in renderGrid() zwischen HEAD (BUG-01: kein HTML5-draggable,
touch-action:none) und BUG-03 (alter draggable=true). Resolution:
HEAD-Variante behalten — BUG-01 hat den HTML5-Drag komplett entfernt,
BUG-03 nur die Span-Geometrie gefixt. Kompatibel, kein Re-Konflikt.

Tests: 5/5 Python + 7/7 Pointer-Events + 8/8 Span-Geometry = alle grün.

templates/index.html

@@ -1305,7 +1305,6 @@
     // Place items into their origin cell
     const occ = occupiedCells();
     layoutItems.forEach((it, idx) => {
-      const cellIdx = it.x + ',' + it.y;
       const originCell = cont.querySelector(`[data-cell="${it.x + it.y * gridCols}"]`);
 
       const div = document.createElement('div');
@@ -1331,12 +1330,19 @@
         <div class="grid-item-resize" data-resize="${idx}" title="Größe ändern (Ecke ziehen)"></div>
       `;
 
-      if (originCell) {
-        originCell.classList.add('occupied');
-        originCell.appendChild(div);
-      } else {
-        cont.appendChild(div);
-      }
+      // BUG-03: Span-Geometrie per CSS Grid (grid-column/grid-row) statt
+      // per Cell-DOM-Anker. Item wird direkt in den Grid-Container gehängt,
+      // nicht in die Origin-Cell. Damit:
+      //   - NxN-Items rendern visuell über NxN Cells
+      //   - Drag-Events auf Nachbar-Cells werden nicht vom Item-DOM
+      //     verschluckt (Item ist nicht mehr Kind der Cell)
+      //   - Resize (applySize in startResizePointer) kann den Span nahtlos
+      //     aktualisieren ohne den DOM-Anker zu wechseln
+      div.style.gridColumn = `${it.x + 1} / span ${it.w}`;
+      div.style.gridRow    = `${it.y + 1} / span ${it.h}`;
+      cont.appendChild(div);
+      // Origin-Cell nur als "occupied" markieren, damit sie ihre leere Optik verliert
+      if (originCell) originCell.classList.add('occupied');
     });
 
     // Mark occupied cells