feat: tasks app, security hardening, mobile fixes, iOS app shell

- Custom SQLite task manager replacing TickTick wrapper
- 73 tasks migrated from TickTick across 15 projects
- RRULE recurrence engine with lazy materialization
- Dashboard tasks widget (desktop sidebar + mobile card)
- Tasks page with project tabs, add/edit/complete/delete
- Security: locked ports to localhost, removed old containers
- Gitea Actions runner configured and all 3 CI jobs passing
- Fixed mobile overflow on dashboard cards
- iOS Capacitor app shell (Second Brain)
- Frontend/backend guide docs for adding new services
- TickTick Google Calendar sync re-authorized

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

frontend-v2/src/routes/(app)/+page.svelte

@@ -4,9 +4,11 @@
 	import DashboardActionCard from '$lib/components/dashboard/DashboardActionCard.svelte';
 	import BudgetModule from '$lib/components/dashboard/BudgetModule.svelte';
 	import FitnessModule from '$lib/components/dashboard/FitnessModule.svelte';
+	import IssuesModule from '$lib/components/dashboard/IssuesModule.svelte';
+	import TasksPanel from '$lib/components/dashboard/TasksPanel.svelte';
+	import TasksModule from '$lib/components/dashboard/TasksModule.svelte';
 
 	const userName = $derived((page as any).data?.user?.display_name || 'there');
-	import IssuesModule from '$lib/components/dashboard/IssuesModule.svelte';
 
 	let inventoryIssueCount = $state(0);
 	let inventoryReviewCount = $state(0);
@@ -58,8 +60,12 @@
 	});
 </script>
 
-<div class="page">
-	<div class="app-surface">
+<div class="page dash-page">
+	<div class="dash-layout">
+		<aside class="tasks-sidebar">
+			<TasksPanel />
+		</aside>
+		<div class="app-surface">
 		<div class="page-header">
 			<div class="page-title">Dashboard</div>
 			<div class="page-greeting">Good to see you, <strong>{userName}</strong></div>
@@ -90,6 +96,8 @@
 			/>
 		</div>
 
+		<TasksModule />
+
 		<div class="modules-grid">
 			<BudgetModule />
 			<div class="right-stack">
@@ -98,9 +106,51 @@
 			</div>
 		</div>
 	</div>
+	</div>
 </div>
 
 <style>
+	.dash-layout {
+		display: grid;
+		grid-template-columns: 280px 1fr;
+		gap: var(--module-gap);
+		max-width: 1500px;
+		margin: 0 auto;
+		padding: 0 var(--sp-6);
+	}
+
+	.tasks-sidebar {
+		position: sticky;
+		top: 80px;
+		align-self: start;
+	}
+
+	.dash-layout > :global(.app-surface) {
+		padding: 0;
+		max-width: none;
+	}
+
+	@media (max-width: 1100px) {
+		.dash-layout {
+			display: block;
+			padding: 0;
+		}
+		.tasks-sidebar {
+			display: none;
+		}
+		.dash-layout > :global(.app-surface) {
+			padding: 0 var(--sp-6);
+			max-width: 1200px;
+			margin: 0 auto;
+		}
+	}
+
+	@media (max-width: 768px) {
+		.dash-layout > :global(.app-surface) {
+			padding: 0 var(--sp-5);
+		}
+	}
+
 	.action-cards {
 		display: flex;
 		flex-direction: column;
@@ -126,5 +176,9 @@
 		.modules-grid {
 			grid-template-columns: 1fr;
 		}
+		.modules-grid > :global(*) {
+			min-width: 0;
+			max-width: 100%;
+		}
 	}
 </style>