made some changes for testing (UI)

web/vue-app/src/components/task/ChildTaskList.vue

@@ -238,12 +238,17 @@ onBeforeUnmount(() => {
   background: rgba(255, 255, 255, 0.15);
   border-radius: 8px;
   padding: 0.75rem;
-  min-width: 110px;
+  min-width: 140px;
+  max-width: 220px;
+  width: 100%;
   text-align: center;
   flex-shrink: 0;
   transition: all 0.2s ease;
   border: 2px solid rgba(255, 255, 255, 0.15);
   box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
 }
 
 /* Outline colors depending on is_good */
@@ -322,7 +327,8 @@ onBeforeUnmount(() => {
     max-width: 100%;
   }
   .task-card {
-    min-width: 90px;
+    min-width: 100px;
+    max-width: 150px;
     padding: 0.6rem;
   }
   .task-name {

web/vue-app/src/components/task/TaskList.vue

@@ -195,8 +195,8 @@ const filteredTasks = computed(() => {
 <style scoped>
 .task-listbox {
   flex: 1 1 auto;
-  width: auto;
   max-width: 480px;
+  width: 100%;
   /* Subtract any header/nav height if needed, e.g. 4.5rem */
   max-height: calc(100vh - 4.5rem);
   overflow-y: auto;