diff --git a/CHANGELOG.md b/CHANGELOG.md
index 48943f9..dd6adc8 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,6 +9,22 @@ Dieses Projekt verwendet [Semantic Versioning](https://semver.org/lang/de/).
 
 ---
 
+## [0.4.0] - 2026-06-29
+
+### Added
+- Einstellungen → Layout: Seitenname, Logo-Upload, Button-Farbe (Colorpicker), Dark/Light-Mode
+- Settings-Tabelle als Key-Value-Store in der Datenbank
+- SettingsService mit Cache-Layer (automatische Invalidierung bei Änderung)
+- SettingsServiceProvider: Einstellungen werden global in alle Views injiziert
+- Dark-Mode via `dark`-Klasse auf HTML-Element (Tailwind CSS)
+- CSS-Variable `--color-primary` für dynamische Button-Farbe
+- Hilfe-Menü auf Ebene 0 (Dropdown) für alle eingeloggten Benutzer
+- Hilfe → Handbuch: Übersicht über Rollen, Funktionen, Bedienung
+- Hilfe → Changelog: Changelog direkt im Browser lesbar
+- Navigation: Einstellungen-Dropdown um Layout erweitert
+
+---
+
 ## [0.3.0] - 2026-06-27
 
 ### Added
@@ -46,7 +62,8 @@ Dieses Projekt verwendet [Semantic Versioning](https://semver.org/lang/de/).
 - Grundlegende PHP-Projektstruktur (public/, src/, config/)
 - composer.json, .gitignore, README.md
 
-[Unreleased]: http://localhost:3000/admin/Network-MGMT/compare/v0.3.0...HEAD
+[Unreleased]: http://localhost:3000/admin/Network-MGMT/compare/v0.4.0...HEAD
+[0.4.0]: http://localhost:3000/admin/Network-MGMT/compare/v0.3.0...v0.4.0
 [0.3.0]: http://localhost:3000/admin/Network-MGMT/compare/v0.2.0...v0.3.0
 [0.2.0]: http://localhost:3000/admin/Network-MGMT/compare/v0.1.0...v0.2.0
 [0.1.0]: http://localhost:3000/admin/Network-MGMT/releases/tag/v0.1.0
diff --git a/app/Http/Controllers/Admin/LayoutController.php b/app/Http/Controllers/Admin/LayoutController.php
new file mode 100644
index 0000000..13e524c
--- /dev/null
+++ b/app/Http/Controllers/Admin/LayoutController.php
@@ -0,0 +1,56 @@
+<?php
+
+namespace App\Http\Controllers\Admin;
+
+use App\Http\Controllers\Controller;
+use App\Services\SettingsService;
+use Illuminate\Http\RedirectResponse;
+use Illuminate\Http\Request;
+use Illuminate\View\View;
+
+class LayoutController extends Controller
+{
+    public function __construct(private SettingsService $settings) {}
+
+    public function index(): View
+    {
+        return view('admin.layout.index', [
+            'settings' => $this->settings->all(),
+        ]);
+    }
+
+    public function update(Request $request): RedirectResponse
+    {
+        $validated = $request->validate([
+            'site_name'    => ['required', 'string', 'max:100'],
+            'button_color' => ['required', 'string', 'regex:/^#[0-9a-fA-F]{6}$/'],
+            'theme_mode'   => ['required', 'in:light,dark'],
+            'site_logo'    => ['nullable', 'image', 'max:2048'],
+        ]);
+
+        // Logo-Upload verarbeiten
+        if ($request->hasFile('site_logo')) {
+            $path = $request->file('site_logo')->store('logos', 'public');
+            $this->settings->set('site_logo', $path);
+        }
+
+        $this->settings->setMany([
+            'site_name'    => $validated['site_name'],
+            'button_color' => $validated['button_color'],
+            'theme_mode'   => $validated['theme_mode'],
+        ]);
+
+        return redirect()
+            ->route('admin.layout.index')
+            ->with('success', 'Layout-Einstellungen gespeichert.');
+    }
+
+    public function removeLogo(): RedirectResponse
+    {
+        $this->settings->set('site_logo', '');
+
+        return redirect()
+            ->route('admin.layout.index')
+            ->with('success', 'Logo entfernt.');
+    }
+}
diff --git a/app/Http/Controllers/Admin/UserController.php b/app/Http/Controllers/Admin/UserController.php
index 9cfcc13..b27bbb6 100644
--- a/app/Http/Controllers/Admin/UserController.php
+++ b/app/Http/Controllers/Admin/UserController.php
@@ -47,7 +47,7 @@ class UserController extends Controller
 
         return redirect()
             ->route('admin.users.index')
-            ->with('success', "Benutzer „{$user->name}" wurde angelegt.");
+            ->with('success', "Benutzer \"{$user->name}\" wurde angelegt.");
     }
 
     public function edit(User $user): View
@@ -79,7 +79,7 @@ class UserController extends Controller
 
         return redirect()
             ->route('admin.users.index')
-            ->with('success', "Benutzer „{$user->name}" wurde aktualisiert.");
+            ->with('success', "Benutzer \"{$user->name}\" wurde aktualisiert.");
     }
 
     public function destroy(User $user): RedirectResponse
@@ -95,6 +95,6 @@ class UserController extends Controller
 
         return redirect()
             ->route('admin.users.index')
-            ->with('success', "Benutzer „{$name}" wurde gelöscht.");
+            ->with('success', "Benutzer \"{$name}\" wurde gelöscht.");
     }
 }
diff --git a/app/Http/Controllers/HelpController.php b/app/Http/Controllers/HelpController.php
new file mode 100644
index 0000000..32cf491
--- /dev/null
+++ b/app/Http/Controllers/HelpController.php
@@ -0,0 +1,23 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\View\View;
+
+class HelpController extends Controller
+{
+    public function manual(): View
+    {
+        return view('help.manual');
+    }
+
+    public function changelog(): View
+    {
+        $changelogPath = base_path('CHANGELOG.md');
+        $content = file_exists($changelogPath)
+            ? file_get_contents($changelogPath)
+            : 'Kein Changelog gefunden.';
+
+        return view('help.changelog', compact('content'));
+    }
+}
diff --git a/app/Models/Setting.php b/app/Models/Setting.php
new file mode 100644
index 0000000..6926777
--- /dev/null
+++ b/app/Models/Setting.php
@@ -0,0 +1,25 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class Setting extends Model
+{
+    protected $fillable = ['key', 'value'];
+
+    public static function get(string $key, mixed $default = null): mixed
+    {
+        return static::where('key', $key)->value('value') ?? $default;
+    }
+
+    public static function set(string $key, mixed $value): void
+    {
+        static::updateOrCreate(['key' => $key], ['value' => $value]);
+    }
+
+    public static function allAsArray(): array
+    {
+        return static::pluck('value', 'key')->toArray();
+    }
+}
diff --git a/app/Providers/SettingsServiceProvider.php b/app/Providers/SettingsServiceProvider.php
new file mode 100644
index 0000000..a7b57aa
--- /dev/null
+++ b/app/Providers/SettingsServiceProvider.php
@@ -0,0 +1,33 @@
+<?php
+
+namespace App\Providers;
+
+use App\Services\SettingsService;
+use Illuminate\Support\Facades\Schema;
+use Illuminate\Support\Facades\View;
+use Illuminate\Support\ServiceProvider;
+
+class SettingsServiceProvider extends ServiceProvider
+{
+    public function register(): void
+    {
+        $this->app->singleton(SettingsService::class);
+    }
+
+    public function boot(): void
+    {
+        // Settings nur laden wenn die Tabelle existiert (z.B. vor Migration schützen)
+        if (!$this->app->runningInConsole() && Schema::hasTable('settings')) {
+            $settings = $this->app->make(SettingsService::class)->all();
+
+            View::share('appSettings', $settings);
+        } else {
+            View::share('appSettings', [
+                'site_name'    => config('app.name'),
+                'site_logo'    => '',
+                'button_color' => '#4f46e5',
+                'theme_mode'   => 'light',
+            ]);
+        }
+    }
+}
diff --git a/app/Services/SettingsService.php b/app/Services/SettingsService.php
new file mode 100644
index 0000000..bdd644c
--- /dev/null
+++ b/app/Services/SettingsService.php
@@ -0,0 +1,36 @@
+<?php
+
+namespace App\Services;
+
+use App\Models\Setting;
+use Illuminate\Support\Facades\Cache;
+
+class SettingsService
+{
+    private const CACHE_KEY = 'app_settings';
+    private const CACHE_TTL = 3600;
+
+    public function all(): array
+    {
+        return Cache::remember(self::CACHE_KEY, self::CACHE_TTL, fn() => Setting::allAsArray());
+    }
+
+    public function get(string $key, mixed $default = null): mixed
+    {
+        return $this->all()[$key] ?? $default;
+    }
+
+    public function set(string $key, mixed $value): void
+    {
+        Setting::set($key, $value);
+        Cache::forget(self::CACHE_KEY);
+    }
+
+    public function setMany(array $data): void
+    {
+        foreach ($data as $key => $value) {
+            Setting::set($key, $value);
+        }
+        Cache::forget(self::CACHE_KEY);
+    }
+}
diff --git a/bootstrap/app.php b/bootstrap/app.php
index 7a2848f..c936581 100644
--- a/bootstrap/app.php
+++ b/bootstrap/app.php
@@ -6,13 +6,20 @@ use Illuminate\Foundation\Configuration\Middleware;
 use Illuminate\Http\Request;
 
 return Application::configure(basePath: dirname(__DIR__))
+    ->withProviders([
+        App\Providers\SettingsServiceProvider::class,
+    ])
     ->withRouting(
         web: __DIR__.'/../routes/web.php',
         commands: __DIR__.'/../routes/console.php',
         health: '/up',
     )
     ->withMiddleware(function (Middleware $middleware): void {
-        //
+        $middleware->alias([
+            'role'       => \Spatie\Permission\Middleware\RoleMiddleware::class,
+            'permission' => \Spatie\Permission\Middleware\PermissionMiddleware::class,
+            'role_or_permission' => \Spatie\Permission\Middleware\RoleOrPermissionMiddleware::class,
+        ]);
     })
     ->withExceptions(function (Exceptions $exceptions): void {
         $exceptions->shouldRenderJsonWhen(
diff --git a/database/migrations/2026_06_29_000001_create_settings_table.php b/database/migrations/2026_06_29_000001_create_settings_table.php
new file mode 100644
index 0000000..5cc2756
--- /dev/null
+++ b/database/migrations/2026_06_29_000001_create_settings_table.php
@@ -0,0 +1,23 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::create('settings', function (Blueprint $table) {
+            $table->id();
+            $table->string('key')->unique();
+            $table->text('value')->nullable();
+            $table->timestamps();
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::dropIfExists('settings');
+    }
+};
diff --git a/database/seeders/DatabaseSeeder.php b/database/seeders/DatabaseSeeder.php
index 6ccb4cb..d754eb8 100644
--- a/database/seeders/DatabaseSeeder.php
+++ b/database/seeders/DatabaseSeeder.php
@@ -10,6 +10,7 @@ class DatabaseSeeder extends Seeder
     {
         $this->call([
             RolesAndPermissionsSeeder::class,
+            SettingsSeeder::class,
         ]);
     }
 }
diff --git a/database/seeders/SettingsSeeder.php b/database/seeders/SettingsSeeder.php
new file mode 100644
index 0000000..3efad48
--- /dev/null
+++ b/database/seeders/SettingsSeeder.php
@@ -0,0 +1,25 @@
+<?php
+
+namespace Database\Seeders;
+
+use App\Models\Setting;
+use Illuminate\Database\Seeder;
+
+class SettingsSeeder extends Seeder
+{
+    public function run(): void
+    {
+        $defaults = [
+            'site_name'      => 'Network-MGMT',
+            'site_logo'      => '',
+            'button_color'   => '#4f46e5',  // Indigo-600
+            'theme_mode'     => 'light',    // light | dark
+        ];
+
+        foreach ($defaults as $key => $value) {
+            Setting::firstOrCreate(['key' => $key], ['value' => $value]);
+        }
+
+        $this->command->info('Default settings seeded.');
+    }
+}
diff --git a/resources/views/admin/layout/index.blade.php b/resources/views/admin/layout/index.blade.php
new file mode 100644
index 0000000..6addc4f
--- /dev/null
+++ b/resources/views/admin/layout/index.blade.php
@@ -0,0 +1,137 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">
+            Layout-Einstellungen
+        </h2>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-3xl mx-auto sm:px-6 lg:px-8 space-y-6">
+
+            @if(session('success'))
+                <div class="p-4 bg-green-100 text-green-800 rounded-md">
+                    {{ session('success') }}
+                </div>
+            @endif
+
+            <form method="POST" action="{{ route('admin.layout.update') }}" enctype="multipart/form-data"
+                  class="bg-white dark:bg-gray-800 shadow-sm sm:rounded-lg p-6 space-y-8">
+                @csrf
+                @method('PUT')
+
+                {{-- Site-Name --}}
+                <div>
+                    <h3 class="text-base font-semibold text-gray-900 dark:text-gray-100 mb-4 pb-2 border-b border-gray-200">
+                        Allgemein
+                    </h3>
+                    <div>
+                        <x-input-label for="site_name" value="Seitenname" />
+                        <x-text-input id="site_name" name="site_name" type="text" class="mt-1 block w-full"
+                            value="{{ old('site_name', $settings['site_name'] ?? 'Network-MGMT') }}" required />
+                        <p class="mt-1 text-xs text-gray-500">Wird im Browser-Tab und in der Navigation angezeigt.</p>
+                        <x-input-error :messages="$errors->get('site_name')" class="mt-2" />
+                    </div>
+                </div>
+
+                {{-- Logo --}}
+                <div>
+                    <h3 class="text-base font-semibold text-gray-900 dark:text-gray-100 mb-4 pb-2 border-b border-gray-200">
+                        Logo
+                    </h3>
+
+                    @if(!empty($settings['site_logo']))
+                        <div class="mb-4 flex items-center space-x-4">
+                            <img src="{{ asset('storage/' . $settings['site_logo']) }}"
+                                 alt="Logo" class="h-12 object-contain border rounded p-1 bg-gray-50">
+                            <a href="{{ route('admin.layout.removeLogo') }}"
+                               onclick="return confirm('Logo wirklich entfernen?')"
+                               class="text-sm text-red-600 hover:text-red-800">Logo entfernen</a>
+                        </div>
+                    @endif
+
+                    <div>
+                        <x-input-label for="site_logo" value="Logo hochladen (PNG, JPG – max. 2 MB)" />
+                        <input id="site_logo" name="site_logo" type="file" accept="image/*"
+                               class="mt-1 block w-full text-sm text-gray-500 file:mr-4 file:py-2 file:px-4
+                                      file:rounded-md file:border-0 file:text-sm file:font-medium
+                                      file:bg-indigo-50 file:text-indigo-700 hover:file:bg-indigo-100" />
+                        <x-input-error :messages="$errors->get('site_logo')" class="mt-2" />
+                    </div>
+                </div>
+
+                {{-- Button-Farbe --}}
+                <div>
+                    <h3 class="text-base font-semibold text-gray-900 dark:text-gray-100 mb-4 pb-2 border-b border-gray-200">
+                        Button-Farbe
+                    </h3>
+                    <div class="flex items-center space-x-4">
+                        <input id="button_color" name="button_color" type="color"
+                               value="{{ old('button_color', $settings['button_color'] ?? '#4f46e5') }}"
+                               class="h-10 w-20 rounded border border-gray-300 cursor-pointer p-1" />
+                        <div>
+                            <p class="text-sm text-gray-700 dark:text-gray-300">Primärfarbe für Buttons und Akzente</p>
+                            <p class="text-xs text-gray-500" id="color_preview_text">
+                                {{ old('button_color', $settings['button_color'] ?? '#4f46e5') }}
+                            </p>
+                        </div>
+                        <button type="button"
+                            id="preview_btn"
+                            style="background-color: {{ old('button_color', $settings['button_color'] ?? '#4f46e5') }}"
+                            class="px-4 py-2 text-white text-sm font-medium rounded-md transition">
+                            Vorschau
+                        </button>
+                    </div>
+                    <x-input-error :messages="$errors->get('button_color')" class="mt-2" />
+                </div>
+
+                {{-- Dark / Light Mode --}}
+                <div>
+                    <h3 class="text-base font-semibold text-gray-900 dark:text-gray-100 mb-4 pb-2 border-b border-gray-200">
+                        Erscheinungsbild
+                    </h3>
+                    <div class="flex space-x-4">
+                        <label class="flex items-center space-x-2 cursor-pointer">
+                            <input type="radio" name="theme_mode" value="light"
+                                   {{ ($settings['theme_mode'] ?? 'light') === 'light' ? 'checked' : '' }}
+                                   class="text-indigo-600 focus:ring-indigo-500" />
+                            <span class="text-sm text-gray-700 dark:text-gray-300">
+                                ☀️ Hell (Light Mode)
+                            </span>
+                        </label>
+                        <label class="flex items-center space-x-2 cursor-pointer">
+                            <input type="radio" name="theme_mode" value="dark"
+                                   {{ ($settings['theme_mode'] ?? 'light') === 'dark' ? 'checked' : '' }}
+                                   class="text-indigo-600 focus:ring-indigo-500" />
+                            <span class="text-sm text-gray-700 dark:text-gray-300">
+                                🌙 Dunkel (Dark Mode)
+                            </span>
+                        </label>
+                    </div>
+                </div>
+
+                {{-- Speichern --}}
+                <div class="flex justify-end pt-2 border-t border-gray-200">
+                    <button type="submit"
+                        id="save_btn"
+                        style="background-color: {{ $settings['button_color'] ?? '#4f46e5' }}"
+                        class="inline-flex items-center px-6 py-2 text-white text-sm font-medium rounded-md hover:opacity-90 transition">
+                        Einstellungen speichern
+                    </button>
+                </div>
+            </form>
+        </div>
+    </div>
+
+    <script>
+        const colorInput = document.getElementById('button_color');
+        const previewBtn = document.getElementById('preview_btn');
+        const saveBtn    = document.getElementById('save_btn');
+        const colorText  = document.getElementById('color_preview_text');
+
+        colorInput.addEventListener('input', function () {
+            previewBtn.style.backgroundColor = this.value;
+            saveBtn.style.backgroundColor    = this.value;
+            colorText.textContent             = this.value;
+        });
+    </script>
+</x-app-layout>
diff --git a/resources/views/admin/users/index.blade.php b/resources/views/admin/users/index.blade.php
index 03d58ea..73da39f 100644
--- a/resources/views/admin/users/index.blade.php
+++ b/resources/views/admin/users/index.blade.php
@@ -1,19 +1,21 @@
 <x-app-layout>
     <x-slot name="header">
-        <div class="flex items-center justify-between">
-            <h2 class="font-semibold text-xl text-gray-800 leading-tight">
-                Benutzerverwaltung
-            </h2>
-            <a href="{{ route('admin.users.create') }}"
-               class="inline-flex items-center px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md hover:bg-indigo-700 transition">
-                + Neuer Benutzer
-            </a>
-        </div>
+        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
+            Benutzerverwaltung
+        </h2>
     </x-slot>
 
     <div class="py-12">
         <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
 
+            {{-- Toolbar --}}
+            <div class="flex justify-end mb-4">
+                <a href="{{ route('admin.users.create') }}"
+                   class="inline-flex items-center px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md hover:bg-indigo-700 transition">
+                    + Neuer Benutzer
+                </a>
+            </div>
+
             {{-- Flash-Meldungen --}}
             @if(session('success'))
                 <div class="mb-4 p-4 bg-green-100 text-green-800 rounded-md">
diff --git a/resources/views/help/changelog.blade.php b/resources/views/help/changelog.blade.php
new file mode 100644
index 0000000..69dc369
--- /dev/null
+++ b/resources/views/help/changelog.blade.php
@@ -0,0 +1,42 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">
+            Changelog
+        </h2>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-4xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white dark:bg-gray-800 shadow-sm sm:rounded-lg p-8">
+                <div class="prose dark:prose-invert max-w-none">
+                    @php
+                        // Einfaches Markdown-to-HTML für den Changelog
+                        $lines = explode("\n", $content);
+                        $html  = '';
+                        foreach ($lines as $line) {
+                            if (str_starts_with($line, '## ')) {
+                                $html .= '<h2 class="text-xl font-bold mt-6 mb-2 text-gray-900 dark:text-gray-100 border-b pb-1">'
+                                    . e(substr($line, 3)) . '</h2>';
+                            } elseif (str_starts_with($line, '### ')) {
+                                $html .= '<h3 class="text-base font-semibold mt-4 mb-1 text-indigo-700 dark:text-indigo-400">'
+                                    . e(substr($line, 4)) . '</h3>';
+                            } elseif (str_starts_with($line, '# ')) {
+                                $html .= '<h1 class="text-2xl font-bold mb-4 text-gray-900 dark:text-gray-100">'
+                                    . e(substr($line, 2)) . '</h1>';
+                            } elseif (str_starts_with($line, '- ')) {
+                                $html .= '<li class="ml-4 text-sm text-gray-700 dark:text-gray-300 list-disc">'
+                                    . e(substr($line, 2)) . '</li>';
+                            } elseif (trim($line) === '---') {
+                                $html .= '<hr class="my-4 border-gray-200 dark:border-gray-700">';
+                            } elseif (trim($line) !== '') {
+                                $html .= '<p class="text-sm text-gray-600 dark:text-gray-400 my-1">'
+                                    . e($line) . '</p>';
+                            }
+                        }
+                    @endphp
+                    {!! $html !!}
+                </div>
+            </div>
+        </div>
+    </div>
+</x-app-layout>
diff --git a/resources/views/help/manual.blade.php b/resources/views/help/manual.blade.php
new file mode 100644
index 0000000..a4edca1
--- /dev/null
+++ b/resources/views/help/manual.blade.php
@@ -0,0 +1,77 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">
+            Handbuch
+        </h2>
+    </x-slot>
+
+    <div class="py-12">
+        <div class="max-w-4xl mx-auto sm:px-6 lg:px-8">
+            <div class="bg-white dark:bg-gray-800 shadow-sm sm:rounded-lg p-8 space-y-8">
+
+                <section>
+                    <h2 class="text-xl font-bold text-gray-900 dark:text-gray-100 mb-3">Erste Schritte</h2>
+                    <p class="text-gray-700 dark:text-gray-300 text-sm leading-relaxed">
+                        Network-MGMT ist eine webbasierte Verwaltungsplattform für Netzwerk-Ressourcen
+                        mit rollenbasierter Zugriffskontrolle.
+                    </p>
+                </section>
+
+                <section>
+                    <h2 class="text-xl font-bold text-gray-900 dark:text-gray-100 mb-3">Rollen &amp; Rechte</h2>
+                    <div class="overflow-hidden rounded-lg border border-gray-200 dark:border-gray-700">
+                        <table class="min-w-full text-sm">
+                            <thead class="bg-gray-50 dark:bg-gray-700">
+                                <tr>
+                                    <th class="px-4 py-2 text-left font-medium text-gray-600 dark:text-gray-300">Rolle</th>
+                                    <th class="px-4 py-2 text-left font-medium text-gray-600 dark:text-gray-300">Beschreibung</th>
+                                    <th class="px-4 py-2 text-left font-medium text-gray-600 dark:text-gray-300">Berechtigungen</th>
+                                </tr>
+                            </thead>
+                            <tbody class="divide-y divide-gray-200 dark:divide-gray-700">
+                                <tr>
+                                    <td class="px-4 py-2"><span class="px-2 py-0.5 bg-red-100 text-red-800 rounded-full text-xs">admin</span></td>
+                                    <td class="px-4 py-2 text-gray-700 dark:text-gray-300">Administrator</td>
+                                    <td class="px-4 py-2 text-gray-600 dark:text-gray-400">Vollzugriff auf alle Funktionen</td>
+                                </tr>
+                                <tr>
+                                    <td class="px-4 py-2"><span class="px-2 py-0.5 bg-yellow-100 text-yellow-800 rounded-full text-xs">manager</span></td>
+                                    <td class="px-4 py-2 text-gray-700 dark:text-gray-300">Manager</td>
+                                    <td class="px-4 py-2 text-gray-600 dark:text-gray-400">Netzwerk lesen, anlegen, bearbeiten; Benutzer lesen</td>
+                                </tr>
+                                <tr>
+                                    <td class="px-4 py-2"><span class="px-2 py-0.5 bg-blue-100 text-blue-800 rounded-full text-xs">user</span></td>
+                                    <td class="px-4 py-2 text-gray-700 dark:text-gray-300">Benutzer</td>
+                                    <td class="px-4 py-2 text-gray-600 dark:text-gray-400">Netzwerk lesen</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </section>
+
+                <section>
+                    <h2 class="text-xl font-bold text-gray-900 dark:text-gray-100 mb-3">Benutzerverwaltung</h2>
+                    <p class="text-gray-700 dark:text-gray-300 text-sm leading-relaxed">
+                        Unter <strong>Einstellungen → Benutzerverwaltung</strong> können Administratoren
+                        neue Benutzer anlegen, bestehende bearbeiten und Rollen zuweisen.
+                        Der eigene Account kann nicht gelöscht werden.
+                    </p>
+                </section>
+
+                <section>
+                    <h2 class="text-xl font-bold text-gray-900 dark:text-gray-100 mb-3">Layout-Einstellungen</h2>
+                    <p class="text-gray-700 dark:text-gray-300 text-sm leading-relaxed">
+                        Unter <strong>Einstellungen → Layout</strong> kann der Seitenname, das Logo,
+                        die Button-Farbe sowie der Dark/Light-Mode konfiguriert werden.
+                        Änderungen werden sofort für alle Benutzer wirksam.
+                    </p>
+                </section>
+
+                <div class="pt-4 border-t border-gray-200 dark:border-gray-700 text-xs text-gray-400 dark:text-gray-500">
+                    Network-MGMT · Version {{ config('app.version', '0.4.0') }}
+                </div>
+
+            </div>
+        </div>
+    </div>
+</x-app-layout>
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index c5ff315..bb867b1 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -1,11 +1,12 @@
 <!DOCTYPE html>
-<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
+<html lang="{{ str_replace('_', '-', app()->getLocale()) }}"
+      class="{{ ($appSettings['theme_mode'] ?? 'light') === 'dark' ? 'dark' : '' }}">
     <head>
         <meta charset="utf-8">
         <meta name="viewport" content="width=device-width, initial-scale=1">
         <meta name="csrf-token" content="{{ csrf_token() }}">
 
-        <title>{{ config('app.name', 'Laravel') }}</title>
+        <title>{{ $appSettings['site_name'] ?? config('app.name', 'Network-MGMT') }}</title>
 
         <!-- Fonts -->
         <link rel="preconnect" href="https://fonts.bunny.net">
@@ -13,14 +14,28 @@
 
         <!-- Scripts -->
         @vite(['resources/css/app.css', 'resources/js/app.js'])
+
+        <!-- Dynamic Settings -->
+        <style>
+            :root {
+                --color-primary: {{ $appSettings['button_color'] ?? '#4f46e5' }};
+            }
+            .btn-primary {
+                background-color: var(--color-primary) !important;
+                color: #fff;
+            }
+            .btn-primary:hover {
+                opacity: 0.88;
+            }
+        </style>
     </head>
     <body class="font-sans antialiased">
-        <div class="min-h-screen bg-gray-100">
+        <div class="min-h-screen bg-gray-100 dark:bg-gray-900">
             @include('layouts.navigation')
 
             <!-- Page Heading -->
             @isset($header)
-                <header class="bg-white shadow">
+                <header class="bg-white dark:bg-gray-800 shadow">
                     <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
                         {{ $header }}
                     </div>
diff --git a/resources/views/layouts/navigation.blade.php b/resources/views/layouts/navigation.blade.php
index dbe7983..f09298c 100644
--- a/resources/views/layouts/navigation.blade.php
+++ b/resources/views/layouts/navigation.blade.php
@@ -15,11 +15,50 @@
                     <x-nav-link :href="route('dashboard')" :active="request()->routeIs('dashboard')">
                         {{ __('Dashboard') }}
                     </x-nav-link>
+
                     @role('admin')
-                    <x-nav-link :href="route('admin.users.index')" :active="request()->routeIs('admin.*')">
-                        Benutzerverwaltung
-                    </x-nav-link>
+                    {{-- Einstellungen-Dropdown --}}
+                    <x-dropdown align="left" width="48">
+                        <x-slot name="trigger">
+                            <button class="inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium leading-5 transition duration-150 ease-in-out focus:outline-none
+                                {{ request()->routeIs('admin.*') ? 'border-indigo-400 text-gray-900' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300' }}">
+                                Einstellungen
+                                <svg class="ms-1 fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+                                    <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd" />
+                                </svg>
+                            </button>
+                        </x-slot>
+                        <x-slot name="content">
+                            <x-dropdown-link :href="route('admin.users.index')">
+                                👥 Benutzerverwaltung
+                            </x-dropdown-link>
+                            <x-dropdown-link :href="route('admin.layout.index')">
+                                🎨 Layout
+                            </x-dropdown-link>
+                        </x-slot>
+                    </x-dropdown>
                     @endrole
+
+                    {{-- Hilfe-Dropdown --}}
+                    <x-dropdown align="left" width="48">
+                        <x-slot name="trigger">
+                            <button class="inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium leading-5 transition duration-150 ease-in-out focus:outline-none
+                                {{ request()->routeIs('help.*') ? 'border-indigo-400 text-gray-900' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300' }}">
+                                Hilfe
+                                <svg class="ms-1 fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+                                    <path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd" />
+                                </svg>
+                            </button>
+                        </x-slot>
+                        <x-slot name="content">
+                            <x-dropdown-link :href="route('help.manual')">
+                                📖 Handbuch
+                            </x-dropdown-link>
+                            <x-dropdown-link :href="route('help.changelog')">
+                                📋 Changelog
+                            </x-dropdown-link>
+                        </x-slot>
+                    </x-dropdown>
                 </div>
             </div>
 
@@ -75,11 +114,28 @@
             <x-responsive-nav-link :href="route('dashboard')" :active="request()->routeIs('dashboard')">
                 {{ __('Dashboard') }}
             </x-responsive-nav-link>
+
             @role('admin')
-            <x-responsive-nav-link :href="route('admin.users.index')" :active="request()->routeIs('admin.*')">
-                Benutzerverwaltung
-            </x-responsive-nav-link>
+            <div class="pt-2 pb-1 border-t border-gray-200">
+                <div class="px-4 py-1 text-xs font-semibold text-gray-400 uppercase tracking-wider">Einstellungen</div>
+                <x-responsive-nav-link :href="route('admin.users.index')">
+                    &nbsp;&nbsp;👥 Benutzerverwaltung
+                </x-responsive-nav-link>
+                <x-responsive-nav-link :href="route('admin.layout.index')">
+                    &nbsp;&nbsp;🎨 Layout
+                </x-responsive-nav-link>
+            </div>
             @endrole
+
+            <div class="pt-2 pb-1 border-t border-gray-200">
+                <div class="px-4 py-1 text-xs font-semibold text-gray-400 uppercase tracking-wider">Hilfe</div>
+                <x-responsive-nav-link :href="route('help.manual')">
+                    &nbsp;&nbsp;📖 Handbuch
+                </x-responsive-nav-link>
+                <x-responsive-nav-link :href="route('help.changelog')">
+                    &nbsp;&nbsp;📋 Changelog
+                </x-responsive-nav-link>
+            </div>
         </div>
 
         <!-- Responsive Settings Options -->
diff --git a/routes/web.php b/routes/web.php
index 056fc97..3c861d6 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -1,7 +1,9 @@
 <?php
 
 use App\Http\Controllers\ProfileController;
+use App\Http\Controllers\HelpController;
 use App\Http\Controllers\Admin\UserController as AdminUserController;
+use App\Http\Controllers\Admin\LayoutController as AdminLayoutController;
 use Illuminate\Support\Facades\Route;
 
 Route::get('/', function () {
@@ -25,6 +27,18 @@ Route::prefix('admin')
     ->group(function () {
         Route::get('/', fn() => redirect()->route('admin.users.index'));
         Route::resource('users', AdminUserController::class);
+        Route::get('layout', [AdminLayoutController::class, 'index'])->name('layout.index');
+        Route::put('layout', [AdminLayoutController::class, 'update'])->name('layout.update');
+        Route::get('layout/remove-logo', [AdminLayoutController::class, 'removeLogo'])->name('layout.removeLogo');
+    });
+
+// Hilfe-Bereich – für alle eingeloggten Benutzer
+Route::prefix('help')
+    ->name('help.')
+    ->middleware(['auth'])
+    ->group(function () {
+        Route::get('manual', [HelpController::class, 'manual'])->name('manual');
+        Route::get('changelog', [HelpController::class, 'changelog'])->name('changelog');
     });
 
 require __DIR__.'/auth.php';