diff --git a/Energy_Pie/module.html b/Energy_Pie/module.html
index b235eff..bbb6623 100644
--- a/Energy_Pie/module.html
+++ b/Energy_Pie/module.html
@@ -1,4 +1,5 @@
-<div style="padding:12px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;">
+<div id="wrap"
+     style="padding:12px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;">
   <!-- Controls -->
   <div style="display:flex;gap:10px;flex-wrap:wrap;align-items:center;">
     <label style="display:flex;gap:6px;align-items:center;">
@@ -17,7 +18,7 @@
     </label>
 
     <button id="prev"  type="button">◀</button>
-    <button id="today" type="button">Letzter Zeit Punkt</button>
+    <button id="today" type="button">Letzter Zeitpunkt</button>
     <button id="next"  type="button">▶</button>
   </div>
 
@@ -36,6 +37,37 @@
   <div id="err" style="margin-top:6px;font-size:12px;opacity:0.9;color:#ffb4b4;"></div>
 </div>
 
+<style>
+  #wrap {
+    position: relative;
+    overflow: hidden;
+  }
+
+  #wrap::before {
+    content: "";
+    position: absolute;
+    inset: -40%;
+    background:
+      radial-gradient(circle at 20% 20%, rgba(99,179,255,0.18), transparent 45%),
+      radial-gradient(circle at 80% 30%, rgba(168,85,247,0.16), transparent 50%),
+      radial-gradient(circle at 50% 80%, rgba(255,255,255,0.06), transparent 55%);
+    filter: blur(18px);
+    animation: auroraMove 10s ease-in-out infinite alternate;
+    pointer-events: none;
+    z-index: 0;
+  }
+
+  #wrap > * {
+    position: relative;
+    z-index: 1;
+  }
+
+  @keyframes auroraMove {
+    from { transform: translate3d(-2%, -2%, 0) scale(1.02); }
+    to   { transform: translate3d( 2%,  2%, 0) scale(1.06); }
+  }
+</style>
+
 <!-- 1) Puffer-Handler: fängt Symcon-Messages ab, selbst wenn UI noch nicht ready ist -->
 <script>
   window.__EnergyPieQueue = window.__EnergyPieQueue || [];