Show due date on the right side of each upcoming task card instead
of as group header rows. Darken checkbox border from #ccc to #999.

Assisted-by: Claude Opus 4.6 via Claude Code

diff --git a/lib/ketchup/views/task_card.rb b/lib/ketchup/views/task_card.rb
index 1e8ae8d..9acfbe0 100644
--- a/lib/ketchup/views/task_card.rb
+++ b/lib/ketchup/views/task_card.rb
@@ -4,11 +4,12 @@ require "phlex"
 
 module Views
   class TaskCard < Phlex::HTML
-    def initialize(task:, csrf:, selected: false, overdue: false)
+    def initialize(task:, csrf:, selected: false, overdue: false, date_label: nil)
       @task = task
       @csrf = csrf
       @selected = selected
       @overdue = overdue
+      @date_label = date_label
     end
 
     def view_template
@@ -49,6 +50,8 @@ module Views
         end
         if @overdue && @task.urgency > 0
           span(class: "task-urgency") { "#{format("%.1f", @task.urgency)}×" }
+        elsif @date_label
+          span(class: "task-date-label") { @date_label }
         end
       end
     end
diff --git a/lib/ketchup/views/task_list.rb b/lib/ketchup/views/task_list.rb
index 620527b..8e1b741 100644
--- a/lib/ketchup/views/task_list.rb
+++ b/lib/ketchup/views/task_list.rb
@@ -61,17 +61,14 @@ module Views
         if @upcoming.empty?
           p(class: "empty") { "Nothing upcoming." }
         else
-          tasks_by_date = @upcoming.group_by { |t| t[:due_date] }
-
           ul(class: "task-list") do
-            tasks_by_date.each do |date, tasks|
-              li(class: "date-header") do
-                span(class: "date-label") { friendly_date(date) }
-              end
-              tasks.each do |task|
-                li(class: "task-item") do
-                  render TaskCard.new(task: task, csrf: @csrf, selected: selected?(task), overdue: false)
-                end
+            @upcoming.each do |task|
+              li(class: "task-item") do
+                render TaskCard.new(
+                  task: task, csrf: @csrf,
+                  selected: selected?(task), overdue: false,
+                  date_label: friendly_date(task[:due_date])
+                )
               end
             end
           end
diff --git a/public/css/app.css b/public/css/app.css
index a044a57..53efbb0 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -180,19 +180,10 @@ h2 { font-size: var(--step-0); font-weight: 600; }
 .task-item {
 }
 
-.date-header {
-  padding-block-start: var(--space-s);
-  padding-block-end: var(--space-3xs);
-}
-
-.date-header:first-child {
-  padding-block-start: var(--space-2xs);
-}
-
-.date-label {
-  font-size: 10px;
-  color: #bbb;
-  letter-spacing: 0.03em;
+.task-date-label {
+  font-size: var(--step--2);
+  color: #aaa;
+  white-space: nowrap;
 }
 
 .empty {
@@ -290,7 +281,7 @@ h2 { font-size: var(--step-0); font-weight: 600; }
   width: 18px;
   height: 18px;
   padding: 0;
-  border: 1.5px solid #ccc;
+  border: 1.5px solid #999;
   border-radius: 3px;
   background: transparent;
   color: transparent;