docs(copilot): add Copilot instructions for The Collective Hub

- Add comprehensive project overview and core philosophy
- Document file structure reference for the codebase
- Create key files reference table for task-specific guidance
- Include multi-tenant guidelines and site resolution flow

.github/prompts/generate-svelte-component.prompt.md

@@ -0,0 +1,71 @@
+---
+description: 'Scaffold a new Svelte 5 component for The Collective Hub. Follows runes convention, snippets over slots, Tailwind CSS, and Lucide icons.'
+agent: 'agent'
+---
+
+Scaffold a Svelte 5 component for The Collective Hub: ${input}
+
+Follow all conventions in:
+- [components.instructions.md](.github/instructions/components.instructions.md)
+- [svelte5.instructions.md](.github/instructions/svelte5.instructions.md)
+- [icons.instructions.md](.github/instructions/icons.instructions.md)
+- [tailwindcss.instructions.md](.github/instructions/tailwindcss.instructions.md)
+
+## Conventions
+
+1. **PascalCase filename** — `TheComponent.svelte`
+2. **Place in appropriate folder:**
+   - `src/lib/components/ui/` — generic reusable UI primitives
+   - `src/lib/components/layout/` — structural shell components
+   - Route directory — page-specific components
+3. **Use Svelte 5 runes**:
+   - `$props()` for component props with inline type
+   - `$state()` for local state
+   - `$derived()` for computed values
+   - `$effect()` for side effects (sparingly)
+   - `$bindable()` for two-way bindings
+4. **Snippets over slots** for composition patterns
+5. **Tailwind CSS** for styling
+6. **Lucide icons** from `@lucide/svelte` — import individual icons by name
+7. **No `svelte-ignore` comments** — fix accessibility and type issues properly
+
+## Example Component
+
+```svelte
+<script lang="ts">
+    import { Heart } from '@lucide/svelte';
+
+    let {
+        title,
+        description = '',
+        liked = $bindable(false),
+    }: {
+        title: string;
+        description?: string;
+        liked?: boolean;
+    } = $props();
+
+    let count = $state(0);
+    let doubled = $derived(count * 2);
+</script>
+
+<div class="rounded-lg border p-4">
+    <div class="flex items-center gap-2">
+        <h2 class="text-lg font-semibold">{title}</h2>
+        <button
+            onclick={() => (liked = !liked)}
+            class="ml-auto"
+            aria-label={liked ? 'Unlike' : 'Like'}
+        >
+            <Heart class={liked ? 'fill-red-500 text-red-500' : ''} />
+        </button>
+    </div>
+    {#if description}
+        <p class="mt-2 text-gray-600">{description}</p>
+    {/if}
+    <p class="mt-2">Count: {count} (doubled: {doubled})</p>
+    <button onclick={() => count++} class="mt-2 rounded bg-blue-600 px-3 py-1 text-white">
+        Increment
+    </button>
+</div>
+```