css fixes

Author: System-End

src/styles/utilities.css

@@ -1,22 +1,28 @@
 @layer utilities {
+  /* Animated background */
   .animated-bg {
-    @apply overflow-hidden;
+    position: relative;
+    overflow: hidden;
   }
 
   .animated-bg::before {
     content: '';
-    @apply absolute inset-0 opacity-50;
-    @apply bg-gradient-primary;
+    position: absolute;
+    inset: 0;
+    opacity: 0.5;
+    background: var(--gradient-primary);
+    background-size: 200% 200%;
     animation: gradientShift 15s ease infinite;
   }
 
+  /* Fox ear styling */
   .fox-ear {
     position: absolute;
     width: 30px;
     height: 30px;
-    background: var(--fox-pink);
+    background-color: var(--fox-pink);
     opacity: 0.1;
-    transition: opacity 0.3s ease;
+    transition: opacity 0.2s ease;
   }
 
   .fox-ear-left {
@@ -32,6 +38,34 @@
     transform: rotate(-45deg);
     border-radius: 0 0 15px 0;
   }
+
+  /* Hover effects */
+  .hover-glow {
+    transition: all 0.2s ease;
+  }
+
+  .hover-glow:hover {
+    filter: drop-shadow(0 0 4px var(--fox-pink-glow));
+  }
+
+  /* Spacing utilities */
+  .section-spacing {
+    margin-top: 2rem;
+    margin-bottom: 2rem;
+  }
+
+  .section-spacing > * + * {
+    margin-top: 1.5rem;
+  }
+
+  .content-spacing {
+    margin-top: 1rem;
+    margin-bottom: 1rem;
+  }
+
+  .content-spacing > * + * {
+    margin-top: 1rem;
+  }
 }
 
 @keyframes gradientShift {

tailwind.config.js

@@ -20,30 +20,19 @@ export default {
         'fox-white': '#fff5f9',
       },
       backgroundImage: {
+        'gradient-primary': 'linear-gradient(135deg, var(--background-primary) 0%, var(--background-secondary) 100%)',
         'gradient-card': 'linear-gradient(135deg, rgba(47, 28, 84, 0.3) 0%, rgba(157, 78, 221, 0.1) 100%)',
       },
-      transitionProperty: {
-        'all': 'all',
-      },
-      boxShadow: {
-        'accent': '0 0 10px var(--accent-primary)',
+      spacing: {
+        'ear': '30px',
       },
       opacity: {
+        '5': '0.05',
         '10': '0.1',
+        '15': '0.15',
         '20': '0.2',
-        '40': '0.4',
-      }
+      },
     },
   },
   plugins: [],
-  safelist: [
-    'bg-accent-primary/10',
-    'bg-accent-primary/20',
-    'border-accent-primary/20',
-    'border-accent-neon/40',
-    'shadow-accent-primary/10',
-    'hover:bg-accent-primary/10',
-    'hover:border-accent-neon/40',
-    'hover:shadow-accent-primary/10'
-  ]
 }