feat: light theme by default with dark toggle, CSS variables, FOUC prevention, theme persistence

tailwind.config.js

@@ -1,4 +1,6 @@
 /** @type {import('tailwindcss').Config} */
+function rgb(v) { return `rgb(var(--${v}) / <alpha-value>)`; }
+
 module.exports = {
   content: [
     './app/**/*.{js,jsx,ts,tsx}',
@@ -7,12 +9,25 @@ module.exports = {
   theme: {
     extend: {
       colors: {
-        bg: '#0a0a0a',
-        surface: '#141414',
-        surface2: '#1c1c1c',
-        border: '#2a2a2a',
-        accent: '#10b981',
-        accent2: '#34d399',
+        bg:        rgb('bg'),
+        surface:   rgb('surface'),
+        surface2:  rgb('surface2'),
+        border:    rgb('border'),
+        text:      rgb('text'),
+        accent:    rgb('accent'),
+        accent2:   rgb('accent2'),
+        // Совместимость со старыми классами — gray-* мапим на наши text-*
+        gray: {
+          100: rgb('text'),
+          200: rgb('text-soft'),
+          300: rgb('text-soft'),
+          400: rgb('text-mute'),
+          500: rgb('text-mute'),
+          600: rgb('text-mute'),
+          700: rgb('border'),
+          800: rgb('surface2'),
+          900: rgb('surface'),
+        },
       },
       fontFamily: {
         sans: ['Inter', 'system-ui', 'sans-serif'],