Move mobile task input to bottom

[Copilot]

Mobile task entry should be easier by placing the input area at the bottom of the screen while keeping desktop layout intact.

• Layout behavior
  • Reverse the main column order under the mobile breakpoint so the task input renders after the task list.
• Viewport alignment
  • Keep the main container height aligned with the full viewport while respecting page padding.

Example:

@media (max-width: 640px) {
  main {
    flex-direction: column-reverse;
    min-height: calc(100vh - 2 * var(--page-padding));
  }
}

• Screenshot
  • https://github.com/user-attachments/assets/89dc5ec4-f5e8-4438-a2cd-538fcedc95e8

Original prompt

I want to move the input to the bottom of screen so it is easier and more natural to enter tasks on mobile

---

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.