From b2ffe3413b66e09da60bc8cba0582a0e762706fe Mon Sep 17 00:00:00 2001
From: Daddy32 <daddy@autistici.org>
Date: Fri, 26 Dec 2025 21:11:08 +0100
Subject: [PATCH] fixes, various

---
 src/config.js                |  4 ++--
 src/scenes/scene-lavalamp.js |  9 +++++----
 styles.css                   | 18 +++++++++---------
 3 files changed, 16 insertions(+), 15 deletions(-)

diff --git a/src/config.js b/src/config.js
index f834d93..a25c7c8 100644
--- a/src/config.js
+++ b/src/config.js
@@ -67,11 +67,11 @@
       backdrop: {
         enabled: true,
         colors: null, // optional array; defaults derived from palette
-        opacity: 0.19,
+        opacity: 0.35,
         blur: 24,
         speedSec: 30,
       },
-      showFps: true,
+      showFps: false,
     };
 
     return {
diff --git a/src/scenes/scene-lavalamp.js b/src/scenes/scene-lavalamp.js
index fceb3de..d5f5862 100644
--- a/src/scenes/scene-lavalamp.js
+++ b/src/scenes/scene-lavalamp.js
@@ -14,7 +14,7 @@
       const x = cx + Math.sin(t * Math.PI * 1.5) * amp;
       const dx = x - prevX;
       const dy = y - prevY;
-      const len = Math.max(1, Math.sqrt(dx * dx + dy * dy));
+      const len = 0.8 * Math.max(1, Math.sqrt(dx * dx + dy * dy));
       const angle = Math.atan2(dy, dx);
       segs.push(
         Bodies.rectangle((prevX + x) / 2, (prevY + y) / 2, thickness, len, {
@@ -40,7 +40,7 @@
       autoSpawn: true,
       minChain: 3,
       palette: ["#f472b6", "#38bdf8", "#fbbf24", "#a855f7", "#22c55e"],
-      ballRadius: 26,
+      ballRadius: 36,
       blobBalls: "jagged",
       winCondition: {
         type: "score",
@@ -63,8 +63,9 @@
       },
     },
     createBodies: (w, h) => {
-      const wallThickness = Math.max(24, w * 0.05);
-      const amp = Math.max(40, w * 0.08);
+      const thicknessScale = Math.min(0.04, 0.03 + (w / 1200) * 0.02);
+      const wallThickness = Math.max(16, w * thicknessScale);
+      const amp = Math.min(15, w * 0.08);
       const segments = 12;
       const curves = [
         ...makeCurveSegments(w * 0.33, h, amp, wallThickness, segments),
diff --git a/styles.css b/styles.css
index ac0a48f..cce5565 100644
--- a/styles.css
+++ b/styles.css
@@ -139,21 +139,21 @@ header .pill {
     background:
         radial-gradient(
             circle at 30% 30%,
-            var(--backdrop-color-a, rgba(56, 189, 248, 0.045)),
+            var(--backdrop-color-a, rgba(56, 189, 248, 0.12)),
             transparent 50%
         ),
         radial-gradient(
             circle at 70% 60%,
-            var(--backdrop-color-b, rgba(167, 139, 250, 0.04)),
+            var(--backdrop-color-b, rgba(167, 139, 250, 0.1)),
             transparent 48%
         ),
         radial-gradient(
             circle at 50% 20%,
-            var(--backdrop-color-c, rgba(52, 211, 153, 0.035)),
+            var(--backdrop-color-c, rgba(52, 211, 153, 0.09)),
             transparent 45%
         );
     filter: blur(var(--backdrop-blur, 24px));
-    opacity: var(--backdrop-opacity, 0.24);
+    opacity: var(--backdrop-opacity, 0.35);
     pointer-events: none;
     transform: scale(1.05);
     z-index: 0;
@@ -165,15 +165,15 @@ header .pill {
     background:
         radial-gradient(
             circle at 20% 60%,
-            var(--backdrop-color-a, rgba(14, 165, 233, 0.032)),
+            var(--backdrop-color-a, rgba(14, 165, 233, 0.08)),
             transparent 50%
         ),
         radial-gradient(
             circle at 80% 30%,
-            var(--backdrop-color-b, rgba(244, 114, 182, 0.032)),
+            var(--backdrop-color-b, rgba(244, 114, 182, 0.08)),
             transparent 50%
         );
-    opacity: calc(var(--backdrop-opacity, 0.24) * 0.7);
+    opacity: calc(var(--backdrop-opacity, 0.35) * 0.7);
     animation: floatBackdropAlt calc(var(--backdrop-speed, 28s) * 1.1)
         ease-in-out infinite alternate;
 }
@@ -575,7 +575,7 @@ canvas {
     }
     #scene-wrapper::before,
     #scene-wrapper::after {
-        filter: blur(18px);
-        opacity: 0.6;
+        filter: blur(22px);
+        opacity: 0.4;
     }
 }