fix: use Tailwind v3 for Linux server builds

src/components/shell/AppShell.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="mx-auto flex min-h-dvh w-full max-w-[768px] flex-col bg-surface shadow-xl shadow-black/5 dark:shadow-black/30"
+    class="mx-auto flex min-h-dvh w-full max-w-app flex-col bg-surface shadow-xl shadow-black/5 dark:shadow-black/30"
   >
     <slot />
   </div>

src/styles/main.css

@@ -1,16 +1,8 @@
-@import 'tailwindcss';
-
-@custom-variant dark (&:where(.dark, .dark *));
-
-@theme {
-  --font-sans: 'Vazirmatn', ui-sans-serif, system-ui, sans-serif;
-
-  --color-brand-50: #ecfdf5;
-  --color-brand-100: #d1fae5;
-  --color-brand-500: #22c55e;
-  --color-brand-600: #16a34a;
-  --color-brand-700: #15803d;
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
 
+:root {
   --color-surface: #ffffff;
   --color-surface-2: #f8fafc;
   --color-surface-3: #f1f5f9;
@@ -19,15 +11,13 @@
   --color-muted: #64748b;
 }
 
-@layer theme {
-  .dark {
-    --color-surface: #0f1419;
-    --color-surface-2: #1a2332;
-    --color-surface-3: #243044;
-    --color-border: #334155;
-    --color-text: #f1f5f9;
-    --color-muted: #94a3b8;
-  }
+.dark {
+  --color-surface: #0f1419;
+  --color-surface-2: #1a2332;
+  --color-surface-3: #243044;
+  --color-border: #334155;
+  --color-text: #f1f5f9;
+  --color-muted: #94a3b8;
 }
 
 @layer base {
@@ -36,7 +26,7 @@
   }
 
   body {
-    @apply bg-surface-2 text-text font-sans;
+    @apply bg-surface-2 font-sans text-text;
   }
 
   #app {