diff --git a/src/styles/global.css b/src/styles/global.css
index daa15f1..130e1ef 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -1,11 +1,12 @@
+/* Tailwind zuerst importieren (CSS-Regel: @import muss vor anderen At-Rules stehen) */
+@import "tailwindcss";
+
 /* Tailwind CSS v4 liest die tailwind.config.* nur dann, wenn sie explizit eingebunden wird.
    Damit Utilities wie `bg-bg`, `text-muted` etc. (aus unserem Theme) weiterhin funktionieren,
    referenzieren wir hier die Config.
 */
 @config "../../tailwind.config.mjs";
 
-@import "tailwindcss";
-
 :root {
   /* Standard: Dark Mode */
   color-scheme: dark;
@@ -58,6 +59,18 @@
   --focus-offset: 3px;
   --focus-offset-bg: var(--bg);
   --focus-offset-alpha: 0.9;
+
+  /* Hintergrund-Blobs: responsiv skalieren, damit sie auch auf großen Screens sichtbar bleiben
+     ohne "knallig" zu wirken. */
+  --blob-a: clamp(420px, 66vmin, 1400px);
+  --blob-b: clamp(520px, 76vmin, 1600px);
+  --blob-c: clamp(420px, 64vmin, 1400px);
+
+  /* Blur skaliert ebenfalls mit (auf großen Screens sonst zu "hart") */
+  --blob-blur: clamp(60px, 7vmin, 220px);
+
+  /* Vignette: hält Kontrast/Lesbarkeit stabil */
+  --blob-vignette: clamp(120px, 12vmin, 260px);
 }
 
 /* Sanftes Scrollen für Ankerlinks (respektiert Reduced Motion) */
@@ -190,21 +203,6 @@ a {
   background-size: 160px 160px;
 }
 
-/* Hintergrund-Blobs: responsiv skalieren, damit sie auch auf großen Screens sichtbar bleiben
-   ohne "knallig" zu wirken. */
-:root {
-  /* vmin skaliert sauber bei Ultrawide/4K, clamp verhindert Übertreibung */
-  --blob-a: clamp(420px, 66vmin, 1400px);
-  --blob-b: clamp(520px, 76vmin, 1600px);
-  --blob-c: clamp(420px, 64vmin, 1400px);
-
-  /* Blur skaliert ebenfalls mit (auf großen Screens sonst zu "hart") */
-  --blob-blur: clamp(60px, 7vmin, 220px);
-
-  /* Vignette: hält Kontrast/Lesbarkeit stabil */
-  --blob-vignette: clamp(120px, 12vmin, 260px);
-}
-
 .bg-artboard {
   position: fixed;
   inset: 0;