update footer | add shared chores | expire todos if not completed

frontend/src/lib/components/Footer.svelte

@@ -1,17 +1,62 @@
 <script lang="ts">
 	import FamDone from './FamDone.svelte';
+
+	// Offset the footer content past the fixed sidebar on fam-scoped pages
+	// (220px desktop / 56px mobile). Standalone pages (landing, pricing, admin)
+	// have no sidebar and leave this false.
+	let { sidebar = false } = $props();
 </script>
 
-<footer class="app-footer">
-	<span class="footer-text"><FamDone /></span>
+<footer class="bg-slate-100 text-[#4c1d95]">
+	<div class="footer-inner px-8 py-16" class:sidebar>
+		<div class="flex items-center justify-between gap-2">
+			<span class="footer-star">✦</span>
+			<span class="footer-copy"
+				>&copy; {new Date().getFullYear()}
+				<span class="footer-text font-bold text-xl"><FamDone /></span> All rights reserved.</span
+			>
+			<aside class="text-text-200 text-wash-300 flex flex-col justify-end text-right text-sm">
+				<span>Built by humans</span>
+				<a href="https://threejjjs.xyz">
+					<h5 class="m-0 text-right font-tertiary text-xl md:text-3xl">
+						three<span class="opacity-55">jjj</span>s
+						<br />
+					</h5>
+				</a>
+				<span class="text-xs">Interactive Tech</span>
+			</aside>
+		</div>
+	</div>
 </footer>
 
 <style>
-	.app-footer {
-		padding: 1rem 1.5rem;
-		border-top: 1px solid #e5e7eb;
+	/* Offset the footer content past the fixed sidebar so it aligns with the
+	   app-main content column (220px desktop / 56px mobile). */
+	.footer-inner.sidebar {
+		margin-left: 220px;
+	}
+	@media (max-width: 1023px) {
+		.footer-inner.sidebar {
+			margin-left: 56px;
+		}
+	}
+	.footer-star {
+		font-size: 2.5rem;
+		line-height: 1;
+		color: #4c1d95;
+		flex-shrink: 0;
+	}
+	.footer-copy {
+		flex: 1;
 		text-align: center;
-		font-size: 0.8rem;
-		color: #9ca3af;
+		padding: 0 1rem;
+	}
+	@media (max-width: 639px) {
+		.footer-star {
+			font-size: 1.75rem;
+		}
+		.footer-copy {
+			padding: 0 0.5rem;
+		}
 	}
 </style>