feat(11-01): replace hex CSS vars with Paperclip OKLCH design tokens

- Replace entire styles.css with OKLCH token system (light + dark modes)
- Switch dark mode from data-theme attribute to .dark CSS class
- Update App.tsx theme toggle to use classList.toggle with system preference detection
- Switch fonts from Inter/JetBrains Mono to Maple Mono/Maple Mono NF CN
- Add chart tokens, sidebar tokens, 0px border radius
- Preserve sidebar-drag, ascii-scroll-track, reduced-motion support
- Remove fontsource font imports from main.tsx

src/renderer/App.tsx

@@ -274,11 +274,24 @@ export function App() {
   useEffect(() => {
     if (!snapshot) return;
     const root = document.documentElement;
-    root.dataset.theme = snapshot.theme;
-    root.style.colorScheme = snapshot.theme === "system" ? "light dark" : snapshot.theme;
+    const applyTheme = () => {
+      const isDark = snapshot.theme === "dark" ||
+        (snapshot.theme === "system" && window.matchMedia("(prefers-color-scheme: dark)").matches);
+      root.classList.toggle("dark", isDark);
+      root.style.colorScheme = isDark ? "dark" : "light";
+    };
+
+    applyTheme();
+
     if (snapshot.locale && snapshot.locale !== locale) {
       setLocale(snapshot.locale);
     }
+
+    if (snapshot.theme === "system") {
+      const mq = window.matchMedia("(prefers-color-scheme: dark)");
+      mq.addEventListener("change", applyTheme);
+      return () => mq.removeEventListener("change", applyTheme);
+    }
   }, [snapshot, locale]);
 
   useEffect(() => {