task(CAD-6): background rendering fix - bgConfig was never wired to render engine (import worked but never drew), canvas area setOptions + pixi sprite implementation

frontend/src/components/CanvasArea.tsx

@@ -378,6 +378,19 @@ const CanvasArea: React.FC<CanvasAreaProps> = ({
     renderEngine.setOptions({ showOrtho: orthoEnabled });
     renderEngine.setOptions({ gridSize, unit, scaleFactor, showGridLabels: true });
     renderEngine.setOptions({ canvasBgColor, gridColor, rulerEnabled });
+
+    // ── Task CAD-6: Hintergrund-Grundriss (bgConfig) an RenderEngine geben ──
+    // Vorher wurde bgConfig als Prop uebergeben aber NIE genutzt — der
+    // importierte Grundriss wurde nicht gezeichnet.
+    renderEngine.setOptions({
+      backgroundSrc: bgConfig?.visible ? (bgConfig.src || undefined) : undefined,
+      backgroundScale: bgConfig?.scale ?? 1,
+      backgroundOffsetX: bgConfig?.offsetX ?? 0,
+      backgroundOffsetY: bgConfig?.offsetY ?? 0,
+      backgroundRotation: ((bgConfig?.rotation ?? 0) * Math.PI) / 180,
+      backgroundOpacity: bgConfig?.opacity ?? 0.5,
+    });
+    renderEngine.render();
     interaction.setSnapEnabled(snapEnabled);
     interaction.setOrthoEnabled(orthoEnabled);
     interaction.setPolarEnabled(polarEnabled);
@@ -385,7 +398,7 @@ const CanvasArea: React.FC<CanvasAreaProps> = ({
     interaction.setGridSize(gridSize);
     renderEngine.render();
   // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [gridEnabled, snapEnabled, orthoEnabled, polarEnabled, unit, gridSize, scaleFactor, canvasBgColor, gridColor, rulerEnabled]);
+  }, [gridEnabled, snapEnabled, orthoEnabled, polarEnabled, unit, gridSize, scaleFactor, canvasBgColor, gridColor, rulerEnabled, bgConfig]);
 
   // Sync active tool
   useEffect(() => {

frontend/src/render/pixi/PixiRenderer.ts

@@ -156,8 +156,48 @@ export class PixiRenderer implements RenderAdapter {
     this.root.addChild(g);
   }
 
-  drawBackground(_img: HTMLImageElement | null, _cfg: BackgroundDrawConfig): void {
-    // Sprite-/Texturintegration folgt in Task C3.
+  private bgSprite: unknown | null = null;
+  private bgSpriteSrc = '';
+
+  drawBackground(img: HTMLImageElement | null, cfg: BackgroundDrawConfig): void {
+    // Task CAD-6: Hintergrund-Grundriss als Sprite unter den Elementen.
+    if (!this.root || !img || !cfg.src) {
+      // Ohne Bild: vorhandenes Sprite entfernen (Hintergrund aus)
+      if (this.bgSprite) {
+        (this.bgSprite as { destroy: () => void }).destroy();
+        this.bgSprite = null;
+        this.bgSpriteSrc = '';
+      }
+      return;
+    }
+    // Bild-Cache: Neuaufbau nur bei Quellwechsel
+    if (this.bgSpriteSrc !== cfg.src) {
+      if (this.bgSprite) (this.bgSprite as { destroy: () => void }).destroy();
+      // Lazy-Pixi (Modul-Fehler-Isolation wie in init): Sprite dynamisch
+      const PixiNS = (this as unknown as { pixiNS: unknown }).pixiNS as
+        { Sprite: new (src: string) => unknown } | undefined;
+      if (!PixiNS) return;
+      const sprite = new PixiNS.Sprite(cfg.src);
+      (sprite as unknown as { alpha: number }).alpha = cfg.opacity ?? 0.5;
+      this.bgSprite = sprite;
+      this.bgSpriteSrc = cfg.src;
+      this.root.addChildAt(sprite as never, 0); // ganz unten
+    }
+    // Transform aktualisieren (Legacy-Paritaet: Zentrum bei offset, scaled)
+    const s = cfg.scale ?? 1;
+    const sprite = this.bgSprite as unknown as {
+      position: { set: (x: number, y: number) => void };
+      width: number; height: number;
+      anchor: { set: (x: number, y: number) => void };
+      rotation: number; scale: { set: (x: number, y: number) => void };
+      alpha: number;
+    };
+    sprite.anchor.set(0, 0);
+    sprite.width = img.width * s;
+    sprite.height = img.height * s;
+    sprite.position.set(cfg.offsetX ?? 0, cfg.offsetY ?? 0);
+    sprite.rotation = cfg.rotation ?? 0;
+    sprite.alpha = cfg.opacity ?? 0.5;
   }
 
   drawRuler(_cfg: RulerConfig): void {