feat: add floating quick task flow

app/static/css/style.css

@@ -913,16 +913,50 @@ p {
   gap: 18px;
 }
 
+.complete-dialog__surface--task {
+  width: min(520px, calc(100vw - 24px));
+}
+
 .choice-grid {
   display: grid;
   gap: 12px;
 }
 
+.dialog-actions {
+  display: flex;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+
 .text-link {
   color: var(--primary-strong);
   font-weight: 700;
 }
 
+.fab-quick-task {
+  position: fixed;
+  right: 18px;
+  bottom: calc(96px + env(safe-area-inset-bottom));
+  width: 62px;
+  height: 62px;
+  border: 0;
+  border-radius: 999px;
+  background: linear-gradient(135deg, #2563eb, #34d399);
+  color: #fff;
+  box-shadow: 0 24px 40px rgba(37, 99, 235, 0.28);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 45;
+  cursor: pointer;
+}
+
+.fab-quick-task .nav-icon,
+.fab-quick-task .nav-icon svg {
+  width: 24px;
+  height: 24px;
+}
+
 @media (min-width: 760px) {
   .page-shell {
     padding: 28px 28px 32px;
@@ -1017,6 +1051,11 @@ p {
     display: none;
   }
 
+  .fab-quick-task {
+    right: 28px;
+    bottom: 28px;
+  }
+
   .task-grid,
   .scoreboard {
     grid-template-columns: repeat(2, minmax(0, 1fr));

app/static/js/app.js

@@ -4,6 +4,9 @@
   const dialogChoice = document.getElementById("completeDialogChoice");
   const dialogText = document.getElementById("completeDialogText");
   const closeButton = document.getElementById("completeDialogClose");
+  const quickTaskDialog = document.getElementById("quickTaskDialog");
+  const quickTaskOpen = document.getElementById("quickTaskOpen");
+  const quickTaskClose = document.getElementById("quickTaskClose");
 
   document.querySelectorAll("[data-complete-action]").forEach((button) => {
     button.addEventListener("click", () => {
@@ -28,6 +31,14 @@
     closeButton.addEventListener("click", () => dialog.close());
   }
 
+  if (quickTaskOpen && quickTaskDialog) {
+    quickTaskOpen.addEventListener("click", () => quickTaskDialog.showModal());
+  }
+
+  if (quickTaskClose && quickTaskDialog) {
+    quickTaskClose.addEventListener("click", () => quickTaskDialog.close());
+  }
+
   const pushButton = document.getElementById("pushToggle");
   const pushHint = document.getElementById("pushHint");
   const vapidKey = document.body.dataset.pushKey;