Initial NUC Portal dashboard

- 17 internal services with live health status
- 28 external bookmarks organized by category
- Dark/light mode toggle with persistence
- Cmd+K search filtering
- Health API polling every 30 seconds

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

src/app/page.tsx

@@ -0,0 +1,109 @@
+'use client';
+
+import { Header, SearchBar, ServiceCard, BookmarkCard, CategorySection } from '@/components';
+import { usePortal } from '@/lib/PortalContext';
+import { categoryLabels, categoryOrder, bookmarkCategoryLabels, bookmarkCategoryOrder, ServiceCategory, BookmarkCategory } from '@/lib/services';
+
+export default function Home() {
+  const { filteredServices, filteredBookmarks, healthStatus, searchQuery } = usePortal();
+
+  // Group services by category
+  const servicesByCategory = categoryOrder.reduce((acc, category) => {
+    const categoryServices = filteredServices.filter(s => s.category === category);
+    if (categoryServices.length > 0) {
+      acc[category] = categoryServices;
+    }
+    return acc;
+  }, {} as Record<ServiceCategory, typeof filteredServices>);
+
+  // Group bookmarks by category
+  const bookmarksByCategory = bookmarkCategoryOrder.reduce((acc, category) => {
+    const categoryBookmarks = filteredBookmarks.filter(b => b.category === category);
+    if (categoryBookmarks.length > 0) {
+      acc[category] = categoryBookmarks;
+    }
+    return acc;
+  }, {} as Record<BookmarkCategory, typeof filteredBookmarks>);
+
+  const hasServices = Object.keys(servicesByCategory).length > 0;
+  const hasBookmarks = Object.keys(bookmarksByCategory).length > 0;
+  const noResults = searchQuery && !hasServices && !hasBookmarks;
+
+  return (
+    <div className="min-h-screen bg-slate-50 dark:bg-stone-950">
+      <Header />
+
+      <main className="max-w-6xl mx-auto px-4 sm:px-6 py-8">
+        {/* Search */}
+        <div className="mb-8 max-w-xl">
+          <SearchBar />
+        </div>
+
+        {/* No results message */}
+        {noResults && (
+          <div className="text-center py-12">
+            <p className="text-slate-500 dark:text-stone-500">
+              No results found for &quot;{searchQuery}&quot;
+            </p>
+          </div>
+        )}
+
+        {/* Services */}
+        {hasServices && (
+          <div className="mb-12">
+            <h2 className="text-xl font-bold text-slate-900 dark:text-stone-100 mb-6">
+              Services
+            </h2>
+            {Object.entries(servicesByCategory).map(([category, services]) => (
+              <CategorySection
+                key={category}
+                title={categoryLabels[category as ServiceCategory]}
+                count={services.length}
+                columns={3}
+              >
+                {services.map(service => (
+                  <ServiceCard
+                    key={service.name}
+                    service={service}
+                    status={healthStatus[service.name] || 'unknown'}
+                  />
+                ))}
+              </CategorySection>
+            ))}
+          </div>
+        )}
+
+        {/* Bookmarks */}
+        {hasBookmarks && (
+          <div>
+            <h2 className="text-xl font-bold text-slate-900 dark:text-stone-100 mb-6">
+              Bookmarks
+            </h2>
+            {Object.entries(bookmarksByCategory).map(([category, bookmarks]) => (
+              <CategorySection
+                key={category}
+                title={bookmarkCategoryLabels[category as BookmarkCategory]}
+                count={bookmarks.length}
+                columns={4}
+              >
+                {bookmarks.map(bookmark => (
+                  <BookmarkCard
+                    key={bookmark.name}
+                    bookmark={bookmark}
+                  />
+                ))}
+              </CategorySection>
+            ))}
+          </div>
+        )}
+      </main>
+
+      {/* Footer */}
+      <footer className="text-center py-8 text-sm text-slate-400 dark:text-stone-600">
+        <span>NUC Portal</span>
+        <span className="mx-2">•</span>
+        <span>192.168.1.3</span>
+      </footer>
+    </div>
+  );
+}