Upload src/index.css with huggingface_hub

src/index.css

@@ -2,93 +2,74 @@
 @tailwind components;
 @tailwind utilities;
 
-* {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-}
-
-body {
-  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-  background-color: #111827;
-  color: #f3f4f6;
-  line-height: 1.6;
-}
+@layer base {
+  body {
+    @apply bg-slate-950 text-slate-100 antialiased;
+  }
 
-pre {
-  white-space: pre-wrap;
-  word-wrap: break-word;
+  ::selection {
+    @apply bg-indigo-500/30;
+  }
 }
 
-code {
-  font-family: 'Fira Code', 'Monaco', 'Consolas', monospace;
-}
+@layer components {
+  .card {
+    @apply bg-slate-900/80 backdrop-blur-sm border border-slate-800 rounded-2xl;
+  }
 
-/* Scrollbar styling */
-::-webkit-scrollbar {
-  width: 8px;
-  height: 8px;
-}
+  .card-hover {
+    @apply transition-all duration-300 hover:border-slate-700 hover:shadow-xl hover:shadow-indigo-500/5;
+  }
 
-::-webkit-scrollbar-track {
-  background: #1f2937;
-}
+  .btn {
+    @apply px-4 py-2 rounded-xl font-medium transition-all duration-200;
+  }
 
-::-webkit-scrollbar-thumb {
-  background: #4b5563;
-  border-radius: 4px;
-}
+  .btn-primary {
+    @apply bg-gradient-to-r from-indigo-600 to-purple-600 text-white hover:from-indigo-500 hover:to-purple-500 shadow-lg shadow-indigo-500/25;
+  }
 
-::-webkit-scrollbar-thumb:hover {
-  background: #6b7280;
-}
+  .btn-secondary {
+    @apply bg-slate-800 text-slate-200 hover:bg-slate-700 border border-slate-700;
+  }
 
-/* Custom animations */
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-    transform: translateY(10px);
+  .code-block {
+    @apply bg-slate-950 border border-slate-800 rounded-xl p-4 font-mono text-sm overflow-x-auto;
   }
-  to {
-    opacity: 1;
-    transform: translateY(0);
+
+  .gradient-text {
+    @apply bg-gradient-to-r from-indigo-400 via-purple-400 to-pink-400 bg-clip-text text-transparent;
   }
-}
 
-.animate-fade-in {
-  animation: fadeIn 0.3s ease-out;
-}
+  .glow {
+    @apply relative;
+  }
 
-/* Gradient text */
-.gradient-text {
-  background: linear-gradient(135deg, #6366f1, #a855f7);
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-  background-clip: text;
+  .glow::before {
+    content: '';
+    @apply absolute -inset-1 bg-gradient-to-r from-indigo-600 to-purple-600 rounded-2xl blur-lg opacity-25;
+  }
 }
 
-/* Code block styling */
-pre code {
-  display: block;
-  padding: 1rem;
-  overflow-x: auto;
-}
+@layer utilities {
+  .scrollbar-thin {
+    scrollbar-width: thin;
+    scrollbar-color: #475569 #1e293b;
+  }
 
-/* Button hover effects */
-button {
-  transition: all 0.2s ease;
-}
+  .scrollbar-thin::-webkit-scrollbar {
+    @apply w-2 h-2;
+  }
 
-button:hover {
-  transform: translateY(-1px);
-}
+  .scrollbar-thin::-webkit-scrollbar-track {
+    @apply bg-slate-900 rounded-full;
+  }
 
-/* Card hover effects */
-.card-hover {
-  transition: all 0.2s ease;
-}
+  .scrollbar-thin::-webkit-scrollbar-thumb {
+    @apply bg-slate-700 rounded-full;
+  }
 
-.card-hover:hover {
-  transform: translateY(-2px);
-  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);
+  .scrollbar-thin::-webkit-scrollbar-thumb:hover {
+    @apply bg-slate-600;
+  }
 }