Add HelpPanel and TodoItemTouch components, extend task commands, and refactor task and view logic

- Introduced `HelpPanel.vue` for displaying keyboard shortcuts and command descriptions.
- Added `TodoItemTouch.vue`, a mobile-friendly task item component with updated bindings and improved actions.
- Extended task commands with support for tagging, due date parsing, and dynamic text formatting.
- Implemented `useActions` utility for parsing and executing command-based task modifications.
- Streamlined task editing and creation in `useTasks` for consistency and API integration.
- Updated `ListScreen` to support collapsible, categorized task lists with visual enhancements.
- Refactored `App.vue` for adaptive input handling on mobile versus desktop views.
- Enhanced API communication in `useApi` with cleaner header generation and error handling.

src/App.vue

@@ -1,9 +1,14 @@
 <script setup lang="ts">
-import { PhCheckSquareOffset, PhListChecks, PhSliders } from '@phosphor-icons/vue'
+import { useMediaQuery } from '@vueuse/core'
 import { computed, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
+import CreateInput from './components/CreateInput.vue'
+import CreateModal from './components/CreateModal.vue'
+
 import { useTasks } from './composables/useTasks.ts'
 
+const isMobile = useMediaQuery('(pointer: coarse)')
+
 const { fetchTasks } = useTasks()
 const router = useRouter()
 const currentPath = computed(() => router.currentRoute.value.path)
@@ -11,22 +16,13 @@ onMounted(fetchTasks)
 </script>
 
 <template>
-  <div class="overflow-hidden">
-    <main class="pb-40 overflow-y-scroll h-screen">
+  <div>
+    <main class="h-screen overflow-y-auto">
       <RouterView />
     </main>
-    <div class="dock dock-xl inset-shadow-sm">
-      <RouterLink to="/create" :class="currentPath === '/create' ? 'dock-active' : ''">
-        <PhCheckSquareOffset :size="32" />
-      </RouterLink>
-
-      <RouterLink to="/" :class="currentPath === '/' ? 'dock-active' : ''">
-        <PhListChecks :size="32" />
-      </RouterLink>
-
-      <RouterLink to="/settings" :class="currentPath === '/settings' ? 'dock-active' : ''">
-        <PhSliders :size="32" />
-      </RouterLink>
-    </div>
+    <template v-if="currentPath === '/'">
+      <CreateModal v-if="isMobile" />
+      <CreateInput v-else />
+    </template>
   </div>
 </template>