refactor: centralize section config — remove all hardcoded section lists

- New packages/config/src/sections.ts: SECTIONS, SECTIONS_BY_ID, SECTION_IDS
  (no Node.js built-in imports — safe for client components)
- New package entrypoint: @mcpedia/config/sections (exports only sections.ts)
- Client components import from @mcpedia/config/sections (no node:fs in bundle)
- Server components import from @mcpedia/config (has env/fs, server-only)
- Removed hardcoded SECTIONS/SECTION_LABEL/SECTION_ICON from:
  - [section]/page.tsx (was inline array)
  - [section]/[...slug]/page.tsx (was hardcoded Record maps)
  - Sidebar.tsx (was inline array)
  - layout.tsx (was inline array)
  - page.tsx (was inline array)
  - create/page.tsx (was inline array via SECTIONS import)
- Added @mcpedia/config/sections entrypoint to package.json exports

apps/web/app/[section]/[...slug]/page.tsx

@@ -7,6 +7,7 @@ import Markdown from "@/components/Markdown";
 import DocForm from "@/components/DocForm";
 import TOC from "@/components/TOC";
 import { classifyPath, extractFoldersForSection } from "@mcpedia/core";
+import { SECTIONS_BY_ID } from "@mcpedia/config/sections";
 import type { DocumentMeta } from "@mcpedia/core";
 
 // Render at request time (content in Postgres, not available at build time).
@@ -17,19 +18,22 @@ interface DocPageProps {
   searchParams: Promise<{ edit?: string }>;
 }
 
-const SECTION_LABEL: Record<string, string> = {
-  docs: "Documentation",
-  writeups: "Writeup",
-  research: "Research",
-  notes: "Note",
-};
-
-const SECTION_ICON: Record<string, string> = {
-  docs: "📄",
-  writeups: "📝",
-  research: "🔬",
-  notes: "📌",
-};
+/**
+ * Get section label and icon from the centralized config.
+ */
+function getSectionInfo(section: string) {
+  const info = SECTIONS_BY_ID.get(section);
+  if (!info) {
+    return {
+      label: section.charAt(0).toUpperCase() + section.slice(1),
+      icon: "📄",
+    };
+  }
+  return {
+    label: info.label,
+    icon: info.icon,
+  };
+}
 
 /**
  * Render any extra/custom frontmatter fields as labeled badges.
@@ -167,10 +171,7 @@ function FolderIndexPage({
 
   const folders = [...immediateFolders.entries()].sort(([a], [b]) => a.localeCompare(b));
 
-  const sectionInfo = {
-    icon: SECTION_ICON[section] || "📁",
-    label: SECTION_LABEL[section] || section,
-  };
+  const sectionInfo = getSectionInfo(section);
 
   return (
     <div>
@@ -366,6 +367,8 @@ export default async function DocPage({ params, searchParams }: DocPageProps) {
   const related = await getRelated(fullSlug, 5);
   const revisions = await listRevisions(fullSlug, 10);
 
+  const sectionInfo = getSectionInfo(doc.section);
+
   return (
     <article>
       {/* Breadcrumb — dynamic based on the doc's actual path */}
@@ -380,7 +383,7 @@ export default async function DocPage({ params, searchParams }: DocPageProps) {
           const crumbPath = doc.slug.split("/").slice(0, i + 1).join("/");
           const isLast = i === doc.slug.split("/").length - 1;
           const label = i === 0
-            ? SECTION_LABEL[part] || part
+            ? sectionInfo.label
             : part
                 .split(/[-_]/)
                 .map((w) => w.charAt(0).toUpperCase() + w.slice(1))
@@ -408,12 +411,12 @@ export default async function DocPage({ params, searchParams }: DocPageProps) {
       <div className="bg-[#0f1011] border border-[#1f2022] rounded-lg p-6 mb-8">
         <div className="flex items-start gap-3 mb-4">
           <span className="text-2xl">
-            {SECTION_ICON[doc.section] || "📄"}
+            {sectionInfo.icon}
           </span>
           <div className="flex-1 min-w-0">
             <div className="flex items-center gap-2 mb-2">
               <span className="text-xs font-medium text-[#7170ff] uppercase">
-                {SECTION_LABEL[doc.section] || doc.section}
+                {sectionInfo.label}
               </span>
               <span className="text-xs text-[#62666d]">·</span>
               <span className="text-xs text-[#62666d]">
@@ -475,38 +478,41 @@ export default async function DocPage({ params, searchParams }: DocPageProps) {
             Related Documents
           </h2>
           <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
-            {related.map((r) => (
-              <Link
-                key={r.slug}
-                href={`/${r.slug}`}
-                className="group block bg-[#0f1011] border border-[#1f2022] rounded-lg p-4 hover:border-[#5e6ad2]/40 hover:bg-[#131415] transition-all duration-200"
-              >
-                <div className="flex items-start gap-2 mb-2">
-                  <span className="text-xl">
-                    {SECTION_ICON[r.section] || "📄"}
-                  </span>
-                  <time className="text-xs text-[#62666d]">
-                    {new Date(r.updatedAt).toLocaleDateString(undefined, {
-                      month: "short",
-                      day: "numeric",
-                    })}
-                  </time>
-                </div>
-                <h3 className="font-medium text-[#f7f8f8] group-hover:text-[#7170ff] transition-colors line-clamp-1 mb-1">
-                  {r.title}
-                </h3>
-                <div className="flex flex-wrap gap-1 mt-2">
-                  {r.tags.slice(0, 3).map((t) => (
-                    <span
-                      key={t}
-                      className="text-xs px-1.5 py-0.5 bg-[#191a1b] border border-[#23252a] rounded text-[#d0d6e0]"
-                    >
-                      #{t}
+            {related.map((r) => {
+              const rInfo = getSectionInfo(r.section);
+              return (
+                <Link
+                  key={r.slug}
+                  href={`/${r.slug}`}
+                  className="group block bg-[#0f1011] border border-[#1f2022] rounded-lg p-4 hover:border-[#5e6ad2]/40 hover:bg-[#131415] transition-all duration-200"
+                >
+                  <div className="flex items-start gap-2 mb-2">
+                    <span className="text-xl">
+                      {rInfo.icon}
                     </span>
-                  ))}
-                </div>
-              </Link>
-            ))}
+                    <time className="text-xs text-[#62666d]">
+                      {new Date(r.updatedAt).toLocaleDateString(undefined, {
+                        month: "short",
+                        day: "numeric",
+                      })}
+                    </time>
+                  </div>
+                  <h3 className="font-medium text-[#f7f8f8] group-hover:text-[#7170ff] transition-colors line-clamp-1 mb-1">
+                    {r.title}
+                  </h3>
+                  <div className="flex flex-wrap gap-1 mt-2">
+                    {r.tags.slice(0, 3).map((t) => (
+                      <span
+                        key={t}
+                        className="text-xs px-1.5 py-0.5 bg-[#191a1b] border border-[#23252a] rounded text-[#d0d6e0]"
+                      >
+                        #{t}
+                      </span>
+                    ))}
+                  </div>
+                </Link>
+              );
+            })}
           </div>
         </aside>
       )}