diff --git a/.codex-input/stitch-dockdeck-canon-v1/stitch_dockdeck_premium_interface_system/instellingen_integraties_definitief/code.html b/.codex-input/stitch-dockdeck-canon-v1/stitch_dockdeck_premium_interface_system/instellingen_integraties_definitief/code.html
deleted file mode 100644
index ed4deee5..00000000
--- a/.codex-input/stitch-dockdeck-canon-v1/stitch_dockdeck_premium_interface_system/instellingen_integraties_definitief/code.html
+++ /dev/null
@@ -1,424 +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 | Integratie-instellingen</title>
-<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
-<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&amp;family=Geist:wght@400;500;600;700;800&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>
-        body {
-            background-color: #0b1326;
-            color: #dbe2fd;
-            font-family: 'Inter', sans-serif;
-            overflow-x: hidden;
-        }
-
-        .glass-panel {
-            background: rgba(15, 23, 42, 0.6);
-            backdrop-filter: blur(12px);
-            -webkit-backdrop-filter: blur(12px);
-            border: 1px solid rgba(30, 41, 59, 0.5);
-            transition: all 0.2s ease-in-out;
-        }
-
-        .glass-panel:hover {
-            background: rgba(45, 52, 73, 0.5);
-            transform: translateY(-2px);
-        }
-
-        .active-dot {
-            width: 8px;
-            height: 8px;
-            border-radius: 50%;
-            background-color: #4edea3;
-            box-shadow: 0 0 8px #4edea3;
-        }
-
-        .active-dot.pulse {
-            animation: pulse-animation 2s infinite;
-        }
-
-        @keyframes pulse-animation {
-            0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(78, 222, 163, 0.7); }
-            70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(78, 222, 163, 0); }
-            100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(78, 222, 163, 0); }
-        }
-
-        .material-symbols-outlined {
-            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
-            vertical-align: middle;
-        }
-
-        /* Custom Switch */
-        .switch {
-            position: relative;
-            display: inline-block;
-            width: 44px;
-            height: 24px;
-        }
-
-        .switch input { opacity: 0; width: 0; height: 0; }
-
-        .slider {
-            position: absolute;
-            cursor: pointer;
-            top: 0; left: 0; right: 0; bottom: 0;
-            background-color: #2d3449;
-            transition: .4s;
-            border-radius: 24px;
-        }
-
-        .slider:before {
-            position: absolute;
-            content: "";
-            height: 18px; width: 18px;
-            left: 3px; bottom: 3px;
-            background-color: white;
-            transition: .4s;
-            border-radius: 50%;
-        }
-
-        input:checked + .slider { background-color: #00b47d; }
-        input:checked + .slider:before { transform: translateX(20px); }
-
-        .status-chip {
-            display: inline-flex;
-            align-items: center;
-            gap: 6px;
-            padding: 2px 10px;
-            border-radius: 9999px;
-            font-size: 12px;
-            font-weight: 500;
-            border: 1px solid rgba(78, 222, 163, 0.2);
-        }
-    </style>
-<script id="tailwind-config">
-        tailwind.config = {
-            darkMode: "class",
-            theme: {
-                extend: {
-                    "colors": {
-                        "surface-variant": "#2d3449",
-                        "on-primary": "#292b5e",
-                        "inverse-on-surface": "#283044",
-                        "surface": "#0b1326",
-                        "surface-container": "#171f33",
-                        "surface-bright": "#31394e",
-                        "on-secondary": "#003824",
-                        "on-error-container": "#ffdad6",
-                        "status-degraded": "#ffb783",
-                        "surface-glass": "rgba(15, 23, 42, 0.6)",
-                        "on-background": "#dbe2fd",
-                        "on-tertiary": "#4f2500",
-                        "status-online": "#4edea3",
-                        "inverse-surface": "#dbe2fd",
-                        "secondary-fixed": "#6ffbbe",
-                        "on-tertiary-fixed-variant": "#703700",
-                        "status-offline": "#ffb4ab",
-                        "outline-variant": "#464554",
-                        "on-primary-fixed": "#131449",
-                        "surface-container-high": "#222a3e",
-                        "primary-fixed": "#e1e0ff",
-                        "on-secondary-container": "#003e28",
-                        "outline": "#908fa0",
-                        "tertiary-fixed-dim": "#ffb783",
-                        "surface-tint": "#c0c1ff",
-                        "tertiary-fixed": "#ffdcc5",
-                        "error-container": "#93000a",
-                        "secondary": "#4edea3",
-                        "primary": "#c0c1ff",
-                        "on-surface-variant": "#c7c4d7",
-                        "on-tertiary-fixed": "#301400",
-                        "on-secondary-fixed-variant": "#005236",
-                        "error": "#ffb4ab",
-                        "surface-container-low": "#131b2e",
-                        "on-tertiary-container": "#452000",
-                        "tertiary": "#ffb783",
-                        "secondary-fixed-dim": "#4edea3",
-                        "surface-container-highest": "#2d3449",
-                        "secondary-container": "#00b47d",
-                        "primary-fixed-dim": "#c0c1ff",
-                        "on-primary-fixed-variant": "#404176",
-                        "primary-container": "#8a8cc6",
-                        "on-primary-container": "#222457",
-                        "inverse-primary": "#585990",
-                        "surface-container-lowest": "#060d20",
-                        "on-secondary-fixed": "#002114",
-                        "on-error": "#690005",
-                        "background": "#0b1326",
-                        "on-surface": "#dbe2fd",
-                        "tertiary-container": "#d97721",
-                        "surface-dim": "#0b1326"
-                    },
-                    "borderRadius": {
-                        "DEFAULT": "0.25rem",
-                        "lg": "0.5rem",
-                        "xl": "0.75rem",
-                        "full": "9999px"
-                    },
-                    "spacing": {
-                        "gutter": "24px",
-                        "stack-lg": "48px",
-                        "margin-desktop": "40px",
-                        "margin-mobile": "16px",
-                        "base": "8px",
-                        "stack-md": "24px",
-                        "container-max": "1440px",
-                        "stack-sm": "12px"
-                    },
-                    "fontFamily": {
-                        "label-md": ["Geist"],
-                        "headline-md": ["Geist"],
-                        "display-lg": ["Geist"],
-                        "body-lg": ["Inter"],
-                        "headline-lg": ["Geist"],
-                        "body-md": ["Inter"]
-                    }
-                }
-            }
-        }
-    </script>
-</head>
-<body class="bg-surface font-body-md text-on-surface">
-<!-- TopNavBar -->
-<header class="fixed top-0 w-full z-50 backdrop-blur-xl border-b border-outline-variant/20 bg-surface-glass shadow-sm flex justify-between items-center h-16 px-gutter">
-<div class="flex items-center gap-base">
-<span class="material-symbols-outlined text-primary text-3xl" style="font-variation-settings: 'FILL' 1;">developer_board</span>
-<h1 class="font-headline-md text-headline-md font-bold text-primary">DockDeck</h1>
-</div>
-<div class="hidden md:flex items-center gap-stack-md">
-<nav class="flex items-center gap-6">
-<a class="text-on-surface-variant hover:bg-surface-variant/50 transition-colors px-3 py-2 rounded-lg" href="#">Dashboard</a>
-<a class="text-on-surface-variant hover:bg-surface-variant/50 transition-colors px-3 py-2 rounded-lg" href="#">Containers</a>
-<a class="text-secondary font-bold px-3 py-2 rounded-lg" href="#">Integraties</a>
-</nav>
-<div class="h-6 w-[1px] bg-outline-variant/30"></div>
-<div class="flex items-center gap-stack-sm">
-<button class="material-symbols-outlined p-2 rounded-full hover:bg-surface-variant/50 transition-colors text-on-surface-variant">settings</button>
-<button class="material-symbols-outlined p-2 rounded-full hover:bg-surface-variant/50 transition-colors text-on-surface-variant">account_circle</button>
-</div>
-</div>
-</header>
-<!-- SideNavBar -->
-<aside class="fixed left-0 top-16 h-[calc(100vh-64px)] w-64 bg-surface-container-low border-r border-outline-variant/10 flex flex-col p-base gap-stack-sm hidden xl:flex">
-<div class="px-4 py-6">
-<div class="flex items-center gap-3">
-<div class="w-10 h-10 rounded-full bg-primary-container flex items-center justify-center text-on-primary-container">
-<span class="material-symbols-outlined" style="font-variation-settings: 'FILL' 1;">person</span>
-</div>
-<div>
-<p class="font-label-md text-label-md text-on-surface font-bold">Admin</p>
-<p class="text-[12px] text-on-surface-variant">Unraid Server</p>
-</div>
-</div>
-</div>
-<div class="space-y-1">
-<a class="flex items-center gap-3 px-4 py-3 text-on-surface-variant hover:bg-surface-bright/30 hover:translate-x-1 duration-200 transition-all rounded-lg" href="#">
-<span class="material-symbols-outlined">dashboard</span>
-<span class="font-label-md text-label-md">Dashboard</span>
-</a>
-<a class="flex items-center gap-3 px-4 py-3 text-on-surface-variant hover:bg-surface-bright/30 hover:translate-x-1 duration-200 transition-all rounded-lg" href="#">
-<span class="material-symbols-outlined">layers</span>
-<span class="font-label-md text-label-md">Containers</span>
-</a>
-<a class="flex items-center gap-3 px-4 py-3 text-on-surface-variant hover:bg-surface-bright/30 hover:translate-x-1 duration-200 transition-all rounded-lg" href="#">
-<span class="material-symbols-outlined">image</span>
-<span class="font-label-md text-label-md">Images</span>
-</a>
-<a class="flex items-center gap-3 px-4 py-3 bg-secondary-container text-on-secondary-container rounded-lg" href="#">
-<span class="material-symbols-outlined">settings_input_component</span>
-<span class="font-label-md text-label-md font-bold">Integraties</span>
-</a>
-</div>
-<div class="mt-auto space-y-1">
-<a class="flex items-center gap-3 px-4 py-3 text-on-surface-variant hover:bg-surface-bright/30 transition-all rounded-lg" href="#">
-<span class="material-symbols-outlined">description</span>
-<span class="font-label-md text-label-md">Docs</span>
-</a>
-<a class="flex items-center gap-3 px-4 py-3 text-on-surface-variant hover:bg-surface-bright/30 transition-all rounded-lg" href="#">
-<span class="material-symbols-outlined text-error">logout</span>
-<span class="font-label-md text-label-md">Logout</span>
-</a>
-</div>
-</aside>
-<!-- Main Content -->
-<main class="xl:ml-64 pt-24 pb-12 px-6 md:px-12 max-w-7xl mx-auto">
-<!-- Page Header -->
-<div class="mb-12">
-<h2 class="font-headline-lg text-headline-lg text-on-surface mb-2">Integratie-instellingen</h2>
-<p class="text-on-surface-variant font-body-md max-w-2xl">
-                Beheer de kernverbindingen van je DockDeck-omgeving. Deze pagina configureert hoe DockDeck communiceert met je host-systeem en netwerklaag.
-            </p>
-</div>
-<!-- Bento Grid for Integrations -->
-<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-<!-- Unraid Metadata Panel -->
-<div class="glass-panel rounded-xl p-6 flex flex-col gap-6 relative overflow-hidden">
-<div class="flex justify-between items-start">
-<div class="w-12 h-12 bg-primary/10 rounded-xl flex items-center justify-center">
-<span class="material-symbols-outlined text-primary text-3xl" style="font-variation-settings: 'FILL' 1;">info</span>
-</div>
-<div class="status-chip text-status-online">
-<div class="active-dot pulse"></div>
-<span>Verbonden</span>
-</div>
-</div>
-<div>
-<h3 class="font-headline-md text-headline-md text-on-surface mb-1">Unraid Metadata</h3>
-<p class="text-sm text-on-surface-variant italic">Leest automatisch systeem-informatie uit de Unraid OS API.</p>
-</div>
-<div class="space-y-3 bg-surface-container-low/50 p-4 rounded-lg border border-outline-variant/10">
-<div class="flex justify-between text-xs">
-<span class="text-outline">CPU-Model</span>
-<span class="text-on-surface font-mono">Intel Core i7-10700K</span>
-</div>
-<div class="flex justify-between text-xs">
-<span class="text-outline">OS Versie</span>
-<span class="text-on-surface font-mono">6.12.4</span>
-</div>
-<div class="flex justify-between text-xs">
-<span class="text-outline">Uptime</span>
-<span class="text-on-surface font-mono">14d 2u 43m</span>
-</div>
-</div>
-<div class="mt-auto pt-4 flex items-center justify-between">
-<span class="text-[10px] uppercase tracking-wider text-outline">Gezien: 2 min geleden</span>
-<button class="bg-primary text-on-primary px-4 py-2 rounded-lg font-label-md text-label-md hover:brightness-110 active:scale-95 transition-all">Test verbinding</button>
-</div>
-</div>
-<!-- Docker Socket Proxy Panel -->
-<div class="glass-panel rounded-xl p-6 flex flex-col gap-6">
-<div class="flex justify-between items-start">
-<div class="w-12 h-12 bg-secondary/10 rounded-xl flex items-center justify-center">
-<span class="material-symbols-outlined text-secondary text-3xl" style="font-variation-settings: 'FILL' 1;">terminal</span>
-</div>
-<div class="status-chip text-status-online">
-<div class="active-dot pulse"></div>
-<span>Verbonden</span>
-</div>
-</div>
-<div>
-<h3 class="font-headline-md text-headline-md text-on-surface mb-1">Docker Socket Proxy</h3>
-<p class="text-sm text-on-surface-variant italic">Leest alleen containerstatistieken. Write-access is geblokkeerd.</p>
-</div>
-<div class="space-y-2">
-<div class="flex items-center gap-2 text-sm text-on-surface-variant">
-<span class="material-symbols-outlined text-sm">check_circle</span>
-<span>API Versie: 1.41</span>
-</div>
-<div class="flex items-center gap-2 text-sm text-on-surface-variant">
-<span class="material-symbols-outlined text-sm">lock</span>
-<span>Mode: Read-Only (Secure)</span>
-</div>
-<div class="flex items-center gap-2 text-sm text-on-surface-variant">
-<span class="material-symbols-outlined text-sm">link</span>
-<span class="font-mono text-xs">tcp://192.168.1.50:2375</span>
-</div>
-</div>
-<div class="mt-auto pt-4 flex items-center justify-between">
-<span class="text-[10px] uppercase tracking-wider text-outline">Sync: 15s geleden</span>
-<button class="bg-primary text-on-primary px-4 py-2 rounded-lg font-label-md text-label-md hover:brightness-110 active:scale-95 transition-all">Test verbinding</button>
-</div>
-</div>
-<!-- Nginx Proxy Manager Panel -->
-<div class="glass-panel rounded-xl p-6 flex flex-col gap-6 lg:col-span-1 md:col-span-2 lg:col-auto">
-<div class="flex justify-between items-start">
-<div class="w-12 h-12 bg-tertiary/10 rounded-xl flex items-center justify-center">
-<span class="material-symbols-outlined text-tertiary text-3xl" style="font-variation-settings: 'FILL' 1;">router</span>
-</div>
-<div class="status-chip text-status-degraded">
-<div class="active-dot bg-status-degraded shadow-[0_0_8px_#ffb783]"></div>
-<span class="text-status-degraded">Bezig met synchroniseren</span>
-</div>
-</div>
-<div>
-<h3 class="font-headline-md text-headline-md text-on-surface mb-1">Nginx Proxy Manager</h3>
-<p class="text-sm text-on-surface-variant italic">Leest proxy-hosts voor automatische URL-toewijzing.</p>
-</div>
-<div class="py-4 border-t border-b border-outline-variant/10 flex items-center justify-between">
-<div>
-<p class="font-label-md text-label-md text-on-surface">Externe URL's weergeven</p>
-<p class="text-xs text-outline">Toon publieke domeinen in dashboard</p>
-</div>
-<label class="switch">
-<input checked="" type="checkbox"/>
-<span class="slider"></span>
-</label>
-</div>
-<div class="mt-auto flex items-center justify-between">
-<span class="text-[10px] uppercase tracking-wider text-outline">Sync: 4m geleden</span>
-<button class="bg-primary text-on-primary px-4 py-2 rounded-lg font-label-md text-label-md hover:brightness-110 active:scale-95 transition-all">Test verbinding</button>
-</div>
-</div>
-</div>
-<!-- Global Status & Info -->
-<div class="mt-stack-lg p-6 bg-surface-container-highest/30 rounded-xl border border-outline-variant/20 flex flex-col md:flex-row items-center justify-between gap-6">
-<div class="flex items-center gap-4">
-<div class="w-12 h-12 rounded-full bg-secondary/20 flex items-center justify-center text-secondary">
-<span class="material-symbols-outlined text-2xl">security</span>
-</div>
-<div>
-<h4 class="font-bold text-on-surface">Veiligheidsmodus actief</h4>
-<p class="text-sm text-on-surface-variant">Alle verbindingen zijn geconfigureerd als 'Read-Only'. DockDeck kan geen wijzigingen aanbrengen in uw infrastructuur.</p>
-</div>
-</div>
-<div class="flex gap-4 w-full md:w-auto">
-<button class="flex-1 md:flex-none px-6 py-2.5 border border-outline-variant text-on-surface-variant rounded-lg font-label-md text-label-md hover:bg-surface-variant/50 transition-colors">Logboeken inzien</button>
-<button class="flex-1 md:flex-none px-6 py-2.5 bg-primary text-on-primary rounded-lg font-label-md text-label-md font-bold hover:brightness-110 transition-all">Alles synchroniseren</button>
-</div>
-</div>
-</main>
-<!-- Background Decoration -->
-<div class="fixed top-0 left-0 w-full h-full -z-10 pointer-events-none opacity-20">
-
-</div>
-<!-- Mobile Bottom Navigation Shell (Filter Logic Applied) -->
-<nav class="md:hidden fixed bottom-0 left-0 w-full bg-surface-glass backdrop-blur-xl border-t border-outline-variant/10 flex justify-around items-center h-16 z-50">
-<a class="flex flex-col items-center gap-1 text-on-surface-variant" href="#">
-<span class="material-symbols-outlined">dashboard</span>
-<span class="text-[10px]">Overzicht</span>
-</a>
-<a class="flex flex-col items-center gap-1 text-on-surface-variant" href="#">
-<span class="material-symbols-outlined">layers</span>
-<span class="text-[10px]">Containers</span>
-</a>
-<a class="flex flex-col items-center gap-1 text-secondary" href="#">
-<span class="material-symbols-outlined" style="font-variation-settings: 'FILL' 1;">settings_input_component</span>
-<span class="text-[10px] font-bold">Integraties</span>
-</a>
-<a class="flex flex-col items-center gap-1 text-on-surface-variant" href="#">
-<span class="material-symbols-outlined">settings</span>
-<span class="text-[10px]">Systeem</span>
-</a>
-</nav>
-<script>
-        // Micro-interaction for Test Connection buttons
-        document.querySelectorAll('button').forEach(btn => {
-            if (btn.innerText === "Test verbinding") {
-                btn.addEventListener('click', function() {
-                    const originalText = this.innerText;
-                    this.innerHTML = '<span class="material-symbols-outlined animate-spin text-sm">refresh</span>';
-                    this.classList.add('opacity-80');
-                    this.disabled = true;
-
-                    setTimeout(() => {
-                        this.innerHTML = '<span class="material-symbols-outlined text-sm">check</span> Succes';
-                        this.classList.replace('bg-primary', 'bg-secondary');
-                        this.classList.replace('text-on-primary', 'text-on-secondary');
-                        
-                        setTimeout(() => {
-                            this.innerText = originalText;
-                            this.classList.replace('bg-secondary', 'bg-primary');
-                            this.classList.replace('text-on-secondary', 'text-on-primary');
-                            this.classList.remove('opacity-80');
-                            this.disabled = false;
-                        }, 2000);
-                    }, 1200);
-                });
-            }
-        });
-    </script>
-</body></html>
\ No newline at end of file
