diff --git a/.codex-input/stitch-dockdeck-canon-v1/stitch_dockdeck_premium_interface_system/instellingen_integraties/code.html b/.codex-input/stitch-dockdeck-canon-v1/stitch_dockdeck_premium_interface_system/instellingen_integraties/code.html
deleted file mode 100644
index 4688fb10..00000000
--- a/.codex-input/stitch-dockdeck-canon-v1/stitch_dockdeck_premium_interface_system/instellingen_integraties/code.html
+++ /dev/null
@@ -1,369 +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"/>
-<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
-<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500&amp;family=Geist:wght@400;500;600;700&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"/>
-<script id="tailwind-config">
-      tailwind.config = {
-        darkMode: "class",
-        theme: {
-          extend: {
-            "colors": {
-                    "primary-container": "#8083ff",
-                    "surface-container-lowest": "#060e20",
-                    "on-primary-fixed": "#07006c",
-                    "on-primary-container": "#0d0096",
-                    "inverse-primary": "#494bd6",
-                    "tertiary": "#ffb783",
-                    "secondary-fixed-dim": "#4edea3",
-                    "surface-container-highest": "#2d3449",
-                    "secondary-container": "#00a572",
-                    "primary-fixed-dim": "#c0c1ff",
-                    "on-primary-fixed-variant": "#2f2ebe",
-                    "tertiary-fixed-dim": "#ffb783",
-                    "surface-tint": "#c0c1ff",
-                    "on-surface": "#dae2fd",
-                    "tertiary-fixed": "#ffdcc5",
-                    "tertiary-container": "#d97721",
-                    "surface-dim": "#0b1326",
-                    "error-container": "#93000a",
-                    "on-secondary-fixed": "#002113",
-                    "surface-container-high": "#222a3d",
-                    "primary-fixed": "#e1e0ff",
-                    "outline": "#908fa0",
-                    "background": "#0b1326",
-                    "on-secondary-container": "#00311f",
-                    "on-error": "#690005",
-                    "surface-container": "#171f33",
-                    "surface-bright": "#31394d",
-                    "surface": "#0b1326",
-                    "primary": "#c0c1ff",
-                    "on-secondary": "#003824",
-                    "on-error-container": "#ffdad6",
-                    "on-primary": "#1000a9",
-                    "inverse-on-surface": "#283044",
-                    "surface-variant": "#2d3449",
-                    "secondary": "#4edea3",
-                    "outline-variant": "#464554",
-                    "secondary-fixed": "#6ffbbe",
-                    "inverse-surface": "#dae2fd",
-                    "on-tertiary-container": "#452000",
-                    "surface-container-low": "#131b2e",
-                    "on-tertiary-fixed-variant": "#703700",
-                    "on-tertiary-fixed": "#301400",
-                    "on-background": "#dae2fd",
-                    "on-surface-variant": "#c7c4d7",
-                    "on-secondary-fixed-variant": "#005236",
-                    "error": "#ffb4ab",
-                    "on-tertiary": "#4f2500"
-            },
-            "borderRadius": {
-                    "DEFAULT": "0.25rem",
-                    "lg": "0.5rem",
-                    "xl": "0.75rem",
-                    "full": "9999px"
-            },
-            "spacing": {
-                    "stack-md": "24px",
-                    "stack-sm": "12px",
-                    "container-max": "1440px",
-                    "stack-lg": "48px",
-                    "margin-desktop": "40px",
-                    "gutter": "24px",
-                    "margin-mobile": "16px",
-                    "base": "8px"
-            },
-            "fontFamily": {
-                    "headline-lg": ["Geist"],
-                    "body-md": ["Inter"],
-                    "headline-md": ["Geist"],
-                    "display-lg": ["Geist"],
-                    "body-lg": ["Inter"],
-                    "code-sm": ["Geist"],
-                    "label-md": ["Geist"],
-                    "headline-lg-mobile": ["Geist"]
-            },
-            "fontSize": {
-                    "headline-lg": ["32px", {"lineHeight": "40px", "letterSpacing": "-0.01em", "fontWeight": "600"}],
-                    "body-md": ["16px", {"lineHeight": "24px", "fontWeight": "400"}],
-                    "headline-md": ["24px", {"lineHeight": "32px", "fontWeight": "500"}],
-                    "display-lg": ["48px", {"lineHeight": "56px", "letterSpacing": "-0.02em", "fontWeight": "600"}],
-                    "body-lg": ["18px", {"lineHeight": "28px", "fontWeight": "400"}],
-                    "code-sm": ["13px", {"lineHeight": "18px", "fontWeight": "400"}],
-                    "label-md": ["14px", {"lineHeight": "20px", "letterSpacing": "0.02em", "fontWeight": "500"}],
-                    "headline-lg-mobile": ["24px", {"lineHeight": "32px", "fontWeight": "600"}]
-            }
-          },
-        },
-      }
-    </script>
-<style>
-        body {
-            background-color: #0b1326;
-            color: #dae2fd;
-            -webkit-font-smoothing: antialiased;
-        }
-        .material-symbols-outlined {
-            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
-        }
-        .status-pulse {
-            animation: pulse-ring 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
-        }
-        @keyframes pulse-ring {
-            0%, 100% { opacity: 1; transform: scale(1); }
-            50% { opacity: .5; transform: scale(1.1); }
-        }
-        .glass-header {
-            background: rgba(11, 19, 38, 0.8);
-            backdrop-filter: blur(12px);
-        }
-        .custom-toggle:checked + .toggle-dot {
-            transform: translateX(100%);
-            background-color: #4edea3;
-        }
-    </style>
-</head>
-<body class="font-body-md text-body-md overflow-x-hidden">
-<!-- TopNavBar Shell -->
-<nav class="fixed top-0 left-0 w-full z-50 flex justify-between items-center px-margin-desktop h-16 bg-surface-dim/80 backdrop-blur-md border-b border-outline-variant">
-<div class="flex items-center gap-8">
-<span class="font-headline-md text-headline-md font-bold text-primary">DockDeck</span>
-<div class="hidden md:flex gap-6 items-center">
-<a class="font-body-md text-body-md text-on-surface-variant hover:text-primary transition-colors duration-200" href="#">Dashboard</a>
-<a class="font-body-md text-body-md text-on-surface-variant hover:text-primary transition-colors duration-200" href="#">Logs</a>
-<a class="font-body-md text-body-md text-on-surface-variant hover:text-primary transition-colors duration-200" href="#">Console</a>
-</div>
-</div>
-<div class="flex items-center gap-4">
-<button class="material-symbols-outlined text-on-surface-variant hover:text-primary transition-all active:scale-95" data-icon="search"></button>
-<button class="material-symbols-outlined text-on-surface-variant hover:text-primary transition-all active:scale-95" data-icon="notifications"></button>
-<button class="material-symbols-outlined text-primary border-b-2 border-primary pb-1" data-icon="settings"></button>
-<div class="w-8 h-8 rounded-full bg-surface-container-highest overflow-hidden border border-outline-variant">
-<img class="w-full h-full object-cover" data-alt="A sophisticated professional profile portrait of a high-tech system administrator in a dark, minimalist office. The aesthetic is tech-noir with soft cyan backlighting against a deep navy background, reflecting the premium modernist UI of DockDeck. Sharp focus, professional lighting, cinematic quality." src="https://lh3.googleusercontent.com/aida-public/AB6AXuAERNdVdFy38jIV84LSdSXVOpwxDjCOhBtJUMIGaFwr7O-3ynupe-V9jdk3bokkTSCzVyExOifaFppYaS1cRDeU9-wmGnmQ59Yw5cMUJEDQ3dqSJDDmH9JcCVgSUaZ2RC98-TP3hG1AO5OclQExS7s_Nv4dmoCahmVidGuSBCqCE8rVcITVLzHa0Tx0sW2Oi1IJZPA5CYnJdZYFylsRdfbyXqJrEYLbnLTNWcyjwTjQ5ZylBWLNG11FrR-6WMT4XY6-DUr0SYaMdtTE"/>
-</div>
-</div>
-</nav>
-<!-- SideNavBar Shell -->
-<aside class="fixed left-0 top-16 bottom-0 w-64 flex flex-col p-4 bg-surface-container-low border-r border-outline-variant hidden md:flex">
-<div class="mb-8 px-2 flex items-center gap-3">
-<div class="w-10 h-10 rounded-lg bg-primary-container/20 flex items-center justify-center text-primary">
-<span class="material-symbols-outlined" data-icon="hub" style="font-variation-settings: 'FILL' 1;"></span>
-</div>
-<div>
-<p class="font-headline-md text-label-md font-bold text-primary">Unraid Engine</p>
-<p class="text-[10px] uppercase tracking-wider text-on-surface-variant">6.12.4 - Stable</p>
-</div>
-</div>
-<div class="flex-1 space-y-1">
-<a class="flex items-center gap-3 px-3 py-2 text-on-surface-variant hover:bg-surface-container-highest hover:text-on-surface transition-all rounded-lg font-label-md text-label-md" href="#">
-<span class="material-symbols-outlined" data-icon="dashboard"></span> Overview
-            </a>
-<a class="flex items-center gap-3 px-3 py-2 text-on-surface-variant hover:bg-surface-container-highest hover:text-on-surface transition-all rounded-lg font-label-md text-label-md" href="#">
-<span class="material-symbols-outlined" data-icon="memory"></span> System
-            </a>
-<a class="flex items-center gap-3 px-3 py-2 text-on-surface-variant hover:bg-surface-container-highest hover:text-on-surface transition-all rounded-lg font-label-md text-label-md" href="#">
-<span class="material-symbols-outlined" data-icon="lan"></span> Network
-            </a>
-<a class="flex items-center gap-3 px-3 py-2 text-on-surface-variant hover:bg-surface-container-highest hover:text-on-surface transition-all rounded-lg font-label-md text-label-md" href="#">
-<span class="material-symbols-outlined" data-icon="database"></span> Storage
-            </a>
-<a class="flex items-center gap-3 px-3 py-2 text-on-surface-variant hover:bg-surface-container-highest hover:text-on-surface transition-all rounded-lg font-label-md text-label-md" href="#">
-<span class="material-symbols-outlined" data-icon="backup"></span> Backups
-            </a>
-<a class="flex items-center gap-3 px-3 py-2 bg-primary-container text-on-primary-container rounded-lg font-label-md text-label-md active:translate-x-1 transition-transform" href="#">
-<span class="material-symbols-outlined" data-icon="hub"></span> Registry
-            </a>
-</div>
-<div class="pt-4 border-t border-outline-variant space-y-1 mt-auto">
-<a class="flex items-center gap-3 px-3 py-2 text-on-surface-variant hover:bg-surface-container-highest hover:text-on-surface transition-all rounded-lg font-label-md text-label-md" href="#">
-<span class="material-symbols-outlined" data-icon="help"></span> Documentation
-            </a>
-<a class="flex items-center gap-3 px-3 py-2 text-on-surface-variant hover:bg-surface-container-highest hover:text-on-surface transition-all rounded-lg font-label-md text-label-md" href="#">
-<span class="material-symbols-outlined" data-icon="chat_bubble"></span> Support
-            </a>
-</div>
-</aside>
-<!-- Main Content Canvas -->
-<main class="md:ml-64 pt-24 px-margin-mobile md:px-margin-desktop pb-12 max-w-container-max mx-auto">
-<header class="mb-stack-lg">
-<div class="flex items-center gap-2 text-on-surface-variant mb-2">
-<span class="material-symbols-outlined text-[18px]" data-icon="settings"></span>
-<span class="font-label-md text-label-md uppercase tracking-widest">Instellingen</span>
-</div>
-<h1 class="font-headline-lg text-headline-lg text-on-surface">Integraties</h1>
-<p class="font-body-md text-body-md text-on-surface-variant max-w-2xl mt-2">
-                Beheer de verbindingen tussen DockDeck en je server-infrastructuur. Zorg voor een actieve sync om realtime statistieken en container-beheer mogelijk te maken.
-            </p>
-</header>
-<div class="grid gap-gutter">
-<!-- Integration List -->
-<section class="space-y-4">
-<!-- Integration Card: Unraid -->
-<div class="bg-surface-container-low border border-outline-variant rounded-xl p-6 hover:shadow-lg transition-all group">
-<div class="flex flex-col md:flex-row md:items-center justify-between gap-6">
-<div class="flex items-start gap-4">
-<div class="w-12 h-12 rounded-xl bg-surface-container-highest flex items-center justify-center text-primary border border-outline-variant shrink-0">
-<span class="material-symbols-outlined text-[28px]" data-icon="dns" style="font-variation-settings: 'FILL' 1;"></span>
-</div>
-<div>
-<h3 class="font-headline-md text-headline-md text-on-surface">Unraid OS</h3>
-<p class="text-on-surface-variant font-body-md">Primaire server management interface en OS statistieken.</p>
-<div class="mt-2 flex items-center gap-4">
-<span class="inline-flex items-center gap-1.5 px-2 py-0.5 rounded-full bg-secondary/10 text-secondary text-[12px] font-medium border border-secondary/20">
-<span class="w-2 h-2 rounded-full bg-secondary status-pulse"></span>
-                                        Verbonden
-                                    </span>
-<span class="text-[12px] text-outline flex items-center gap-1">
-<span class="material-symbols-outlined text-[14px]" data-icon="sync"></span>
-                                        Laatste sync: 2 min geleden
-                                    </span>
-</div>
-</div>
-</div>
-<div class="flex items-center gap-3">
-<button class="px-4 py-2 rounded-lg border border-outline-variant text-on-surface hover:bg-surface-container-high transition-colors font-label-md text-label-md active:scale-95">
-                                Verbinding Testen
-                            </button>
-<button class="material-symbols-outlined p-2 text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high rounded-lg transition-all" data-icon="more_vert"></button>
-</div>
-</div>
-</div>
-<!-- Integration Card: Docker Socket Proxy -->
-<div class="bg-surface-container-low border border-outline-variant rounded-xl p-6 hover:shadow-lg transition-all">
-<div class="flex flex-col md:flex-row md:items-center justify-between gap-6">
-<div class="flex items-start gap-4">
-<div class="w-12 h-12 rounded-xl bg-surface-container-highest flex items-center justify-center text-primary border border-outline-variant shrink-0">
-<span class="material-symbols-outlined text-[28px]" data-icon="layers" style="font-variation-settings: 'FILL' 1;"></span>
-</div>
-<div>
-<h3 class="font-headline-md text-headline-md text-on-surface">Docker Socket Proxy</h3>
-<p class="text-on-surface-variant font-body-md">Beveiligde toegang tot de Docker API voor containerbeheer.</p>
-<div class="mt-2 flex items-center gap-4">
-<span class="inline-flex items-center gap-1.5 px-2 py-0.5 rounded-full bg-error/10 text-error text-[12px] font-medium border border-error/20">
-<span class="w-2 h-2 rounded-full bg-error"></span>
-                                        Fout
-                                    </span>
-<span class="text-[12px] text-error/60 flex items-center gap-1">
-<span class="material-symbols-outlined text-[14px]" data-icon="history"></span>
-                                        Time-out bij verbinding (14:32)
-                                    </span>
-</div>
-</div>
-</div>
-<div class="flex items-center gap-3">
-<button class="px-4 py-2 rounded-lg bg-primary text-on-primary hover:bg-primary-container transition-colors font-label-md text-label-md active:scale-95 shadow-md">
-                                Opnieuw Proberen
-                            </button>
-<button class="material-symbols-outlined p-2 text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high rounded-lg transition-all" data-icon="more_vert"></button>
-</div>
-</div>
-</div>
-<!-- Integration Card: Nginx Proxy Manager -->
-<div class="bg-surface-container-low border border-outline-variant rounded-xl p-6 hover:shadow-lg transition-all relative overflow-hidden">
-<div class="flex flex-col md:flex-row md:items-center justify-between gap-6 mb-6">
-<div class="flex items-start gap-4">
-<div class="w-12 h-12 rounded-xl bg-surface-container-highest flex items-center justify-center text-primary border border-outline-variant shrink-0">
-<span class="material-symbols-outlined text-[28px]" data-icon="swap_calls" style="font-variation-settings: 'FILL' 1;"></span>
-</div>
-<div>
-<h3 class="font-headline-md text-headline-md text-on-surface">Nginx Proxy Manager</h3>
-<p class="text-on-surface-variant font-body-md">Automatische SSL en Reverse Proxy routering voor je containers.</p>
-<div class="mt-2 flex items-center gap-4">
-<span class="inline-flex items-center gap-1.5 px-2 py-0.5 rounded-full bg-secondary/10 text-secondary text-[12px] font-medium border border-secondary/20">
-<span class="w-2 h-2 rounded-full bg-secondary status-pulse"></span>
-                                        Verbonden
-                                    </span>
-<span class="text-[12px] text-outline flex items-center gap-1">
-<span class="material-symbols-outlined text-[14px]" data-icon="sync"></span>
-                                        Laatste sync: Zojuist
-                                    </span>
-</div>
-</div>
-</div>
-<div class="flex items-center gap-3">
-<button class="px-4 py-2 rounded-lg border border-outline-variant text-on-surface hover:bg-surface-container-high transition-colors font-label-md text-label-md active:scale-95">
-                                Verbinding Testen
-                            </button>
-<button class="material-symbols-outlined p-2 text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high rounded-lg transition-all" data-icon="more_vert"></button>
-</div>
-</div>
-<!-- NPM Specific Toggle -->
-<div class="pt-4 border-t border-outline-variant flex items-center justify-between">
-<div class="flex items-center gap-2">
-<span class="material-symbols-outlined text-primary text-[20px]" data-icon="link"></span>
-<span class="font-label-md text-on-surface">Externe URL's activeren</span>
-<span class="material-symbols-outlined text-outline text-[16px] cursor-help" data-icon="info" title="Maakt containers bereikbaar via publieke domeinen geregistreerd in NPM."></span>
-</div>
-<label class="relative inline-flex items-center cursor-pointer">
-<input checked="" class="sr-only peer custom-toggle" type="checkbox"/>
-<div class="w-11 h-6 bg-surface-container-highest rounded-full peer peer-checked:bg-secondary/30 transition-all"></div>
-<div class="absolute left-1 top-1 w-4 h-4 bg-outline rounded-full transition-transform toggle-dot"></div>
-</label>
-</div>
-</div>
-</section>
-<!-- Bottom Action Grid -->
-<div class="grid grid-cols-1 md:grid-cols-2 gap-stack-md mt-stack-md">
-<div class="p-6 rounded-xl bg-surface-container-lowest border border-dashed border-outline-variant flex flex-col items-center justify-center text-center group cursor-pointer hover:border-primary transition-colors">
-<div class="w-12 h-12 rounded-full bg-surface-container-high flex items-center justify-center mb-4 group-hover:text-primary transition-colors">
-<span class="material-symbols-outlined text-[32px]" data-icon="add"></span>
-</div>
-<h4 class="font-headline-md text-label-md font-bold text-on-surface">Nieuwe Integratie Toevoegen</h4>
-<p class="text-on-surface-variant text-[12px] mt-1">Verbind met Home Assistant, Plex of Tautulli.</p>
-</div>
-<div class="p-6 rounded-xl bg-surface-container-lowest border border-outline-variant flex flex-col justify-between">
-<div>
-<h4 class="font-headline-md text-label-md font-bold text-on-surface">Systeem Status</h4>
-<p class="text-on-surface-variant text-[12px] mt-1">Global Health Check van alle verbindingen.</p>
-</div>
-<div class="flex items-center justify-between mt-4">
-<div class="flex -space-x-2">
-<div class="w-8 h-8 rounded-full bg-secondary border-2 border-surface-container-lowest flex items-center justify-center text-[10px] text-on-secondary font-bold">98%</div>
-<div class="w-8 h-8 rounded-full bg-surface-container-high border-2 border-surface-container-lowest flex items-center justify-center text-primary"><span class="material-symbols-outlined text-[14px]" data-icon="bolt"></span></div>
-</div>
-<a class="text-primary text-[12px] font-medium hover:underline" href="#">Bekijk Rapport →</a>
-</div>
-</div>
-</div>
-</div>
-</main>
-<!-- FAB Suppression: Contextually hidden as per rules for Settings screens -->
-<script>
-        // Micro-interaction for the toggle
-        document.querySelectorAll('.custom-toggle').forEach(toggle => {
-            toggle.addEventListener('change', function() {
-                const parent = this.closest('div');
-                if(this.checked) {
-                    console.log('Integratie optie geactiveerd');
-                } else {
-                    console.log('Integratie optie gedeactiveerd');
-                }
-            });
-        });
-
-        // Simulating a "Test Connection" loading state
-        document.querySelectorAll('button').forEach(btn => {
-            if(btn.innerText.includes('Testen')) {
-                btn.addEventListener('click', function() {
-                    const originalText = this.innerText;
-                    this.disabled = true;
-                    this.innerHTML = `<span class="flex items-center gap-2"><svg class="animate-spin h-4 w-4 text-primary" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg> Laden...</span>`;
-                    
-                    setTimeout(() => {
-                        this.disabled = false;
-                        this.innerText = "Succes!";
-                        this.classList.add('bg-secondary/20', 'text-secondary', 'border-secondary/30');
-                        setTimeout(() => {
-                            this.innerText = originalText;
-                            this.classList.remove('bg-secondary/20', 'text-secondary', 'border-secondary/30');
-                        }, 2000);
-                    }, 1500);
-                });
-            }
-        });
-    </script>
-</body></html>
\ No newline at end of file
