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/layout/AppLayout.tsx

@@ -96,9 +96,9 @@ export function AppLayout() {
           />
           <nav
             className="absolute inset-y-0 left-0 w-72 shadow-2xl animate-slide-in-left"
-            style={{ background: '#0f1118', borderRight: '1px solid #1e2130' }}
+            style={{ background: 'var(--color-bg-sidebar)', borderRight: '1px solid var(--color-border-default)' }}
           >
-            <div className="flex h-14 items-center justify-between px-4" style={{ borderBottom: '1px solid #1e2130' }}>
+            <div className="flex h-14 items-center justify-between px-4" style={{ borderBottom: '1px solid var(--color-border-default)' }}>
               <Link to="/" className="flex items-center gap-2.5">
                 <BrandLogo size="sm" />
                 <span className="text-sm font-heading font-bold text-text-heading">ResolutionFlow</span>
@@ -115,7 +115,7 @@ export function AppLayout() {
 
             <div className="flex flex-col p-3">
               {/* User info */}
-              <div className="mb-3 pb-3 px-3" style={{ borderBottom: '1px solid #1e2130' }}>
+              <div className="mb-3 pb-3 px-3" style={{ borderBottom: '1px solid var(--color-border-default)' }}>
                 <p className="text-sm font-medium text-foreground">{user?.name || user?.email}</p>
                 {effectiveRole && effectiveRole !== 'engineer' && (
                   <span className="mt-1 inline-flex items-center gap-1 text-xs text-muted-foreground">
@@ -151,7 +151,7 @@ export function AppLayout() {
               </div>
 
               {/* Logout */}
-              <div className="mt-3 pt-3" style={{ borderTop: '1px solid #1e2130' }}>
+              <div className="mt-3 pt-3" style={{ borderTop: '1px solid var(--color-border-default)' }}>
                 <button
                   type="button"
                   onClick={handleLogout}