feat: Hintergrund wechselt dynamisch zur Pastelversion der aktuellen Farbe

Bei jeder Farbidentifikation wird der Hue übernommen, Sättigung gedämpft
(max 45%) und Helligkeit auf 92% gesetzt. Sanfter 0.8s CSS-Übergang.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

js/app.js

@@ -44,6 +44,13 @@ document.querySelectorAll('.tab-btn').forEach(btn => {
 // Every color change goes into history
 document.addEventListener('colorChanged', (e) => addToHistory(e.detail));
 
+// Hintergrundfarbe als extrem helles Pastell der aktuellen Farbe
+document.addEventListener('colorChanged', (e) => {
+  const { h, s } = e.detail;
+  const pastelS = Math.round(Math.min(s * 0.5, 45));
+  document.body.style.background = `hsl(${h}, ${pastelS}%, 92%)`;
+});
+
 initEingabe(addFavorit, addColorToSchema);
 initPicker(addFavorit, addColorToSchema);
 initHarmonien(addFavorit, addColorToSchema);

style.css

@@ -7,6 +7,7 @@ body {
   background: #DFE9F5;
   color: #222;
   min-height: 100vh;
+  transition: background 0.8s ease;
 }
 
 #lottie-bg {