fix: design system v4 polish — home icon, mobile hamburger, contrast, font-label cleanup

- Home sidebar icon: always cyan, bg-accent-dim only when route is "/"
- Mobile TopBar: add left padding so hamburger isn't hidden behind logo
- Landing page: bump card border color (#1e2130 → #2a2f3d) for better contrast
- Replace all font-label references (40 occurrences, 19 files) with font-mono or font-sans
- Remove deprecated --font-label CSS variable from index.css
- Convert hardcoded hex in layout inline styles to CSS variables (light-mode ready)
- Add @types/react-syntax-highlighter for script builder types

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

frontend/src/components/editor-ai/NodeSummary.tsx

@@ -29,7 +29,7 @@ export function NodeSummary({ node, flowName, flowType, nodeCount }: NodeSummary
             {flowName || 'Untitled Flow'}
           </span>
         </div>
-        <div className="mt-1 flex items-center gap-3 font-label text-[0.625rem] uppercase tracking-widest text-muted-foreground">
+        <div className="mt-1 flex items-center gap-3 font-sans text-[0.625rem] uppercase tracking-widest text-muted-foreground">
           <span>{flowType || 'flow'}</span>
           {nodeCount !== undefined && <span>{nodeCount} nodes</span>}
         </div>
@@ -44,7 +44,7 @@ export function NodeSummary({ node, flowName, flowType, nodeCount }: NodeSummary
     <div className="border-b px-3 py-2.5" style={{ borderColor: 'var(--glass-border)' }}>
       <div className="flex items-center gap-2">
         <Icon className={`h-3.5 w-3.5 ${colorClass}`} />
-        <span className="font-label text-[0.625rem] uppercase tracking-widest text-muted-foreground">
+        <span className="font-sans text-[0.625rem] uppercase tracking-widest text-muted-foreground">
           {node.type}
         </span>
       </div>

frontend/src/components/editor-ai/SuggestionsTab.tsx

@@ -28,7 +28,7 @@ export function SuggestionsTab({ suggestions }: SuggestionsTabProps) {
         return (
           <div key={s.id} className="rounded-lg border border-border bg-card px-3 py-2">
             <div className="flex items-center justify-between">
-              <span className="font-label text-[0.625rem] uppercase tracking-widest text-muted-foreground">
+              <span className="font-sans text-[0.625rem] uppercase tracking-widest text-muted-foreground">
                 {s.action_type.replace(/_/g, ' ')}
               </span>
               <span className={`flex items-center gap-1 text-xs ${config.color}`}>
@@ -39,7 +39,7 @@ export function SuggestionsTab({ suggestions }: SuggestionsTabProps) {
             {s.target_node_id && (
               <p className="mt-1 text-xs text-muted-foreground truncate">Node: {s.target_node_id}</p>
             )}
-            <p className="mt-0.5 font-label text-[0.625rem] text-text-muted">
+            <p className="mt-0.5 font-sans text-[0.625rem] text-text-muted">
               {new Date(s.created_at).toLocaleDateString()}
             </p>
           </div>