fix(auth): prevent AuthNotifier auto-dispose causing theme toggle logout

Applied @persistentRiverpod annotation to AuthNotifier so it persists
for app lifetime. Previously, theme changes could trigger AuthProvider
rebuild via auto-dispose, causing AsyncLoading state and auth issues.

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

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

AGENTS.md

@@ -59,10 +59,8 @@ This project uses version-tag-based CI/CD. Releases trigger automated Docker bui
 3. Commit changes: `git commit -m "chore: release vX.X.X"`
 4. Create git tag: `git tag vX.X.X`
 5. Push with tags: `git push origin master --tags`
-6. Create release in Gitea UI (git.schweitz.net → Releases → New Release)
+
-   * Select the tag
+CI/CD auto-triggers when a tag starting with `v` is pushed.
-   * Add release notes (can copy from CHANGELOG)
-   * **Publish** the release (this triggers CI/CD)
 
 **What happens on release:**
 

CHANGELOG.md

@@ -7,6 +7,150 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [1.1.15] - 2026-01-05
+
+### Fixed
+- Theme toggle causing auth issues due to AuthNotifier auto-dispose
+  - Applied `@persistentRiverpod` annotation to AuthNotifier
+  - AuthProvider now persists for app lifetime, preventing rebuild on theme change
+
+## [1.1.14] - 2026-01-04
+
+### Fixed
+- Theme toggle causing auth issues due to ThemeProvider auto-dispose
+  - Added `@persistentRiverpod` annotation for providers that need keepAlive
+  - ThemeProvider now persists for app lifetime
+
+### Added
+- `@persistentRiverpod` annotation in `core/providers/annotations.dart`
+  - Reusable annotation for providers that should not auto-dispose
+  - Documented in ARCHITECTURE.md
+
+## [1.1.13] - 2026-01-04
+
+### Added
+- Settings page with Appearance, Navigation, and Account sections
+- Theme toggle in user profile dropdown (System/Light/Dark)
+- Theme syncs with API preferences on login
+- Default room preference syncs with backend
+
+### Changed
+- Theme changes now persist to both local storage and API
+
+## [1.1.12] - 2026-01-04
+
+### Changed
+- Control Room navigation reorganized:
+  - New "Stack" section with Containers and Proxy Hosts
+  - New "Data Management" section with PostgreSQL, Redis, Qdrant, Neo4j placeholders
+  - Removed: Networks, Volumes, Images (Portainer) and Redirections, Streams, Certificates (NPM)
+
+## [1.1.11] - 2026-01-04
+
+### Fixed
+- API client providers now use `keepAlive: true` to prevent Ref invalidation
+  - Fixes "DioException [unknown]: null" error on /security/users and other API pages
+  - AuthInterceptor's stored Ref was becoming invalid when provider auto-disposed
+
+## [1.1.10] - 2026-01-04
+
+### Changed
+- Removed page swipe transitions - all navigation is now instant (NoTransitionPage)
+
+## [1.1.9] - 2026-01-04
+
+### Changed
+- Moved health check to `/health` directory - URL is now `/health` instead of `/health.html`
+  - Enables NPM forward auth path exclusion for health endpoint
+
+## [1.1.8] - 2026-01-04
+
+### Changed
+- Dark background (`#1a1a2e`) on web/index.html to prevent white flash during auth redirects
+
+## [1.1.7] - 2026-01-04
+
+### Removed
+- Removed `/callback` route from Flutter router - AuthController handles callback in main() before app starts
+- Removed `_OidcCallbackPage` widget - no visible auth UI needed
+
+## [1.1.6] - 2026-01-04
+
+### Changed
+- **Auth moved to standalone controller** - Handles OIDC completely outside Riverpod
+  - New `AuthController` runs in `main()` before `runApp()` - avoids provider lifecycle issues
+  - Handles callback, token exchange, and /auth/sync before app starts
+  - If auth not ready (redirecting), app doesn't start at all
+  - `AuthProvider` now just loads stored tokens (no async OIDC logic)
+  - Fixes "Cannot use Ref after disposed" errors from autoDispose providers
+
+## [1.1.5] - 2026-01-04
+
+### Fixed
+- Race condition in OIDC callback: AuthProvider.build() was initiating silent OIDC while the callback page was processing, causing PKCE state to be cleared. Now skips silent OIDC when on `/callback` route.
+
+## [1.1.4] - 2026-01-04
+
+### Fixed
+- Silent OIDC fallback: when `prompt=none` fails with `login_required` (no Authentik session), automatically fall back to regular OIDC flow to show login UI
+
+## [1.1.3] - 2026-01-04
+
+### Changed
+- **Web auth uses silent OIDC with JWT Bearer tokens**
+  - Uses `prompt=none` to silently obtain JWT when Authentik session exists (via NPM forward auth)
+  - Flutter sends Bearer token to core-api instead of relying on forward auth cookies
+  - Fixes cross-subdomain cookie issues between home.schweitz.net and api.schweitz.net
+  - Callback now syncs with `/auth/sync` to get user profile and roles from core-api
+  - API interceptor now adds Bearer token on web (previously skipped)
+
+## [1.1.2] - 2026-01-04
+
+### Changed
+- **Web auth simplified**: Skip Flutter OIDC on web - NPM forward auth handles it
+  - NPM authenticates at proxy level before app loads
+  - No more redundant OIDC redirect after NPM auth completes
+  - Fixes "Cannot use Ref after disposed" error from conflicting auth flows
+  - Mobile still uses Flutter OIDC flow
+
+### Added
+- Logout now redirects to Authentik to end SSO session
+  - Clears local tokens AND invalidates Authentik session
+  - Uses OIDC end_session_endpoint from discovery document
+  - Redirects back to app after Authentik logout completes
+
+## [1.1.0] - 2026-01-04
+
+### Changed
+- **Dockerfile rebuild fix**: Added `flutter clean` before build to prevent stale cached artifacts
+  - VERSION build arg added for explicit cache busting
+  - Reordered build steps: clean → pub get → build_runner → health.json → flutter build
+  - Ensures deployed app always matches the version in health.json
+
+### Fixed
+- Replaced deprecated `dart:html` with `package:web` in iframe_view_web.dart
+  - Uses `web.HTMLIFrameElement` instead of `html.IFrameElement`
+  - Fixes deprecation warnings for Flutter 3.x web builds
+
+## [1.0.12] - 2026-01-04
+
+### Changed
+- Removed login page - auth now auto-initiates from AppScaffold
+  - No more redirect to /login, just auto-start OIDC if not authenticated
+  - Shows loading screen during auth, error screen on failure with retry
+  - Seamless experience when Authentik session exists
+
+### Removed
+- Removed /login route and _LoginPage widget
+
+## [1.0.11] - 2026-01-04
+
+### Changed
+- Web auth now extracts user info directly from JWT instead of syncing with core-api
+  - Eliminates CORS preflight issues with /auth/sync endpoint
+  - Decodes JWT claims (name, email, groups) client-side
+  - Bearer token will be used for API authentication
+
 ## [1.0.10] - 2026-01-04
 
 ### Fixed

Dockerfile

@@ -3,16 +3,24 @@ FROM ghcr.io/cirruslabs/flutter:stable AS builder
 
 WORKDIR /app
 
-# Copy dependency files first for better caching
+# VERSION arg busts cache when version changes in pubspec.yaml
-COPY pubspec.yaml ./
+# Extract version: docker build --build-arg VERSION=$(grep '^version:' pubspec.yaml | cut -d' ' -f2) .
+ARG VERSION=0.0.0
+RUN echo "Building version: $VERSION"
 
-# Get dependencies (generates pubspec.lock)
+# Copy dependency files first for better caching
+COPY pubspec.yaml pubspec.lock* ./
+
+# Get dependencies
 RUN flutter pub get
 
 # Copy the rest of the application
 COPY . .
 
-# Generate code with build_runner
+# Clean any cached build artifacts to ensure fresh build
+RUN flutter clean && flutter pub get
+
+# Generate code with build_runner (after clean for fresh generation)
 RUN dart run build_runner build --delete-conflicting-outputs
 
 # Generate health.json with version info

docs/ARCHITECTURE.md

@@ -420,6 +420,41 @@ ContainerRepository containerRepository(Ref ref) {
 }
 ```
 
+### Persistent Providers
+
+By default, `@riverpod` generates providers with `isAutoDispose: true`, meaning they dispose when no longer watched. This causes issues for:
+
+- **API clients** with interceptors that store a `Ref`
+- **App-level state** like theme, auth, config
+- **Providers with listeners** to other providers
+
+Use `@persistentRiverpod` from `core/providers/annotations.dart` for these cases:
+
+```dart
+import 'package:tatlock_ui/core/providers/annotations.dart';
+
+// ✅ Correct - persists for app lifetime
+@persistentRiverpod
+Dio coreApiClient(Ref ref) { ... }
+
+@persistentRiverpod
+class ThemeNotifier extends _$ThemeNotifier { ... }
+
+// ❌ Wrong - auto-dispose can invalidate stored Ref
+@riverpod
+Dio coreApiClient(Ref ref) { ... }
+```
+
+**When to use `@persistentRiverpod`:**
+
+| Use Case | Annotation | Example |
+|----------|------------|---------|
+| API clients with interceptors | `@persistentRiverpod` | `coreApiClient`, `tatlockApiClient` |
+| Auth state provider | `@persistentRiverpod` | `AuthNotifier` |
+| Theme/config providers | `@persistentRiverpod` | `ThemeNotifier` |
+| Feature data providers | `@riverpod` (default) | `ContainersNotifier` |
+| UI state providers | `@riverpod` (default) | `SearchFilterNotifier` |
+
 ## File Naming Conventions
 
 | Type | Convention | Example |

lib/core/api/api_client.dart

@@ -2,6 +2,7 @@ import 'package:dio/dio.dart';
 import 'package:riverpod_annotation/riverpod_annotation.dart';
 import 'package:tatlock_ui/core/api/api_interceptors.dart';
 import 'package:tatlock_ui/core/config/app_config.dart';
+import 'package:tatlock_ui/core/providers/annotations.dart';
 
 import 'api_client_native.dart' if (dart.library.html) 'api_client_web.dart'
     as platform;
@@ -9,7 +10,7 @@ import 'api_client_native.dart' if (dart.library.html) 'api_client_web.dart'
 part 'api_client.g.dart';
 
 /// Provides the Dio instance for Core API.
-@riverpod
+@persistentRiverpod
 Dio coreApiClient(Ref ref) {
   final options = BaseOptions(
     baseUrl: AppConfig.coreApiUrl,
@@ -33,7 +34,7 @@ Dio coreApiClient(Ref ref) {
 }
 
 /// Provides the Dio instance for Tatlock API.
-@riverpod
+@persistentRiverpod
 Dio tatlockApiClient(Ref ref) {
   final options = BaseOptions(
     baseUrl: AppConfig.tatlockApiUrl,

lib/core/api/api_interceptors.dart

@@ -10,8 +10,7 @@ import 'package:tatlock_ui/core/error/app_exception.dart';
 /// Adds authentication token to requests.
 ///
 /// - **LAN mode**: Skipped entirely (no auth required)
-/// - **Web**: Skipped (cookies handle auth via NPM forward auth)
+/// - **Web + Mobile**: Adds Bearer token from OIDC authentication
-/// - **Mobile**: Adds Bearer token from OIDC authentication
 class AuthInterceptor extends Interceptor {
   AuthInterceptor(this._ref);
 
@@ -25,17 +24,11 @@ class AuthInterceptor extends Interceptor {
       return;
     }
 
-    // Skip Bearer token on web - cookies handle auth via NPM forward auth
+    // Add Bearer token for all platforms (web + mobile)
-    if (kIsWeb) {
-      handler.next(options);
-      return;
-    }
-
-    // Mobile: Add Bearer token from OIDC authentication
     final authState = _ref.read(authProvider);
 
     authState.whenData((auth) {
-      if (auth.isAuthenticated && auth.accessToken != null && auth.accessToken != 'web-session') {
+      if (auth.isAuthenticated && auth.accessToken != null) {
         options.headers['Authorization'] = 'Bearer ${auth.accessToken}';
       }
     });

lib/core/auth/auth_controller.dart

@@ -0,0 +1,288 @@
+import 'dart:convert' show jsonDecode, jsonEncode;
+import 'dart:developer' as developer;
+
+import 'package:dio/dio.dart';
+import 'package:flutter/foundation.dart' show kIsWeb;
+import 'package:shared_preferences/shared_preferences.dart';
+
+import '../config/app_config.dart';
+import 'auth_datasource.dart';
+import 'auth_state.dart';
+import 'oidc_service_web.dart';
+import 'permissions.dart';
+import 'user_preferences.dart';
+import 'web_utils.dart' as web_utils;
+
+/// Standalone auth controller that handles OIDC flow before app starts.
+///
+/// This runs outside of Riverpod to avoid lifecycle issues. Call [initialize]
+/// in main() before runApp(). The controller will:
+/// 1. Handle callback if on /callback route (exchange code, sync, store tokens)
+/// 2. Check for valid stored tokens
+/// 3. Redirect to silent OIDC if no tokens (app won't continue)
+///
+/// Once auth is complete, [AuthProvider] can simply read the stored tokens.
+class AuthController {
+  // Storage keys (same as AuthProvider)
+  static const _accessTokenKey = 'auth_access_token';
+  static const _refreshTokenKey = 'auth_refresh_token';
+  static const _expiresAtKey = 'auth_expires_at';
+  static const _userIdKey = 'auth_user_id';
+  static const _authentikIdKey = 'auth_authentik_id';
+  static const _userNameKey = 'auth_user_name';
+  static const _userEmailKey = 'auth_user_email';
+  static const _avatarUrlKey = 'auth_avatar_url';
+  static const _rolesKey = 'auth_roles';
+  static const _preferencesKey = 'auth_preferences';
+
+  /// Initialize auth before app starts.
+  ///
+  /// Returns true if auth is ready (tokens available).
+  /// Returns false if redirecting (app should not continue).
+  /// Throws on error.
+  static Future<bool> initialize() async {
+    // Skip auth entirely for LAN mode
+    if (!AppConfig.requiresAuth) {
+      developer.log('Auth not required (LAN mode)', name: 'auth_controller');
+      return true;
+    }
+
+    // Only handle web auth here - mobile uses different flow
+    if (!kIsWeb) {
+      developer.log('Non-web platform, skipping controller init', name: 'auth_controller');
+      return true;
+    }
+
+    final currentUrl = web_utils.getCurrentUrl();
+    developer.log('Auth controller init, URL: $currentUrl', name: 'auth_controller');
+
+    // Check if we're on the callback route
+    if (currentUrl.contains('/callback')) {
+      return _handleCallback(currentUrl);
+    }
+
+    // Check for valid stored tokens
+    final prefs = await SharedPreferences.getInstance();
+    final accessToken = prefs.getString(_accessTokenKey);
+    if (accessToken != null) {
+      final expiresAtMs = prefs.getInt(_expiresAtKey);
+      final expiresAt = expiresAtMs != null
+          ? DateTime.fromMillisecondsSinceEpoch(expiresAtMs)
+          : null;
+
+      if (expiresAt == null || expiresAt.isAfter(DateTime.now())) {
+        developer.log('Valid tokens found', name: 'auth_controller');
+        return true; // Auth ready
+      }
+      developer.log('Tokens expired', name: 'auth_controller');
+    }
+
+    // No valid tokens - initiate silent OIDC
+    developer.log('No valid tokens, starting silent OIDC', name: 'auth_controller');
+    await _initiateSilentOidc();
+    return false; // Redirecting, app should not continue
+  }
+
+  /// Handle the OIDC callback.
+  static Future<bool> _handleCallback(String url) async {
+    final uri = Uri.parse(url);
+    final code = uri.queryParameters['code'];
+    final state = uri.queryParameters['state'];
+    final error = uri.queryParameters['error'];
+
+    developer.log('Handling callback: code=${code != null}, error=$error', name: 'auth_controller');
+
+    // Handle errors
+    if (error != null) {
+      if (error == 'login_required') {
+        // Silent auth failed - no session, start regular OIDC
+        developer.log('Silent auth failed (login_required), starting regular OIDC', name: 'auth_controller');
+        await _initiateRegularOidc();
+        return false;
+      }
+      throw Exception('Auth error: $error - ${uri.queryParameters['error_description']}');
+    }
+
+    if (code == null || state == null) {
+      throw Exception('Invalid callback - missing code or state');
+    }
+
+    // Exchange code for tokens
+    developer.log('Exchanging code for tokens', name: 'auth_controller');
+    final oidcService = OidcServiceWeb();
+    final tokens = await oidcService.exchangeCode(code, state);
+
+    // Sync with core-api
+    developer.log('Syncing with core-api', name: 'auth_controller');
+    final dio = Dio(BaseOptions(
+      baseUrl: AppConfig.coreApiUrl,
+      headers: {
+        'Content-Type': 'application/json',
+        'Accept': 'application/json',
+      },
+    ));
+    final authDatasource = AuthDatasource(dio);
+    final syncResponse = await authDatasource.syncUser(tokens.accessToken);
+
+    developer.log('Synced user: ${syncResponse.name}', name: 'auth_controller');
+
+    // Store credentials
+    await _storeAuth(
+      accessToken: tokens.accessToken,
+      refreshToken: tokens.refreshToken,
+      expiresAt: tokens.expiresAt,
+      userId: syncResponse.userId,
+      authentikId: syncResponse.authentikId,
+      userName: syncResponse.name,
+      userEmail: syncResponse.email,
+      avatarUrl: syncResponse.avatarUrl,
+      roles: syncResponse.roles,
+      preferences: syncResponse.preferences,
+    );
+
+    // Redirect to home (removes callback params from URL)
+    developer.log('Auth complete, redirecting to home', name: 'auth_controller');
+    web_utils.redirectTo('/');
+    return false; // Redirecting
+  }
+
+  /// Initiate silent OIDC (prompt=none).
+  static Future<void> _initiateSilentOidc() async {
+    final oidcService = OidcServiceWeb();
+    final authUrl = await oidcService.getAuthorizationUrl(silent: true);
+    developer.log('Redirecting to silent OIDC', name: 'auth_controller');
+    web_utils.redirectTo(authUrl);
+  }
+
+  /// Initiate regular OIDC (shows login UI).
+  static Future<void> _initiateRegularOidc() async {
+    final oidcService = OidcServiceWeb();
+    final authUrl = await oidcService.getAuthorizationUrl(silent: false);
+    developer.log('Redirecting to regular OIDC', name: 'auth_controller');
+    web_utils.redirectTo(authUrl);
+  }
+
+  /// Store auth data.
+  static Future<void> _storeAuth({
+    required String accessToken,
+    String? refreshToken,
+    DateTime? expiresAt,
+    String? userId,
+    String? authentikId,
+    String? userName,
+    String? userEmail,
+    String? avatarUrl,
+    List<Role>? roles,
+    UserPreferences? preferences,
+  }) async {
+    final prefs = await SharedPreferences.getInstance();
+
+    await prefs.setString(_accessTokenKey, accessToken);
+    if (refreshToken != null) {
+      await prefs.setString(_refreshTokenKey, refreshToken);
+    }
+    if (expiresAt != null) {
+      await prefs.setInt(_expiresAtKey, expiresAt.millisecondsSinceEpoch);
+    }
+    if (userId != null) await prefs.setString(_userIdKey, userId);
+    if (authentikId != null) await prefs.setString(_authentikIdKey, authentikId);
+    if (userName != null) await prefs.setString(_userNameKey, userName);
+    if (userEmail != null) await prefs.setString(_userEmailKey, userEmail);
+    if (avatarUrl != null) await prefs.setString(_avatarUrlKey, avatarUrl);
+
+    if (roles != null) {
+      final rolesJson = jsonEncode(roles.map((r) => {
+        'id': r.id,
+        'name': r.name,
+        'domain': r.domain.value,
+        'category': r.category,
+        'action': r.action.name,
+      }).toList());
+      await prefs.setString(_rolesKey, rolesJson);
+    }
+
+    if (preferences != null) {
+      await prefs.setString(_preferencesKey, jsonEncode(preferences.toJson()));
+    }
+  }
+
+  /// Load stored auth state (for AuthProvider to use).
+  static Future<AuthState> loadStoredAuth() async {
+    try {
+      final prefs = await SharedPreferences.getInstance();
+
+      final accessToken = prefs.getString(_accessTokenKey);
+      if (accessToken == null) {
+        return const AuthState();
+      }
+
+      final expiresAtMs = prefs.getInt(_expiresAtKey);
+      final expiresAt = expiresAtMs != null
+          ? DateTime.fromMillisecondsSinceEpoch(expiresAtMs)
+          : null;
+
+      final rolesJson = prefs.getString(_rolesKey);
+      final roles = rolesJson != null ? _parseRoles(rolesJson) : <Role>[];
+
+      final prefsJson = prefs.getString(_preferencesKey);
+      final preferences = prefsJson != null
+          ? UserPreferences.fromJson(jsonDecode(prefsJson) as Map<String, dynamic>)
+          : null;
+
+      return AuthState(
+        isAuthenticated: true,
+        accessToken: accessToken,
+        refreshToken: prefs.getString(_refreshTokenKey),
+        expiresAt: expiresAt,
+        userId: prefs.getString(_userIdKey),
+        authentikId: prefs.getString(_authentikIdKey),
+        userName: prefs.getString(_userNameKey),
+        userEmail: prefs.getString(_userEmailKey),
+        avatarUrl: prefs.getString(_avatarUrlKey),
+        roles: roles,
+        preferences: preferences,
+      );
+    } catch (e) {
+      developer.log('Failed to load stored auth: $e', name: 'auth_controller');
+      return const AuthState();
+    }
+  }
+
+  static List<Role> _parseRoles(String json) {
+    try {
+      final list = jsonDecode(json) as List<dynamic>;
+      return list.map((item) {
+        final map = item as Map<String, dynamic>;
+        final domain = Domain.fromString(map['domain'] as String);
+        final action = Action.fromString(map['action'] as String);
+
+        if (domain == null || action == null) return null;
+
+        return Role(
+          id: map['id'] as String,
+          name: map['name'] as String,
+          domain: domain,
+          category: map['category'] as String? ?? 'general',
+          action: action,
+        );
+      }).whereType<Role>().toList();
+    } catch (e) {
+      return [];
+    }
+  }
+
+  /// Clear stored auth (for logout).
+  static Future<void> clearAuth() async {
+    final prefs = await SharedPreferences.getInstance();
+    await prefs.remove(_accessTokenKey);
+    await prefs.remove(_refreshTokenKey);
+    await prefs.remove(_expiresAtKey);
+    await prefs.remove(_userIdKey);
+    await prefs.remove(_authentikIdKey);
+    await prefs.remove(_userNameKey);
+    await prefs.remove(_userEmailKey);
+    await prefs.remove(_avatarUrlKey);
+    await prefs.remove(_rolesKey);
+    await prefs.remove(_preferencesKey);
+  }
+}

lib/core/auth/auth_provider.dart

@@ -1,4 +1,4 @@
-import 'dart:convert';
+import 'dart:convert' show jsonDecode, jsonEncode;
 import 'dart:developer' as developer;
 
 import 'package:flutter/foundation.dart' show kIsWeb;
@@ -6,6 +6,7 @@ import 'package:riverpod_annotation/riverpod_annotation.dart';
 import 'package:shared_preferences/shared_preferences.dart';
 
 import '../config/app_config.dart';
+import '../providers/annotations.dart';
 import 'auth_datasource.dart';
 import 'auth_state.dart';
 import 'oidc_service.dart';
@@ -24,7 +25,7 @@ part 'auth_provider.g.dart';
 ///
 /// After OIDC authentication, syncs with core-api via POST /auth/sync
 /// to get user profile, roles, and preferences.
-@riverpod
+@persistentRiverpod
 class AuthNotifier extends _$AuthNotifier {
   // Storage keys
   static const _accessTokenKey = 'auth_access_token';
@@ -40,7 +41,9 @@ class AuthNotifier extends _$AuthNotifier {
 
   @override
   Future<AuthState> build() async {
-    // Load stored auth on all platforms
+    // AuthController.initialize() in main() handles OIDC flow before app starts.
+    // By the time we get here, tokens are already stored (or we're in LAN mode).
+    // Just load the stored auth state.
     return _loadStoredAuth();
   }
 
@@ -270,7 +273,12 @@ class AuthNotifier extends _$AuthNotifier {
       final authDatasource = ref.read(authDatasourceProvider);
       final syncResponse = await authDatasource.syncUser(tokens.accessToken);
 
-      // Step 3: Store credentials and user data
+      developer.log(
+        'Synced user: ${syncResponse.name} with ${syncResponse.roles.length} roles',
+        name: 'auth',
+      );
+
+      // Step 3: Store credentials and user data from sync response
       await _storeAuth(
         accessToken: tokens.accessToken,
         refreshToken: tokens.refreshToken,
@@ -298,10 +306,7 @@ class AuthNotifier extends _$AuthNotifier {
         preferences: syncResponse.preferences,
       ));
 
-      developer.log(
+      developer.log('Authenticated as ${syncResponse.name}', name: 'auth');
-        'Authenticated as ${syncResponse.name} with ${syncResponse.roles.length} roles',
-        name: 'auth',
-      );
 
       // Clean up the URL by removing the query parameters
       web_utils.replaceUrl('/');
@@ -315,10 +320,27 @@ class AuthNotifier extends _$AuthNotifier {
   }
 
   /// Sign out and clear stored credentials.
+  ///
+  /// On web, also redirects to Authentik's logout endpoint to end the SSO session.
   Future<void> signOut() async {
+    // Clear local storage first
     await _clearStoredAuth();
     state = const AsyncData(AuthState());
-    developer.log('Signed out', name: 'auth');
+    developer.log('Signed out locally', name: 'auth');
+
+    // On web, redirect to Authentik logout to end SSO session
+    if (kIsWeb && AppConfig.requiresAuth) {
+      try {
+        final oidcService = OidcServiceWeb();
+        final logoutUrl = await oidcService.getLogoutUrl();
+        developer.log('Redirecting to Authentik logout', name: 'auth');
+        web_utils.redirectTo(logoutUrl);
+      } catch (e) {
+        developer.log('Failed to get logout URL: $e', name: 'auth');
+        // Local logout already done, just reload to trigger re-auth
+        web_utils.redirectTo('/');
+      }
+    }
   }
 
   /// Update user preferences.

lib/core/auth/oidc_service_web.dart

@@ -34,7 +34,12 @@ class OidcServiceWeb implements OidcService {
   ///
   /// Returns a URL that the browser should navigate to for authentication.
   /// The [codeVerifier] and [state] are stored for later verification.
-  Future<String> getAuthorizationUrl() async {
+  ///
+  /// If [silent] is true, adds `prompt=none` to skip login UI.
+  /// This is used when the user already has an Authentik session (via NPM).
+  /// Authentik will instantly redirect back with a code, or return an error
+  /// if there's no valid session.
+  Future<String> getAuthorizationUrl({bool silent = false}) async {
     // Fetch OIDC discovery document
     final discovery = await _fetchDiscovery();
     final authEndpoint = discovery['authorization_endpoint'] as String;
@@ -59,10 +64,11 @@ class OidcServiceWeb implements OidcService {
       'code_challenge': codeChallenge,
       'code_challenge_method': 'S256',
       'state': state,
+      if (silent) 'prompt': 'none', // Silent auth - no UI, instant redirect
     };
 
     final uri = Uri.parse(authEndpoint).replace(queryParameters: params);
-    developer.log('Authorization URL: $uri', name: 'oidc_web');
+    developer.log('Authorization URL (silent=$silent): $uri', name: 'oidc_web');
     return uri.toString();
   }
 
@@ -209,4 +215,31 @@ class OidcServiceWeb implements OidcService {
     return List.generate(length, (_) => chars[random.nextInt(chars.length)])
         .join();
   }
+
+  /// Get the logout URL to redirect the browser to for SSO logout.
+  ///
+  /// [idToken] is optional but recommended for logout verification.
+  /// After logout, Authentik redirects back to [postLogoutRedirectUri].
+  Future<String> getLogoutUrl({String? idToken}) async {
+    final discovery = await _fetchDiscovery();
+    final endSessionEndpoint = discovery['end_session_endpoint'] as String?;
+
+    if (endSessionEndpoint == null) {
+      // Fallback: just redirect to home, local state already cleared
+      developer.log('No end_session_endpoint in discovery', name: 'oidc_web');
+      return AppConfig.webBaseUrl;
+    }
+
+    final params = <String, String>{
+      'post_logout_redirect_uri': AppConfig.webBaseUrl,
+    };
+
+    if (idToken != null) {
+      params['id_token_hint'] = idToken;
+    }
+
+    final uri = Uri.parse(endSessionEndpoint).replace(queryParameters: params);
+    developer.log('Logout URL: $uri', name: 'oidc_web');
+    return uri.toString();
+  }
 }

lib/core/providers/annotations.dart

@@ -0,0 +1,15 @@
+import 'package:riverpod_annotation/riverpod_annotation.dart';
+
+/// Riverpod annotation for providers that should persist for the app lifetime.
+///
+/// Use this instead of `@riverpod` when:
+/// - The provider holds app-level state (theme, auth, config)
+/// - The provider stores a Ref that must remain valid (API clients with interceptors)
+/// - Disposing would cause flickering or re-initialization issues
+///
+/// Example:
+/// ```dart
+/// @persistentRiverpod
+/// class ThemeNotifier extends _$ThemeNotifier { ... }
+/// ```
+const persistentRiverpod = Riverpod(keepAlive: true);

lib/core/theme/theme_provider.dart

@@ -1,6 +1,10 @@
+import 'dart:developer' as developer;
+
 import 'package:flutter/material.dart';
 import 'package:riverpod_annotation/riverpod_annotation.dart';
 import 'package:shared_preferences/shared_preferences.dart';
+import 'package:tatlock_ui/core/auth/auth_provider.dart';
+import 'package:tatlock_ui/core/providers/annotations.dart';
 
 part 'theme_provider.g.dart';
 
@@ -17,13 +21,21 @@ enum ThemeSetting {
 }
 
 /// Provider for theme setting state.
-@riverpod
+///
+/// Syncs with API preferences when user is authenticated. On login, the theme
+/// from API preferences takes precedence over local storage.
+@persistentRiverpod
 class ThemeNotifier extends _$ThemeNotifier {
   static const _prefsKey = 'theme_setting';
 
   @override
   ThemeSetting build() {
+    // Load local setting first for immediate UI
     _loadSavedSetting();
+
+    // Listen for auth state changes to sync from API preferences
+    _syncFromAuthPreferences();
+
     return ThemeSetting.system;
   }
 
@@ -39,6 +51,36 @@ class ThemeNotifier extends _$ThemeNotifier {
     }
   }
 
+  /// Listen to auth state and sync theme from API preferences.
+  void _syncFromAuthPreferences() {
+    ref.listen(authProvider, (_, next) {
+      next.whenData((auth) {
+        final apiTheme = auth.preferences?.theme;
+        if (apiTheme != null && apiTheme.isNotEmpty) {
+          try {
+            final themeSetting = ThemeSetting.values.byName(apiTheme);
+            if (themeSetting != state) {
+              developer.log(
+                'Syncing theme from API: $apiTheme',
+                name: 'theme',
+              );
+              state = themeSetting;
+              // Also persist to local storage for offline use
+              _saveToLocalStorage(themeSetting);
+            }
+          } catch (_) {
+            // Invalid theme value from API, keep current
+          }
+        }
+      });
+    });
+  }
+
+  Future<void> _saveToLocalStorage(ThemeSetting setting) async {
+    final prefs = await SharedPreferences.getInstance();
+    await prefs.setString(_prefsKey, setting.name);
+  }
+
   /// Update theme setting and persist to storage.
   Future<void> setSetting(ThemeSetting setting) async {
     state = setting;

lib/features/control_room/presentation/pages/control_room_page.dart

@@ -69,44 +69,11 @@ class _SectionContent extends ConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    switch (nav) {
+    return switch (nav) {
-      case ControlRoomNav.containers:
+      ControlRoomNav.containers => const _ContainersSection(),
-        return const _ContainersSection();
+      ControlRoomNav.proxyHosts => const ProxyHostsPage(),
-      case ControlRoomNav.proxyHosts:
+      _ => _PlaceholderSection(nav: nav),
-        return const ProxyHostsPage();
+    };
-      default:
-        return _PlaceholderSection(nav: nav);
-    }
-  }
-}
-
-/// Containers section with optional stack filter.
-class _ContainersSection extends ConsumerWidget {
-  const _ContainersSection();
-
-  @override
-  Widget build(BuildContext context, WidgetRef ref) {
-    final selectedStack = ref.watch(selectedStackProvider);
-    final colorScheme = Theme.of(context).colorScheme;
-
-    return Row(
-      children: [
-        // Stacks filter panel
-        const _StacksFilterPanel(),
-        // Divider
-        VerticalDivider(
-          width: 1,
-          thickness: 1,
-          color: colorScheme.outlineVariant,
-        ),
-        // Main content - containers list or stack detail
-        Expanded(
-          child: selectedStack == null
-              ? const ContainersListPage()
-              : StackDetailPage(stackId: selectedStack),
-        ),
-      ],
-    );
   }
 }
 
@@ -150,6 +117,36 @@ class _PlaceholderSection extends StatelessWidget {
   }
 }
 
+/// Containers section with optional stack filter.
+class _ContainersSection extends ConsumerWidget {
+  const _ContainersSection();
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final selectedStack = ref.watch(selectedStackProvider);
+    final colorScheme = Theme.of(context).colorScheme;
+
+    return Row(
+      children: [
+        // Stacks filter panel
+        const _StacksFilterPanel(),
+        // Divider
+        VerticalDivider(
+          width: 1,
+          thickness: 1,
+          color: colorScheme.outlineVariant,
+        ),
+        // Main content - containers list or stack detail
+        Expanded(
+          child: selectedStack == null
+              ? const ContainersListPage()
+              : StackDetailPage(stackId: selectedStack),
+        ),
+      ],
+    );
+  }
+}
+
 /// Stacks filter panel for Containers section (includes "All Containers" option).
 class _StacksFilterPanel extends ConsumerWidget {
   const _StacksFilterPanel();

lib/features/control_room/router.dart

@@ -1,35 +1,32 @@
 import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
 import 'package:tatlock_ui/features/control_room/presentation/pages/control_room_page.dart';
+import 'package:tatlock_ui/routing/app_router.dart';
 import 'package:tatlock_ui/shared/layouts/widgets/nav_panel.dart';
 
 /// Route paths for Control Room.
 abstract class ControlRoomRoutes {
   static const base = '/control-room';
-  // Portainer
+  // Stack
   static const containers = '/control-room/containers';
-  static const networks = '/control-room/networks';
-  static const volumes = '/control-room/volumes';
-  static const images = '/control-room/images';
-  // NPM
   static const proxyHosts = '/control-room/proxy-hosts';
-  static const redirections = '/control-room/redirections';
+  // Data Management
-  static const streams = '/control-room/streams';
+  static const postgres = '/control-room/postgres';
-  static const certificates = '/control-room/certificates';
+  static const redis = '/control-room/redis';
+  static const qdrant = '/control-room/qdrant';
+  static const neo4j = '/control-room/neo4j';
 }
 
 /// Control Room navigation items with section grouping.
 enum ControlRoomNav {
-  // Portainer section
+  // Stack Management section - Docker containers and reverse proxy
-  containers('containers', 'Containers', Icons.dns, 'Portainer'),
+  containers('containers', 'Containers', Icons.dns, 'Stack Management'),
-  networks('networks', 'Networks', Icons.hub, 'Portainer'),
+  proxyHosts('proxy-hosts', 'Proxy Hosts', Icons.public, 'Stack Management'),
-  volumes('volumes', 'Volumes', Icons.storage, 'Portainer'),
+  // Data Management section - Database browsers
-  images('images', 'Images', Icons.photo_library, 'Portainer'),
+  postgres('postgres', 'PostgreSQL', Icons.table_chart, 'Data Management'),
-  // NPM section
+  redis('redis', 'Redis', Icons.memory, 'Data Management'),
-  proxyHosts('proxy-hosts', 'Proxy Hosts', Icons.public, 'NPM'),
+  qdrant('qdrant', 'Qdrant', Icons.scatter_plot, 'Data Management'),
-  redirections('redirections', 'Redirections', Icons.alt_route, 'NPM'),
+  neo4j('neo4j', 'Neo4j', Icons.hub, 'Data Management');
-  streams('streams', 'Streams', Icons.stream, 'NPM'),
-  certificates('certificates', 'SSL Certificates', Icons.verified_user, 'NPM');
 
   const ControlRoomNav(this.id, this.label, this.icon, this.section);
 
@@ -66,7 +63,8 @@ List<RouteBase> controlRoomRoutes() {
       GoRoute(
         path: nav.path,
         name: 'controlRoom${_capitalize(nav.id.replaceAll('-', '_'))}',
-        builder: (context, state) => ControlRoomPage(nav: nav),
+        pageBuilder: (context, state) =>
+            noTransitionPage(context, state, ControlRoomPage(nav: nav)),
       ),
   ];
 }

lib/features/front_hall/presentation/widgets/iframe_view_web.dart

@@ -1,8 +1,8 @@
-import 'dart:html' as html;
 import 'dart:ui_web' as ui_web;
 
 import 'package:flutter/material.dart';
 import 'package:url_launcher/url_launcher.dart';
+import 'package:web/web.dart' as web;
 
 /// Embedded iframe view for displaying external content (web only).
 ///
@@ -31,7 +31,7 @@ class IframeView extends StatefulWidget {
 
 class _IframeViewState extends State<IframeView> {
   late final String _viewType;
-  late html.IFrameElement _iframe;
+  late web.HTMLIFrameElement _iframe;
   bool _isLoading = true;
 
   @override
@@ -42,17 +42,18 @@ class _IframeViewState extends State<IframeView> {
   }
 
   void _createIframe() {
-    _iframe = html.IFrameElement()
+    _iframe = web.document.createElement('iframe') as web.HTMLIFrameElement
       ..src = widget.url
       ..style.border = 'none'
       ..style.width = '100%'
       ..style.height = '100%'
-      ..allow = 'fullscreen'
+      ..allow = 'fullscreen';
-      ..onLoad.listen((_) {
+
-        if (mounted) {
+    _iframe.onLoad.listen((_) {
-          setState(() => _isLoading = false);
+      if (mounted) {
-        }
+        setState(() => _isLoading = false);
-      });
+      }
+    });
 
     // Register the view factory
     ui_web.platformViewRegistry.registerViewFactory(

lib/features/security/router.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
 import 'package:tatlock_ui/features/security/presentation/pages/security_page.dart';
+import 'package:tatlock_ui/routing/app_router.dart';
 import 'package:tatlock_ui/shared/layouts/widgets/nav_panel.dart';
 
 /// Route paths for Security room.
@@ -60,7 +61,8 @@ List<RouteBase> securityRoutes() {
       GoRoute(
         path: nav.path,
         name: 'security${_capitalize(nav.id.replaceAll('-', '_'))}',
-        builder: (context, state) => SecurityPage(nav: nav),
+        pageBuilder: (context, state) =>
+            noTransitionPage(context, state, SecurityPage(nav: nav)),
       ),
   ];
 }

lib/features/settings/presentation/pages/settings_page.dart

@@ -0,0 +1,306 @@
+import 'dart:developer' as developer;
+
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:tatlock_ui/core/auth/auth_provider.dart';
+import 'package:tatlock_ui/core/theme/theme_provider.dart';
+
+/// Settings page with user preferences.
+class SettingsPage extends ConsumerWidget {
+  const SettingsPage({super.key});
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final authState = ref.watch(authProvider);
+    final currentTheme = ref.watch(themeProvider);
+    final colorScheme = Theme.of(context).colorScheme;
+    final textTheme = Theme.of(context).textTheme;
+
+    return Scaffold(
+      body: authState.when(
+        data: (auth) => SingleChildScrollView(
+          padding: const EdgeInsets.all(24),
+          child: Center(
+            child: ConstrainedBox(
+              constraints: const BoxConstraints(maxWidth: 600),
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: [
+                  // Page header
+                  Text(
+                    'Settings',
+                    style: textTheme.headlineMedium,
+                  ),
+                  const SizedBox(height: 32),
+
+                  // Appearance section
+                  _SectionHeader(title: 'Appearance'),
+                  const SizedBox(height: 8),
+                  Card(
+                    child: Padding(
+                      padding: const EdgeInsets.all(16),
+                      child: Row(
+                        children: [
+                          Icon(
+                            _themeIcon(currentTheme),
+                            color: colorScheme.onSurfaceVariant,
+                          ),
+                          const SizedBox(width: 16),
+                          Expanded(
+                            child: Column(
+                              crossAxisAlignment: CrossAxisAlignment.start,
+                              children: [
+                                Text('Theme', style: textTheme.titleMedium),
+                                Text(
+                                  'Choose your preferred color scheme',
+                                  style: textTheme.bodySmall?.copyWith(
+                                    color: colorScheme.onSurfaceVariant,
+                                  ),
+                                ),
+                              ],
+                            ),
+                          ),
+                          DropdownButton<ThemeSetting>(
+                            value: currentTheme,
+                            underline: const SizedBox(),
+                            onChanged: (value) {
+                              if (value != null) {
+                                _updateTheme(ref, value);
+                              }
+                            },
+                            items: const [
+                              DropdownMenuItem(
+                                value: ThemeSetting.system,
+                                child: Text('System'),
+                              ),
+                              DropdownMenuItem(
+                                value: ThemeSetting.light,
+                                child: Text('Light'),
+                              ),
+                              DropdownMenuItem(
+                                value: ThemeSetting.dark,
+                                child: Text('Dark'),
+                              ),
+                            ],
+                          ),
+                        ],
+                      ),
+                    ),
+                  ),
+
+                  const SizedBox(height: 24),
+
+                  // Navigation section
+                  _SectionHeader(title: 'Navigation'),
+                  const SizedBox(height: 8),
+                  Card(
+                    child: Padding(
+                      padding: const EdgeInsets.all(16),
+                      child: Row(
+                        children: [
+                          Icon(
+                            Icons.home_outlined,
+                            color: colorScheme.onSurfaceVariant,
+                          ),
+                          const SizedBox(width: 16),
+                          Expanded(
+                            child: Column(
+                              crossAxisAlignment: CrossAxisAlignment.start,
+                              children: [
+                                Text(
+                                  'Default Room',
+                                  style: textTheme.titleMedium,
+                                ),
+                                Text(
+                                  'Room to show when app opens',
+                                  style: textTheme.bodySmall?.copyWith(
+                                    color: colorScheme.onSurfaceVariant,
+                                  ),
+                                ),
+                              ],
+                            ),
+                          ),
+                          DropdownButton<String>(
+                            value:
+                                auth.preferences?.defaultRoom ?? 'front-hall',
+                            underline: const SizedBox(),
+                            onChanged: (value) {
+                              if (value != null) {
+                                _updateDefaultRoom(ref, value);
+                              }
+                            },
+                            items: const [
+                              DropdownMenuItem(
+                                value: 'front-hall',
+                                child: Text('Front Hall'),
+                              ),
+                              DropdownMenuItem(
+                                value: 'control-room',
+                                child: Text('Control Room'),
+                              ),
+                              DropdownMenuItem(
+                                value: 'parlor',
+                                child: Text('Parlor'),
+                              ),
+                            ],
+                          ),
+                        ],
+                      ),
+                    ),
+                  ),
+
+                  const SizedBox(height: 24),
+
+                  // Account section
+                  _SectionHeader(title: 'Account'),
+                  const SizedBox(height: 8),
+                  Card(
+                    child: Column(
+                      children: [
+                        _AccountInfoTile(
+                          icon: Icons.person_outline,
+                          label: 'Name',
+                          value: auth.userName ?? 'Not available',
+                        ),
+                        const Divider(height: 1),
+                        _AccountInfoTile(
+                          icon: Icons.email_outlined,
+                          label: 'Email',
+                          value: auth.userEmail ?? 'Not available',
+                        ),
+                        if (auth.roles.isNotEmpty) ...[
+                          const Divider(height: 1),
+                          _AccountInfoTile(
+                            icon: Icons.shield_outlined,
+                            label: 'Roles',
+                            value: auth.roles.map((r) => r.name).join(', '),
+                          ),
+                        ],
+                      ],
+                    ),
+                  ),
+                ],
+              ),
+            ),
+          ),
+        ),
+        loading: () => const Center(child: CircularProgressIndicator()),
+        error: (error, _) => Center(
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              Icon(Icons.error_outline, size: 48, color: colorScheme.error),
+              const SizedBox(height: 16),
+              Text(
+                'Failed to load settings',
+                style: textTheme.titleMedium,
+              ),
+              const SizedBox(height: 8),
+              Text(
+                error.toString(),
+                style: textTheme.bodySmall?.copyWith(
+                  color: colorScheme.onSurfaceVariant,
+                ),
+              ),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+
+  IconData _themeIcon(ThemeSetting theme) {
+    return switch (theme) {
+      ThemeSetting.system => Icons.brightness_auto,
+      ThemeSetting.light => Icons.light_mode,
+      ThemeSetting.dark => Icons.dark_mode,
+    };
+  }
+
+  Future<void> _updateTheme(WidgetRef ref, ThemeSetting setting) async {
+    // Update local theme immediately for instant UI response
+    await ref.read(themeProvider.notifier).setSetting(setting);
+
+    // Sync to backend
+    try {
+      await ref.read(authProvider.notifier).updatePreferences(
+            theme: setting.name,
+          );
+    } catch (e) {
+      developer.log('Failed to sync theme preference: $e', name: 'settings');
+    }
+  }
+
+  Future<void> _updateDefaultRoom(WidgetRef ref, String room) async {
+    try {
+      await ref.read(authProvider.notifier).updatePreferences(
+            defaultRoom: room,
+          );
+    } catch (e) {
+      developer.log('Failed to sync default room: $e', name: 'settings');
+    }
+  }
+}
+
+/// Section header widget.
+class _SectionHeader extends StatelessWidget {
+  const _SectionHeader({required this.title});
+
+  final String title;
+
+  @override
+  Widget build(BuildContext context) {
+    final colorScheme = Theme.of(context).colorScheme;
+    final textTheme = Theme.of(context).textTheme;
+
+    return Text(
+      title.toUpperCase(),
+      style: textTheme.labelMedium?.copyWith(
+        color: colorScheme.primary,
+        letterSpacing: 1.0,
+        fontWeight: FontWeight.w600,
+      ),
+    );
+  }
+}
+
+/// Account info tile widget.
+class _AccountInfoTile extends StatelessWidget {
+  const _AccountInfoTile({
+    required this.icon,
+    required this.label,
+    required this.value,
+  });
+
+  final IconData icon;
+  final String label;
+  final String value;
+
+  @override
+  Widget build(BuildContext context) {
+    final colorScheme = Theme.of(context).colorScheme;
+    final textTheme = Theme.of(context).textTheme;
+
+    return Padding(
+      padding: const EdgeInsets.all(16),
+      child: Row(
+        children: [
+          Icon(icon, color: colorScheme.onSurfaceVariant),
+          const SizedBox(width: 16),
+          Expanded(
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Text(label, style: textTheme.bodySmall?.copyWith(
+                  color: colorScheme.onSurfaceVariant,
+                )),
+                const SizedBox(height: 2),
+                Text(value, style: textTheme.titleMedium),
+              ],
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}

lib/main.dart

@@ -4,19 +4,26 @@ import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 
 import 'app.dart';
+import 'core/auth/auth_controller.dart';
 import 'core/config/url_strategy.dart';
 import 'version.g.dart';
 
-void main() {
+void main() async {
   WidgetsFlutterBinding.ensureInitialized();
 
   // Use path-based URLs on web (no-op on mobile/desktop)
   configureUrlStrategy();
 
-  developer.log(
+  debugPrint('🪣 ${AppVersion.name} v${AppVersion.fullVersion}');
-    '${AppVersion.name} v${AppVersion.fullVersion}',
+
-    name: 'tatlock_ui',
+  // Initialize auth before starting the app.
-  );
+  // This handles OIDC callback and silent auth on web.
+  // If it returns false, we're redirecting and shouldn't continue.
+  final authReady = await AuthController.initialize();
+  if (!authReady) {
+    developer.log('Auth redirecting, not starting app', name: 'tatlock_ui');
+    return; // Don't run the app - browser is redirecting
+  }
 
   runApp(const ProviderScope(child: TatlockApp()));
 }

lib/routing/app_router.dart

@@ -1,77 +1,36 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:go_router/go_router.dart';
 import 'package:riverpod_annotation/riverpod_annotation.dart';
-import 'package:tatlock_ui/core/auth/auth_provider.dart';
-import 'package:tatlock_ui/core/config/app_config.dart';
 import 'package:tatlock_ui/features/control_room/router.dart';
 import 'package:tatlock_ui/features/front_hall/presentation/pages/front_hall_page.dart';
 import 'package:tatlock_ui/features/security/router.dart';
+import 'package:tatlock_ui/features/settings/presentation/pages/settings_page.dart';
 import 'package:tatlock_ui/shared/layouts/app_scaffold.dart';
 
 part 'app_router.g.dart';
 
+/// No-animation page builder for instant transitions
+Page<void> noTransitionPage(BuildContext context, GoRouterState state, Widget child) {
+  return NoTransitionPage<void>(
+    key: state.pageKey,
+    child: child,
+  );
+}
+
 /// Route paths as constants.
 abstract class AppRoutes {
   static const frontHall = '/';
   static const parlor = '/parlor';
   static const settings = '/settings';
-  static const login = '/login';
-  static const callback = '/callback';
 }
 
 /// Provides the GoRouter instance.
 @riverpod
 GoRouter appRouter(Ref ref) {
-  final authState = ref.watch(authProvider);
-
   return GoRouter(
     initialLocation: AppRoutes.frontHall,
     debugLogDiagnostics: true,
-    redirect: (context, state) {
-      // No auth required in LAN mode
-      if (!AppConfig.requiresAuth) {
-        return null;
-      }
-
-      // Allow callback route through without auth check (must be checked FIRST!)
-      if (state.matchedLocation == AppRoutes.callback) {
-        return null;
-      }
-
-      final isAuthenticated = authState.value?.isAuthenticated ?? false;
-      final isLoginRoute = state.matchedLocation == AppRoutes.login;
-
-      // If not authenticated, redirect to login (except if already on login)
-      if (!isAuthenticated && !isLoginRoute) {
-        return AppRoutes.login;
-      }
-
-      // If authenticated and on login page, redirect to home
-      if (isAuthenticated && isLoginRoute) {
-        return AppRoutes.frontHall;
-      }
-
-      return null;
-    },
     routes: [
-      // Login route (outside shell - no app scaffold)
-      GoRoute(
-        path: AppRoutes.login,
-        name: 'login',
-        builder: (context, state) => const _LoginPage(),
-      ),
-      // OIDC callback route (handles auth code exchange)
-      GoRoute(
-        path: AppRoutes.callback,
-        name: 'callback',
-        builder: (context, state) => _OidcCallbackPage(
-          code: state.uri.queryParameters['code'],
-          callbackState: state.uri.queryParameters['state'],
-          error: state.uri.queryParameters['error'],
-          errorDescription: state.uri.queryParameters['error_description'],
-        ),
-      ),
       // Main app routes (inside shell with app scaffold)
       ShellRoute(
         builder: (context, state, child) => AppScaffold(child: child),
@@ -79,21 +38,22 @@ GoRouter appRouter(Ref ref) {
           GoRoute(
             path: AppRoutes.frontHall,
             name: 'frontHall',
-            builder: (context, state) => const FrontHallPage(),
+            pageBuilder: (context, state) =>
+                noTransitionPage(context, state, const FrontHallPage()),
           ),
           ...controlRoomRoutes(),
           ...securityRoutes(),
           GoRoute(
             path: AppRoutes.parlor,
             name: 'parlor',
-            builder: (context, state) =>
+            pageBuilder: (context, state) =>
-                const _PlaceholderPage(title: 'Parlor'),
+                noTransitionPage(context, state, const _PlaceholderPage(title: 'Parlor')),
           ),
           GoRoute(
             path: AppRoutes.settings,
             name: 'settings',
-            builder: (context, state) =>
+            pageBuilder: (context, state) =>
-                const _PlaceholderPage(title: 'Settings'),
+                noTransitionPage(context, state, const SettingsPage()),
           ),
         ],
       ),
@@ -136,260 +96,3 @@ class _PlaceholderPage extends StatelessWidget {
   }
 }
 
-/// Login page displayed when user is not authenticated.
-class _LoginPage extends ConsumerWidget {
-  const _LoginPage();
-
-  @override
-  Widget build(BuildContext context, WidgetRef ref) {
-    final authAsync = ref.watch(authProvider);
-    final colorScheme = Theme.of(context).colorScheme;
-
-    return Scaffold(
-      body: Center(
-        child: ConstrainedBox(
-          constraints: const BoxConstraints(maxWidth: 400),
-          child: Card(
-            child: Padding(
-              padding: const EdgeInsets.all(32),
-              child: Column(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  Icon(
-                    Icons.home_work_outlined,
-                    size: 64,
-                    color: colorScheme.primary,
-                  ),
-                  const SizedBox(height: 24),
-                  Text(
-                    'Tatlock Estate',
-                    style: Theme.of(context).textTheme.headlineMedium?.copyWith(
-                          fontWeight: FontWeight.w600,
-                        ),
-                  ),
-                  const SizedBox(height: 8),
-                  Text(
-                    'Sign in to access the estate management system',
-                    style: Theme.of(context).textTheme.bodyMedium?.copyWith(
-                          color: colorScheme.onSurfaceVariant,
-                        ),
-                    textAlign: TextAlign.center,
-                  ),
-                  const SizedBox(height: 32),
-                  authAsync.when(
-                    data: (_) => _buildSignInContent(context, ref),
-                    loading: () => const Column(
-                      children: [
-                        SizedBox(
-                          width: 24,
-                          height: 24,
-                          child: CircularProgressIndicator(strokeWidth: 2),
-                        ),
-                        SizedBox(height: 16),
-                        Text('Checking authentication...'),
-                      ],
-                    ),
-                    error: (error, _) => _buildErrorContent(context, ref, error),
-                  ),
-                ],
-              ),
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-
-  Widget _buildSignInContent(BuildContext context, WidgetRef ref) {
-    // Same sign in button for both web and mobile
-    return FilledButton.icon(
-      onPressed: () => ref.read(authProvider.notifier).signIn(),
-      icon: const Icon(Icons.login),
-      label: const Text('Sign in with Authentik'),
-      style: FilledButton.styleFrom(
-        minimumSize: const Size(double.infinity, 48),
-      ),
-    );
-  }
-
-  Widget _buildErrorContent(BuildContext context, WidgetRef ref, Object error) {
-    final colorScheme = Theme.of(context).colorScheme;
-
-    return Column(
-      children: [
-        Container(
-          padding: const EdgeInsets.all(12),
-          decoration: BoxDecoration(
-            color: colorScheme.errorContainer,
-            borderRadius: BorderRadius.circular(8),
-          ),
-          child: Row(
-            children: [
-              Icon(Icons.error_outline, color: colorScheme.onErrorContainer),
-              const SizedBox(width: 12),
-              Expanded(
-                child: Text(
-                  _formatError(error),
-                  style: TextStyle(color: colorScheme.onErrorContainer),
-                ),
-              ),
-            ],
-          ),
-        ),
-        const SizedBox(height: 16),
-        OutlinedButton.icon(
-          onPressed: () => ref.read(authProvider.notifier).signIn(),
-          icon: const Icon(Icons.refresh),
-          label: const Text('Try again'),
-          style: OutlinedButton.styleFrom(
-            minimumSize: const Size(double.infinity, 48),
-          ),
-        ),
-      ],
-    );
-  }
-
-  String _formatError(Object error) {
-    final message = error.toString();
-    if (message.contains('user_cancelled')) {
-      return 'Sign in was cancelled';
-    }
-    if (message.contains('network')) {
-      return 'Network error. Please check your connection.';
-    }
-    return 'Authentication failed. Please try again.';
-  }
-}
-
-/// OIDC callback page that handles the authorization code exchange.
-class _OidcCallbackPage extends ConsumerStatefulWidget {
-  const _OidcCallbackPage({
-    this.code,
-    this.callbackState,
-    this.error,
-    this.errorDescription,
-  });
-
-  final String? code;
-  final String? callbackState;
-  final String? error;
-  final String? errorDescription;
-
-  @override
-  ConsumerState<_OidcCallbackPage> createState() => _OidcCallbackPageState();
-}
-
-class _OidcCallbackPageState extends ConsumerState<_OidcCallbackPage> {
-  bool _isProcessing = true;
-  String? _error;
-
-  @override
-  void initState() {
-    super.initState();
-    // Defer callback processing to avoid Riverpod state modification during build
-    WidgetsBinding.instance.addPostFrameCallback((_) {
-      _processCallback();
-    });
-  }
-
-  Future<void> _processCallback() async {
-    // Check for error from Authentik
-    if (widget.error != null) {
-      setState(() {
-        _isProcessing = false;
-        _error = widget.errorDescription ?? widget.error;
-      });
-      return;
-    }
-
-    // Check for required parameters
-    if (widget.code == null || widget.callbackState == null) {
-      setState(() {
-        _isProcessing = false;
-        _error = 'Invalid callback - missing code or state parameter';
-      });
-      return;
-    }
-
-    // Exchange code for tokens
-    try {
-      await ref.read(authProvider.notifier).handleOidcCallback(
-            widget.code!,
-            widget.callbackState!,
-          );
-
-      // Navigate to home on success
-      if (mounted) {
-        context.go(AppRoutes.frontHall);
-      }
-    } catch (e) {
-      if (mounted) {
-        setState(() {
-          _isProcessing = false;
-          _error = e.toString();
-        });
-      }
-    }
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    final colorScheme = Theme.of(context).colorScheme;
-
-    return Scaffold(
-      body: Center(
-        child: ConstrainedBox(
-          constraints: const BoxConstraints(maxWidth: 400),
-          child: Card(
-            child: Padding(
-              padding: const EdgeInsets.all(32),
-              child: Column(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  Icon(
-                    _error != null ? Icons.error_outline : Icons.home_work_outlined,
-                    size: 64,
-                    color: _error != null ? colorScheme.error : colorScheme.primary,
-                  ),
-                  const SizedBox(height: 24),
-                  Text(
-                    _error != null ? 'Authentication Failed' : 'Signing in...',
-                    style: Theme.of(context).textTheme.headlineMedium?.copyWith(
-                          fontWeight: FontWeight.w600,
-                        ),
-                  ),
-                  const SizedBox(height: 16),
-                  if (_isProcessing)
-                    const CircularProgressIndicator()
-                  else if (_error != null) ...[
-                    Container(
-                      padding: const EdgeInsets.all(12),
-                      decoration: BoxDecoration(
-                        color: colorScheme.errorContainer,
-                        borderRadius: BorderRadius.circular(8),
-                      ),
-                      child: Text(
-                        _error!,
-                        style: TextStyle(color: colorScheme.onErrorContainer),
-                        textAlign: TextAlign.center,
-                      ),
-                    ),
-                    const SizedBox(height: 16),
-                    OutlinedButton.icon(
-                      onPressed: () => context.go(AppRoutes.login),
-                      icon: const Icon(Icons.arrow_back),
-                      label: const Text('Back to Login'),
-                      style: OutlinedButton.styleFrom(
-                        minimumSize: const Size(double.infinity, 48),
-                      ),
-                    ),
-                  ],
-                ],
-              ),
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-}

lib/shared/layouts/app_scaffold.dart

@@ -1,5 +1,9 @@
+import 'package:flutter/foundation.dart' show kIsWeb;
 import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:go_router/go_router.dart';
+import 'package:tatlock_ui/core/auth/auth_provider.dart';
+import 'package:tatlock_ui/core/config/app_config.dart';
 import 'package:tatlock_ui/features/control_room/router.dart';
 import 'package:tatlock_ui/features/security/router.dart';
 import 'package:tatlock_ui/routing/app_router.dart';
@@ -7,6 +11,11 @@ import 'package:tatlock_ui/shared/layouts/widgets/top_header_bar.dart';
 
 /// Main application scaffold with top header navigation.
 ///
+/// Handles authentication automatically:
+/// - If not authenticated, auto-initiates OIDC flow
+/// - Shows loading state during authentication
+/// - Shows error state if auth fails (with retry)
+///
 /// Layout structure per UI_LAYOUT.md:
 /// ```
 /// ┌─────────────────────────────────────────────────────────────────┐
@@ -15,16 +24,62 @@ import 'package:tatlock_ui/shared/layouts/widgets/top_header_bar.dart';
 /// │  BODY: Room page content (may include room-specific sidebar)    │
 /// └─────────────────────────────────────────────────────────────────┘
 /// ```
-class AppScaffold extends StatelessWidget {
+class AppScaffold extends ConsumerStatefulWidget {
   const AppScaffold({super.key, required this.child});
 
   final Widget child;
 
+  @override
+  ConsumerState<AppScaffold> createState() => _AppScaffoldState();
+}
+
+class _AppScaffoldState extends ConsumerState<AppScaffold> {
   // Header height must match TopHeaderBar._headerHeight
   static const double _headerHeight = 56.0;
 
+  bool _authInitiated = false;
+
   @override
   Widget build(BuildContext context) {
+    // No auth required in LAN mode - show content directly
+    if (!AppConfig.requiresAuth) {
+      return _buildScaffold(context);
+    }
+
+    // Watch auth state (works for both web and mobile)
+    final authAsync = ref.watch(authProvider);
+
+    return authAsync.when(
+      data: (authState) {
+        if (authState.isAuthenticated) {
+          // Authenticated - show the app
+          _authInitiated = false; // Reset for next time
+          return _buildScaffold(context);
+        }
+
+        // On web, NPM handles auth - if we're here without auth, something is wrong
+        // (NPM should have redirected to Authentik before we loaded)
+        if (kIsWeb) {
+          return _buildAuthErrorScreen(context, 'Authentication required');
+        }
+
+        // Mobile: Not authenticated - auto-initiate OIDC
+        if (!_authInitiated) {
+          _authInitiated = true;
+          WidgetsBinding.instance.addPostFrameCallback((_) {
+            ref.read(authProvider.notifier).signIn();
+          });
+        }
+
+        // Show loading while redirecting to Authentik
+        return _buildAuthLoadingScreen(context, 'Redirecting to sign in...');
+      },
+      loading: () => _buildAuthLoadingScreen(context, 'Loading user info...'),
+      error: (error, _) => _buildAuthErrorScreen(context, error),
+    );
+  }
+
+  Widget _buildScaffold(BuildContext context) {
     return Scaffold(
       body: Stack(
         children: [
@@ -32,7 +87,7 @@ class AppScaffold extends StatelessWidget {
           Positioned.fill(
             child: Padding(
               padding: const EdgeInsets.only(top: _headerHeight),
-              child: child,
+              child: widget.child,
             ),
           ),
 
@@ -51,6 +106,115 @@ class AppScaffold extends StatelessWidget {
     );
   }
 
+  Widget _buildAuthLoadingScreen(BuildContext context, String message) {
+    final colorScheme = Theme.of(context).colorScheme;
+
+    return Scaffold(
+      body: Center(
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: [
+            Icon(
+              Icons.home_work_outlined,
+              size: 64,
+              color: colorScheme.primary,
+            ),
+            const SizedBox(height: 24),
+            Text(
+              'Tatlock Estate',
+              style: Theme.of(context).textTheme.headlineMedium?.copyWith(
+                    fontWeight: FontWeight.w600,
+                  ),
+            ),
+            const SizedBox(height: 32),
+            const SizedBox(
+              width: 24,
+              height: 24,
+              child: CircularProgressIndicator(strokeWidth: 2),
+            ),
+            const SizedBox(height: 16),
+            Text(
+              message,
+              style: Theme.of(context).textTheme.bodyMedium?.copyWith(
+                    color: colorScheme.onSurfaceVariant,
+                  ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget _buildAuthErrorScreen(BuildContext context, Object error) {
+    final colorScheme = Theme.of(context).colorScheme;
+
+    return Scaffold(
+      body: Center(
+        child: ConstrainedBox(
+          constraints: const BoxConstraints(maxWidth: 400),
+          child: Card(
+            child: Padding(
+              padding: const EdgeInsets.all(32),
+              child: Column(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Icon(
+                    Icons.error_outline,
+                    size: 64,
+                    color: colorScheme.error,
+                  ),
+                  const SizedBox(height: 24),
+                  Text(
+                    'Authentication Failed',
+                    style: Theme.of(context).textTheme.headlineMedium?.copyWith(
+                          fontWeight: FontWeight.w600,
+                        ),
+                  ),
+                  const SizedBox(height: 16),
+                  Container(
+                    padding: const EdgeInsets.all(12),
+                    decoration: BoxDecoration(
+                      color: colorScheme.errorContainer,
+                      borderRadius: BorderRadius.circular(8),
+                    ),
+                    child: Text(
+                      _formatError(error),
+                      style: TextStyle(color: colorScheme.onErrorContainer),
+                      textAlign: TextAlign.center,
+                    ),
+                  ),
+                  const SizedBox(height: 24),
+                  FilledButton.icon(
+                    onPressed: () {
+                      _authInitiated = false;
+                      ref.read(authProvider.notifier).signIn();
+                    },
+                    icon: const Icon(Icons.refresh),
+                    label: const Text('Try again'),
+                    style: FilledButton.styleFrom(
+                      minimumSize: const Size(double.infinity, 48),
+                    ),
+                  ),
+                ],
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+
+  String _formatError(Object error) {
+    final message = error.toString();
+    if (message.contains('user_cancelled')) {
+      return 'Sign in was cancelled';
+    }
+    if (message.contains('network')) {
+      return 'Network error. Please check your connection.';
+    }
+    return 'Authentication failed. Please try again.';
+  }
+
   int _selectedIndex(BuildContext context) {
     final location = GoRouterState.of(context).matchedLocation;
 

lib/shared/layouts/widgets/profile_dropdown.dart

@@ -1,7 +1,10 @@
+import 'dart:developer' as developer;
+
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:go_router/go_router.dart';
 import 'package:tatlock_ui/core/auth/auth_provider.dart';
+import 'package:tatlock_ui/core/theme/theme_provider.dart';
 import 'package:tatlock_ui/routing/app_router.dart';
 
 /// Profile dropdown menu in the header.
@@ -13,6 +16,7 @@ class ProfileDropdown extends ConsumerWidget {
   @override
   Widget build(BuildContext context, WidgetRef ref) {
     final authState = ref.watch(authProvider);
+    final currentTheme = ref.watch(themeProvider);
     final colorScheme = Theme.of(context).colorScheme;
 
     return authState.when(
@@ -76,6 +80,102 @@ class ProfileDropdown extends ConsumerWidget {
             ),
           ),
 
+          // Theme submenu header
+          PopupMenuItem<String>(
+            enabled: false,
+            height: 32,
+            child: Text(
+              'THEME',
+              style: Theme.of(context).textTheme.labelSmall?.copyWith(
+                    color: colorScheme.onSurfaceVariant,
+                    letterSpacing: 0.5,
+                  ),
+            ),
+          ),
+
+          // Theme: System
+          PopupMenuItem<String>(
+            value: 'theme_system',
+            height: 40,
+            child: Row(
+              children: [
+                Icon(
+                  Icons.brightness_auto,
+                  size: 18,
+                  color: currentTheme == ThemeSetting.system
+                      ? colorScheme.primary
+                      : null,
+                ),
+                const SizedBox(width: 12),
+                Text(
+                  'System',
+                  style: currentTheme == ThemeSetting.system
+                      ? TextStyle(color: colorScheme.primary)
+                      : null,
+                ),
+                const Spacer(),
+                if (currentTheme == ThemeSetting.system)
+                  Icon(Icons.check, size: 16, color: colorScheme.primary),
+              ],
+            ),
+          ),
+
+          // Theme: Light
+          PopupMenuItem<String>(
+            value: 'theme_light',
+            height: 40,
+            child: Row(
+              children: [
+                Icon(
+                  Icons.light_mode,
+                  size: 18,
+                  color: currentTheme == ThemeSetting.light
+                      ? colorScheme.primary
+                      : null,
+                ),
+                const SizedBox(width: 12),
+                Text(
+                  'Light',
+                  style: currentTheme == ThemeSetting.light
+                      ? TextStyle(color: colorScheme.primary)
+                      : null,
+                ),
+                const Spacer(),
+                if (currentTheme == ThemeSetting.light)
+                  Icon(Icons.check, size: 16, color: colorScheme.primary),
+              ],
+            ),
+          ),
+
+          // Theme: Dark
+          PopupMenuItem<String>(
+            value: 'theme_dark',
+            height: 40,
+            child: Row(
+              children: [
+                Icon(
+                  Icons.dark_mode,
+                  size: 18,
+                  color: currentTheme == ThemeSetting.dark
+                      ? colorScheme.primary
+                      : null,
+                ),
+                const SizedBox(width: 12),
+                Text(
+                  'Dark',
+                  style: currentTheme == ThemeSetting.dark
+                      ? TextStyle(color: colorScheme.primary)
+                      : null,
+                ),
+                const Spacer(),
+                if (currentTheme == ThemeSetting.dark)
+                  Icon(Icons.check, size: 16, color: colorScheme.primary),
+              ],
+            ),
+          ),
+
+          const PopupMenuDivider(),
+
           // Logout (only if authenticated)
           if (auth.isAuthenticated)
             const PopupMenuItem<String>(
@@ -93,6 +193,12 @@ class ProfileDropdown extends ConsumerWidget {
           switch (value) {
             case 'settings':
               context.go(AppRoutes.settings);
+            case 'theme_system':
+              _updateTheme(ref, ThemeSetting.system);
+            case 'theme_light':
+              _updateTheme(ref, ThemeSetting.light);
+            case 'theme_dark':
+              _updateTheme(ref, ThemeSetting.dark);
             case 'logout':
               ref.read(authProvider.notifier).signOut();
           }
@@ -126,4 +232,20 @@ class ProfileDropdown extends ConsumerWidget {
     }
     return name[0].toUpperCase();
   }
+
+  /// Update theme locally and sync to API.
+  Future<void> _updateTheme(WidgetRef ref, ThemeSetting setting) async {
+    // Update local theme immediately for instant UI response
+    await ref.read(themeProvider.notifier).setSetting(setting);
+
+    // Sync to backend (fire-and-forget, errors logged not shown)
+    try {
+      await ref.read(authProvider.notifier).updatePreferences(
+            theme: setting.name,
+          );
+    } catch (e) {
+      // Theme still works locally even if API sync fails
+      developer.log('Failed to sync theme preference: $e', name: 'profile');
+    }
+  }
 }

npm-config.conf

@@ -0,0 +1,53 @@
+# Increase buffer size for large headers from Authentik
+proxy_buffers 8 16k;
+proxy_buffer_size 32k;
+
+# Exclude static assets from forward auth
+# These paths bypass auth_request but still proxy to upstream
+location ~ ^/(manifest\.json|favicon\.(ico|png)|health|icons|assets) {
+    auth_request off;
+    proxy_pass $forward_scheme://$server:$port;
+}
+
+# Forward authentication via standalone outpost
+auth_request /outpost.goauthentik.io/auth/nginx;
+error_page 401 = @goauthentik_proxy_signin;
+
+# Capture auth response headers
+auth_request_set $auth_cookie $upstream_http_set_cookie;
+auth_request_set $authentik_username $upstream_http_x_authentik_username;
+auth_request_set $authentik_groups $upstream_http_x_authentik_groups;
+auth_request_set $authentik_email $upstream_http_x_authentik_email;
+auth_request_set $authentik_name $upstream_http_x_authentik_name;
+auth_request_set $authentik_uid $upstream_http_x_authentik_uid;
+
+# Forward auth headers to application
+add_header Set-Cookie $auth_cookie;
+proxy_set_header X-authentik-username $authentik_username;
+proxy_set_header X-authentik-groups $authentik_groups;
+proxy_set_header X-authentik-email $authentik_email;
+proxy_set_header X-authentik-name $authentik_name;
+proxy_set_header X-authentik-uid $authentik_uid;
+
+# Outpost proxy location
+location /outpost.goauthentik.io {
+    proxy_pass https://localhost:9444/outpost.goauthentik.io;
+    proxy_set_header Host $host;
+    proxy_set_header X-Original-URL $scheme://$http_host$request_uri;
+    proxy_set_header X-Forwarded-Proto $scheme;
+    proxy_set_header X-Forwarded-Host $http_host;
+    proxy_set_header X-Forwarded-For $remote_addr;
+    proxy_pass_request_body off;
+    proxy_set_header Content-Length "";
+
+    # WebSocket support
+    proxy_http_version 1.1;
+    proxy_set_header Upgrade $http_upgrade;
+    proxy_set_header Connection $connection_upgrade;
+}
+
+# Signin redirect handler
+location @goauthentik_proxy_signin {
+    internal;
+    return 302 /outpost.goauthentik.io/start?rd=$request_uri;
+}

pubspec.yaml

@@ -16,7 +16,7 @@ publish_to: 'none' # Remove this line if you wish to publish to pub.dev
 # https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
 # In Windows, build-name is used as the major, minor, and patch parts
 # of the product and file versions while build-number is used as the build suffix.
-version: 1.0.10+1
+version: 1.1.15+1
 
 environment:
   sdk: ^3.10.4

tool/generate_health_json.dart

@@ -1,7 +1,9 @@
 #!/usr/bin/env dart
-// Generates web/health.json from pubspec.yaml
+// Generates web/health/health.json from pubspec.yaml
 // Run: dart run tool/generate_health_json.dart
 
+// ignore_for_file: avoid_print
+
 import 'dart:convert';
 import 'dart:io';
 
@@ -35,15 +37,15 @@ void main() {
     'fullVersion': '$version+$buildNumber',
   };
 
-  final webDir = Directory('web');
+  final healthDir = Directory('web/health');
-  if (!webDir.existsSync()) {
+  if (!healthDir.existsSync()) {
-    webDir.createSync(recursive: true);
+    healthDir.createSync(recursive: true);
   }
 
-  final healthFile = File('web/health.json');
+  final healthFile = File('web/health/health.json');
   healthFile.writeAsStringSync(
     const JsonEncoder.withIndent('  ').convert(health),
   );
 
-  print('Generated web/health.json with version $version+$buildNumber');
+  print('Generated web/health/health.json with version $version+$buildNumber');
 }

web/health/health.json

@@ -0,0 +1,8 @@
+{
+  "status": "healthy",
+  "name": "tatlock_ui",
+  "title": "Tatlock - a Home Lab AI",
+  "version": "1.0.4",
+  "buildNumber": 1,
+  "fullVersion": "1.0.4+1"
+}

web/health/index.html

@@ -13,7 +13,7 @@
   <h1 id="status">Loading...</h1>
   <pre id="data"></pre>
   <script>
-    fetch('/health.json')
+    fetch('./health.json')
       .then(r => r.json())
       .then(data => {
         document.getElementById('status').textContent = data.status?.toUpperCase() || 'OK';

web/index.html

@@ -32,6 +32,14 @@
 
   <title>Tatlock</title>
   <link rel="manifest" href="manifest.json">
+  <style>
+    body {
+      margin: 0;
+      padding: 0;
+      /* Match Flutter's dark theme scaffold background (FlexScheme.aquaBlue) */
+      background-color: #111111;
+    }
+  </style>
 </head>
 <body>
   <script src="flutter_bootstrap.js" async></script>