feat(manacore/web): complete mobile responsiveness for all modules and shared components

ListViews (25 remaining modules):
- All module ListViews now have responsive container padding (p-3 sm:p-4)
- All interactive items have min-h-[44px] touch targets on mobile
- Picture/Moodlit grids: grid-cols-2 on mobile, grid-cols-3 on desktop

DetailViews (17 modules):
- All DetailViews have reduced padding on mobile (0.75rem vs 1rem)
- All buttons, inputs, selects have min-height: 44px on mobile

Modals (14 components):
- Shared Modal.svelte: bottom-sheet pattern on mobile (slides up from bottom)
- 13 app-specific modals: same bottom-sheet treatment
- Reduced padding, larger close buttons, max-h-[95vh] on mobile

Shared UI components:
- GlobalSpotlight: bottom-sheet on mobile, prevents iOS zoom, hides keyboard hints
- PillDropdown: full-width bottom-sheet on mobile with backdrop
- AppDrawer: 44px touch targets on buttons and search
- TagStrip: 44px min-height on all pill buttons
- ToastContainer: larger touch targets, safe-area positioning

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

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

@@ -406,6 +406,7 @@
 		align-items: center;
 		gap: 0.5rem;
 		padding: 0.75rem 1rem;
+		min-height: 48px;
 		border-bottom: 1px solid rgba(0, 0, 0, 0.08);
 	}
 
@@ -476,6 +477,7 @@
 		align-items: center;
 		gap: 0.375rem;
 		padding: 0.375rem 0.625rem;
+		min-height: 44px;
 		border-radius: 9999px;
 		border: 1px solid rgba(0, 0, 0, 0.08);
 		background: rgba(0, 0, 0, 0.03);
@@ -538,6 +540,7 @@
 		align-items: center;
 		gap: 0.5rem;
 		padding: 0.5rem;
+		min-height: 44px;
 		border-radius: 0.5rem;
 		border: none;
 		background: none;
@@ -590,6 +593,11 @@
 	/* Favorite toggle */
 	.fav-toggle {
 		padding: 0.375rem;
+		min-width: 44px;
+		min-height: 44px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
 		border: none;
 		background: none;
 		cursor: pointer;

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

@@ -480,10 +480,16 @@
 		display: flex;
 		align-items: center;
 		gap: 0.75rem;
-		padding: 1rem 1.25rem;
+		padding: 0.75rem 1rem;
 		border-bottom: 1px solid rgba(0, 0, 0, 0.08);
 	}
 
+	@media (min-width: 641px) {
+		.spotlight-input-wrapper {
+			padding: 1rem 1.25rem;
+		}
+	}
+
 	:global(.dark) .spotlight-input-wrapper {
 		border-bottom-color: rgba(255, 255, 255, 0.1);
 	}
@@ -550,6 +556,7 @@
 		justify-content: space-between;
 		width: 100%;
 		padding: 0.625rem 0.75rem;
+		min-height: 44px;
 		border: none;
 		background: none;
 		border-radius: 0.5rem;
@@ -737,12 +744,37 @@
 	/* Mobile */
 	@media (max-width: 640px) {
 		.spotlight-overlay {
-			padding-top: 1rem;
+			padding-top: 0;
+			align-items: flex-end;
 		}
 
 		.spotlight-modal {
 			max-width: none;
-			margin: 0 0.5rem;
+			margin: 0;
+			border-radius: 1rem 1rem 0 0;
+			max-height: 85vh;
+			animation: spotlightSlideUp 0.2s ease-out;
+		}
+
+		.spotlight-results {
+			max-height: 60vh;
+		}
+
+		.spotlight-footer {
+			display: none;
+		}
+
+		.spotlight-input {
+			font-size: 1rem;
+		}
+	}
+
+	@keyframes spotlightSlideUp {
+		from {
+			transform: translateY(100%);
+		}
+		to {
+			transform: translateY(0);
 		}
 	}
 </style>

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

@@ -620,4 +620,57 @@
 	:global(.dark) .fan-up .dropdown-footer {
 		border-bottom-color: rgba(255, 255, 255, 0.15);
 	}
+
+	/* Mobile: bottom sheet */
+	@media (max-width: 640px) {
+		.fan-container {
+			position: fixed;
+			top: auto !important;
+			left: 0 !important;
+			right: 0;
+			bottom: 0;
+			width: 100%;
+			max-height: 80vh;
+			overflow-y: auto;
+			padding: 1rem;
+			padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
+			background: rgba(255, 255, 255, 0.95);
+			backdrop-filter: blur(20px);
+			-webkit-backdrop-filter: blur(20px);
+			border-top: 1px solid rgba(0, 0, 0, 0.1);
+			border-radius: 1rem 1rem 0 0;
+			box-shadow: 0 -10px 25px -5px rgba(0, 0, 0, 0.15);
+			transform: none;
+			animation: pillSheetUp 0.2s ease-out;
+		}
+
+		:global(.dark) .fan-container {
+			background: rgba(30, 30, 35, 0.95);
+			border-top-color: rgba(255, 255, 255, 0.12);
+		}
+
+		.fan-up {
+			transform: none;
+			flex-direction: column;
+		}
+
+		.pill,
+		.fan-pill,
+		.submenu-item {
+			min-height: 44px;
+		}
+
+		.menu-backdrop {
+			background: rgba(0, 0, 0, 0.3);
+		}
+	}
+
+	@keyframes pillSheetUp {
+		from {
+			transform: translateY(100%);
+		}
+		to {
+			transform: translateY(0);
+		}
+	}
 </style>

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

@@ -207,6 +207,7 @@
 		display: flex;
 		align-items: center;
 		gap: 0.5rem;
+		min-height: 44px;
 		cursor: pointer;
 		flex-shrink: 0;
 		transition: all 0.15s ease;