feat(sync): add sync status PillNav dropdown + onboarding step

PillNavigation sync dropdown:
- New cloud icon pill showing sync status (Lokal/Sync/Pausiert)
- Dropdown with contextual actions: activate, top up credits, settings
- Shows next charge date when active
- Only visible for authenticated users

Onboarding wizard:
- New SyncStep between AI tier and Credits steps
- Explains local-first model: data always stays local, sync is optional
- Interval selection (monthly 30 / quarterly 90 / yearly 360 credits)
- Activate button with balance check and error handling
- Also fixed missing AiTierStep rendering in wizard template

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

packages/shared-ui/src/navigation/PillNavigation.svelte

@@ -247,6 +247,12 @@
 		aiTierItems?: PillDropdownItem[];
 		/** Current AI tier label, e.g. "Browser" or "Server" */
 		currentAiTierLabel?: string;
+		/** Show sync status dropdown */
+		showSyncStatus?: boolean;
+		/** Sync status dropdown items */
+		syncStatusItems?: PillDropdownItem[];
+		/** Current sync status label */
+		currentSyncLabel?: string;
 		/** Primary color for active state (CSS custom property or hex) */
 		primaryColor?: string;
 		/** Elements to prepend before nav items (tab groups, dividers, nav items) */
@@ -342,6 +348,9 @@
 		showAiTierSelector = false,
 		aiTierItems = [],
 		currentAiTierLabel = 'KI',
+		showSyncStatus = false,
+		syncStatusItems = [],
+		currentSyncLabel = 'Sync',
 		themeMode = 'system',
 		onThemeModeChange,
 		appItems = [],
@@ -670,6 +679,16 @@
 				/>
 			{/if}
 
+			<!-- Sync Status -->
+			{#if showSyncStatus && syncStatusItems.length > 0}
+				<PillDropdown
+					items={syncStatusItems}
+					direction={dropdownDirection}
+					label={currentSyncLabel}
+					icon="cloud"
+				/>
+			{/if}
+
 			<!-- Theme Toggle (only show when not using theme variants dropdown) -->
 			{#if showThemeToggle && onToggleTheme && !showThemeVariants}
 				<button