diff --git a/.codex-input/stitch-dockdeck-canon-v1/stitch_dockdeck_premium_interface_system/dockdeck_dashboard_mobiel_definitief/code.html b/.codex-input/stitch-dockdeck-canon-v1/stitch_dockdeck_premium_interface_system/dockdeck_dashboard_mobiel_definitief/code.html
deleted file mode 100644
index b5eae728..00000000
--- a/.codex-input/stitch-dockdeck-canon-v1/stitch_dockdeck_premium_interface_system/dockdeck_dashboard_mobiel_definitief/code.html
+++ /dev/null
@@ -1,350 +0,0 @@
-<!DOCTYPE html>
-
-<html class="dark" lang="nl"><head>
-<meta charset="utf-8"/>
-<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
-<title>DockDeck | Mobile Dashboard</title>
-<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
-<link href="https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&amp;family=Inter:wght@400;500;600&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
-<style>
-        :root {
-            --glass-bg: rgba(15, 23, 42, 0.6);
-            --glass-border: rgba(30, 41, 59, 0.5);
-        }
-        body {
-            background-color: #0b1326;
-            color: #dbe2fd;
-            font-family: 'Inter', sans-serif;
-            -webkit-tap-highlight-color: transparent;
-        }
-        .glass-panel {
-            background: var(--glass-bg);
-            backdrop-filter: blur(12px);
-            -webkit-backdrop-filter: blur(12px);
-            border: 1px solid var(--glass-border);
-        }
-        .active-dot {
-            width: 8px;
-            height: 8px;
-            border-radius: 50%;
-            background-color: #4edea3;
-            box-shadow: 0 0 8px #4edea3;
-            animation: pulse 2s infinite;
-        }
-        @keyframes pulse {
-            0% { transform: scale(0.95); opacity: 0.8; }
-            50% { transform: scale(1.1); opacity: 1; }
-            100% { transform: scale(0.95); opacity: 0.8; }
-        }
-        .safe-area-bottom {
-            padding-bottom: env(safe-area-inset-bottom);
-        }
-        .no-scrollbar::-webkit-scrollbar {
-            display: none;
-        }
-    </style>
-<script id="tailwind-config">
-        tailwind.config = {
-          darkMode: "class",
-          theme: {
-            extend: {
-              "colors": {
-                      "on-error-container": "#ffdad6",
-                      "surface-glass": "rgba(15, 23, 42, 0.6)",
-                      "on-surface": "#dbe2fd",
-                      "inverse-surface": "#dbe2fd",
-                      "background": "#0b1326",
-                      "surface-dim": "#0b1326",
-                      "on-primary": "#292b5e",
-                      "surface": "#0b1326",
-                      "on-tertiary": "#4f2500",
-                      "on-tertiary-fixed-variant": "#703700",
-                      "surface-container-highest": "#2d3449",
-                      "on-secondary": "#003824",
-                      "on-primary-fixed": "#131449",
-                      "tertiary": "#ffb783",
-                      "on-error": "#690005",
-                      "inverse-primary": "#585990",
-                      "primary-fixed": "#e1e0ff",
-                      "outline": "#908fa0",
-                      "secondary": "#4edea3",
-                      "secondary-fixed-dim": "#4edea3",
-                      "error": "#ffb4ab",
-                      "inverse-on-surface": "#283044",
-                      "outline-variant": "rgba(30, 41, 59, 0.5)",
-                      "primary-fixed-dim": "#c0c1ff",
-                      "error-container": "#93000a",
-                      "tertiary-container": "#d97721",
-                      "status-degraded": "#ffb783",
-                      "secondary-fixed": "#6ffbbe",
-                      "on-secondary-fixed-variant": "#005236",
-                      "surface-container-lowest": "#060d20",
-                      "primary-container": "#8a8cc6",
-                      "tertiary-fixed": "#ffdcc5",
-                      "surface-container": "#171f33",
-                      "on-primary-fixed-variant": "#404176",
-                      "on-secondary-fixed": "#002114",
-                      "on-secondary-container": "#003e28",
-                      "surface-variant": "#2d3449",
-                      "on-surface-variant": "#c7c4d7",
-                      "surface-bright": "#31394e",
-                      "primary": "#c0c1ff",
-                      "surface-container-high": "#222a3e",
-                      "on-background": "#dbe2fd",
-                      "surface-container-low": "#131b2e",
-                      "tertiary-fixed-dim": "#ffb783",
-                      "on-tertiary-container": "#452000",
-                      "secondary-container": "#00b47d",
-                      "status-online": "#4edea3",
-                      "on-primary-container": "#222457",
-                      "status-offline": "#ffb4ab",
-                      "surface-tint": "#c0c1ff",
-                      "on-tertiary-fixed": "#301400"
-              },
-              "borderRadius": {
-                      "DEFAULT": "0.25rem",
-                      "lg": "0.5rem",
-                      "xl": "0.75rem",
-                      "full": "9999px"
-              },
-              "spacing": {
-                      "stack-lg": "48px",
-                      "margin-mobile": "16px",
-                      "base": "8px",
-                      "stack-sm": "12px",
-                      "stack-md": "24px",
-                      "container-max": "1440px",
-                      "margin-desktop": "40px",
-                      "gutter": "24px"
-              },
-              "fontFamily": {
-                      "headline-md": ["Geist"],
-                      "body-lg": ["Inter"],
-                      "display-lg": ["Geist"],
-                      "label-md": ["Geist"],
-                      "headline-lg": ["Geist"],
-                      "body-md": ["Inter"],
-                      "headline-lg-mobile": ["Geist"],
-                      "code-sm": ["Geist"]
-              },
-              "fontSize": {
-                      "headline-md": ["24px", {"lineHeight": "32px", "fontWeight": "500"}],
-                      "body-lg": ["18px", {"lineHeight": "28px", "fontWeight": "400"}],
-                      "display-lg": ["48px", {"lineHeight": "56px", "letterSpacing": "-0.02em", "fontWeight": "600"}],
-                      "label-md": ["14px", {"lineHeight": "20px", "letterSpacing": "0.02em", "fontWeight": "500"}],
-                      "headline-lg": ["32px", {"lineHeight": "40px", "letterSpacing": "-0.01em", "fontWeight": "600"}],
-                      "body-md": ["16px", {"lineHeight": "24px", "fontWeight": "400"}],
-                      "headline-lg-mobile": ["24px", {"lineHeight": "32px", "fontWeight": "600"}],
-                      "code-sm": ["13px", {"lineHeight": "18px", "fontWeight": "400"}]
-              }
-            },
-          },
-        }
-      </script>
-<style>
-    body {
-      min-height: max(884px, 100dvh);
-    }
-  </style>
-</head>
-<body class="flex flex-col min-h-screen">
-<!-- Top Bar Component -->
-<header class="fixed top-0 w-full z-50 glass-panel shadow-sm h-16 flex justify-between items-center px-gutter">
-<div class="flex items-center gap-2">
-<span class="font-headline-md text-headline-md font-bold text-primary">DockDeck</span>
-</div>
-<div class="flex items-center gap-stack-sm">
-<button class="w-10 h-10 flex items-center justify-center rounded-full hover:bg-surface-variant/50 transition-colors active:scale-95">
-<span class="material-symbols-outlined text-on-surface-variant">account_circle</span>
-</button>
-</div>
-</header>
-<!-- Main Content Canvas -->
-<main class="flex-1 mt-16 px-margin-mobile pb-32 pt-stack-sm overflow-x-hidden">
-<!-- Search Section -->
-<section class="mb-stack-md">
-<div class="relative group">
-<div class="absolute inset-y-0 left-4 flex items-center pointer-events-none">
-<span class="material-symbols-outlined text-on-surface-variant">search</span>
-</div>
-<input class="w-full h-14 bg-surface-container-low border-none rounded-xl pl-12 pr-4 text-on-surface placeholder:text-on-surface-variant focus:ring-2 focus:ring-primary-container transition-all text-body-md" placeholder="Snel zoeken naar apps..." type="text"/>
-</div>
-</section>
-<!-- Status Overview (Subtle) -->
-<section class="mb-stack-md flex gap-stack-sm overflow-x-auto no-scrollbar">
-<div class="glass-panel px-4 py-3 rounded-xl flex items-center gap-3 shrink-0">
-<div class="active-dot"></div>
-<span class="font-label-md text-label-md text-on-surface">Server Online</span>
-</div>
-<div class="glass-panel px-4 py-3 rounded-xl flex items-center gap-3 shrink-0 border-outline-variant/30">
-<span class="material-symbols-outlined text-secondary scale-75">layers</span>
-<span class="font-label-md text-label-md text-on-surface">12 Containers</span>
-</div>
-</section>
-<!-- Favorites (Bento Style) -->
-<section class="mb-stack-md">
-<h2 class="font-headline-md text-headline-md mb-stack-sm px-1 text-primary">Favorieten</h2>
-<div class="grid grid-cols-2 gap-4">
-<!-- App Tile 1 -->
-<div class="glass-panel p-4 rounded-xl relative group active:scale-95 transition-transform">
-<div class="w-12 h-12 rounded-xl bg-primary-container/20 flex items-center justify-center mb-4">
-<span class="material-symbols-outlined text-primary text-3xl">terminal</span>
-</div>
-<span class="font-label-md text-label-md block text-on-surface mb-1">Terminal</span>
-<span class="text-[10px] text-on-surface-variant uppercase tracking-wider font-bold">In gebruik</span>
-<div class="absolute top-4 right-4">
-<div class="active-dot"></div>
-</div>
-</div>
-<!-- App Tile 2 -->
-<div class="glass-panel p-4 rounded-xl relative group active:scale-95 transition-transform">
-<div class="w-12 h-12 rounded-xl bg-secondary-container/20 flex items-center justify-center mb-4">
-<span class="material-symbols-outlined text-secondary text-3xl">storage</span>
-</div>
-<span class="font-label-md text-label-md block text-on-surface mb-1">Nextcloud</span>
-<span class="text-[10px] text-on-surface-variant uppercase tracking-wider font-bold">Actief</span>
-<div class="absolute top-4 right-4">
-<div class="active-dot"></div>
-</div>
-</div>
-<!-- Long Tile -->
-<div class="col-span-2 glass-panel p-4 rounded-xl flex items-center gap-4 active:scale-[0.98] transition-transform">
-<div class="w-14 h-14 rounded-xl bg-tertiary-container/20 flex items-center justify-center shrink-0">
-<span class="material-symbols-outlined text-tertiary text-4xl">dns</span>
-</div>
-<div class="flex-1">
-<span class="font-label-md text-label-md block text-on-surface">Pi-Hole AdBlocker</span>
-<div class="flex items-center gap-2 mt-1">
-<span class="text-[11px] text-on-surface-variant">2.4k Verzoeken geblokkeerd</span>
-</div>
-</div>
-<span class="material-symbols-outlined text-on-surface-variant">chevron_right</span>
-</div>
-</div>
-</section>
-<!-- Categories / All Apps Grid -->
-<section class="mb-stack-md">
-<div class="flex justify-between items-center mb-stack-sm px-1">
-<h2 class="font-headline-md text-headline-md text-primary">Alle Apps</h2>
-<button class="text-secondary font-label-md text-label-md">Bekijk alles</button>
-</div>
-<div class="grid grid-cols-4 gap-3">
-<!-- Compact App Icons -->
-<div class="flex flex-col items-center gap-2">
-<div class="w-14 h-14 glass-panel rounded-2xl flex items-center justify-center active:scale-90 transition-transform">
-<span class="material-symbols-outlined text-on-surface">movie</span>
-</div>
-<span class="text-[11px] font-medium text-on-surface-variant text-center">Plex</span>
-</div>
-<div class="flex flex-col items-center gap-2">
-<div class="w-14 h-14 glass-panel rounded-2xl flex items-center justify-center active:scale-90 transition-transform">
-<span class="material-symbols-outlined text-on-surface">monitoring</span>
-</div>
-<span class="text-[11px] font-medium text-on-surface-variant text-center">Grafana</span>
-</div>
-<div class="flex flex-col items-center gap-2">
-<div class="w-14 h-14 glass-panel rounded-2xl flex items-center justify-center active:scale-90 transition-transform">
-<span class="material-symbols-outlined text-on-surface">database</span>
-</div>
-<span class="text-[11px] font-medium text-on-surface-variant text-center">MariaDB</span>
-</div>
-<div class="flex flex-col items-center gap-2">
-<div class="w-14 h-14 glass-panel rounded-2xl flex items-center justify-center active:scale-90 transition-transform">
-<span class="material-symbols-outlined text-on-surface">hub</span>
-</div>
-<span class="text-[11px] font-medium text-on-surface-variant text-center">HomeAssistant</span>
-</div>
-<div class="flex flex-col items-center gap-2">
-<div class="w-14 h-14 glass-panel rounded-2xl flex items-center justify-center active:scale-90 transition-transform">
-<span class="material-symbols-outlined text-on-surface">shield</span>
-</div>
-<span class="text-[11px] font-medium text-on-surface-variant text-center">Authelia</span>
-</div>
-<div class="flex flex-col items-center gap-2">
-<div class="w-14 h-14 glass-panel rounded-2xl flex items-center justify-center active:scale-90 transition-transform">
-<span class="material-symbols-outlined text-on-surface">vpn_key</span>
-</div>
-<span class="text-[11px] font-medium text-on-surface-variant text-center">Tailscale</span>
-</div>
-<div class="flex flex-col items-center gap-2">
-<div class="w-14 h-14 glass-panel rounded-2xl flex items-center justify-center active:scale-90 transition-transform">
-<span class="material-symbols-outlined text-on-surface">cloud_sync</span>
-</div>
-<span class="text-[11px] font-medium text-on-surface-variant text-center">Sync</span>
-</div>
-<div class="flex flex-col items-center gap-2">
-<div class="w-14 h-14 glass-panel rounded-2xl flex items-center justify-center active:scale-90 transition-transform border-dashed border-primary/30">
-<span class="material-symbols-outlined text-primary">add</span>
-</div>
-<span class="text-[11px] font-medium text-on-surface-variant text-center">Nieuw</span>
-</div>
-</div>
-</section>
-<!-- Quick Actions Banner -->
-<section class="mb-4">
-<div class="relative w-full h-32 rounded-2xl overflow-hidden glass-panel flex items-center px-6">
-<div class="absolute inset-0 z-0 opacity-20">
-
-</div>
-<div class="relative z-10">
-<h3 class="font-headline-md text-headline-md text-on-surface">Server Update</h3>
-<p class="text-body-md text-on-surface-variant mb-2">v2.4.1 is nu beschikbaar</p>
-<button class="bg-primary text-on-primary px-4 py-1.5 rounded-lg font-label-md text-label-md transition-all active:scale-95">Update Nu</button>
-</div>
-</div>
-</section>
-</main>
-<!-- Bottom Navigation Bar -->
-<nav class="fixed bottom-0 w-full z-50 glass-panel border-t border-outline-variant/10 md:hidden safe-area-bottom">
-<div class="flex justify-around items-center h-16 px-gutter">
-<!-- Nav Item: Dashboard (Active) -->
-<a class="flex flex-col items-center justify-center gap-1 text-secondary font-bold active:scale-95 transition-all" href="#">
-<span class="material-symbols-outlined" style="font-variation-settings: 'FILL' 1;">dashboard</span>
-<span class="font-label-md text-[10px]">Dashboard</span>
-</a>
-<!-- Nav Item: Categorieën -->
-<a class="flex flex-col items-center justify-center gap-1 text-on-surface-variant hover:text-on-surface active:scale-95 transition-all" href="#">
-<span class="material-symbols-outlined">grid_view</span>
-<span class="font-label-md text-[10px]">Categorieën</span>
-</a>
-<!-- Nav Item: Statistieken (Implicit/Small) -->
-<a class="flex flex-col items-center justify-center gap-1 text-on-surface-variant hover:text-on-surface active:scale-95 transition-all" href="#">
-<span class="material-symbols-outlined">analytics</span>
-<span class="font-label-md text-[10px]">Status</span>
-</a>
-<!-- Nav Item: Instellingen -->
-<a class="flex flex-col items-center justify-center gap-1 text-on-surface-variant hover:text-on-surface active:scale-95 transition-all" href="#">
-<span class="material-symbols-outlined">settings</span>
-<span class="font-label-md text-[10px]">Instellingen</span>
-</a>
-</div>
-</nav>
-<!-- Micro-interaction Script -->
-<script>
-        document.addEventListener('DOMContentLoaded', () => {
-            const inputs = document.querySelectorAll('input');
-            inputs.forEach(input => {
-                input.addEventListener('focus', () => {
-                    // Slight vibration effect on mobile if supported
-                    if ('vibrate' in navigator) {
-                        navigator.vibrate(5);
-                    }
-                });
-            });
-
-            // Smooth appear animation for cards
-            const cards = document.querySelectorAll('.glass-panel');
-            cards.forEach((card, index) => {
-                card.style.opacity = '0';
-                card.style.transform = 'translateY(10px)';
-                setTimeout(() => {
-                    card.style.transition = 'all 0.4s ease-out';
-                    card.style.opacity = '1';
-                    card.style.transform = 'translateY(0)';
-                }, index * 40);
-            });
-        });
-    </script>
-</body></html>
\ No newline at end of file
