refactor: replace hardcoded hex values with Tailwind semantic tokens

3,200+ hardcoded color values replaced with CSS variable-backed
Tailwind classes (bg-card, text-foreground, border-border, etc.).
Enables light mode via CSS variable swap. Only syntax highlighting
colors and intentional one-offs remain hardcoded (~15 values).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

frontend/src/components/tree-editor/TreeEditorLayout.tsx

@@ -46,11 +46,11 @@ export function TreeEditorLayout({
         <>
           {/* Code Mode: Monaco editor (60%) + Preview (40%) — unchanged */}
           <div className={cn(
-            'flex flex-col overflow-hidden border-[#1e2130]',
+            'flex flex-col overflow-hidden border-border',
             isMobile ? 'h-full w-full border-b' : 'w-3/5 border-r'
           )}>
             <Suspense fallback={
-              <div className="flex h-full items-center justify-center bg-[#14161d]">
+              <div className="flex h-full items-center justify-center bg-card">
                 <Spinner size="sm" className="h-6 w-6 border-t-foreground" />
               </div>
             }>