feat: светлая тема как основная + переключатель тем

- CSS-переменные --bg, --surface, --ink, --mute, --accent для обеих тем
- darkMode: 'class' в Tailwind config
- ThemeToggle компонент с Sun/Moon, сохраняет выбор в localStorage
- Inline-скрипт в layout.js защищает от FOUC (FlashOfUnstyledContent)
- Авто-определение по prefers-color-scheme как fallback
- not-found.js: красивая 404 страница вместо дефолтной Next
- Обновлены все компоненты и страницы — Header, Footer, ArticleCard, page.js, blog, tag, about

components/ThemeToggle.js

@@ -0,0 +1,36 @@
+'use client';
+import { useEffect, useState } from 'react';
+import { Sun, Moon } from 'lucide-react';
+
+export default function ThemeToggle() {
+  const [theme, setTheme] = useState('light');
+  const [mounted, setMounted] = useState(false);
+
+  useEffect(() => {
+    setMounted(true);
+    const isDark = document.documentElement.classList.contains('dark');
+    setTheme(isDark ? 'dark' : 'light');
+  }, []);
+
+  function toggle() {
+    const next = theme === 'dark' ? 'light' : 'dark';
+    setTheme(next);
+    if (next === 'dark') document.documentElement.classList.add('dark');
+    else document.documentElement.classList.remove('dark');
+    try { localStorage.setItem('theme', next); } catch {}
+  }
+
+  // плейсхолдер до маунта, чтобы кнопка не прыгала
+  if (!mounted) return <div className="w-9 h-9" aria-hidden />;
+
+  return (
+    <button
+      onClick={toggle}
+      className="w-9 h-9 inline-flex items-center justify-center rounded-lg mute hover:ink hover:surface-2 transition-colors"
+      title={theme === 'dark' ? 'Включить светлую тему' : 'Включить тёмную тему'}
+      aria-label="Переключить тему"
+    >
+      {theme === 'dark' ? <Sun className="w-4 h-4" /> : <Moon className="w-4 h-4" />}
+    </button>
+  );
+}