From 0acd7c3e7e5043c958172d8f49fabaf36c2837fb Mon Sep 17 00:00:00 2001
From: Till-JS <101404291+Till-JS@users.noreply.github.com>
Date: Fri, 28 Nov 2025 20:54:50 +0100
Subject: [PATCH] feat(shared-branding): add global app icons and centralized
 app config
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add app-icons.ts with SVG data URLs for all Manacore apps
- Add mana-apps.ts with centralized app configuration (de/en translations)
- Update AppSlider components across all apps to use global APP_ICONS
- Use real SVGs for memoro, manacore, mana, moodlit, maerchenzauber
- Placeholder icons for apps without original SVGs (chat, presi, manadeck, picture, zitare, wisekeep)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../web/src/lib/components/AppSlider.svelte   |  32 +++
 .../web/src/lib/components/AppSlider.svelte   |  11 +-
 .../web/src/lib/components/AppSlider.svelte   |  11 +-
 .../web/src/lib/components/AppSlider.svelte   |  11 +-
 .../web/src/lib/components/AppSlider.svelte   |  11 +-
 .../web/src/lib/components/AppSlider.svelte   |  13 +-
 packages/shared-branding/src/app-icons.ts     |  65 ++++++
 packages/shared-branding/src/index.ts         |  16 ++
 packages/shared-branding/src/mana-apps.ts     | 216 ++++++++++++++++++
 9 files changed, 360 insertions(+), 26 deletions(-)
 create mode 100644 apps/chat/apps/web/src/lib/components/AppSlider.svelte
 create mode 100644 packages/shared-branding/src/app-icons.ts
 create mode 100644 packages/shared-branding/src/mana-apps.ts

diff --git a/apps/chat/apps/web/src/lib/components/AppSlider.svelte b/apps/chat/apps/web/src/lib/components/AppSlider.svelte
new file mode 100644
index 000000000..ac8bb846d
--- /dev/null
+++ b/apps/chat/apps/web/src/lib/components/AppSlider.svelte
@@ -0,0 +1,32 @@
+<script lang="ts">
+	import { AppSlider, type AppItem } from '@manacore/shared-ui';
+	import { MANA_APPS, APP_STATUS_LABELS, APP_SLIDER_LABELS } from '@manacore/shared-branding';
+
+	// Convert MANA_APPS to AppItem format (German)
+	const apps: AppItem[] = MANA_APPS.map((app) => ({
+		name: app.name,
+		description: app.description.de,
+		longDescription: app.longDescription.de,
+		icon: app.icon,
+		color: app.color,
+		comingSoon: app.comingSoon,
+		status: app.status,
+	}));
+
+	const statusLabels = APP_STATUS_LABELS.de;
+	const labels = APP_SLIDER_LABELS.de;
+
+	function handleAppClick(app: AppItem, index: number) {
+		console.log('Opening app:', app.name);
+	}
+</script>
+
+<AppSlider
+	{apps}
+	title={labels.title}
+	isDark={false}
+	{statusLabels}
+	comingSoonLabel={labels.comingSoon}
+	openAppLabel={labels.openApp}
+	onAppClick={handleAppClick}
+/>
diff --git a/apps/maerchenzauber/apps/web/src/lib/components/AppSlider.svelte b/apps/maerchenzauber/apps/web/src/lib/components/AppSlider.svelte
index 3727c00a0..4788ee830 100644
--- a/apps/maerchenzauber/apps/web/src/lib/components/AppSlider.svelte
+++ b/apps/maerchenzauber/apps/web/src/lib/components/AppSlider.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { AppSlider, type AppItem } from '@manacore/shared-ui';
+	import { APP_ICONS } from '@manacore/shared-branding';
 	import { t } from 'svelte-i18n';
 
 	let apps = $derived<AppItem[]>([
@@ -7,7 +8,7 @@
 			name: 'Memoro',
 			description: $t('app_slider.memoro_desc'),
 			longDescription: $t('app_slider.memoro_long_desc'),
-			icon: '/images/app-icons/memoro-logo-gradient.png',
+			icon: APP_ICONS.memoro,
 			color: '#f8d62b',
 			comingSoon: false,
 			status: 'published',
@@ -16,7 +17,7 @@
 			name: 'Märchenzauber',
 			description: $t('app_slider.maerchenzauber_desc'),
 			longDescription: $t('app_slider.maerchenzauber_long_desc'),
-			icon: '/images/app-icons/maerchenzauber-logo-gradient.png',
+			icon: APP_ICONS.maerchenzauber,
 			color: '#FF6B9D',
 			comingSoon: false,
 			status: 'beta',
@@ -25,7 +26,7 @@
 			name: 'ManaDeck',
 			description: $t('app_slider.manadeck_desc'),
 			longDescription: $t('app_slider.manadeck_long_desc'),
-			icon: '/images/app-icons/manadeck-logo-gradient.png',
+			icon: APP_ICONS.manadeck,
 			color: '#8b5cf6',
 			comingSoon: true,
 			status: 'development',
@@ -34,7 +35,7 @@
 			name: 'Moodlit',
 			description: $t('app_slider.moodlit_desc'),
 			longDescription: $t('app_slider.moodlit_long_desc'),
-			icon: '/images/app-icons/moodlit-logo-gradient.png',
+			icon: APP_ICONS.moodlit,
 			color: '#9C27B0',
 			comingSoon: true,
 			status: 'planning',
@@ -43,7 +44,7 @@
 			name: 'Manacore',
 			description: $t('app_slider.manacore_desc'),
 			longDescription: $t('app_slider.manacore_long_desc'),
-			icon: '/images/app-icons/manacore-logo-gradient.png',
+			icon: APP_ICONS.manacore,
 			color: '#6366f1',
 			comingSoon: true,
 			status: 'development',
diff --git a/apps/manacore/apps/web/src/lib/components/AppSlider.svelte b/apps/manacore/apps/web/src/lib/components/AppSlider.svelte
index 87ee03b8c..4cd0928f2 100644
--- a/apps/manacore/apps/web/src/lib/components/AppSlider.svelte
+++ b/apps/manacore/apps/web/src/lib/components/AppSlider.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { AppSlider, type AppItem } from '@manacore/shared-ui';
+	import { APP_ICONS } from '@manacore/shared-branding';
 	import { t } from 'svelte-i18n';
 
 	let apps = $derived<AppItem[]>([
@@ -7,7 +8,7 @@
 			name: 'Memoro',
 			description: $t('app_slider.memoro_desc'),
 			longDescription: $t('app_slider.memoro_long_desc'),
-			icon: '/images/app-icons/memoro-logo-gradient.png',
+			icon: APP_ICONS.memoro,
 			color: '#f8d62b',
 			comingSoon: false,
 			status: 'published',
@@ -16,7 +17,7 @@
 			name: 'Märchenzauber',
 			description: $t('app_slider.maerchenzauber_desc'),
 			longDescription: $t('app_slider.maerchenzauber_long_desc'),
-			icon: '/images/app-icons/maerchenzauber-logo-gradient.png',
+			icon: APP_ICONS.maerchenzauber,
 			color: '#FF6B9D',
 			comingSoon: true,
 			status: 'beta',
@@ -25,7 +26,7 @@
 			name: 'ManaDeck',
 			description: $t('app_slider.manadeck_desc'),
 			longDescription: $t('app_slider.manadeck_long_desc'),
-			icon: '/images/app-icons/manadeck-logo-gradient.png',
+			icon: APP_ICONS.manadeck,
 			color: '#8b5cf6',
 			comingSoon: true,
 			status: 'development',
@@ -34,7 +35,7 @@
 			name: 'Moodlit',
 			description: $t('app_slider.moodlit_desc'),
 			longDescription: $t('app_slider.moodlit_long_desc'),
-			icon: '/images/app-icons/moodlit-logo-gradient.png',
+			icon: APP_ICONS.moodlit,
 			color: '#9C27B0',
 			comingSoon: true,
 			status: 'planning',
@@ -43,7 +44,7 @@
 			name: 'Manacore',
 			description: $t('app_slider.manacore_desc'),
 			longDescription: $t('app_slider.manacore_long_desc'),
-			icon: '/images/app-icons/manacore-logo-gradient.png',
+			icon: APP_ICONS.manacore,
 			color: '#6366f1',
 			comingSoon: false,
 			status: 'development',
diff --git a/apps/manadeck/apps/web/src/lib/components/AppSlider.svelte b/apps/manadeck/apps/web/src/lib/components/AppSlider.svelte
index f76d3e66f..e291b4b2f 100644
--- a/apps/manadeck/apps/web/src/lib/components/AppSlider.svelte
+++ b/apps/manadeck/apps/web/src/lib/components/AppSlider.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { AppSlider, type AppItem } from '@manacore/shared-ui';
+	import { APP_ICONS } from '@manacore/shared-branding';
 	import { t } from 'svelte-i18n';
 
 	let apps = $derived<AppItem[]>([
@@ -7,7 +8,7 @@
 			name: 'Memoro',
 			description: $t('app_slider.memoro_desc'),
 			longDescription: $t('app_slider.memoro_long_desc'),
-			icon: '/images/app-icons/memoro-logo-gradient.png',
+			icon: APP_ICONS.memoro,
 			color: '#f8d62b',
 			comingSoon: false,
 			status: 'published',
@@ -16,7 +17,7 @@
 			name: 'ManaDeck',
 			description: $t('app_slider.manadeck_desc'),
 			longDescription: $t('app_slider.manadeck_long_desc'),
-			icon: '/images/app-icons/manadeck-logo-gradient.png',
+			icon: APP_ICONS.manadeck,
 			color: '#8b5cf6',
 			comingSoon: false,
 			status: 'development',
@@ -25,7 +26,7 @@
 			name: 'Märchenzauber',
 			description: $t('app_slider.maerchenzauber_desc'),
 			longDescription: $t('app_slider.maerchenzauber_long_desc'),
-			icon: '/images/app-icons/maerchenzauber-logo-gradient.png',
+			icon: APP_ICONS.maerchenzauber,
 			color: '#FF6B9D',
 			comingSoon: true,
 			status: 'beta',
@@ -34,7 +35,7 @@
 			name: 'Moodlit',
 			description: $t('app_slider.moodlit_desc'),
 			longDescription: $t('app_slider.moodlit_long_desc'),
-			icon: '/images/app-icons/moodlit-logo-gradient.png',
+			icon: APP_ICONS.moodlit,
 			color: '#9C27B0',
 			comingSoon: true,
 			status: 'planning',
@@ -43,7 +44,7 @@
 			name: 'Manacore',
 			description: $t('app_slider.manacore_desc'),
 			longDescription: $t('app_slider.manacore_long_desc'),
-			icon: '/images/app-icons/manacore-logo-gradient.png',
+			icon: APP_ICONS.manacore,
 			color: '#6366f1',
 			comingSoon: true,
 			status: 'development',
diff --git a/apps/memoro/apps/web/src/lib/components/AppSlider.svelte b/apps/memoro/apps/web/src/lib/components/AppSlider.svelte
index 577ea29fe..6e43648c1 100644
--- a/apps/memoro/apps/web/src/lib/components/AppSlider.svelte
+++ b/apps/memoro/apps/web/src/lib/components/AppSlider.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { AppSlider, type AppItem } from '@manacore/shared-ui';
+	import { APP_ICONS } from '@manacore/shared-branding';
 	import { theme } from '$lib/stores/theme';
 	import { t } from 'svelte-i18n';
 
@@ -11,7 +12,7 @@
 			name: 'Memoro',
 			description: $t('app_slider.memoro_desc'),
 			longDescription: $t('app_slider.memoro_long_desc'),
-			icon: '/images/app-icons/memoro-logo-gradient.png',
+			icon: APP_ICONS.memoro,
 			color: '#f8d62b',
 			comingSoon: false,
 			status: 'published',
@@ -20,7 +21,7 @@
 			name: 'Märchenzauber',
 			description: $t('app_slider.maerchenzauber_desc'),
 			longDescription: $t('app_slider.maerchenzauber_long_desc'),
-			icon: '/images/app-icons/maerchenzauber-logo-gradient.png',
+			icon: APP_ICONS.maerchenzauber,
 			color: '#FF6B9D',
 			comingSoon: true,
 			status: 'beta',
@@ -29,7 +30,7 @@
 			name: 'ManaDeck',
 			description: $t('app_slider.manadeck_desc'),
 			longDescription: $t('app_slider.manadeck_long_desc'),
-			icon: '/images/app-icons/manadeck-logo-gradient.png',
+			icon: APP_ICONS.manadeck,
 			color: '#8b5cf6',
 			comingSoon: true,
 			status: 'development',
@@ -38,7 +39,7 @@
 			name: 'Moodlit',
 			description: $t('app_slider.moodlit_desc'),
 			longDescription: $t('app_slider.moodlit_long_desc'),
-			icon: '/images/app-icons/moodlit-logo-gradient.png',
+			icon: APP_ICONS.moodlit,
 			color: '#9C27B0',
 			comingSoon: true,
 			status: 'planning',
@@ -47,7 +48,7 @@
 			name: 'Manacore',
 			description: $t('app_slider.manacore_desc'),
 			longDescription: $t('app_slider.manacore_long_desc'),
-			icon: '/images/app-icons/manacore-logo-gradient.png',
+			icon: APP_ICONS.manacore,
 			color: '#00BCD4',
 			comingSoon: true,
 			status: 'development',
diff --git a/apps/picture/apps/web/src/lib/components/AppSlider.svelte b/apps/picture/apps/web/src/lib/components/AppSlider.svelte
index ba32fc13e..9a1c9332f 100644
--- a/apps/picture/apps/web/src/lib/components/AppSlider.svelte
+++ b/apps/picture/apps/web/src/lib/components/AppSlider.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { AppSlider, type AppItem } from '@manacore/shared-ui';
+	import { APP_ICONS } from '@manacore/shared-branding';
 	import { actualMode } from '$lib/stores/theme';
 	import { t } from 'svelte-i18n';
 
@@ -10,7 +11,7 @@
 			name: 'Picture',
 			description: $t('app_slider.picture_desc'),
 			longDescription: $t('app_slider.picture_long_desc'),
-			icon: '/images/app-icons/picture-logo-gradient.png',
+			icon: APP_ICONS.picture,
 			color: '#3b82f6',
 			comingSoon: false,
 			status: 'published',
@@ -19,7 +20,7 @@
 			name: 'Memoro',
 			description: $t('app_slider.memoro_desc'),
 			longDescription: $t('app_slider.memoro_long_desc'),
-			icon: '/images/app-icons/memoro-logo-gradient.png',
+			icon: APP_ICONS.memoro,
 			color: '#f8d62b',
 			comingSoon: false,
 			status: 'published',
@@ -28,7 +29,7 @@
 			name: 'Märchenzauber',
 			description: $t('app_slider.maerchenzauber_desc'),
 			longDescription: $t('app_slider.maerchenzauber_long_desc'),
-			icon: '/images/app-icons/maerchenzauber-logo-gradient.png',
+			icon: APP_ICONS.maerchenzauber,
 			color: '#FF6B9D',
 			comingSoon: true,
 			status: 'beta',
@@ -37,7 +38,7 @@
 			name: 'ManaDeck',
 			description: $t('app_slider.manadeck_desc'),
 			longDescription: $t('app_slider.manadeck_long_desc'),
-			icon: '/images/app-icons/manadeck-logo-gradient.png',
+			icon: APP_ICONS.manadeck,
 			color: '#8b5cf6',
 			comingSoon: true,
 			status: 'development',
@@ -46,7 +47,7 @@
 			name: 'Moodlit',
 			description: $t('app_slider.moodlit_desc'),
 			longDescription: $t('app_slider.moodlit_long_desc'),
-			icon: '/images/app-icons/moodlit-logo-gradient.png',
+			icon: APP_ICONS.moodlit,
 			color: '#9C27B0',
 			comingSoon: true,
 			status: 'planning',
@@ -55,7 +56,7 @@
 			name: 'Manacore',
 			description: $t('app_slider.manacore_desc'),
 			longDescription: $t('app_slider.manacore_long_desc'),
-			icon: '/images/app-icons/manacore-logo-gradient.png',
+			icon: APP_ICONS.manacore,
 			color: '#00BCD4',
 			comingSoon: true,
 			status: 'development',
diff --git a/packages/shared-branding/src/app-icons.ts b/packages/shared-branding/src/app-icons.ts
new file mode 100644
index 000000000..aee1c59ab
--- /dev/null
+++ b/packages/shared-branding/src/app-icons.ts
@@ -0,0 +1,65 @@
+/**
+ * App icons as SVG data URLs for the Mana ecosystem
+ * These can be used directly as image src or CSS background-image
+ */
+
+// Helper to convert SVG string to data URL
+const svgToDataUrl = (svg: string): string => {
+	const encoded = encodeURIComponent(svg)
+		.replace(/'/g, '%27')
+		.replace(/"/g, '%22');
+	return `data:image/svg+xml,${encoded}`;
+};
+
+// Memoro icon SVG
+const memoroSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M512 130C722.973 130 894 301.027 894 512C894 722.973 722.973 894 512 894C301.027 894 130 722.973 130 512C130 301.027 301.027 130 512 130ZM328.076 324.825C322.366 323.075 316.506 323.345 310.81 324.903C299.274 328.059 288.955 336.364 283.562 342.26C260.131 367.874 245.424 391.558 236.524 418.066C227.606 444.63 224.432 474.286 224.432 512C224.432 670.525 352.874 783.368 512 783.368C671.126 783.368 799.568 670.525 799.568 512C799.568 474.285 796.393 444.629 787.475 418.064C778.574 391.555 763.867 367.872 740.435 342.257C735.237 336.575 723.981 328.835 711.804 325.948C705.777 324.52 699.735 324.331 694.177 325.975C688.685 327.599 683.404 331.086 678.906 337.479L569.857 492.133C554.287 513.249 535.932 525.917 515.688 526.654C495.436 527.391 474.644 516.138 454.368 492.428L345.154 337.57C339.593 330.392 333.746 326.563 328.076 324.825Z" fill="#F8D62B"/><path d="M512 130C722.973 130 894 301.027 894 512C894 722.973 722.973 894 512 894C301.027 894 130 722.973 130 512C130 301.027 301.027 130 512 130ZM328.076 324.825C322.366 323.075 316.506 323.345 310.81 324.903C299.274 328.059 288.955 336.364 283.562 342.26C260.131 367.874 245.424 391.558 236.524 418.066C227.606 444.63 224.432 474.286 224.432 512C224.432 670.525 352.874 783.368 512 783.368C671.126 783.368 799.568 670.525 799.568 512C799.568 474.285 796.393 444.629 787.475 418.064C778.574 391.555 763.867 367.872 740.435 342.257C735.237 336.575 723.981 328.835 711.804 325.948C705.777 324.52 699.735 324.331 694.177 325.975C688.685 327.599 683.404 331.086 678.906 337.479L569.857 492.133C554.287 513.249 535.932 525.917 515.688 526.654C495.436 527.391 474.644 516.138 454.368 492.428L345.154 337.57C339.593 330.392 333.746 326.563 328.076 324.825Z" stroke="#FFE97B" stroke-width="8"/></svg>`;
+
+// ManaCore icon SVG
+const manacoreSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="512.5" cy="512.5" r="403.614" stroke="#004D81" stroke-width="95.7727"/><path d="M583.883 512.512C582.858 513.285 367.199 676.079 277.02 676.088C186.632 676.088 113.352 602.857 113.347 512.512C113.347 422.164 186.63 348.914 277.02 348.914C367.414 348.923 583.883 512.512 583.883 512.512ZM440.67 512.512C439.972 511.984 332.285 430.713 287.237 430.713C242.045 430.714 205.402 467.339 205.402 512.512C205.402 557.686 242.045 594.31 287.237 594.31C332.256 594.31 439.828 513.148 440.67 512.512Z" fill="url(#paint0_linear_1157_667)"/><path d="M512.512 440.52C513.285 441.544 676.079 657.203 676.088 747.383C676.088 837.77 602.857 911.051 512.512 911.055C422.163 911.055 348.914 837.773 348.914 747.383C348.923 656.988 512.512 440.52 512.512 440.52ZM512.512 583.733C511.984 584.431 430.713 692.117 430.713 737.165C430.714 782.357 467.339 819 512.512 819C557.685 819 594.31 782.357 594.31 737.165C594.31 692.146 513.148 584.574 512.512 583.733Z" fill="url(#paint1_linear_1157_667)"/><path d="M440.521 512.488C441.546 511.715 657.205 348.921 747.385 348.912C837.772 348.912 911.053 422.143 911.057 512.488C911.057 602.836 837.775 676.086 747.385 676.086C656.99 676.077 440.521 512.488 440.521 512.488ZM583.735 512.488C584.433 513.016 692.119 594.287 737.167 594.287C782.359 594.286 819.002 557.661 819.002 512.488C819.002 467.314 782.359 430.69 737.167 430.69C692.148 430.69 584.576 511.852 583.735 512.488Z" fill="url(#paint2_linear_1157_667)"/><path d="M512.488 583.883C511.715 582.858 348.921 367.199 348.912 277.02C348.912 186.632 422.143 113.352 512.488 113.347C602.836 113.347 676.086 186.63 676.086 277.02C676.077 367.414 512.488 583.883 512.488 583.883ZM512.488 440.67C513.016 439.972 594.287 332.285 594.287 287.237C594.285 242.045 557.661 205.402 512.488 205.402C467.314 205.402 430.69 242.045 430.69 287.237C430.69 332.256 511.852 439.828 512.488 440.67Z" fill="url(#paint3_linear_1157_667)"/><defs><linearGradient id="paint0_linear_1157_667" x1="583.883" y1="512.501" x2="113.347" y2="512.501" gradientUnits="userSpaceOnUse"><stop offset="0.211538" stop-color="#004471"/><stop offset="0.788462" stop-color="#0099FF"/></linearGradient><linearGradient id="paint1_linear_1157_667" x1="512.501" y1="440.52" x2="512.501" y2="911.055" gradientUnits="userSpaceOnUse"><stop offset="0.211538" stop-color="#004471"/><stop offset="0.788462" stop-color="#0099FF"/></linearGradient><linearGradient id="paint2_linear_1157_667" x1="440.521" y1="512.499" x2="911.057" y2="512.499" gradientUnits="userSpaceOnUse"><stop offset="0.211538" stop-color="#004471"/><stop offset="0.788462" stop-color="#0099FF"/></linearGradient><linearGradient id="paint3_linear_1157_667" x1="512.499" y1="583.883" x2="512.499" y2="113.347" gradientUnits="userSpaceOnUse"><stop offset="0.211538" stop-color="#004471"/><stop offset="0.788462" stop-color="#0099FF"/></linearGradient></defs></svg>`;
+
+// Mana icon (single droplet)
+const manaSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M515.714 104.592C516.403 105.506 586.851 198.868 657.146 311.452C692.29 367.739 727.445 428.91 753.828 485.782C780.141 542.503 797.996 595.499 798 635.247L797.994 637.095C797.001 794.047 669.581 920.992 512.52 921C354.836 921 227 793.054 227 635.247L227.014 633.369C227.567 593.742 245.359 541.362 271.366 485.376C297.857 428.348 333.141 367.024 368.373 310.65C403.613 254.263 438.847 202.755 465.267 165.349C478.478 146.644 489.489 131.46 497.198 120.95C501.053 115.695 504.083 111.608 506.15 108.833C507.184 107.446 507.977 106.386 508.513 105.673C508.78 105.316 508.984 105.046 509.12 104.864C509.188 104.774 509.24 104.705 509.274 104.659C509.292 104.636 509.305 104.619 509.313 104.607C509.318 104.602 509.322 104.597 509.324 104.594C509.329 104.593 509.419 104.658 512.52 107L509.327 104.589L512.522 100.359L515.714 104.592ZM512.519 360.227C503.066 372.996 474.086 412.798 445.191 459.084C427.696 487.109 410.282 517.433 397.254 545.525C384.156 573.769 375.759 599.211 375.759 617.659C375.762 693.248 436.998 754.533 512.52 754.533C588.041 754.533 649.277 693.248 649.277 617.659C649.277 599.223 640.892 573.803 627.809 545.581C614.796 517.51 597.398 487.208 579.915 459.195C550.999 412.865 521.982 373.013 512.519 360.227Z" fill="url(#paint0_linear_1194_1020)" stroke="#0199FF" stroke-width="8"/><defs><linearGradient id="paint0_linear_1194_1020" x1="512.5" y1="107" x2="512.5" y2="917" gradientUnits="userSpaceOnUse"><stop stop-color="#0068AD"/><stop offset="0.524038" stop-color="#0099FF"/></linearGradient></defs></svg>`;
+
+// ManaChat icon (simplified chat bubble with gradient)
+const chatSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="130" y="130" width="764" height="764" rx="382" fill="url(#chatGrad)"/><path d="M512 280C655.6 280 772 380.8 772 504C772 627.2 655.6 728 512 728C483.2 728 455.2 724 428.4 716.4L324 776L348.8 684.4C296.8 640.4 264 580.8 264 516C264 388.8 372.8 280 512 280ZM392 480C375.2 480 362 493.2 362 510C362 526.8 375.2 540 392 540C408.8 540 422 526.8 422 510C422 493.2 408.8 480 392 480ZM512 480C495.2 480 482 493.2 482 510C482 526.8 495.2 540 512 540C528.8 540 542 526.8 542 510C542 493.2 528.8 480 512 480ZM632 480C615.2 480 602 493.2 602 510C602 526.8 615.2 540 632 540C648.8 540 662 526.8 662 510C662 493.2 648.8 480 632 480Z" fill="white"/><defs><linearGradient id="chatGrad" x1="130" y1="130" x2="894" y2="894" gradientUnits="userSpaceOnUse"><stop stop-color="#0ea5e9"/><stop offset="1" stop-color="#0284c7"/></linearGradient></defs></svg>`;
+
+// Presi icon (presentation/slides icon with gradient)
+const presiSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="130" y="130" width="764" height="764" rx="382" fill="url(#presiGrad)"/><rect x="280" y="300" width="464" height="344" rx="24" fill="white"/><rect x="320" y="340" width="180" height="120" rx="8" fill="#f97316" fill-opacity="0.3"/><rect x="320" y="480" width="120" height="16" rx="4" fill="#f97316" fill-opacity="0.5"/><rect x="320" y="512" width="200" height="12" rx="3" fill="#f97316" fill-opacity="0.3"/><rect x="320" y="536" width="160" height="12" rx="3" fill="#f97316" fill-opacity="0.3"/><circle cx="620" cy="400" r="60" fill="#f97316"/><rect x="580" y="480" width="100" height="80" rx="8" fill="#f97316" fill-opacity="0.4"/><path d="M512 688L512 744" stroke="white" stroke-width="24" stroke-linecap="round"/><circle cx="512" cy="784" r="32" fill="white"/><defs><linearGradient id="presiGrad" x1="130" y1="130" x2="894" y2="894" gradientUnits="userSpaceOnUse"><stop stop-color="#f97316"/><stop offset="1" stop-color="#ea580c"/></linearGradient></defs></svg>`;
+
+// ManaDeck icon (cards/flashcards with gradient)
+const manadeckSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="130" y="130" width="764" height="764" rx="382" fill="url(#deckGrad)"/><rect x="280" y="340" width="320" height="420" rx="24" fill="white" transform="rotate(-8 280 340)"/><rect x="340" y="280" width="320" height="420" rx="24" fill="white" transform="rotate(4 340 280)"/><rect x="380" y="300" width="320" height="420" rx="24" fill="white"/><rect x="420" y="380" width="240" height="20" rx="4" fill="#8b5cf6" fill-opacity="0.6"/><rect x="420" y="420" width="180" height="16" rx="4" fill="#8b5cf6" fill-opacity="0.4"/><rect x="420" y="450" width="200" height="16" rx="4" fill="#8b5cf6" fill-opacity="0.4"/><rect x="420" y="520" width="240" height="120" rx="8" fill="#8b5cf6" fill-opacity="0.2"/><defs><linearGradient id="deckGrad" x1="130" y1="130" x2="894" y2="894" gradientUnits="userSpaceOnUse"><stop stop-color="#8b5cf6"/><stop offset="1" stop-color="#7c3aed"/></linearGradient></defs></svg>`;
+
+// Märchenzauber icon (Finia the squirrel - original logo)
+const maerchenzauberSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M662.003 709.293C658.097 701.545 655.574 692.596 650.887 685.088L623.846 642.505C634.181 641.544 644.517 639.081 654.312 635.718C704.908 618.54 750.577 585.867 778.58 540.401C833.563 451.149 828.215 343.219 749.916 270.305C770.768 274.269 791.86 284.179 809.707 295.47C900.564 352.829 956.87 488.327 942.989 593.975C942.508 597.519 942.027 600.402 941.727 601.903C940.765 606.468 940.585 607.309 940.104 612.054C929.889 712.116 870.639 795.541 790.057 850.557C790.478 843.11 790.718 845.632 785.31 844.912C778.46 843.951 771.79 843.29 765.24 841.008C808.385 801.067 846.603 745.03 863.548 688.272C865.171 682.866 872.201 656.679 872.201 653.016V585.266C867.695 584.305 869.137 585.867 867.935 587.729C863.909 593.855 861.625 603.045 857.659 609.832C816.677 679.683 762.956 708.873 689.946 728.513C683.937 730.134 675.103 731.516 673.601 737.942C673 734.819 672.339 731.456 671.678 728.393C670.656 723.648 667.412 718.002 664.047 713.137C663.866 712.597 664.227 711.876 664.047 711.215C663.806 710.374 662.965 709.653 662.124 709.293H662.003Z" fill="#E8AB47"/><path d="M673.48 737.945C674.983 731.518 683.816 730.137 689.825 728.515C762.836 708.875 816.557 679.625 857.539 609.834C861.505 603.047 863.848 593.918 867.814 587.731C869.016 585.869 867.574 584.308 872.081 585.269V653.018C872.081 656.682 865.05 682.868 863.428 688.274C846.422 745.032 808.264 801.129 765.119 841.01C761.874 843.292 749.015 851.881 747.813 853.863C744.688 859.089 750.036 864.734 747.032 869.659C743.667 875.245 727.742 876.566 726.961 884.915C726.06 885.275 724.377 887.437 721.854 888.338C711.939 891.882 640.731 910.921 637.186 907.798L661.763 868.398C682.554 825.034 682.795 784.432 673.48 737.885V737.945Z" fill="#DB8535"/><path d="M765.179 841.008C771.789 843.29 778.399 843.951 785.249 844.912C790.657 845.632 790.417 843.11 789.996 850.558C767.522 865.933 754.422 874.522 726.961 884.913C727.742 876.564 743.666 875.183 747.031 869.657C750.036 864.732 744.688 859.086 747.812 853.861C749.014 851.879 761.874 843.29 765.119 841.008H765.179Z" fill="#DC8836"/><path d="M663.927 711.215C663.326 710.674 662.364 710.074 662.004 709.293C662.845 709.653 663.686 710.314 663.927 711.215Z" fill="#DB8535"/><path d="M492.006 928.817C491.946 921.67 497.054 923.832 501.561 923.111C557.686 913.922 598.127 897.886 621.622 841.728C662.123 745.029 601.612 649.171 523.975 594.396C485.036 566.887 432.156 553.073 402.29 515.535C390.693 501 384.804 485.925 386.967 466.885C385.405 465.083 358.304 485.624 355.54 487.907C312.455 523.944 285.414 570.611 271.052 624.847C255.248 684.488 267.627 747.011 264.802 808.514C264.622 812.538 264.923 816.562 264.562 820.647C263.541 831.818 249.359 886.294 252.304 890.678C254.467 893.861 271.473 895.843 276.28 896.324C271.052 906.835 267.867 921.73 253.866 924.493C242.509 926.775 214.446 926.895 203.149 924.493C183.499 920.348 204.712 890.318 214.206 882.93C218.052 879.927 223.28 878.846 226.525 876.203C236.62 867.915 233.976 849.356 238.062 838.124V766.531C232.474 765.45 234.997 768.213 233.735 770.736C229.469 779.264 230.01 783.949 227.606 791.397C216.91 824.551 204.291 862.029 191.311 892.54C186.624 903.531 179.053 923.472 166.434 924.973C158.442 925.874 102.978 925.874 98.6511 923.952C82.0059 916.565 105.501 887.915 115.176 881.369C120.704 877.585 143.539 870.017 144.621 868.335C146.063 866.053 154.536 834.761 155.437 830.016C184.04 683.346 86.7531 615.177 79.422 485.084C75.6363 417.995 97.6296 341.117 132.963 284.539C136.148 279.434 144.741 271.626 145.943 266.941C148.466 257.091 145.462 240.394 146.423 229.283C150.029 188.921 185.783 120.091 218.953 98.2287C216.73 114.505 205.853 135.707 199.544 150.662C189.268 174.867 181.156 196.429 176.95 222.556C174.786 235.949 171.001 253.547 175.027 266.461C174.846 268.322 175.387 270.545 175.027 272.166C169.919 280.575 161.566 286.521 155.978 294.569C148.887 304.84 141.676 319.134 138.732 331.327C138.071 332.648 137.47 333.789 136.809 335.171C131.881 345.381 125.512 355.712 125.331 367.604C124.971 368.505 124.07 369.706 123.409 371.448C110.309 406.824 106.223 453.131 108.145 490.73C108.746 502.321 110.97 516.676 113.854 527.968C113.974 529.229 113.734 530.55 113.854 531.812C115.777 549.53 124.55 570.551 131.04 587.188C135.607 598.78 140.474 610.552 146.303 621.543C153.995 635.958 163.73 651.874 174.967 663.526C177.13 667.37 178.332 669.412 180.675 673.076C185.362 680.343 206.154 706.53 213.124 707.431C215.708 711.455 216.189 711.755 218.833 715.059C223.881 721.365 229.409 727.491 236.019 732.236C234.036 696.5 237.221 663.286 246.114 628.751C267.687 545.325 328.98 449.708 415.571 424.001C454.269 412.53 492.968 414.692 522.532 381.058C524.876 378.355 529.863 377.874 528.241 371.508C519.468 372.829 518.566 371.448 512.978 367.664L511.055 361.958C511.175 360.697 511.055 359.436 511.055 358.114C511.295 352.528 511.115 346.703 510.875 341.117C496.032 338.534 482.812 331.267 469.051 325.681C468.511 325.441 467.669 325.921 467.129 325.681C462.021 317.873 448.38 312.828 442.912 305.981C435.04 296.011 426.507 272.947 418.215 260.995C388.83 218.652 343.041 197.931 291.363 201.654C291.122 201.414 288.899 202.375 287.577 200.273C282.469 191.864 276.821 176.849 272.254 167.299C275.799 167.299 276.52 171.323 278.383 166.819C281.388 159.491 282.169 151.443 285.954 143.755C291.483 132.644 316.36 99.0696 327.537 95.5259C339.856 91.622 342.5 107.959 344.603 116.908C346.766 143.575 348.389 170.903 352.295 197.03C387.628 208.802 413.167 227.721 433.898 258.653C448.56 280.515 449.101 296.972 474.94 311.206C502.402 326.342 528.782 325.08 554.441 334.87C575.232 342.859 563.334 362.499 554.621 375.952C540.92 397.214 510.454 418.176 486.778 426.464C456.733 436.975 402.17 434.152 408.42 480.82C414.669 527.487 514.18 563.404 551.015 590.311C626.249 645.267 678.408 745.21 653.771 839.626C631.237 926.174 568.382 927.075 491.946 928.937L492.006 928.817Z" fill="#6D3511"/><path d="M272.373 167.179C276.94 176.729 282.649 191.684 287.696 200.153C288.958 202.315 291.181 201.294 291.482 201.535C291.722 201.715 290.581 204.838 292.744 205.378C299.234 207.12 314.617 204.658 322.97 205.378C359.565 208.442 397.723 235.83 417.192 265.86C433.176 290.545 437.262 313.549 467.248 325.621C467.789 325.861 468.63 325.381 469.171 325.621C467.789 327.904 475.42 332.408 476.562 333.009C482.751 336.192 503.663 341.838 505.526 343.7C510.333 348.385 503.182 358.655 511.174 358.054C511.174 359.316 511.294 360.637 511.174 361.898C511.174 362.439 507.869 364.961 509.311 367.604C510.453 368.085 512.556 367.304 513.037 367.604C518.626 371.328 519.527 372.769 528.3 371.448C529.863 377.815 524.935 378.295 522.592 380.998C523.974 375.232 517.063 376.854 513.938 377.094C500.178 378.115 490.984 381.658 475.781 380.998C403.131 377.634 356.02 353.55 285.833 397.395C176.828 465.564 163.669 595.837 214.986 705.509C215.287 706.65 213.965 707.551 213.063 707.431C205.372 695.479 206.994 699.323 197.98 690.914C191.37 684.848 189.988 676.56 180.614 673.016C178.211 669.352 177.009 667.31 174.906 663.466C169.858 654.457 167.755 653.256 163.428 646.769C157.659 638.241 156.818 624.967 146.302 621.483C140.413 610.492 135.546 598.72 131.039 587.128C135.065 585.266 131.64 581.242 130.799 578.78C125.992 565.206 123.047 552.353 119.622 538.419C118.66 534.515 119.622 531.692 113.853 531.752C113.733 530.491 113.973 529.169 113.853 527.908C108.265 474.393 113.192 433.071 123.708 380.277C124.249 377.694 126.773 372.95 123.408 371.388C124.069 369.706 124.97 368.445 125.331 367.544C128.155 360.036 133.202 351.388 136.327 343.159C137.108 341.057 140.233 336.372 136.808 335.051C137.469 333.73 138.07 332.528 138.731 331.207C144.92 319.315 154.054 302.077 161.625 290.666C166.553 283.218 173.043 281.476 175.026 272.047C175.386 270.425 174.845 268.143 175.026 266.341C175.867 258.593 176.468 250.725 176.949 242.496C177.309 236.43 181.876 227.962 176.949 222.436C181.155 196.249 189.267 174.747 199.543 150.542C205.852 135.587 216.729 114.385 218.952 98.1089C224.36 94.5652 228.146 92.8835 234.816 94.8055C238.301 95.8265 255.788 129.641 258.792 135.887C263.72 146.158 267.506 156.909 272.433 167.119L272.373 167.179ZM260.896 226.34L227.485 132.824L222.738 136.188C217.45 171.083 205.732 203.697 209.338 239.734C221.055 225.739 243.65 222.015 260.896 226.34ZM331.563 306.522C332.404 307.783 332.524 309.585 334.567 309.885C338.653 310.606 353.916 307.843 361.247 308.324C370.802 308.924 383.601 311.987 392.675 315.05C395.74 316.072 397.963 319.255 401.268 319.855C405.655 320.636 403.672 318.354 404.152 316.011C405.474 309.285 396.581 298.534 390.812 294.029C380.416 285.861 368.338 283.999 355.419 285.5C347.847 286.401 325.734 297.332 331.563 306.522Z" fill="#DB8535"/><path d="M323.931 737.941C332.344 725.509 334.988 708.752 341.598 695.478C352.174 674.397 383.241 642.504 404.754 632.594C424.163 623.645 446.397 623.224 467.188 625.326C468.149 631.092 465.746 628.39 462.561 629.17C392.976 646.708 345.143 715.178 367.377 787.132C380.116 828.274 429.691 865.392 472.957 865.872C472.236 869.356 469.171 869.416 466.347 869.716C454.449 871.037 441.289 868.154 429.03 871.578C427.107 871.518 425.184 871.638 423.322 871.578C421.459 871.518 419.476 871.638 417.613 871.578C407.157 871.158 394.478 873.5 385.164 869.656C397.422 868.395 407.878 868.215 420.497 867.734C422.781 867.674 427.588 869.176 427.167 865.872C381.018 853.259 337.932 819.925 318.283 776.14C318.403 775.54 318.163 774.819 318.283 774.219C319.905 765.51 321.107 756.32 322.129 747.491C322.189 746.891 322.129 746.23 322.129 745.569C324.652 744.608 323.931 741.966 324.051 739.863C324.051 739.203 324.051 738.602 324.051 737.941H323.931Z" fill="#6D3511"/><path d="M385.045 869.658C394.359 873.502 407.038 871.159 417.494 871.58C417.734 874.463 422.962 874.463 423.202 871.58C425.125 871.64 427.048 871.52 428.911 871.58C429.151 871.58 431.074 873.442 433.538 873.562C443.393 874.102 453.428 873.021 463.283 873.502C463.583 881.129 455.231 878.967 451.866 875.424C451.085 886.115 450.664 904.734 465.687 901.731C470.674 900.77 481.551 894.103 485.216 894.343C491.165 894.763 489.122 901.31 491.826 905.094C495.311 910.079 514.841 913.563 519.889 909.899C522.713 907.857 521.03 902.391 526.318 904.013C523.855 907.737 534.31 913.142 532.087 915.424C531.246 916.325 511.716 918.488 507.991 919.148C505.166 919.629 500.9 917.346 501.501 923.112C496.994 923.833 491.886 921.671 491.946 928.818C452.106 929.779 412.206 928.278 372.666 926.836C361.369 926.416 332.645 929.179 324.293 925.635C320.387 924.013 319.906 918.307 319.906 914.524C319.726 895.905 332.946 882.811 349.591 878.186C353.557 877.105 354.999 875.964 360.167 873.442C368.339 872 376.752 870.439 384.985 869.598L385.045 869.658Z" fill="#DB8535"/><path d="M264.742 808.576C270.511 809.657 268.467 805.633 268.588 801.969C269.729 767.734 267.386 733.799 266.665 699.745C271.953 698.363 271.292 703.889 272.433 707.372C291.783 697.342 298.092 706.111 304.101 724.67C308.728 720.586 321.888 725.751 323.811 724.43C326.335 722.688 323.511 708.093 331.563 709.294C329.82 720.706 324.893 725.991 323.931 737.944C323.931 738.544 323.931 739.205 323.931 739.865C321.408 740.826 322.189 743.469 322.008 745.571C322.008 746.232 322.069 746.833 322.008 747.493C318.343 755.241 312.875 766.593 318.163 774.221C318.042 774.821 318.283 775.542 318.163 776.143C310.591 814.402 293.585 861.55 276.159 896.385C271.352 895.905 254.346 893.923 252.183 890.74C249.238 886.355 263.42 831.879 264.441 820.708C264.802 816.624 264.441 812.6 264.682 808.576H264.742Z" fill="#DB8535"/><path d="M264.742 808.573C267.567 747.07 255.188 684.546 270.992 624.906C285.414 570.67 312.395 523.942 355.48 487.966C358.244 485.623 385.405 465.142 386.907 466.944C384.804 485.924 390.633 500.999 402.23 515.594C432.096 553.072 484.976 566.946 523.914 594.454C601.552 649.23 662.063 745.088 621.562 841.787C598.067 897.944 557.625 913.981 501.501 923.17C500.84 917.464 505.166 919.747 507.99 919.206C511.716 918.545 531.246 916.383 532.087 915.482C534.31 913.14 523.854 907.794 526.318 904.071C521.03 902.449 522.713 907.854 519.888 909.957C514.841 913.62 495.371 910.137 491.826 905.152C489.122 901.308 491.165 894.761 485.216 894.401C481.55 894.161 470.674 900.827 465.686 901.788C450.664 904.791 451.084 886.172 451.866 875.481C455.231 879.085 463.583 881.247 463.283 873.559C453.428 873.079 443.393 874.16 433.538 873.62C431.074 873.499 429.151 871.637 428.911 871.637C441.169 868.214 454.329 871.157 466.227 869.776C469.112 869.475 472.116 869.355 472.837 865.932C429.572 865.451 379.997 828.333 367.258 787.191C345.024 715.238 392.796 646.768 462.441 629.23C465.626 628.449 468.03 631.152 467.069 625.386C446.277 623.284 424.043 623.704 404.634 632.653C383.122 642.564 352.055 674.456 341.479 695.538C334.808 708.811 332.224 725.508 323.812 738.001C324.773 726.049 329.701 720.823 331.443 709.352C323.391 708.151 326.155 722.745 323.692 724.487C321.769 725.809 308.609 720.703 303.982 724.727C297.973 706.169 291.603 697.339 272.314 707.43C271.172 703.946 271.893 698.421 266.545 699.802C267.266 733.797 269.61 767.791 268.468 802.026C268.348 805.69 270.391 809.714 264.622 808.633L264.742 808.573ZM488.22 881.127L474.88 883.95C478.426 888.695 488.521 888.635 488.22 881.127Z" fill="#DC8836"/><path d="M215.048 705.448C163.73 595.776 176.89 465.503 285.895 397.334C356.021 353.489 403.132 377.574 475.842 380.937C490.985 381.658 500.239 378.054 514 377.033C517.125 376.793 524.035 375.171 522.653 380.937C493.149 414.631 454.39 412.409 415.691 423.881C329.1 449.587 267.808 545.205 246.235 628.63C237.282 663.165 234.157 696.379 236.14 732.116C229.53 727.371 224.001 721.245 218.954 714.938C220.276 710.193 216.31 707.851 215.108 705.388L215.048 705.448Z" fill="#F8EAB3"/><path d="M113.793 527.969C110.909 516.678 108.686 502.323 108.085 490.731C106.162 453.133 110.248 406.825 123.348 371.449C126.773 373.011 124.189 377.756 123.648 380.338C113.072 433.192 108.145 474.454 113.793 527.969Z" fill="#DC8836"/><path d="M291.483 201.536C343.162 197.812 388.951 218.533 418.335 260.877C426.628 272.829 435.161 295.892 443.033 305.863C448.501 312.77 462.082 317.755 467.249 325.563C437.264 313.49 433.178 290.427 417.194 265.802C397.724 235.771 359.566 208.383 322.971 205.32C314.618 204.599 299.235 207.062 292.745 205.32C290.582 204.779 291.724 201.656 291.483 201.476V201.536Z" fill="#DC8836"/><path d="M130.981 587.13C124.491 570.553 115.718 549.472 113.795 531.754C119.624 531.634 118.602 534.456 119.564 538.421C122.989 552.355 125.873 565.208 130.741 578.782C131.582 581.244 135.007 585.268 130.981 587.13Z" fill="#DC8836"/><path d="M469.112 325.621C482.873 331.207 496.093 338.474 510.936 341.057C511.236 346.643 511.416 352.469 511.116 358.054C503.124 358.655 510.275 348.384 505.467 343.7C503.605 341.838 482.633 336.192 476.504 333.009C475.422 332.408 467.79 327.903 469.112 325.621Z" fill="#DC8836"/><path d="M174.966 266.46C170.94 253.546 174.725 235.948 176.889 222.555C181.816 228.08 177.249 236.549 176.889 242.615C176.408 250.844 175.807 258.712 174.966 266.46Z" fill="#DC8836"/><path d="M125.271 367.605C125.452 355.713 131.761 345.382 136.749 335.172C140.174 336.433 137.049 341.118 136.268 343.28C133.203 351.509 128.096 360.157 125.271 367.665V367.605Z" fill="#DC8836"/><path d="M180.676 673.016C190.05 676.559 191.432 684.788 198.042 690.914C207.116 699.322 205.433 695.479 213.125 707.431C214.026 707.551 215.348 706.71 215.048 705.509C216.189 707.971 220.156 710.314 218.894 715.059C216.25 711.755 215.769 711.455 213.185 707.431C206.214 706.53 185.423 680.343 180.736 673.076L180.676 673.016Z" fill="#DC8836"/><path d="M174.967 272.168C172.984 281.598 166.494 283.339 161.567 290.787C153.995 302.259 144.861 319.436 138.672 331.328C141.616 319.196 148.887 304.841 155.918 294.571C161.446 286.523 169.859 280.516 174.967 272.168Z" fill="#DC8836"/><path d="M146.302 621.484C156.818 625.028 157.659 638.241 163.428 646.77C167.815 653.257 169.918 654.458 174.906 663.467C163.729 651.815 153.934 635.839 146.242 621.484H146.302Z" fill="#DC8836"/><path d="M513.038 367.604C512.557 367.244 510.394 368.025 509.312 367.604C507.87 364.962 511.115 362.499 511.175 361.898L513.098 367.604H513.038Z" fill="#DC8836"/><path d="M260.897 226.34C243.651 222.015 221.057 225.739 209.339 239.733C205.674 203.757 217.452 171.143 222.74 136.188L227.487 132.824L260.897 226.34Z" fill="#6D3511"/><path d="M404.153 316.071C381.258 307.362 356.14 301.416 331.563 306.521C325.734 297.391 347.847 286.4 355.419 285.499C368.338 283.998 380.357 285.92 390.812 294.028C396.521 298.533 405.475 309.284 404.153 316.011V316.071Z" fill="#6D3511"/><path d="M404.152 316.073C403.672 318.415 405.655 320.758 401.268 319.917C397.963 319.316 395.8 316.133 392.675 315.112C383.541 311.989 370.802 308.986 361.247 308.385C353.976 307.905 338.713 310.668 334.567 309.947C332.524 309.586 332.344 307.845 331.562 306.583C356.14 301.478 381.258 307.364 404.152 316.133V316.073Z" fill="#DC8836"/><path d="M318.223 774.22C312.875 766.592 318.403 755.24 322.069 747.492C321.107 756.321 319.845 765.511 318.223 774.22Z" fill="#DC8836"/><path d="M423.261 871.517C423.021 874.4 417.793 874.4 417.553 871.517C419.476 871.577 421.399 871.457 423.261 871.517Z" fill="#DC8836"/><path d="M322.009 745.569C322.129 743.467 321.348 740.824 323.932 739.863C323.811 741.965 324.532 744.608 322.009 745.569Z" fill="#DC8836"/><path d="M488.221 881.129C488.522 888.637 478.426 888.697 474.881 883.952L488.221 881.129Z" fill="#DB8535"/></svg>`;
+
+// Picture icon (image/gallery with gradient)
+const pictureSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="130" y="130" width="764" height="764" rx="382" fill="url(#pictureGrad)"/><rect x="260" y="300" width="504" height="424" rx="24" fill="white"/><circle cx="380" cy="420" r="50" fill="#22c55e" fill-opacity="0.6"/><path d="M260 600L420 480L520 580L620 460L764 600V700C764 713.255 753.255 724 740 724H284C270.745 724 260 713.255 260 700V600Z" fill="#22c55e" fill-opacity="0.4"/><defs><linearGradient id="pictureGrad" x1="130" y1="130" x2="894" y2="894" gradientUnits="userSpaceOnUse"><stop stop-color="#22c55e"/><stop offset="1" stop-color="#16a34a"/></linearGradient></defs></svg>`;
+
+// Zitare icon (quote/inspiration with gradient)
+const zitareSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="130" y="130" width="764" height="764" rx="382" fill="url(#quoteGrad)"/><path d="M340 360C340 338.909 356.909 322 378 322H486C507.091 322 524 338.909 524 360V468C524 489.091 507.091 506 486 506H420L360 580V506H378C356.909 506 340 489.091 340 468V360Z" fill="white"/><path d="M500 440C500 418.909 516.909 402 538 402H646C667.091 402 684 418.909 684 440V548C684 569.091 667.091 586 646 586H580L520 660V586H538C516.909 586 500 569.091 500 548V440Z" fill="white" fill-opacity="0.7"/><rect x="300" y="680" width="424" height="16" rx="4" fill="white" fill-opacity="0.6"/><rect x="340" y="712" width="344" height="12" rx="3" fill="white" fill-opacity="0.4"/><defs><linearGradient id="quoteGrad" x1="130" y1="130" x2="894" y2="894" gradientUnits="userSpaceOnUse"><stop stop-color="#f59e0b"/><stop offset="1" stop-color="#d97706"/></linearGradient></defs></svg>`;
+
+// WiseKeep icon (wisdom/lightbulb with gradient)
+const wisekeepSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="130" y="130" width="764" height="764" rx="382" fill="url(#wiseGrad)"/><path d="M512 240C408.954 240 324 324.954 324 428C324 495.636 360.727 554.545 416 588.364V652C416 674.091 434.909 692 457 692H567C589.091 692 608 674.091 608 652V588.364C663.273 554.545 700 495.636 700 428C700 324.954 615.046 240 512 240Z" fill="white"/><rect x="432" y="720" width="160" height="24" rx="12" fill="white"/><rect x="456" y="760" width="112" height="20" rx="10" fill="white"/><path d="M512 340V500M432 420H592" stroke="#6366f1" stroke-width="24" stroke-linecap="round"/><defs><linearGradient id="wiseGrad" x1="130" y1="130" x2="894" y2="894" gradientUnits="userSpaceOnUse"><stop stop-color="#6366f1"/><stop offset="1" stop-color="#4f46e5"/></linearGradient></defs></svg>`;
+
+// Moodlit icon (colorful gradient circle)
+const moodlitSvg = `<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0)"><rect x="103" y="103" width="819" height="819" rx="409.5" fill="white"/><g filter="url(#filter0)"><circle cx="611" cy="250" r="314" fill="#D10000"/></g><g filter="url(#filter1)"><circle cx="231" cy="393" r="314" fill="#D17A00"/></g><g filter="url(#filter2)"><circle cx="735" cy="625" r="314" fill="#FFEA00"/></g><g filter="url(#filter3)"><circle cx="409" cy="844" r="314" fill="#0033FF"/></g></g><rect x="107" y="107" width="811" height="811" rx="405.5" stroke="white" stroke-opacity="0.2" stroke-width="8"/><defs><filter id="filter0" x="-2" y="-363" width="1226" height="1226" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="149" result="effect1"/></filter><filter id="filter1" x="-382" y="-220" width="1226" height="1226" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="149" result="effect1"/></filter><filter id="filter2" x="122" y="12" width="1226" height="1226" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="149" result="effect1"/></filter><filter id="filter3" x="-204" y="231" width="1226" height="1226" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="149" result="effect1"/></filter><clipPath id="clip0"><rect x="103" y="103" width="819" height="819" rx="409.5" fill="white"/></clipPath></defs></svg>`;
+
+/**
+ * App icons as data URLs
+ * Use these directly in <img src={APP_ICONS.memoro}> or CSS background-image
+ */
+export const APP_ICONS = {
+	memoro: svgToDataUrl(memoroSvg),
+	manacore: svgToDataUrl(manacoreSvg),
+	mana: svgToDataUrl(manaSvg),
+	chat: svgToDataUrl(chatSvg),
+	presi: svgToDataUrl(presiSvg),
+	manadeck: svgToDataUrl(manadeckSvg),
+	maerchenzauber: svgToDataUrl(maerchenzauberSvg),
+	picture: svgToDataUrl(pictureSvg),
+	zitare: svgToDataUrl(zitareSvg),
+	wisekeep: svgToDataUrl(wisekeepSvg),
+	moodlit: svgToDataUrl(moodlitSvg),
+} as const;
+
+export type AppIconId = keyof typeof APP_ICONS;
diff --git a/packages/shared-branding/src/index.ts b/packages/shared-branding/src/index.ts
index 7bbf34968..7bfdc345e 100644
--- a/packages/shared-branding/src/index.ts
+++ b/packages/shared-branding/src/index.ts
@@ -21,10 +21,26 @@ export {
 	StorytellerLogo,
 	UloadLogo,
 	ChatLogo,
+	PresiLogo,
 } from './logos';
 
 // Configuration
 export { APP_BRANDING, getAppBranding, getAllAppBrandings } from './config';
 
+// App Icons (SVG data URLs)
+export { APP_ICONS, type AppIconId } from './app-icons';
+
+// Mana Apps Configuration
+export {
+	MANA_APPS,
+	getManaApp,
+	getManaAppsByStatus,
+	getAvailableManaApps,
+	APP_STATUS_LABELS,
+	APP_SLIDER_LABELS,
+	type ManaApp,
+	type AppStatus,
+} from './mana-apps';
+
 // Types
 export type { AppId, AppBranding, LogoProps, AppLogoWithNameProps } from './types';
diff --git a/packages/shared-branding/src/mana-apps.ts b/packages/shared-branding/src/mana-apps.ts
new file mode 100644
index 000000000..59ed6cb61
--- /dev/null
+++ b/packages/shared-branding/src/mana-apps.ts
@@ -0,0 +1,216 @@
+/**
+ * Central configuration for all Mana ecosystem apps
+ * This is the single source of truth for AppSlider components
+ */
+
+import { APP_ICONS, type AppIconId } from './app-icons';
+
+export type AppStatus = 'published' | 'beta' | 'development' | 'planning';
+
+export interface ManaApp {
+	id: AppIconId;
+	name: string;
+	description: {
+		de: string;
+		en: string;
+	};
+	longDescription: {
+		de: string;
+		en: string;
+	};
+	icon: string; // Data URL from APP_ICONS
+	color: string;
+	comingSoon: boolean;
+	status: AppStatus;
+	url?: string; // Optional URL for the app
+}
+
+/**
+ * All apps in the Mana ecosystem
+ * Order determines display order in AppSlider
+ */
+export const MANA_APPS: ManaApp[] = [
+	{
+		id: 'chat',
+		name: 'ManaChat',
+		description: {
+			de: 'KI Chat Assistent',
+			en: 'AI Chat Assistant',
+		},
+		longDescription: {
+			de: 'Dein intelligenter KI-Begleiter für Gespräche, Fragen und kreative Aufgaben.',
+			en: 'Your intelligent AI companion for conversations, questions, and creative tasks.',
+		},
+		icon: APP_ICONS.chat,
+		color: '#0ea5e9',
+		comingSoon: false,
+		status: 'beta',
+	},
+	{
+		id: 'memoro',
+		name: 'Memoro',
+		description: {
+			de: 'KI Sprachnotizen',
+			en: 'AI Voice Memos',
+		},
+		longDescription: {
+			de: 'Verwandle deine Sprachnotizen in organisiertes, durchsuchbares Wissen mit KI-gestützter Transkription.',
+			en: 'Transform your voice memos into organized, searchable knowledge with AI-powered transcription.',
+		},
+		icon: APP_ICONS.memoro,
+		color: '#f8d62b',
+		comingSoon: false,
+		status: 'published',
+	},
+	{
+		id: 'presi',
+		name: 'Presi',
+		description: {
+			de: 'Präsentations-Creator',
+			en: 'Presentation Creator',
+		},
+		longDescription: {
+			de: 'Erstelle beeindruckende Präsentationen mit KI-gestützten Design-Vorschlägen.',
+			en: 'Create stunning presentations with AI-powered design suggestions.',
+		},
+		icon: APP_ICONS.presi,
+		color: '#f97316',
+		comingSoon: false,
+		status: 'development',
+	},
+	{
+		id: 'manadeck',
+		name: 'ManaDeck',
+		description: {
+			de: 'KI Karteikarten',
+			en: 'AI Flashcards',
+		},
+		longDescription: {
+			de: 'Lerne intelligenter mit KI-generierten Karteikarten und Spaced Repetition.',
+			en: 'Learn smarter with AI-generated flashcards and spaced repetition.',
+		},
+		icon: APP_ICONS.manadeck,
+		color: '#8b5cf6',
+		comingSoon: true,
+		status: 'development',
+	},
+	{
+		id: 'maerchenzauber',
+		name: 'Märchenzauber',
+		description: {
+			de: 'KI Geschichten',
+			en: 'AI Stories',
+		},
+		longDescription: {
+			de: 'Erstelle magische, personalisierte Geschichten für Kinder mit KI-gestütztem Storytelling.',
+			en: 'Create magical, personalized stories for children with AI-powered storytelling.',
+		},
+		icon: APP_ICONS.maerchenzauber,
+		color: '#FF6B9D',
+		comingSoon: true,
+		status: 'beta',
+	},
+	{
+		id: 'picture',
+		name: 'ManaPicture',
+		description: {
+			de: 'KI Bildgenerierung',
+			en: 'AI Image Generation',
+		},
+		longDescription: {
+			de: 'Erschaffe einzigartige Bilder mit der Kraft künstlicher Intelligenz.',
+			en: 'Create unique images with the power of artificial intelligence.',
+		},
+		icon: APP_ICONS.picture,
+		color: '#22c55e',
+		comingSoon: true,
+		status: 'development',
+	},
+	{
+		id: 'zitare',
+		name: 'Zitare',
+		description: {
+			de: 'Tägliche Inspiration',
+			en: 'Daily Inspiration',
+		},
+		longDescription: {
+			de: 'Entdecke inspirierende Zitate und Weisheiten für jeden Tag.',
+			en: 'Discover inspiring quotes and wisdom for every day.',
+		},
+		icon: APP_ICONS.zitare,
+		color: '#f59e0b',
+		comingSoon: true,
+		status: 'development',
+	},
+	{
+		id: 'wisekeep',
+		name: 'WiseKeep',
+		description: {
+			de: 'KI Wissensextraktion',
+			en: 'AI Knowledge Extraction',
+		},
+		longDescription: {
+			de: 'Extrahiere Weisheiten und Erkenntnisse aus Videos und Texten.',
+			en: 'Extract wisdom and insights from videos and texts.',
+		},
+		icon: APP_ICONS.wisekeep,
+		color: '#6366f1',
+		comingSoon: true,
+		status: 'planning',
+	},
+];
+
+/**
+ * Get a specific app by ID
+ */
+export function getManaApp(id: AppIconId): ManaApp | undefined {
+	return MANA_APPS.find((app) => app.id === id);
+}
+
+/**
+ * Get apps filtered by status
+ */
+export function getManaAppsByStatus(status: AppStatus): ManaApp[] {
+	return MANA_APPS.filter((app) => app.status === status);
+}
+
+/**
+ * Get only published/available apps
+ */
+export function getAvailableManaApps(): ManaApp[] {
+	return MANA_APPS.filter((app) => !app.comingSoon);
+}
+
+/**
+ * Status labels in German and English
+ */
+export const APP_STATUS_LABELS = {
+	de: {
+		published: 'Live',
+		beta: 'Beta',
+		development: 'In Entwicklung',
+		planning: 'Geplant',
+	},
+	en: {
+		published: 'Live',
+		beta: 'Beta',
+		development: 'In Development',
+		planning: 'Planned',
+	},
+} as const;
+
+/**
+ * Common labels for AppSlider in German and English
+ */
+export const APP_SLIDER_LABELS = {
+	de: {
+		title: 'Teil des Mana Ecosystems',
+		comingSoon: 'Demnächst',
+		openApp: 'App öffnen',
+	},
+	en: {
+		title: 'Part of the Mana Ecosystem',
+		comingSoon: 'Coming Soon',
+		openApp: 'Open App',
+	},
+} as const;