fix: UI polish + EXTERNAL node kind + horizontal nav

- Added EXTERNAL to NodeKind enum (stub nodes for cross-repo references)
- Updated enum count tests (32 → 33)
- Layout: horizontal top navigation (was vertical sidebar)
- Font size: 14px (was 13px compact), removed compact algorithm
- Dashboard: stats-only cards with click-to-expand modal breakdown
  (removed all charts from dashboard — clean stats view)
- Codebase Map: full-height treemap with ECharts built-in breadcrumb
  navigation, nested directory drill-down, language color coding
- Premium theme: deep indigo palette, refined dark mode backgrounds

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Author: aksOps

src/main/frontend/src/components/AppLayout.tsx

@@ -1,6 +1,5 @@
-import { useState } from 'react';
 import { Outlet, useNavigate, useLocation } from 'react-router-dom';
-import { Layout, Menu, Switch, Typography } from 'antd';
+import { Layout, Menu, Switch, Typography, Space } from 'antd';
 import {
   DashboardOutlined,
   AppstoreOutlined,
@@ -11,7 +10,7 @@ import {
 } from '@ant-design/icons';
 import { useTheme } from '@/context/ThemeContext';
 
-const { Header, Sider, Content } = Layout;
+const { Header, Content } = Layout;
 
 const menuItems = [
   { key: '/', icon: <DashboardOutlined />, label: 'Dashboard' },
@@ -21,7 +20,6 @@ const menuItems = [
 ];
 
 export default function AppLayout() {
-  const [collapsed, setCollapsed] = useState(false);
   const navigate = useNavigate();
   const location = useLocation();
   const { isDark, toggle } = useTheme();
@@ -32,50 +30,43 @@ export default function AppLayout() {
 
   return (
     <Layout style={{ minHeight: '100vh' }}>
-      <Sider
-        collapsible
-        collapsed={collapsed}
-        onCollapse={setCollapsed}
-        breakpoint="lg"
-        style={{ overflow: 'auto', height: '100vh', position: 'fixed', left: 0, top: 0, bottom: 0 }}
+      <Header
+        style={{
+          padding: '0 24px',
+          display: 'flex',
+          alignItems: 'center',
+          gap: 0,
+          position: 'sticky',
+          top: 0,
+          zIndex: 100,
+          borderBottom: isDark ? '1px solid #2d2d4a' : '1px solid #f0f0f0',
+        }}
       >
-        <div style={{ padding: collapsed ? '16px 8px' : '16px', textAlign: 'center' }}>
-          <Typography.Title
-            level={4}
-            style={{ color: '#1677ff', margin: 0, whiteSpace: 'nowrap' }}
-          >
-            {collapsed ? 'IQ' : 'Code IQ'}
-          </Typography.Title>
-        </div>
+        <Typography.Title
+          level={4}
+          style={{ color: '#4f46e5', margin: '0 24px 0 0', whiteSpace: 'nowrap', lineHeight: '64px' }}
+        >
+          Code IQ
+        </Typography.Title>
         <Menu
-          theme="dark"
-          mode="inline"
+          mode="horizontal"
           selectedKeys={[selectedKey]}
           items={menuItems}
           onClick={({ key }) => navigate(key)}
+          style={{ flex: 1, border: 'none', background: 'transparent' }}
         />
-      </Sider>
-      <Layout style={{ marginLeft: collapsed ? 80 : 200, transition: 'margin-left 0.2s' }}>
-        <Header
-          style={{
-            padding: '0 24px',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'flex-end',
-            background: 'transparent',
-          }}
-        >
+        <Space>
           <Switch
             checked={isDark}
             onChange={toggle}
             checkedChildren={<MoonOutlined />}
             unCheckedChildren={<SunOutlined />}
           />
-        </Header>
-        <Content style={{ margin: '0 16px 16px', overflow: 'auto' }}>
-          <Outlet />
-        </Content>
-      </Layout>
+        </Space>
+      </Header>
+      <Content style={{ padding: '16px 24px', overflow: 'auto' }}>
+        <Outlet />
+      </Content>
     </Layout>
   );
 }

src/main/frontend/src/main.tsx

@@ -11,8 +11,8 @@ function ThemedApp() {
   return (
     <ConfigProvider theme={{
       algorithm: isDark
-        ? [theme.darkAlgorithm, theme.compactAlgorithm]
-        : [theme.defaultAlgorithm, theme.compactAlgorithm],
+        ? [theme.darkAlgorithm]
+        : [theme.defaultAlgorithm],
       token: {
         // Premium deep indigo palette
         colorPrimary: '#4f46e5',
@@ -22,7 +22,7 @@ function ThemedApp() {
         colorInfo: '#6366f1',
         // Typography
         fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",
-        fontSize: 13,
+        fontSize: 14,
         // Refined spacing
         borderRadius: 6,
         wireframe: false,