tweaked rendering order

static/js/button-generator/button-generator-core.js

@@ -186,8 +186,8 @@ export class ButtonGenerator {
       centerY: this.canvas.height / 2
     };
 
-    // Apply effects in order: transform -> background -> border -> text/text2 -> general
-    const renderOrder = ['transform', 'background', 'border', 'text', 'text2', 'general'];
+    // Apply effects in order: transform -> background -> background-animation -> text/text2 -> border -> general
+    const renderOrder = ['transform', 'background', 'background-animation', 'text', 'text2', 'border', 'general'];
 
     // Save context once before transforms
     this.ctx.save();

static/js/button-generator/effects/background-aurora.js

@@ -9,9 +9,9 @@ export class AuroraEffect extends ButtonEffect {
     super({
       id: "bg-aurora",
       name: "Aurora",
-      type: "general",
+      type: "background-animation",
       category: "Background Animations",
-      renderOrder: 55,
+      renderOrder: 10,
     });
   }
 

static/js/button-generator/effects/background-bubbles.js

@@ -9,9 +9,9 @@ export class BubblesEffect extends ButtonEffect {
     super({
       id: "bg-bubbles",
       name: "Bubbles",
-      type: "general",
+      type: "background-animation",
       category: "Background Animations",
-      renderOrder: 55,
+      renderOrder: 10,
     });
 
     this.bubbles = [];

static/js/button-generator/effects/background-fire.js

@@ -9,9 +9,9 @@ export class FireEffect extends ButtonEffect {
     super({
       id: "bg-fire",
       name: "Fire",
-      type: "general",
+      type: "background-animation",
       category: "Background Animations",
-      renderOrder: 55,
+      renderOrder: 10,
     });
 
     this.particles = [];

static/js/button-generator/effects/background-rain.js

@@ -9,9 +9,9 @@ export class RainBackgroundEffect extends ButtonEffect {
     super({
       id: 'bg-rain',
       name: 'Rain Effect',
-      type: 'general',
+      type: 'background-animation',
       category: 'Background Animations',
-      renderOrder: 55 // After background, before other effects
+      renderOrder: 10
     });
 
     // Initialize raindrop positions (persistent across frames)

static/js/button-generator/effects/background-starfield.js

@@ -9,9 +9,9 @@ export class StarfieldEffect extends ButtonEffect {
     super({
       id: "bg-starfield",
       name: "Starfield",
-      type: "general",
+      type: "background-animation",
       category: "Background Animations",
-      renderOrder: 55,
+      renderOrder: 10,
     });
 
     this.stars = [];
@@ -42,7 +42,7 @@ export class StarfieldEffect extends ButtonEffect {
         type: "range",
         label: "Twinkle Speed",
         defaultValue: 1,
-        min: 0.1,
+        min: 1,
         max: 3,
         step: 0.1,
         showWhen: "animate-starfield",